Hi,
It looks like you are not using the new code that I posted above that allows buttons to be used.
It also looks like you didn’t add the custom class to the buttons for the new script to work, please review this thread again.

Best regards,
Mike

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

Hi,

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

Best regards,
Rikard

Hi,

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

Best regards,
Rikard

Hi,

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

.home #after_section_1 {
  border-top-width: 0;
}

Best regards,
Rikard

Hi,
The function that they posted:

function varnish_safe_http_headers() {
    header( 'X-UA-Compatible: IE=edge,chrome=1' );
    session_cache_limiter('');
    header("Cache-Control: public, s-maxage=120");
  if( !session_id() )
  {
    session_start();
  }
}
add_action( 'send_headers', 'varnish_safe_http_headers' );

is the function that you added from this post above.
Which is from this Stack Exchange solution to override the WordPress default PHPSESSID to solve issues with a Varnish server.

Best regards,
Mike

Hi,

Thank you for the update.

The menu items are not displaying because their opacity is set to 0. Did you add this modification somewhere?

#top #wrap_all #av-burger-menu-ul > li {
    opacity: 0;
    position: relative;
    top: 18px;
    transition: opacity 0.3s ease-out,top 0.3s ease-out,left 0.3s ease-out;
    transform: translate3d(0,0,0);
}

You may need to remove the code or override it with the following css.

#top #wrap_all #av-burger-menu-ul > li {
    opacity: 1;
}

Please make sure to toggle or temporarily disable the Enfold > Performance > File Compression settings to make sure that the changes take effect.

Best regards,
Ismael

Hey Createve_Solutions,

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

body#top #wrap_all .footer_color .widgettitle {
  color: #fff;
  border-color: #ddd;
}

Best regards,
Rikard

• This reply was modified 2 years, 3 months ago by Rikard.

Hi,

Great, I’m glad that you found a solution, and thanks for the update. Please let us know if you should need any further help on the topic, or if we can close it.

Best regards,
Rikard

Hey Thomas,

You can use the “ava_after_main_container” hook instead of the “woocommerce_before_shop_loop” for that.

If you created your Blog page using ALB, the simpler way would be adding the Widget Area element to the top of your page and choosing your widget.

Best regards,
Yigit

Hey Diana,

Thank you for the inquiry.

The issue occurs because of the overflow property in this css rule, which is only applied on mobile view.

.av-parallax-section {
    position: relative;
    border-top: none;
    overflow: hidden;
}

To override it, you can add this css code.

#reservierung + .av-parallax-section {
    overflow: visible !important;
}

Best regards,
Ismael

Hey ballindigital,
Thank you for the link to your site, when I check your page on my desktop the height of the elements are the same and so the buttons are lined up, but I believe that your screen size is smaller, so we need to set the height of the elements at certain screen sizes when the content length causes the text to wrap into a new line. I see you are using three grid rows with two cells each, and in each is a image, special heading, text block and a button. So we need to set the height for all special headings and text blocks to the same.
Try adding this code to the end of your child theme functions.php file in Appearance ▸ Editor:

function grid_row_special_headings_and_text_blocks_equal_heights() { ?>
  <script>
(function($){
	var width = $(window).width();
  	if (width > 767) {
  $('.page-id-3083 .av-layout-grid-container').each(function(){  
     var $specialHeading = $('.flex_cell .av-special-heading-tag',this);
     var $textBlock = $('.flex_cell .av_textblock_section p',this);
     var specialHeadingHeight = Math.max.apply(Math, $specialHeading.map(function(){
         return $(this).height();
     }).get());
     var textBlockHeight = Math.max.apply(Math, $textBlock.map(function(){
         return $(this).height();
     }).get());
     $specialHeading.height(specialHeadingHeight);
     $textBlock.height(textBlockHeight);
  });
} else {}
})(jQuery);
</script>
  <?php
}
add_action( 'wp_footer', 'grid_row_special_headings_and_text_blocks_equal_heights', 99 );

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

Best regards,
Mike

Hey ballindigital,
Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

@media only screen and (max-width: 767px) {
.responsive #top #wrap_all #footer .container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 90%;
	max-width: 90%;
}

.responsive #top #wrap_all #footer .flex_column.av_one_third:first-child {
    width: calc(50%);
    clear: none; 
}
.responsive #top #wrap_all #footer .flex_column.av_one_third:first-child .widgettitle {
	width: 98%;
}
.responsive #top #wrap_all #footer .flex_column.av_one_third:nth-child(2) .widgettitle {
	width: 100%;
}
.responsive #top #wrap_all #footer .flex_column.av_one_third:nth-child(2) #menu-item-1422 a {
	padding-right: 0;
}
.responsive #top #wrap_all #footer .flex_column.av_one_third:nth-child(2) {
    text-align: right;
    width: calc(50%);
}

.responsive #top #wrap_all #footer .flex_column.av_one_third:last-child {
    width: 100%;
    text-align: center;
}
.wpcf7 .wpcf7-spinner {
	display: none;
}
}

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,
Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

#top .avia-post-nav:hover .entry-info-wrap {
    width: auto;
}
#top .avia-post-nav .entry-info {
    width: auto;
}

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 schweg33,
Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

#top .avia-post-nav .entry-image {
    display: none;
}
#top .avia-post-nav .entry-info-wrap {
text-align: center;
}

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,
Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

#top .av-tab-section-outer-container .av-active-tab-title.av-section-tab-title,
#top .av-tab-section-outer-container .av-section-tab-title:hover {
    background-color: #fff;
}

adjust color to suit.

Best regards,
Mike

Hi,
It looks like for level one & three the menu item gets the class current-menu-item
But not for level two, it gets the class active-parent-item
So try adding this css:

#top #header .av-main-nav > li.active-parent-item > a {
    background-color: #776fb1;
}

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

Best regards,
Mike

Hey imc-html,
Try changing this line:

.responsive #top #header #header_main .inner-container .main_menu {
    order: 1;

to this:

.responsive #top #header #header_main .inner-container .main_menu {
    order: 3;

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

Best regards,
Mike

Hi,
I added this css:

#top .all_colors h1 {
	font-size: 18px;
}
#top .all_colors h2 {
	font-size: 14px;
}

check now.

Best regards,
Mike

Hey lausianne,
There is not a built-in way to do this, but you can try this solution

Best regards,
Mike