Codeless
  • Support Home
  • Themes
  • Support
  • WordPress Tutorials
    • How to Start a Blog
    • Best Website Builders
    • Best Small Business Hosting
    • Email Marketing Services
    • Cheap WordPress Hosting
  • Video Tutorials

Community Forums

Codeless slider displaying a grey box instead of slider on mobile

    • 9 years, 3 months ago n2squared
      Participant

      Expired

      I don’t see this issue in the forums? This was working a few weeks ago, did a theme update but I can seem to get the mobile slider to show up again. I have turned it off for now, but it can be seen on ozmosi.com/slider-test/

      Please let me know if there is anything that I need to change in the settings.

      Thanks!

      Nicole

    • 9 years, 3 months ago n2squared
      Participant

      Expired

      This reply has been marked as private.
    • 9 years, 3 months ago Mirela
      Participant

      Hello,

      Sorry for the late reply.
      Did you made any changes to theme files? Or added any new third party plugin recently? Please send us your wp credentials in a private reply. So we can give it a closer look.

      Best regards!

    • 9 years, 3 months ago n2squared
      Participant

      Expired

      This reply has been marked as private.
    • 9 years, 3 months ago Ruco
      Keymaster

      Hello,

      You have selected the option to remove the slider on responsive. Also you haven’t set the slider height.
      The options can be found at homepage -> Slider Options.

      Best regards!

    • 9 years, 3 months ago n2squared
      Participant

      Expired

      This reply has been marked as private.
    • 9 years, 3 months ago Mirela
      Participant

      Hello,

      To remove the gray box, please add this cod einto your custom css box:
      @media (max-width: 480px){

      .slider#slider-fullwidth {
          min-height: inherit !important;
      }}

      And to remove the arrows, please add this:
      .codeless_slider .nav-roundslide .icon-wrap { display: none;} This will delete them in desktop too. If you want to remove them only in mobile, then add this line inside the @media(max-width: 480px) block above.
      Let us know.

      Best regards!

    • 9 years, 3 months ago n2squared
      Participant

      Expired

      Hi again.

      Sorry to be a pain – I think I did it wrong. Attaching screenshot. Let me know what I did wrong. Thanks so much!! Nicole

      https://ozmosi.com/wp-content/uploads/2016/03/Screen-Shot-2016-03-25-at-8.25.45-PM.png

       

    • 9 years, 3 months ago Mirela
      Participant

      Hello,
      I edited the cod eto this:

      @media (max-width: 480px){
      .slider#slider-fullwidth { min-height: inherit !important;}
      .codeless_slider .nav-roundslide a { display: none;}
      }

      You had left out the !important; from the first line of code, while i edited the second line. Please check your site, it is ok now.

      Best regards!

    • 9 years, 3 months ago n2squared
      Participant

      Expired

      Thank you so much!

      I am still seeing the circles. Any thoughts / or additional code to ensure those are removed?

      Thanks again!

      I really appreciate the guidance. Nicole

    • 9 years, 3 months ago Mirela
      Participant

      Hello,

      The code removes the arrows completely. I don’t see any circles in mobile slider (screenshot). Can you send a screenshot of them?

      Best regards!

    • 9 years, 3 months ago n2squared
      Participant

      Expired

      Hi again – I am including 2 screenshots. One is desktop – where the arrows and the circles are still visible. The other is of mobile, where the circles are still visible.

      https://ozmosi.com/wp-content/uploads/2016/04/Screen-Shot-2016-04-03-at-1.48.51-PM.png

      https://ozmosi.com/wp-content/uploads/2016/04/IMG_7893.png

      Apologies if there was confusion in what I was asking for – what I was hoping to remove was the circle and the arrow on all sizes of the slider – desktop and mobile. Is this possible to remove these on both?

      Thanks!

    • 9 years, 2 months ago Mirela
      Participant

      Hello,

      Sorry i thought you neede it only for the mobile mode. Anyway, to remove the slider arrows from every screen size, please remove this line:
      .codeless_slider .nav-roundslide a { display: none;}
      from the block of code above (inside the max-width: 480px). And instead, add it outside of the block. This should be the result code:

      @media (max-width: 480px){
      .slider#slider-fullwidth { min-height: inherit !important;}
      }
      .codeless_slider .nav-roundslide a { display: none;}

      Let us know.

      Best regards!

Viewing 12 reply threads

You must be logged in to reply to this topic.

Login

Log In
Register

Renew Support

  • Renew Specular Support
  • Renew Tower Support
  • Renew Folie Support
  • Renew Handel Support
  • Renew June Support
  • Renew Picante Support
  • Renew Thype Support
  • Renew Regn Support

Search Forums

Forums

  • Bygge – Construction Theme
  • Converta – Software Theme
  • Folie – The WordPress Website Builder
  • Handel – Responsive Multi-Purpose Business Theme
  • June WooCommerce WordPress Theme
  • Livecast – Podcast Theme
  • Picante – Restaurant & Food WordPress Theme
  • Regn | Agency & Business WordPress Theme
  • Remake – Minimal Portfolio & Agency Theme
  • Specular – Multi-Purpose WordPress Theme
  • Suggest us Features
  • Tower – Business-Driven Multipurpose WP Theme
  • Vibrance – Photography Theme

Site Links

  • Support Policy
  • Specular Support Forum
  • Video Tutorials
  • Knowledge Base
  • Guides and Reviews

Useful Articles

  • Build a Website
  • Web Design & Development
  • Hosting
  • WordPress

Login

Log In
Register Lost Password