Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #162519
    Lydia
    Participant

    Hi there,
    I do not like how the title and the pagers are shown on a smaller screens – tablets and mobile. The text is not readable and the pagers are over-sized. I decided that I need to hide these elements on smaller screens.

    I came up with this code and it seems to be working:

    @media screen and (max-width: 760px){
    #feature-slider .entry-title {
    visibility:hidden;
    }
    #feature-slider .cycle-pager {
    visibility:hidden;
    }
    }

    Do you see any errors in my code? Will it be working across all the platforms? Any suggestions?

    Thank you.

    #162548
    Skandha
    Keymaster

    @olgasyracusegmail-com: Yes, the code should work well on all platforms. Let me know if you have anymore issues.

    Kind Regards,
    Skandha

    #162557
    Lydia
    Participant

    Skandha,
    This code is a quick fix to the slider on my website, it is good for now while I am looking for a permanent solution. I need a responsive slider with the build-in ability to crop the image for a smaller screen, and with a better control over the text. Is it possible to use a MetaSlider plugin instead of your default slider? What file should I use (c-panel file manager)to insert the Metaslider code manually?

    I really do not want to move my website to a different theme but I can’t use your slider on my website. Please help me to continue using your theme. Thank you again.

    #162580
    Skandha
    Keymaster

    @olgasyracusegmail-com: Please post in your site URL and let me know what issues you are having with the slider so that I can help you out!
    I will try solving those issues so that you don’t have to use another plugin for a feature that is already in the theme.

    Let me know if this helps you out!
    Kind Regards.
    Skandha

    #162634
    Lydia
    Participant

    http://www.johnsoncamera.com
    I would really appreciate your help!

    #162755
    Skandha
    Keymaster

    @olgasyracusegmail-com: The text not visible in the slider I think can be fixed by giving the text container a light background.
    Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

    #feature-slider .entry-container, #feature-slider .entry-container:hover {
    	background-color:rgba(0,0,0,0.6);
    }

    Also remove the above CSS code you added.
    The size of slider pagers seems to be okay when I see it.

    Let me know if this helps you out!
    Kind Regards,
    Skandha

Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘How to hide Title and Pager on homepage Slider for small screens?’ is closed to new replies.