Hi,
Please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:
#top.home #av_section_1 {
background-size: cover !important;
}
The WordPress > Customize > Additional CSS has been given priority over all css in WordPress, so it is a good place to check if some css is working. If you are adding your css to the child theme style.css and you are using the Enfold Theme Options > Performance > JS & CSS file merging and compression you will need to resave the Theme options, the big blue “save all changes” button for the child theme css to be re-built. Sometimes the button is not active so you can’t click it, in this case please add a blank space to the Quick CSS and then save and clear your cache.
You can add your own custom class, in the code above you can replace #av_section_1 with your custom class.
For the width of the background you will need to manually adjust because the with is automatically set to 100%, please try this css:
#top #av_section_1 .av-special-heading-tag {
width: 90% !important;
}
#top #av_section_1 .av-subheading {
width: 36% !important;
}
Best regards,
Mike
Hey marsh1984,
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:
CSS Snippet:
/* CSS - */
@media only screen and(max-width: 767px) {
#top .avia-fullscreen-slider .slideshow_align_caption {
vertical-align: top;
}
#top .avia-fullscreen-slider .avia-slideshow-arrows {
display:none;
}}
You may not see the changes until the cached files are cleared in your browser.
Please perform the below steps to clear the browser cache:
1. Disable “merging and compression” for CSS and JS files from Enfold > Performance.
2. If a caching plugin is installed check the plugin settings and clear the cache and deactivate the plugins for testing purpose.
3. Hard refresh by pressing Ctrl + Shift + F5 on your browser or press the F12 key to open chrome dev tools and right click on the refresh button and select “Empty Cache and Hard Reload”.

Best regards,
Vinay
Hi,
Currently on some pages the scrollbar shows and on some pages which are not long enough the scrollbar does not show. This is default browser behavior but this affects the menu position. You can force the scrollbar to be displayed on all pages by using the below CSS.
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:
CSS Snippet:
/* CSS - */
html {
overflow: -moz-scrollbars-vertical;
overflow-y: scroll;
}
You may not see the changes until the cached files are cleared in your browser.
Please perform the below steps to clear the browser cache:
1. Disable “merging and compression” for CSS and JS files from Enfold > Performance.
2. If a caching plugin is installed check the plugin settings and clear the cache and deactivate the plugins for testing purpose.
3. Hard refresh by pressing Ctrl + Shift + F5 on your browser or press the F12 key to open chrome dev tools and right click on the refresh button and select “Empty Cache and Hard Reload”.

