Hi,
Glad Guenni007 could help, thank you Guenni007, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.
Best regards,
Mike
Hi,
Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.
Best regards,
Mike
Hi Franz,
Please try the following in Quick CSS under Enfold->General Styling:
@media only screen and (max-width: 989px) {
.responsive #top .av-switch-990 .av-menu-mobile-active .av-subnav-menu > li > a {
padding: 5px 15%;
}
.sticky_placeholder {
height: 0;
}
.responsive #top .av-switch-990 .av-menu-mobile-active .av-subnav-menu > li a::before {
top: 5px;
}
}
Best regards,
Rikard
Hi,
Glad to know that the issue has been resolved. To optimize page loading by only including elements that are actually used, you can adjust the Enfold > Performance > Disable Template Builder Elements > Disabling Of Template Builder Elements settings. If you have more questions, please don’t hesitate to open a new thread.
Have a nice day.
Best regards,
Ismael
Hi,
Thank you for your patience, try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:
#top .avia-slider-testimonials.av-slideshow-ui .avia-slideshow-arrows a {
color: #000;
opacity: 1 !important;
}
Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.
After applying the css, please clear your browser cache and check.
Best regards,
Mike
Hi,
Thanks for the update, we’ll close this thread for now then. Please open a new thread if you should have any further questions or problems.
Best regards,
Rikard
Hi,
Are we talking about this setting?


because it shows & works for me in Chrome and Firefox, perhaps you have adblock enabled in your browsers or some other extension.
Best regards,
Mike
Hi,
To fix the menu in landscape mode try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:
@media only screen and (max-width: 989px) and (orientation: landscape) {
#av-burger-menu-ul {
padding: 0 !important;
}
}
Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.
After applying the css, please clear your browser cache and check.
Please see the screenshot in the Private Content area of the expected results.
Best regards,
Mike
Hey sailentpooN,
Thank you for your patience and the link to your slider, I recommend using the LayerSlider for your situation, I created a test page linked below so you can see that it will work better and I linked the LayerSlider export file of my example if you want to try it on your site, just use the import project button in the LayerSlider:

Best regards,
Mike
Hey Mike.
That CSS is from Enfold, not mine.
For my side, I disabled cache, deleted old css and js, delete browser cache, delete all my custom css and nothing. That Enfold CSS is making it black.
Thanks.
Hey clbdcnpafe,
Thank you for the link to your site, try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:
@media only screen and (max-width: 481px) {
#avia_sc_text_7 #attachment_34258,
#avia_sc_text_7 p {
max-width: 361px!important;
}
}
Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.
After applying the css, please clear your browser cache and check.
Best regards,
Mike
Hey peterolle,
In your css above you have a comma:

Try removing it and disable any caching plugin and Enfold Theme Options ▸ Performance ▸ JS & CSS file merging and compression, then enable Enfold Theme Options ▸ Performance ▸ Delete old CSS and JS files and then ensure to clear your browser cache and check again.
If this doesn’t help then try removing all of your custom css, as you may have other commas or missing brackets, and check again. If this does help then add your custom css back a little at a time until you find the error, of try using CSS Lint
If this doesn’t help, then we will need to examine your site, if it is on a localhost then we will need to wait until it is live.
Best regards,
Mike
Hey AlyssaMandy,
To fade-in try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:
.avia_transform .active-slide .avia-caption-title,
.avia_transform .active-slide .avia-caption-content,
.avia_transform .active-slide .avia-slideshow-button-2,
.avia_transform .active-slide .avia-slideshow-button {
-webkit-animation: avia-fadein 0.7s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275) !important;
animation: avia-fadein 0.7s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275) !important;
}
Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.
After applying the css, please clear your browser cache and check.
Best regards,
Mike
Hey peterolle,
single product pages contain the body class single-product so you could use
.single-product #av_section_1 {
border: red solid 2px;
}
for the whole section

but if you only want the style the related products items, it contains the classes related products so you could use
.single-product .related.products .product {
border: red solid 2px;
}

Best regards,
Mike
Hi,
Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.
Best regards,
Mike
Hi,
Ok, I didn’t understand your original request to be full width, so try this:
function av_woo_tabs_below_product_summary_full_width() {
remove_action('woocommerce_after_single_product_summary', 'woocommerce_output_product_data_tabs', 1 );
add_action( 'woocommerce_after_single_product_summary', 'woocommerce_output_product_data_tabs', 20 );
}
add_action( 'init', 'av_woo_tabs_below_product_summary_full_width');

Best regards,
Mike
I had everything correctly and I went to test some different colors in the general styles.
Click and save, click and save, click and save.
Then I returned to the one I was using previously.
Now the nav menu text is black in the transparent headers, the text colors I chose only appear when scrolling and the nav collapses with the defined background color.
I tried and tried and nothing.
Now inspecting I see this:
#top #header.header_color.av_header_transparency .av-main-nav > li > a .avia-menu-text,{
color: var(--enfold-header_replacement_menu_color);
}
The only difference I see between browser is that safari uses bold and chrome not, but the black text is used when the header is transparent.
Thanks.
Hi,
Thanks for the update, we’ll close this thread for now then. Please open a new thread if you should have any further questions or problems.
Best regards,
Rikard1
have you tried the test the other way round?
disable siteground optimizer and activate “use minified …”
Clear all cachings before you deactivate siteground optimizer – i think that tool comes with a caching addon.
merge all css an js means – combine all css and js in one file each. I guess that this is what a lot of optimization tools do too.
Now Enfold offers the usage of minified Versions of their core files. That seems to be a better way. Especially for TTBF (time to first byte)
Section Content duplicating and other sections of the same page disappears
Full working homepage: https://tinyurl.com/2daj5qvx
After editing a text section:https://tinyurl.com/25eakku5
Disabled all plugins: = no go
Updated enfold theme = no go
hosting – no errors on their side:
Seen error on the wordpress:
[04-May-2024 13:54:45 UTC] PHP Warning: Attempt to read property “type” on null in /home/turfgloc/public_html/wp-includes/rest-api/endpoints/class-wp-rest-templates-controller.php on line 769
Hi,
Glad that this helped, I don’t think that it would conflict but I don’t know for sure and I can’t test, if you do try the plugin you can always keep this in mind as you test.
In my research and testing I found a working way to add a option “category” to the sort by filter
add_filter( 'avf_wc_product_order_dropdown_frontend', 'my_add_custom_sorting_options' );
function my_add_custom_sorting_options( $options ){
$options[ 'cat' ] = 'Category';
return $options;
}

