Archived topic
Generate Wordpress html code from Generate blocks
24 replies · Started by CRAIG on July 14, 2021
Sure thing, I have added a link privately to this message
Try swapping the CSS for this:
.gb-container-4123e9fd {
margin: 0 0 100px;
background-color: #f7f7ff;
color: #000000;
border-radius: 5px;
border-width: 0;
}
.gb-container-4123e9fd>.gb-inside-container {
padding: 40px 20px 20px;
}
.gb-icon {
display: inline-flex;
line-height: 0;
}
.gb-icon svg {
height: 1em;
width: 1em;
fill: currentColor;
}
h2.gb-headline-e9fa1b79 {
text-align: center;
color: #0f1c2b;
font-size: 44px;
font-weight: 700;
line-height: 60px;
margin-bottom: 15px;
}
p.gb-headline-6c36ba78 {
text-align: center;
color: #0f1c2b;
font-size: 16px;
line-height: 40px;
margin-bottom: 20px;
}
.gb-button-wrapper.gb-button-wrapper-203ac754 {
margin: 30px 0 0;
justify-content: center;
}
.gb-button-wrapper a.gb-button-dc9d43a7,
.gb-button-wrapper a.gb-button-dc9d43a7:visited {
background-color: #e63946;
color: #ffffff;
font-weight: bold;
padding: 15px 20px;
border-radius: 4px;
display: inline-flex;
align-items: center;
}
.gb-button-wrapper a.gb-button-dc9d43a7:hover,
.gb-button-wrapper a.gb-button-dc9d43a7:active,
.gb-button-wrapper a.gb-button-dc9d43a7:focus {
background-color: rgba(230, 57, 70, 0.95);
color: #ffffff;
}
a.gb-button-dc9d43a7 .gb-icon {
font-size: 1em;
padding: 0;
}
@media (max-width: 767px) {
.gb-container-4123e9fd {
font-size: 16px;
margin-right: 10px;
margin-left: 10px;
}
.gb-container-4123e9fd>.gb-inside-container {
padding: 20px;
}
p.gb-headline-6c36ba78 {
font-size: 24px;
padding-right: 20px;
padding-left: 20px;
}
}
This has worked
WOW
Thank you
Can ask what is you changed? As I will probably be making other ads in future (not loads) and I'd like to learn how to do it without pestering you guys
I revisited the static page you created and pulled the CSS from there.
CSS classes unique IDs can get updated when copied or republished. I then stripped out the CSS that wasn't required ( aka from the other blocks on the page ).
If you do it in the future, create a completely blank canvas page - that has NO other Blocks on the page, including any in a Block element - then the CSS will only be for that block.
Also if you have GB Pro you can create Global Styles - for the Container, Headline Blocks and Buttons - using your own specific classes that will make it simpler to isolate the CSS ( its in a different file )
Thanks David
You're welcome
Hi David,
Sorry to revive this again (haha)
The button on the ads is now aligning to the left for some reason (link added privately)
I have been working on the site, but I haven't made any changes at all to the CSS code you supplied to me (above) - I haven't even been in the plugin settings since it started working
Edit this part of the CSS - and add the display: flex; property commented below:
.gb-button-wrapper.gb-button-wrapper-203ac754 {
margin: 30px 0 0;
justify-content: center;
display: flex; /* add this */
}
Thanks David, really appreciate the help
Glad to be of help