Best regards,
Vinay
Hey bauchope,
Sorry for the late reply. Please try the following in Quick CSS under Enfold->General Styling:
@media only screen and (max-width: 1200px) {
.avia-button.avia-size-large {
min-width: 100%;
}
}
Best regards,
Rikard
Hi!
Within the symbol box, links in text and buttons should not be underlined. The code in style.ccs (enfold-child)
a {text-decoration: none; outline: 0; max-width: 100%; max-width: none \ 9; }
a: hover, a: focus, a: visited {outline: 0; text-decoration: none;}
p a, p a: visited {line-height: inherit; }
a.avianolink, .avianolink a {cursor: default;}
#top .avia_hidden_link_text {display: none;}
it does not work.
Best regards
Morcy
-
This topic was modified 6 years, 9 months ago by
Morcy.
Hi Sandro,
Try adding this css code in Quick CSS, located in Enfold > General Styling:
button.pum-trigger {
padding: 9px 22px;
cursor: pointer;
border: none;
-webkit-appearance: none;
border-radius: 0px;
background-color: #719430;
color: #ffffff;
border-color: #507210;
}
button.pum-trigger:hover {
background-color: #83a83d;
color: #ffffff;
border-color: #61861b;
}
Hope it helps.
Best regards,
Nikko
Hi there, I have just installed Enfold version 4.5.7 with latest version of woocommerce and their extension bookings. I want to achieve the same as in the spa demo:
That is, to display the “Choose” button and once users click, show them the calendar. However I’m not getting that. See the link attached.
I have tried switching the theme to twenty nineteen on WordPress and then that feature works so I guess it must be something related to Enfold.
What can I do? Thanks!
Thank you for trying to help! I appreciate it. I’m using the Button element. In Enfold theme options the box is checked for “Show element options for developers.” What is an “edited alb element of the button”?
Hi, we have launched a website using Enfold and in the responsive section the button doesn’t display. I’m sending you privately link and login credentials.
Thanks!
read carefully even on top of that : https://webers-testseite.de/edited-enfold-alb-elements/#buttons
for better advice i had to see a link and your two buttons you are talking about.
Hello!
I am trying to add a custom button to the “social share button.”
I followed the steps here and see the addition under “Social Profiles” dropdowns:
But when I try to find the custom icon under the “Social Share Button” in the advanced layout builder, it is no where to be seen…no checkbox….
My goal is to have this custom icon available on all post pages (example in the private content).
Any help would be very much appreciated!
Thank you!!
Hi Rikard,
thank you for the good tip to bring Enfold up to date – I should have done that myself automatically. Version 4.5.7 is now active.
After inserting the new Private Token Key, I was able to display the coordinates of latitude and longitude in the Google Maps module and the map appaered in the frontend – but after a moment also a usage notice and an OK button…
On the Google Services page at Enfold, I checked the Google API key to see if it is still working – unfortunately it does not!
“This API key did not connect to Google Maps.”
I am completely unclear why the Google key suddenly no longer connects, after I’ve improved the situation by the enfold update publicly crucial.
In the private conent area you find the credentials of the site, so that you are able to take a closer look, if you want to.
Best regards
Grobi
Rikard ok … no problem
i try step by step, because now i found more touble but first please. Have a look to:
scrolling down to the end of the page.
here is link “diary” this is coming. this comes from a code generator of calendly.com ici have inserted this with a codeblock. I would like to have this in an enfold button. is that possible?
Thank you !!!
Hi xansdesign
I don’t know what this plugin does, but as far as I know even with the API you still have to click the update button in order to update Enfold.
I am not aware of Enfold updating automatically (maybe I am wrong).
Cheers from another participant
Michael
Hi,
I checked your site and cleared the cache. The site looks good on my end. Icons fade in when the pace is scrolled.
You may not see the changes until the cached files are cleared in your browser.
Please perform the below steps to clear the browser cache:
1. Disable “merging and compression” for CSS and JS files from Enfold > Performance.
2. If a caching plugin is installed check the plugin settings and clear the cache and deactivate the plugins for testing purpose.
3. Hard refresh by pressing Ctrl + Shift + F5 on your browser or press the F12 key to open chrome dev tools and right click on the refresh button and select “Empty Cache and Hard Reload”.

Best regards,
Vinay
Hi folks,
i hope i can explain my problem …
after having made a popup which I wanted to embed on a page >> the button shows in a different style as the Envato-theme-button-style!
look here:

