- This topic has 9 replies, 3 voices, and was last updated 3 years, 4 months ago by Leo.
-
AuthorPosts
-
December 1, 2020 at 10:37 am #1561606Brian
Hi,
Is there a way of making button blocks take on the styles set in Customize > Colors > Buttons? Also, Is there a way of getting buttons to line up – I think the current layout looks messy.
Kind Regards,
Brian Thompson
December 1, 2020 at 11:32 am #1561771LeoStaffCustomer SupportHi there,
Is there a way of making button blocks take on the styles set in Customize > Colors > Buttons?
Unfortunately not.
Also, Is there a way of getting buttons to line up β I think the current layout looks messy.
Line up in what way? You can add multiple buttons inside a button wrapper if that helps:
https://docs.generateblocks.com/article/buttons-overview/#adding-more-buttonsDecember 3, 2020 at 3:30 am #1565399BrianHi Leo,
I was doing a bit of research on this and found this snippet:
add_filter( 'generateblocks_defaults', function( $defaults ) { $color_settings = wp_parse_args( get_option( 'generate_settings', array() ), generate_get_color_defaults() ); $defaults['button']['backgroundColor'] = $color_settings['form_button_background_color']; $defaults['button']['backgroundColorHover'] = $color_settings['form_button_background_color_hover']; $defaults['button']['textColor'] = $color_settings['form_button_text_color']; $defaults['button']['textColorHover'] = $color_settings['form_button_text_color_hover']; $defaults['button']['paddingTop'] = '10'; $defaults['button']['paddingRight'] = '20'; $defaults['button']['paddingBottom'] = '10'; $defaults['button']['paddingLeft'] = '20'; return $defaults; } );
From Here:
https://generatepress.com/forums/topic/add-custom-css-selector-to-the-button-selector/#post-1322768
but will it still work? Also, where what do I add it to?
Kind Regards,
Brian Thompson
December 3, 2020 at 5:39 am #1565565DavidStaffCustomer SupportHi there,
the code that Tom provide here is a PHP Snippet.
This article explains how to add PHP to your site:
December 4, 2020 at 11:31 am #1567739BrianHi David,
I have tried adding the php code through code snippets suggested but there doesn’t seem to be any difference at all. Is there a way that I could style them individually through adding a class I just want to make the hover colours uniform.
Kind Regards,
Brian Thompson
December 4, 2020 at 5:32 pm #1567961LeoStaffCustomer SupportNot sure if I fully understand.
The snippet David provided is to set the default value and not to change all their values at once.
Is there a way that I could style them individually through adding a class I just want to make the hover colours uniform.
You should be able to use the color options within the buttons blocks to do so.
Am I missing something here?
December 5, 2020 at 9:35 am #1568624BrianHi Leo,
Sorry, what I meant was when I added the php filter suggested by David, there wasn’t any change to the default size even though the filter was supposed to set the default colours to default to what is in customize > colors > Buttons.
Here is a screenshot of the php snippet which was suggested in the adding php page:
This is what is set in the customizer:
Also, sorry, I wasn’t thinking straight. I meant to say about is there a way of applying a custom style to the individual buttons through the Additional CSS class(es) field of every button as opposed to going to every one to style them.
I hope this clears up some of the confusion.
Kind Regards,
Brian Thompson
December 5, 2020 at 4:11 pm #1568860LeoStaffCustomer SupportHmm I just tested the snippet and it worked for me.
Take a look at this short clip:
https://www.screencast.com/t/Ij2mdDTHI meant to say about is there a way of applying a custom style to the individual buttons through the Additional CSS class(es) field of every button as opposed to going to every one to style them.
I supposed if give you all the button a class like special-button, then you can style it with this CSS:
.gb-button-wrapper .gb-button.special-button, .gb-button-wrapper .gb-button.gb-button.special-button:visited { background-color: #f1c40f; color: #ffffff; padding: 40px 20px; }
I would recommend against doing this though as it’s just not good practice.
We will have the copy style option in the pro module which will make this easy π
December 8, 2020 at 6:01 am #1571530BrianHi Leo,
Sorry for the delay in getting back to you. It now works with me. I forgot to clear the cache. I didn’t see an instant update of the colours in the preview of the customizer though for some reason. I have the snippet transferred to the live site so I’m hoping that when I go live with it that it will work there too.
Thanks Again.
Kind Regards,
Brian Thompson
December 8, 2020 at 10:30 am #1571936LeoStaffCustomer SupportNo problem π
-
AuthorPosts
- You must be logged in to reply to this topic.