Support » Plugin: Related Posts Thumbnails Plugin for WordPress » Change Font Size When Using Block

  • Resolved extinctdisney

    (@extinctdisney)


    For whatever reason, when using the block option to add related posts to a page (linked above), the “Related Posts Block Title” isn’t pulling from the settings and the font is much smaller than the H4 I’ve specified (see “Related Posts” heading on this page for example: https://www.extinctdisney.com/food-rocks/). Is there a way to correct this?

    The page I need help with: [log in to see the link]

Viewing 13 replies - 1 through 13 (of 13 total)
  • Plugin Support Muhammad Arslan

    (@wparslan)

    Hi @extinctdisney

    Related Posts Thumbnail plugin has a block section as well.

    On your site, the title is defined in the H4 tag moreover, If you want to add custom classes you can add custom classes as well to target the specific element from the Related Posts Thumbnail block.

    Screen Shot

    Thread Starter extinctdisney

    (@extinctdisney)

    Apologies, let me clarify.

    I have set the Related Post plugin settings to have the title set to H4 and it is working as it should on all the automatically placed instances of the Plugin (as can be seen on this post: https://www.extinctdisney.com/food-rocks/).

    It is not, however, working where I have used the gutenberg block on the landing page (as can be seen here: https://www.extinctdisney.com/). When the block is added, the only options are to change what the title above the related posts says and, despite it being set to H4 in the settings, where I have manually placed the block, you can see where it says “Jump In!” is not an H4 sized heading.

    Plugin Support Muhammad Arslan

    (@wparslan)

    When using the Gutenburg block, write the title with the tag.
    For example, if you have the title “Some Title” write it as “<h4> Some Title </h4>”.

    It will be converted to a h4 tag.

    Thank You

    Thread Starter extinctdisney

    (@extinctdisney)

    Thanks so very much. That fixed the heading size in the block but now, I have an increase in the amount of white space between the heading and the posts. Any thoughts on how to resolve that?

    Plugin Support Muhammad Arslan

    (@wparslan)

    Hi @extinctdisney

    You can target the specific block heading by custom CSS by giving a class to the h4 tag.

    Thank You. 🙂

    Thread Starter extinctdisney

    (@extinctdisney)

    Sorry, I’m not sure that’s the answer I’m looking for. There is white space above and below the block heading. How would I remove that with css?

    Plugin Support Muhammad Arslan

    (@wparslan)

    Hi @extinctdisney

    I couldn’t see any extra spacing above and below the heading could you be more specific on which page you are facing this issue.

    I checked your given page and it didn’t contain any extra spacing regarding Related Posts Thumbnails. (https://www.extinctdisney.com/food-rocks/)

    Looking Forward Dear,

    Thread Starter extinctdisney

    (@extinctdisney)

    I am referring to the landing page I’ve been speaking about throughout this thread.
    https://www.extinctdisney.com/
    If you visit that, you’ll see space above and below the H4 heading of “Jump In” above the Related Posts block.

    Plugin Support Muhammad Arslan

    (@wparslan)

    Oh, so this is the page, no problem…

    Use the following CSS to remove them also purge the cache after adding this custom CSS.

    p.relpoststh-block-title {
     display: none;   
    }
    .relpost-thumb-container p {
        display: none;
    }

    Cheers!

    Thread Starter extinctdisney

    (@extinctdisney)

    In trying this, it appeared to only make the heading smaller. The white space was unchanged. To confirm, should this css go in the css for the block or the page overall?

    Plugin Support Muhammad Arslan

    (@wparslan)

    Hi @extinctdisney
    Here is your page before the CSS https://d.pr/i/0YR4D2
    Here is your Page after the CSS https://d.pr/i/XDYIvi

    You must be using some cache plugin so please purge the cache.
    The CSS is designed only to target the Related Post block elements.

    Regards,
    Team Related Posts Thumbnails

    Thread Starter extinctdisney

    (@extinctdisney)

    The answer to my question is that this css needed to be placed in the overall custom css for the theme. I understand it was designed to target just that block but what I was asking was where should the css go. I had originally placed it in the “Additional CSS Class(es)” section of the Advanced editor for that block specifically. It needs to go into the full site custom css.

    Thanks

    Plugin Support Muhammad Arslan

    (@wparslan)

    Hi @extinctdisney

    No, dear.
    The Additional Class/(es) just adds the class name/s to that block.
    The CSS should go in the theme’s CSS so it can target the block.

    Thank You

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘Change Font Size When Using Block’ is closed to new replies.