but this doesn’t work because there doesn’t seem to be a built-in query to orderby categories, or at least I couldn’t find one. I assume that the plugin creates a query to do this.
Otherwise perhaps this will put you on the right track and you or your team can write a query for this, I was not able to.
Best regards,
Mike
Hi,
Perhaps you have a plugin conflicting with the setting because the enable the cookie consent messages (cookie bar) option shows correctly for me in Chrome:

and in Firefox:

Try disabling all of your plugins and then reload the page. If that doesn’t help try creating a second admin account and then login with that account and check.
Best regards,
Mike
Hey peterolle,
Try adding this code to the end of your child theme functions.php file in Appearance ▸ Editor:
function av_woo_tabs_below_product_image() {
if ( is_product() ) {
remove_action('woocommerce_after_single_product_summary', 'woocommerce_output_product_data_tabs', 1);
add_action('avf_sidebar_position', 'woocommerce_output_product_data_tabs', 1);
}
}
add_action( 'template_redirect', 'av_woo_tabs_below_product_image');
This moves the product tabs under product gallery and above product sidebar, the sidebar is not required, I’m just noting where it will be if used. This works for both WooCommerce 3.0 product gallery & Default enfold product gallery

Best regards,
Mike
Hi,
My website has been slow lately and cannot pass Google’s core web vitals test. Currently I am using host server’s optimization tool, and this is the slowest file.
URL https://www.interactiongreen.com/wp-content/uploads/siteground-optimizer-assets/siteground-optimizer-combined-css-b925f36671b15d7d50e5a5f98e150a37.css
I am assuming that this is large because of the “the extensive CSS content on my site.” However, because I knew that Enfold is slow, I only use a couple of features within Avia Layout builder like gallery, buttons, magazine and occasional video. I enable lazy loading, disable animation, use “load upon access” for the video. I have no customized features. I don’t know that else I can do to make my CSS content smaller. Why is Enfold CSS content so large? As I don’t use most of the features anyway to improve speed, is there any way I can exclude CSS I don’t use?
Also, it was my understanding that I should disable features on Enfold’s “Website Performance And Optimization” when I use a third party performance optimizer. (which is what I do now) Currently, CSS File Merging And Compression, Javascript File Merging And Compression among other features are disabled on Enfold.
But as I cannot speed up my site, I wonder if I should enable some of these features. Please let me know.
@Mike, so here’s what’s odd. This is the PSI I just ran. . . it’s back to 73: https://pagespeed.web.dev/analysis/https-gatehealing-com/g76fe8ffqh?form_factor=mobile
I’m not sure what size each element that I use an image for is expecting? How do I know what size to pick if there is no direction as to what it is looking for? Do I just put one in that is too big, but that looks good (if I pick too small, it looks fuzzy . .. too large and it cuts off words) then run PSI to see if it is expecting a different size, then go back to the library and choose the closest match?
Is there a setting in Enfold that I can turn on that tells me in the element box what size image the element itself is looking for?
Hi,
As I understand your situation, when you have the enable the cookie consent messages (cookie bar) enabled the cantact form Google recaptcha is disabled and shows a message, this is the correct behavior, and then when the user accepts the cookie bar the Google recaptcha message doesn’t go away, to correct this go to the theme settings and when you enable the cookie consent messages (cookie bar), go to the bottom of the panel and enable the Show advanced options and enabled Auto Reload Page on Accept Settings

Now the page should reload when the cookie bar is accepted and the Google recaptcha will show.
Best regards,
Mike
Hi,
Thanks for letting us know. Please open a new thread if you should have any further questions or problems.
Best regards,
Rikard
Hey Jim!
Thank you for reporting this.
Will be fixed in 5.7.1.
Thank you for using Enfold and enjoy the day.
Regards,
Günter
Hi,
To remove the items that you listed above Try adding this code to the end of your child theme functions.php file in Appearance ▸ Editor:
function my_woocommerce_catalog_orderby( $orderby ) {
unset($orderby["menu_order"]);
unset($orderby["rating"]);
unset($orderby["rand"]);
unset($orderby["id"]);
return $orderby;
}
add_filter( "avf_wc_product_order_dropdown_frontend", "my_woocommerce_catalog_orderby", 20 );
the menu will then look like this:

but to add the category item you will need to use the WooCommerce Product Table plugin this is a paid plugin and I don’t know if it will work correctly with Enfold.
This is the article that says how to add categories to the options.
Best regards,
Mike
Hi,
I logged into your site and found that your snippet to change the logo for mobile was disabled, so I enabled it and found that it works correctly. Please see the screenshot in the Private Content area of what I see, please check.
In your screenshot it looks like you were using a iPhone when you saw the “Enfold” logo on mobile.
Please note that iPhones can be hard to clear the cache, often you need to also clear the history to fully purge the cache, following these steps for Safari and note Step 4 where you will Clear the History.
So if you see the “Enfold” logo on mobile try to Clear the History on your iPhone
Best regards,
Mike