WP Show Posts & Social Icons display issue on homepage

Hi there,

looks and sounds like a caching issue - can you disable any caching / optimization plugins - then recheck the site.

Hi,

Yes, when I disable the caching plugin, they appear as normal. Any idea how to exclude them from cache? :/

You will need to check with the cache plugin support on how you can exclude specific CSS. If they can advise how then we can probably advise on the specifics of WPSP.

I see there is an option to exclude CSS: https://prnt.sc/rCJML8Y1_M6z

If you can disable the litespeed cache i will take a look at the site to see what needs to be added to the 'excludes'

Of course, I disabled it :)

Ok so:

1. The Inline CSS for that WPSP list is:

.wp-show-posts-columns#wpsp-14764 {margin-left: -2em; }.wp-show-posts-columns#wpsp-14764 .wp-show-posts-inner {margin: 0 0 2em 2em; }

2. And the main style sheet is:

wp-show-posts-min.css

You will need to check with Litespeed how you add them to the exclude field.

Thanks, it worked!

Any idea what is the CSS for the social icons in the footer and how to align them? :)

Personally I would remove the Social Links Block and create them using a GenerateBlocks Buttons block, you can simply add the icon and check the option to remove the Text label. You can then adjust the positioning in the editor and GB settings

Thanks for the suggestion.

I added a GB Buttons Block but nny idea how to remove the button and leave only the icon like in the above Social Links Block? https://prnt.sc/fRDs8GG5mv4p

With the Buttons Block selected, and below where you set the Icon there is an option: Remove Text
See here:

https://docs.generateblocks.com/article/buttons-overview/#icon

Just check that to remove any text you added to the button.
With the button selected go to the Advanced Tab and there you can add an aria-label for your button so screenreaders can know what its for eg. My Facebook Link

This was useful, thanks!

And is it possible instead of a square the icon to be a circle?

Do you mean the facebook icon ? if so you can get a square from FA:

https://fontawesome.com/icons/facebook-square?s=brands

And this article explains how to use them in GenerateBlocks:

https://docs.generateblocks.com/article/adding-custom-svg-icons/

And FA made it easier to get the SVG Code by simply click the </> button on that page i linked to.

No, the idea is to make the buttons circle, not square as of now https://prnt.sc/bR_Mn4j070SI