what do i have to do to make use of the standard-Enfold-Style?
thanks in advance!
kind regards
Sandro
Thank you for your reply. I could not respond earlier because I was on vacation. I will not enable avia layout builder debugger If it will not cause any problems in the future. I’m glad tot hear that. (The reason why was that some campers were not showing in the search results. To solve this I have to go standard builder, code editor and delete <!– /wp:shortcode –> at the beginning and ending. Then I have to save it. Put is back and go to the advanced builder again and then the problem is solves. I made a note to do this every time I add a camper.)
The site went at the end of last week https://www.camperfans.nl/ and there are no problems with the buttons at that server. I will wait with updating for a while. Thanks for the tip off deleting the enfold folder in stead off over writing. I will do that. If the problem occurs after updating and I can not solve it I will open a new ticket.
Only problem now is the view in Edge. http://www.dev02.fyi-marketing.nl/wp-content/uploads/screenshot.pdf
Dear Enfold-experts,
I just added a support contact form on my enfold theme.
The problem is that is does not look like the forms here:
I would like the following:
– In my version I have borders around the different text fields – I would like it like in the above link
– There is too much padding under the submit-button
– There does not come a red border when it validates the form
When I try to add some of the CSS modifications on my quick css it does not affect anything:
Here is how I inserted the form:
[av_contact (Email address hidden if logged out) ' title='How can we help you?' on_send='' sent='Your message has been sent! We will get back to you shortly.' link='manually,http://' subject='Support Request' autorespond='' captcha='' form_align='' color='' custom_class='' admin_preview_bg='' av_uid='av-hroj83']
[av_contact_field label='Name' type='text' options='' check='is_empty' width='' multi_select='' av_contact_preselect='' av_uid='av-hkvmv7'][/av_contact_field]
[av_contact_field label='E-Mail' type='text' options='' check='is_email' width='' multi_select='' av_contact_preselect='' av_uid='av-hhfwe3'][/av_contact_field]
[av_contact_field label='Message' type='textarea' check='is_empty' options='' multi_select='' av_contact_preselect='' width='' av_uid='av-h5d55n'][/av_contact_field]
[/av_contact]
I tried to change to layout by:
.av-contact-form-title fieldset h3 {
font-size: 24px;
text-transform: uppercase;
}
or
/*—————————————-
// CSS – Contact form label icons
//————————————–*/
#top .avia_ajax_form.cf-label-icons label{
padding-left: 20px;
}
#top .avia_ajax_form.cf-label-icons label::before {
position: absolute;
left:0;
font-family: ‘entypo-fontello’;
}
#top .avia_ajax_form.cf-label-icons fieldset p:nth-child(2) label:before{
content:”e80a”;
}
#top .avia_ajax_form.cf-label-icons fieldset p:nth-child(3) label:before{
content:”e805″;
}
#top .avia_ajax_form.cf-label-icons fieldset p:nth-child(4) label:before{
content:”e826″;
}
#top .avia_ajax_form.cf-label-icons fieldset p:nth-child(5) label:before{
content:”e83b”;
}
/* Input field do not support pseudo elements so we target the last p in the fieldset which is usually the submit button */
#top .avia_ajax_form.cf-label-icons fieldset p:last-child:before{
content:”e844″;
color:#FFF;
font-family: ‘entypo-fontello’;
position: absolute;
left: 20px;
top: 50%;
transform: translateY(-50%);
}
But nothing changes
I hope you can help.
-
This topic was modified 6 years, 9 months ago by
ksnoo04.
Hi,
Glad to hear, I checked your buttons again and they are working for me also.
Glad we were able to help, we will close this now. Thank you for using Enfold.
For your information, you can take a look at Enfold documentation here
For any other questions or issues, feel free to start new threads in the Enfold forum and we will gladly try to help you :)
Best regards,
Mike
Hi,
Thank you for the login, I checked one of your widget items (CHRISTMAS 2018) to see why the excerpt was not showing and found that you created the post with the Advanced Layout Builder.
In order to show an excerpt for this post you will need to add a manual excerpt by going to the top of the post page and clicking the “screen options” tab/button and check the excerpt box:

this will show an excerpt field below the post that you can add text to.

I do see that your category choice is not working, but I note that you have a “visibility” option that I don’t:

I believe this is from your “Conditional Menus” plugin, please try disabling to test, a similar plugin that does work with Enfold is: Widget Options
Best regards,
Mike
Hello,
Sometime within the past few days all my PayPal Add To Cart buttons stopped working except for one. The buttons are arranged in Text Box content elements contained within Column layout elements within Color Section layout elements. The still-working button is the only one in its row. Experimentation reveals that the button codes don’t work anymore if there is more than one button in a row; i.e. in columns. A non-working button can be made to work if it is moved to be the only button on its row. Other than rearranging/stacking my products so the buttons are arranged in a single column is there a workaround for this?
I’m using WordPress Classic and am up to date on Plugin versions. I already tried updating my web content after disabling all plugins. Please note the All In One SEO Pack Pro must remain disabled as it causes updates to hang and then return errors.
David
Hey Gerhard,
Thank you for contacting us.
I checked your site and noticed you are using a large jpg image. Instead please use the below link to generate a favicon and upload it to the theme options.
https://favicon.io/
After updating the favicon please perform the below steps to clear the browser cache to view the changes:
1. Disable “merging and compression” for CSS and JS files from Enfold > Performance.
2. If a caching plugin is installed check the plugin settings and clear the cache and deactivate the plugins for testing purpose.
3. Hard refresh by pressing Ctrl + Shift + F5 on your browser or press the F12 key to open chrome dev tools and right click on the refresh button and select “Empty Cache and Hard Reload”.

