[Support request] Latest WordPress Update Issue

[Luke]

I actually noticed a few days ago that the recent WordPress update messed up a little bit on my blog with buttons. For example when you check this article and hover over the blue button you will see that the sign on the button disappears – I am 100% sure it was caused by the update (it shouldn’t be disappearing). Do you think that when they release the next update this issue may be fixed?

[Leo]

Hi Luke,

Are you using any caching plugins? If so can you try clearing and disabling it for me to take a look?

Thanks!

[Luke]

No, I’m not using caching plugins. But I cleared cache both on Ezoic and Cloudflare. But I think it doesn’t change anything. However not all buttons are affected. Check the link to another article and you will see that the same kind of button in a different article works OK. It started to happen once I updated WordPress to the latest version.

[Leo]

Check the link to another article and you will see that the same kind of button in a different article works OK.

The markup of that button is different than the one you’ve shown in the first link.

Can you disable Ezoic and Cloudflare cache as I requested? I need to see the source code better.

Thanks!

[Luke]

I know how to clear Ezoic and Cloudflare caching but I have no idea how to disable them. Probably I will need to contact Ezoic support.

[Leo]

Sounds good.

This CSS should work as a temp fix for now:

a.wp-block-button__link:hover {
    color: #fff;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

I would also highly recommend considering using GenerateBlocks – you would have much less issues 🙂

[Luke]

Why do you think it’s only a temporary fix?

I understand that if I started using GenerateBlocks I would need to replace the existing buttons with GenerateBlocks buttons? Is it a free or a paid plugin?

[Leo]

The fix should always work – I just wanted to know if there is a way to fix it without using CSS.

You can start using GB for new posts if you don’t want to go through the existing posts to update all buttons.

GB has a free and a pro version.

[Luke]

Are you sure that CSS code is correct because I went to my WordPress dashboard: Customizing – Additional CSS and there I pasted that CSS code and clicked Publish. But it looks like it didn’t work. When I hover over the buttons the signs on the buttons still vanish. I also cleared cache on Ezoic but it didn’t help. Check the link.

[David]

Hi there,

edit your CSS you have a backtick mark just before that CSS. You need to delete that.

[Luke]

OK, I fixed that. It’s working now.

I’m wondering if we can do one more thing with it. Now when you hover over the button the text on the button doesn’t disappear, but once you click it then it disappears and it reappears once you hover over it. Is it possible to add something to that CSS code to prevent that sign on the button from disappearing once we click on it?

Leo suggested to start using Generateblocks. I’m thinking of starting with the free version. But what’s the difference actually between a free version and a paid one? If I want to start using Generateblocks for creating buttons in the new blog posts will it make any difference if I choose free or paid version?

[David]

Try changing the CSS to this:

a.wp-block-button__link:hover,
a.wp-block-button__link:visited {
    color: #fff;
}

GenerateBlocks Free does a hell of a lot, possibly too much 🙂

GenerataBlocks Pro adds:

a. Convenience features, such as allowing you to save Global Styles, crate your own Patterns, build asset libraries for saving SVG icons and shapes etc
b. Advanced features such as Advanced Backgrounds where you can set different background images for different devices or hover states, Effects for adding hover effects to GB blocks, insert Data Attributes into the blocks HTML for custom development, stage 1 ACF integration with GB Dynamic Data.
c. In the next release it will have 2 new variant blocks for adding Accodions and Tabs.

And other stuff.

[Luke]

OK, I used the code which you provided but it didn’t help. Can you check if the code on my site looks good? Maybe I did something wrong.

[David]

I can see that CSS is working. Can you clear your browser caches.

[Luke]

I checked it in the Brave browser in the incognito mode and it’s not working for me. Once I click the button the text on the button disappears and reappears when I hover over it. I did the same with three other buttons down the page and the effect was the same. There are 3 buttons down the page one after another. When you click the 1st button, the text disappears, when you click the 2nd button, the text reappears on the 1st button and when you click the third button the text reappears on the 2nd button. Strange. But this is what I see. If you confirm that everything’s working fine for you and the text on the button doesn’t disappear after clicking on it, I will leave it as it is. Probably there’s something wrong on my end.

[Author]

Posts