Dear Customers! We're out of the office from the 6th of October to the 11th of October. We sincerely apologize for the inconvenience. For WordPress 5.5.* related issues, please visit this article

Okay
  Public Ticket #1670346
how to change the font size for slider
Closed

Comments

  •  1
    funzool started the conversation

    hi,

    how to change the font size for the slider? tried customizer but didnt seem to work.

  •  361
    Filip replied

    Hi there!

    What exact slider do you have in mind? If it's:

    1. Fullscreen slider, then please use this custom CSS (to be added in Theme Options / Advanced / Custom CSS area):

    .home-inner.v2 .home-text-slider .home-texts .slide { font-size: 50px; }
    .home-inner.v2 .home-fixed-text { font-size: 18px; }
    

    The first line applies to the bigger text, the smaller one applies to the subtitle.

    2. If it's a Revolution or Layer slider, you will need to go to the Revolution Slider settings, edit that specific slider you use and change the typographic settings right there.

    Kind Regards,
    Veented Team

  •  1
    funzool replied

    Using the full screen slider. Ok got it. Thanks.

  •  361
    Filip replied

    You're welcome!

    Kind Regards,
    Veented Team

  •  1
    funzool replied

    How about on mobile? How do i enlarge the font size?

  •  361
    Filip replied

    Hi again,

    This CSS will work:

    @media screen and (max-width:760px) {
        .home-inner.v2 .home-text-slider .home-texts .slide { font-size: 50px; }
        .home-inner.v2 .home-fixed-text { font-size: 18px; }
    }
    

    Kind Regards,
    Veented Team

  •  1
    funzool replied

    Doesn't seem to work. Here's the link. www.neptuneavia.com

  •  361
    Filip replied

    Hi there,

    Oh, it looks like it's being overwritten by some other rules. Please try the following code:

    @media screen and (max-width:760px) {
        #page-content .home-inner.v2 .home-fixed-text {
            font-size: 18px;
            line-height: 1.3em;
        }
    }

    Kind Regards,
    Veented Team

  •  1
    funzool replied

    thanks it worked. however, another issue on ipad. tried the same fix but didnt work. what should i put?

  •  361
    Filip replied

    Hi there,

    Okay, so that code I just sent you includes the "760px" part and that means it's going to affect devices with a screen resolution lower than that. For iPad, please change it to "1024px".

    Kind Regards,
    Veented Team

  •  1
    funzool replied

    i want to have different font sizes as follows. seems like it didnt work on ipad for 1024 for the latter. what should i change?

    @media screen and (max-width:760px) {
        #page-content .home-inner.v2 .home-fixed-text {
            font-size: 22px;
            line-height: 1.3em;
        }
    } @media screen and (max-width:1024px) {
    .home-inner.v2 .home-fixed-text {
            font-size: 32px;
            line-height: 2.3em;
        }
    }
  •  361
    Filip replied

    Hi there!

    Well, you use a stronger selector (with an ID #) for smaller devices (max-width:760px;). Please use the same selector for both, like:

    @media screen and (max-width:760px) {
        #page-content .home-inner.v2 .home-fixed-text {
            font-size: 22px;
            line-height: 1.3em;
        }
    }
    @media screen and (max-width:1024px) {
        #page-content .home-inner.v2 .home-fixed-text {
            font-size: 32px;
            line-height: 2.3em;
        }
    }
    

    Kind Regards,
    Veented Team