Archived topic
Code being stripped when converting to blocks
22 replies · Started by Jodie on June 23, 2019
Looks like you've done it?
https://www.screencast.com/t/Kt7f5Iik7AK
If not, this should be the CSS to target the Post Comment button specifically:
.comment-respond input[type="submit"] {
color: #ffffff;
background-color: #000000;
}
Hi there Leo.
No sadly I didn't make it work. I just removed the css from the additional css section for the wp-block-button and changed the color of the buttons in the section in the customiser.
I will have a go at trying the css you have given me for the post comment button.
I'll let you know how I go :)
I really appreciate your help.
Cheers Jodie
Thanks very much Leo
I reverted the settings for the button color in Appearance to transparent again.
Then added back my css and then added yours and it works.
Thanks so much for your help.
Cheers
Jodie :)
No problem :)
Hi Guys
I am wondering what I am doing wrong?
I have applied this css to the Advance CSS in Appearance section but the text size is not displaying as 19px
/*START of WP BUTTON*/
.wp-block-button {
width: 100%;
max-width: 480px;
border-radius: 100px;
margin: 0 auto 10px;
margin-top: 60px; margin-bottom: 60px;
display: block;
font-size: 19px !important;
font-weight: bold;
background-color: #49a964;
background-image: -webkit-gradient(linear, left top, left bottom, from(#8bc89c), to(#49a964));
text-decoration: none;
color: #ffffff !important
}
.wp-block-button:hover{
background-color: #eaa355; background-image: -webkit-gradient(linear, left top, left bottom, from(#f5d5b1), to(#eaa355)) ;
color: #ffffff
}
/*END of WP BUTTON*/
This works in my other site but not for my new site. Here is the post where the WP Buttons show up in green https://crochetpenguin.com/gifts-for-crocheters/
What am I missing please?
Cheers
Jodie
Hi there,
This is the markup generated by the Block Button:
<div class="wp-block-button aligncenter">
<a class="wp-block-button__link" href=" url " target="_blank" rel="nofollow noreferrer noopener">Button Label</a>
</div>
That CSS is currently adding styles to the <div> and the font size style belongs to <a> tag.
Instead of targeting .wp-block-button in your CSS target:
.wp-block-button__link or .wp-block-button a
Simply one word for you David - Legend
Thank you so much for your help.
I used the .wp-block-button_link as the target and now the text is displaying as it should.
Much appreciated as always.
Cheers
Jodie
Glad to be of help