Reusable Block Formatting not Displaying

To troubleshoot the issue with your affiliate disclaimer block, I would recommend trying the following steps:

Check your theme’s styles: If your theme has a default font size set for certain elements, it could be causing your affiliate disclaimer block to display at a different size. You can try adding a custom CSS rule to override the default font size for your disclaimer block.

Check for conflicting CSS rules: It’s possible that there is another CSS rule that is causing your font size to be overridden. To troubleshoot this, you can use a tool like the browser’s developer console or a plugin like CSS Hero to inspect the CSS rules being applied to your disclaimer block and see if there are any conflicting rules.

Check for plugin conflicts: If you are using any plugins that add their own CSS rules, it’s possible that one of these plugins is causing the font size of your disclaimer block to be overridden. You can try deactivating each plugin one by one to see if any of them are causing the issue.

To add a custom CSS rule, you can try the following steps:

In your WordPress dashboard, go to Appearance > Customize.

Click on the “Additional CSS” option in the left-hand menu.

Add the following CSS rule:

.wp-block-my-plugin-disclaimer {
  font-size: 10px;
}

Replace .wp-block-my-plugin-disclaimer with the class name of your disclaimer block. You can find the class name by inspecting the element in the browser’s developer console or by looking at the HTML source code of the page.

I hope these suggestions help! Let me know if you have any other questions.

• This reply was modified 2 years, 3 months ago by Mayank Kumar.

Hi Mayank,

Thankyou so much for your reply.

I think my theme has a conflicting CSS rule for the size of body text so I would need to override that rule. I can definitely paste the additional code in to my file, however – I can’t work out the name of the block. I’ve inspected the element in Google, but I can’t seem to find a name.

I’m so sorry, do you think you would be able to find it? It is on this post, just under the first image with the cactus – https://sallysees.com/mexico-city-itinerary/

The text is in italics and starts – “This article may contain affiliate / compensated links…”

Thankyou so much – sorry for a very stupid question!!

Sally

Please try adding this code

em {
    font-size: 10px;
    line-height: 1.7em;
}

Hi there, that worked but it changed the styling of any text in italics ?? I now have random tiny sized words throughout my blog post.

In the reusable blocks editor I have the option to add a HTML anchor to the block – would that help if added an anchor and therefore knew the name?

I can also directly add a Additional CSS Class inside the editor?

Screenshot here – https://drive.google.com/file/d/1CopnYX2Crn6ExLHMbF-YxKK_7yk-85dg/view?usp=sharing

Thankyou!!!

No HTML anchor is not here to help. Try to add the the css class to this block in your WordPress default editor or the theme you are using if your theme allows. Then you can change the class em with the name of your class

Hey,

Now please try this method which can helo you to do that.

Click on the 3dot option and then Edit as HTML

and add this tag

<em style="font-size:10px;">Here is your text</em>

• This reply was modified 2 years, 3 months ago by Mayank Kumar.
• This reply was modified 2 years, 3 months ago by Mayank Kumar.

Hey, thankyou for that. It worked, however the link I had included in the text is no longer displayed as you can see here: https://sallysees.com/mexico-city-itinerary/

When I try to switch back to the visual editor, it just says ‘This block contains unexpected or invalid content’ and when I try to recover it to be able to re-edit and add the link, the entire text just disappears.

Not sure what is going on!

<em style="font-size:10px;">This article may contain affiliate / compensated links, that may earn me a small commission, at no extra cost to you. For full information, please see our <a href="https://sallysees.com/affiliate-disclaimer/" target="_blank">disclaimer</a> here. While all efforts have been taken to ensure the information included in this post is correct and current, travel information such as opening hours, business operations and prices change frequently. If you find anything in this post that is incorrect or outdated please let me know in the comments so I can update it for other readers.</em>

Add this code either in default editor or in your visual editor.

IT WORKED!!! Thankyou so so much for your help. I really really appreciate it ??

Great!!! You can mark the topic is solved now.

Will do that now. Thankyou again, so so much!

Your Welcome!!