If you still have any issue please deactivate all plugins, clear the cache again and check for the issue.
Best regards,
Vinay
We have a site that we don’t want to use the Enfold theme anymore.
How can we convert all this custom HTML in the Posts, like:
[av_button label]
[av_textblock]
[av_heading]
etc
Thanks in advance.
Hi there,
I am trying to make some changes to theme options like i am trying to left align the logo and menu right align but when i click “Save changes” button it says “Changes not saved”
This is my site URL : https://www.allpowerfullove.org/
I have tried everything, deactivated all plugins, Edited .htaccess file and removed any extra code. I tried flushing DNS Cache . Nothing helped.
I am attaching my site logins in the private content area. please fix this ..
Hello Victoria,
I am using Mega menu for the menu. But I think search button is not from mega menu. I see there is Quick CSS added for search bar in Enfold theme-> General Styling. But it’s not showing in mobile.
Thank you for the reply!
Hi! I have soon finished our site built with enfold.
But I have three problems that needs to be fixed before we launch!
1. I have chosen transparent Header on all pages, but it does not apply to the mobile version. I have tried every setting to get the same transparent header (logo & burger menu) to look the same on smaller devices. How is this fixed so it’s always transparent as on the full version? To be clear i want to remove the white background color that appears on mobile versions in the menu just as the desktop version.
2. Remove border on buttons. As seen on the website there is a black / white border around the buttons when using the color setting light transperant / dark transperant. I can not find any setting for removing the border at all. I just want to have the button text without any background color och border color. How do i fix this?
3. Changing Hoover effect color on a cell in grid row. All over the page i have grid rows with cells. In the setting edit cell/ column link / hoover effect i have activated this function. But now the hoover effect is white and not blank. How can i change the hoover effect to black instead?
Thanks so much in advanced, we really need help so we can publish the website live!
Best Regards
Marcus
Hey vincent_bazinet,
The site looks good on my end. You may not see the changes until the cached files are cleared in your browser.
Please perform the below steps to clear the browser cache:
1. Disable “merging and compression” for CSS and JS files from Enfold > Performance.
2. If a caching plugin is installed check the plugin settings and clear the cache and deactivate the plugins for testing purpose.
3. Hard refresh by pressing Ctrl + Shift + F5 on your browser or press the F12 key to open chrome dev tools and right click on the refresh button and select “Empty Cache and Hard Reload”.

Best regards,
Victoria
I have added an image in a box and a button, both of them have rounded corners. I cant seem to find where I can change this as I do not want rounded corners. Could anybody advise? This is using the latest version of enfold (as a child theme)
Hey Miki,
The site looks good on my end. You may not see the changes until the cached files are cleared in your browser.
Please perform the below steps to clear the browser cache:
1. Disable “merging and compression” for CSS and JS files from Enfold > Performance.
2. If a caching plugin is installed check the plugin settings and clear the cache and deactivate the plugins for testing purpose.
3. Hard refresh by pressing Ctrl + Shift + F5 on your browser or press the F12 key to open chrome dev tools and right click on the refresh button and select “Empty Cache and Hard Reload”.

Best regards,
Victoria
Hi dear Enfold Team,
I’m having trouble displaying a google map. What I have done so far:
– get a not limited Google API key and…
– …implemented on Google Services page in Enfold
– received a positive confirmation after check (Last time we reviewed, we were able to connect to Google Maps with your API key)
– Entered the Map-address and clicked on the button “Get coordinates”
– Error message received “An error has occurred! Too many requests at once Please wait a few seconds before requesting coordinates again”
– tried several times, waited almost an hour
– Pages cache emptied
– disabled plugins
– Credit card data deposited with Google
… all without success!
Can you help me?
Best regards
Grobi