Hi,

Great, I’m glad that Mike could help you out. Please let us know if you should need any further help on the topic, or if we can close it.

Best regards,
Rikard

Hey paoluccimarketing2015,

Thank you for the inquiry.

We ran a test using the Pagespeed Insights tool, and some of the recommendations include reducing unused CSS/JS code and eliminating render-blocking resources. You may enhance this by disabling the Enfold > Performance > File Compression settings and installing a third-party compression plugin such as Autoptimize, WP Super Minify, or BWP Minify. You can also utilize the default compression settings from cache plugins like WP Rocket or W3 Total Cache.

Another area for improvement is minimizing the impact of third-party code, including Google Tag Manager and scripts from sibforms.com. And you should also leverage browser caching, which can be achieved by editing your .htaccess file or installing a caching plugin.

// https://wp-rocket.me/google-core-web-vitals-wordpress/serve-static-assets-with-an-efficient-cache-policy/#section-5

Please check the articles below for more info about site optimization.

// https://kriesi.at/archives/scoring-100-100-in-google-pagespeed-insights-gtmetrix-pagespeed-and-yslow
// https://gtmetrix.com/wordpress-optimization-guide.html

Best regards,
Ismael

Hey ausgesonnen,

Please try the following in Quick CSS under Enfold->General Styling:

#footer {
    border-top-width: 0;
}

Best regards,
Rikard

Hi,

Thanks for the clarification. Please try the following in Quick CSS under Enfold->General Styling:

#top .av_header_with_border.av_header_transparency #header_main, #top .av_header_with_border.av_header_transparency .avia-menu.av_menu_icon_beside {
    border: 1px solid #daa520;
}

Best regards,
Rikard

Hi,

Great, I’m glad that we could help you out. Please let us know if you should need any further help on the topic, or if we can close it.

Best regards,
Rikard

Hey meanster99,

Thank you for the inquiry.

but isn’t now and it doesn’t use the transparent logo on anything below the breakpoint when the burger menu appears.

Please try to add this code inside the css media query for mobile view.

.responsive.html_mobile_menu_tablet #top .av_header_transparency.av_alternate_logo_active .logo a > img, .responsive.html_mobile_menu_tablet #top .av_header_transparency.av_alternate_logo_active .logo a > svg {
    opacity: 0;
}

.responsive.html_mobile_menu_tablet #top .av_header_transparency .logo img.alternate, .responsive.html_mobile_menu_tablet #top .av_header_transparency .logo .subtext.avia-svg-logo-sub {
    display: block;
}

Best regards,
Ismael

Hi,

How can I style the two columns in the colour section (one with an image, one with a textblock) that is called from the popup link, to fill the width of the popup?

Please add this code inside the css media query (max-width: 767px) for mobile view.

#top .mfp-content .flex_column_table .flex_column {
    width: 100%;
}

Best regards,
Ismael

Hey navindesigns,
Thank you for the link to your site and your example, try adding this code to the end of your child theme functions.php file in Appearance ▸ Editor:

function custom_single_post_banner() { ?>
  <script>
(function($) {
  $(function() {
  	var postTitle = $('.single-post h1.post-title').detach().text();
  	var postBanner = $('<div class="banner"><h1>'+ postTitle +'</h1></div>');
     $('.single-post .big-preview.single-big').detach().insertBefore('.container_wrap_first');
     $(postBanner).insertAfter('.single-post .big-preview.single-big img');
  });
})(jQuery);
</script>
  <?php
}
add_action('wp_footer', 'custom_single_post_banner', 99);

and this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

@media only screen and (max-width: 767px) { 
#top.single-post #wrap_all .all_colors .big-preview.single-big .banner h1 {
	font-size: 18px;
}
.single-post .big-preview.single-big .banner {
	top:18%;
	padding:0 5%;
}
}

.single-post .big-preview.single-big {
    padding: 0;
	pointer-events:none;
}
.single-post .big-preview.single-big .banner {
	top:30%;
	position:absolute;
	z-index:4;
	padding:0 10%;
	color:#000;
}
.single-post .banner h1 {
	background-color: rgba(255,255,255,71%);
}

@media only screen and (min-width: 1440px) { 
.single-post .big-preview.single-big {
	max-height: 450px;
}
.single-post .big-preview.single-big a img {
	transform: translateY(-20%);
}
.single-post .big-preview.single-big a {
	max-height: 450px;
}
.single-post .big-preview.single-big .banner {
	top:36%;
	padding:0 15%;
}
}

it will take the single post feature image and title from the default layout like this:

and create a full width banner with the title in it like this:

On mobile it should look like this:

Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.

