[Resolved] Archive title scaling on mobile

Home Forums Support Archive title scaling on mobile

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #356996
    Roman

    I have mentioned that archive titles (h1 .page-title) don’t scale down going to mobile view, like post titles (h1 .entry-title) do. Is it a feature or a bug? I would like both post titles and archive titles behave the same way. Currently, archive titles are just so huge on mobile. The taxonomy description could scale down as well…

    GP Premium 1.3.1
    #357138
    Tom
    Lead Developer
    Lead Developer

    The archive titles are much smaller by default.

    You can adjust them like this:

    @media (max-width: 768px) {
        .page-header h1 {
            font-size: 18px;
        }
    }
    #360498
    Roman

    I am not sure we are talking about the same titles. Please have a look for example here http://telezjetele.cz/rubrika/za-humny/ – title of this archive page is huge and doesn’t scale down (description text as well).

    CSS provided above doesn’t work for me.

    #360568
    Leo
    Staff
    Customer Support

    Hi there,

    The title is currently taking style from this CSS you’ve added:

    .page-header h1 {
        font-size: 2.15em;
        margin-bottom: 0.25em;
    }

    The description is taking style from this:

    .taxonomy-description {
        font-size: 1.1em
    }

    Is this not what you wanted?

    #360574
    Roman

    I have forgotten I previously set this CSS, thank you for pointing me there.

    Now I would like if the title behaved the same way like any h1 tag. Could you help me with a proper CSS?

    #360579
    Leo
    Staff
    Customer Support

    Hmm if you remove the custom CSS style for it then it should inherit from normal setting.

    #360593
    Roman

    Yes, but h1 with class=”page-title” has different setting than h1 which can be set via customizer > typography > content > H1

    #360607
    Leo
    Staff
    Customer Support

    Ahh I think you are correct 🙂

    So you can set the desktop/tablet size by this CSS:

    @media (min-width: 769px) {
        .page-header h1 {
            font-size: 18px;
        }
    }

    mobile size:

    @media (max-width: 768px) {
        .page-header h1 {
            font-size: 18px;
        }
    }
    #360613
    Roman

    Thank you!

    #360614
    Leo
    Staff
    Customer Support
    #377085
    Tim

    Just came across this issue, where using the customiser to change font size and weight for h1 took effect almost everywhere, but not on the category page headings which use page-title instead of entry-title. Is this going to be corrected in future updates? I currently can’t find any way with the customiser to change the page-title font sizes. It originally happened for widgets too, until I found the separate section for widgets in typography. Can we get a similar page section added so I don’t have to mess about trying to write my own css please 🙂

    Thanks

    #377165
    Tom
    Lead Developer
    Lead Developer

    Absolutely, this will be corrected in the next version 🙂

    #377250
    Tim

    Awesome, thanks Tom!

Viewing 13 posts - 1 through 13 (of 13 total)
  • You must be logged in to reply to this topic.