Tagged: 

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #303464

    Hi –
    We want to include a button on a color background, but we don’t want the button to have a color. No background. Just a white border. What’s the CSS with a section ID? Can’t get it to stick.

    #303642

    Hey blankonblank!

    Thank you for using Enfold.

    Do you mind if we take a look at the actual page with the button? We can remove the background of the button via CSS.

    Regards,
    Ismael

    #303937
    This reply has been marked as private.
    #304183

    Hi!

    Thank you for the info.

    Please use this on Quick CSS or custom.css:

    .avia-button-wrap.avia-button-center.avia-builder-el-7.el_after_av_heading.avia-builder-el-last a.avia-button.avia-icon_select-no.avia-color-custom.avia-size-large.avia-position-center {
    background: transparent !important;
    border: 1px solid white !important;
    box-shadow: inset 0 0 10px white;
    }

    Another way to do that is to apply a unique css selector for the button or any advance layout builder elements. Edit functions.php, find this code:

    if(isset($avia_config['use_child_theme_functions_only'])) return;
    

    Below, add this code:

    add_theme_support('avia_template_builder_custom_css');
    

    Edit the button element then scroll below. Add a unique css selector on “Custom Css Class” field. For example, add “transparent-button”.

    You can add something like this on your custom.css or Quick CSS:

    .transparent-button a.avia-button {
    background: transparent !important;
    border: 1px solid white !important;
    box-shadow: inset 0 0 10px white;
    }

    Refer to this link for more info: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/

    Regards,
    Ismael

    #304444
    This reply has been marked as private.
    #304456

    Hey!

    In that case, you should refer to second solution. It would be more stable too

    Best regards,
    Yigit

    #304495

    ok. how would that look for child theme functions.php?

    #304537

    Hey!

    Simply add following code to Functions.php file in Appearance > Editor

    add_theme_support('avia_template_builder_custom_css');

    and follow the instructions Ismael posted here

    Cheers!
    Yigit

    #304556
    This reply has been marked as private.
    #304561

    Hi!

    You should see Custom CSS field now – http://kriesi.at/documentation/enfold/wp-content/uploads/sites/2/2013/12/blur.jpg
    Please edit your buttons and add “transparent-button” into custom CSS field, update your page then add following custom CSS code in Quick CSS field ( inside Enfold theme options > General Styling tab ) or Custom.css file ( inside Enfold/CSS folder )

    .transparent-button a.avia-button {
    background: transparent !important;
    border: 1px solid white !important;
    box-shadow: inset 0 0 10px white;
    }

    Code will be applied only on buttons with custom CSS class “transparent-button”.

    Cheers!
    Yigit

    #304596
    This reply has been marked as private.
Viewing 11 posts - 1 through 11 (of 11 total)
  • The topic ‘Button – Remove background’ is closed to new replies.