Best regards,
Mike

Hi,
Thanks for your question, please note that the “preview” that YOAST SEO plugin shows you is only their guess, Google will show what they believe is the “most helpful content”, this is what their last “Helpful Content” update was for. If you think that you have made changes and it should be different then you can go to your Google Search Console account and request a new crawl. I searched your page and found that your listing shows your topbar links and menu, please see the screenshots in the Private Content area.
When I check your page source code all of the YOAST SEO plugin code is there, so the theme is not causing any issues and Yoast is working correctly, but they should not mislead you into thinking that your search results will be exactly like the “preview” they show you.
You can go to your Google Search Console account and request a new crawl and perhaps Google will show something different.
Try reading more about the “Helpful Content” update:
https://developers.google.com/search/blog/2022/08/helpful-content-update
https://developers.google.com/search/docs/appearance/helpful-content-system

Best regards,
Mike

Hi,
The subline above is calling the font-family “calibriz” which is not correct, it should be font-family “calibri-cursiv-bold”
So please correct your css to this:

#top .av-special-heading .av-subheading.av-subheading_above {
font-size: 32px !important;
    font-family: 'calibri-cursiv-bold'!important; 
    font-style: italic; bold !important; 
    color: #ff0044 !important;
}

then clear your browser cache and check.

Best regards,
Mike

Hi,
The white space is caused by 140px of top padding, which the removed css corrected, but it was affecting your other pages, so please try this css so the white space of the hidden header will be removed only for this one page:

.html_header_top.html_header_sticky #top.page-id-825 #wrap_all #main {
padding-top: 0px !important;
}

After applying the css, please clear your browser cache and check.

Best regards,
Mike

Hey Chrisxx1982,
Thank you for your patience and the screenshot, please see this shortcode created by Guenni007, you can add it to a custom HTML widget in your footer widget area.

Best regards,
Mike

Hi,
For the post in your screenshot there are two widths, the first is the layout width which is set to 1310px on your site at Enfold Theme Options ▸ General Layout ▸ Dimensions ▸ Maximum Container width, so if this is what you mean please adjust this setting.

The second is the blog template which on your site is 800px:

which you can change to 100% with this css in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field

#top.single .fullsize .template-blog .post .entry-content-wrapper,
#top.single .fullsize .template-blog .post .entry-content-wrapper>* {
    max-width: 100%;
}

This is the expected results:

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 artVantage,
Thank you for your patience, but unfortunately we don’t have a carousel option with the exact same look as the classic gallery. Try reviewing the WordPress plugins for a carousel plugin.
For your second question, please review the column margin, current the columns with the images have a negative top margin (-220px), and the columns with the text also has a negative top of -180px, so use the mobile icon to remove this for mobile.

Since the animation doesn’t have a mobile setting and you are currently hiding these item on mobile, you could clone the columns for mobile and remove the animation and negative position to achieve this.
If you have trouble with this, try cloning your page as a test page and include a admin login in the Private Content area so we can help and then you can review the settings for your live page.

Best regards,
Mike

Hey Michael,
Thank you for your patience, but the site you linked to is not working, but I believe that I found the correct site in one of your other threads.
When I checked your three columns, all of them were set to “position 1”:

please note that this will only work when “Column Behaviour” set to individual:

One way around this limitation is to add custom IDs the elements:

and then this css, which I added to your WordPress ▸ Customize ▸ Additional CSS

@media only screen and (max-width: 767px) { 
  #changeorder,#changeorder .entry-content-wrapper,#changeorder .flex_column_table {
  display: flex !important; 
  flex-wrap: wrap !important; 
  }
  #placeone {
      order: 1 !important; 
  }
  #placetwo {
      order: 2 !important; 
  }
  #placethree {
      order: 3 !important; 
  }
}

and this works for your DE site, but your EN & FR pages don’t update correctly, I’m not sure if it is your caching or your WPML. To correct I added this css:

@media only screen and (max-width: 767px) { 
  #top.home #av_section_1,#top.home #av_section_1 .entry-content-wrapper {
  display: flex !important; 
  flex-wrap: wrap !important; 
  }
  #top.home #av_section_1 .av_one_fourth.first {
      order: 1 !important; 
  }
  #top.home #av_section_1 .av_one_fourth.last {
      order: 2 !important; 
  }
  #top.home #av_section_1 .av_one_half {
      order: 3 !important; 
  }
}

Now it is working for all three languages, please clear your browser cache and check.

Best regards,
Mike

Hi,

Great, I’m glad that you got things working again. Please let us know if you should need any further help on the topic, or if we can close it.

Best regards,
Rikard