[Resolved] A few quick customisation questions

Home Forums Support A few quick customisation questions

  • This topic has 5 replies, 2 voices, and was last updated 1 year ago by Leo.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #991901
    Alasdair

    I have just overhauled the look of my website and run into a few issues. Currently, I am working my way through adding custom CSS for most of these but was unsure if there was actual settings I was missing.

    1. Headings work as expected, and use the designated font from the typography settings, in the blog layout and at the top of individual pages. However, all the headings in the main content inherit from the body font. Inspecting the page it looks like the heading font is being overwritten by the body font. Is there a way to stop this from happening?

    Edit: The correct heading fonts are used on the Contact page, but not other pages for some reason.

    2. Is there a setting for changing the font and colour of image and other captions? Similarly, is it possible to change the colour and weight for separator blocks? Both are currently difficult to see with my current theme

    3. Similarly, is there a setting to reduce the font weight for date, category, and tags – but not body text?

    4. Is it possible to increase the spacing between the categories and tags shown after a post?

    5. For tablet and mobile views is it possible to align the “+More” button to load more posts in the blog layout to the left so it matches the “Read More” buttons that follow blog excerpts. Doing this seems beyond my noob CSS skill level as “align: left” shunts it all the way to the left outside the main container.

    6. Finally, what is the easiest way to add Sansita as a font option within the typography settings?

    #991953
    Leo
    Staff
    Customer Support

    Hi there,

    1. Are you referring to this heading?
    https://www.screencast.com/t/MqhsgDwD1QrC

    If so, the font-family setting is overwritten by the HTML inline style as indicated above.

    2. Image caption requires CSS:

    figcaption {
        font-family: "Oswald", sans-serif;
        font-size: 20px;
        color: #000;
    }

    and separator block:

    .wp-block-separator {
        background-color: #000000;
        height: 3px;
        width: 400px;
    }

    3. Try this:

    .entry-meta {
        font-weight: 300;
    }

    4. Try this:

    .cat-links, .tags-links {
        margin-bottom: 5px;
    }

    5. Try this:

    .masonry-load-more.load-more {
        text-align: left;
    }

    6. This should help:
    https://docs.generatepress.com/article/customizing-the-google-font-list/#adding-your-google-font-to-the-list

    Let me know 🙂

    #992474
    Alasdair

    Thanks for the reply.

    1. Argh, bloody Gutenberg. I forgot about this issue when it happened before. On converting old ‘classic’ posts and pages to Gutenberg, inline styles were added that kept the original font used in the ‘classic’ posts. Do you know if there is any way to quickly remove inline styles from Gutenberg blocks?

    2-5. Perfect! Thank you.

    6. Magic! Got it working.

    #992519
    Leo
    Staff
    Customer Support

    1. Unfortunately it would have to remove manually as far as I understand.

    #995790
    Alasdair

    Managed to find a plugin, “Advanced Rich Text Tools for Gutenberg”, which adds a button to clear formatting. It removes bold, links, and other formatting as well – but manually fixing the few blocks with those and using the button to nuke the rest was definitely much faster overall.

    Thanks again for your help.

    #995857
    Leo
    Staff
    Customer Support
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.