Hi,
Ok, thank you, I see the Variation Title in the variation but it doesn’t seem to work on the frontend. I don’t see any errors that might point to a cause.
I did find the script that I posted above was in your child theme style.css so I moved it to your child theme functions.php and it changes the product title when a variation is picked, so that is good news:

Best regards,
Mike

Hi,
I tried to create one for you but didn’t get the variations correct, please see the link below and adjust the variations. Do not use the Advanced Layout Builder, only use the woocommerce product fields:

Best regards,
Mike

Hi,
Perhaps you can post a admin login in the Private Content area so we can look.

Best regards,
Mike

Hi,
I’m not sure how https://mart-anthony-stark.github.io/Enfold-js/ works, but I don’t think you can animate the color sections, you will need to animate the objects inside.
Try using the theme settings, we are limited to supporting custom code snippets and javascript libraries. The login doesn’t work.

Best regards,
Mike

Hi,
Odd, it works for me, this is what it looks like:

Best regards,
Mike

Hi,
Thanks for the feedback, the issue is that the example link is using a normal menu and you are using a mobile burger menu for your desktop, these are two different menus.
Whe I checked your site I found no “Book Now” button so I created a new one for you, and added the required custom class menu-item-avia-special cta which was disabled on your site, and then I added this css:

.html_burger_menu_active #header .avia-menu .menu-item-avia-special.cta {
  display: block !important; 
}

and Guenni007’s solution works great, thanks for sharing Guenni007!

you will need to adjust the button url as I didn’t know the like you wanted.

Best regards,
Mike

Hi,
To change this so it only works on screens larger than 768px I changed the code to this, which also adds some body margin so it won’t overlap the page content, and I make the menu items closer and I adjusted the social icons, please check.

function create_a_sidebar_header_with_burger_menu() { ?>
  <script>
document.addEventListener('DOMContentLoaded', function() {
    // Check if the HTML element has the "wp-toolbar" class
    if (document.documentElement.classList.contains('wp-toolbar')) {
        return; // Exit the script if "wp-toolbar" class is found
    }

    // Check if the screen width is larger than 768px
    if (window.innerWidth <  768) {
        return; // Exit the script if the screen width is less than 768px
    }

    // Create the main toolbar div
    const toolbar = document.createElement('div');
    toolbar.id = 'right-toolbar';

    // Create the inner content divs
    for (let i = 1; i <= 3; i++) {
        const contentDiv = document.createElement('div');
        contentDiv.className = 'toolbar-content';
        contentDiv.id = 'content' + i;
        toolbar.appendChild(contentDiv);
    }

    // Append the toolbar to the body
    document.body.appendChild(toolbar);

    // Add the CSS styles
    const style = document.createElement('style');
    style.innerHTML = `
        #right-toolbar {
            position: fixed;
            right: 0;
            top: 0;
            width: 100px;
            height: 100%;
            background-color: #f8f8f8;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            align-items: center;
            padding: 20px 0;
            box-shadow: -2px 0 5px rgba(0, 0, 0, 0.5);
            z-index: 999;
        }
        #content1 .main_menu {
        	position: relative;
        }
        .toolbar-content {
            width: 80px;
            height: 100px;
            background-color: #f8f8f8;
            margin-bottom: 10px;
            border-radius: 5px;
            display: flex;
            justify-content: center;
            align-items: start;
        }

        .toolbar-content:last-child {
            margin-bottom: 0;
        }

        .rotated-logo {
            transform: rotate(90deg);
            transform-origin: center;
        }
        #content2 .logo {
        float: none;
        position: relative;
    		left: unset;
    		height: unset;
        }
        #content3 .social_bookmarks {
            /*transform: rotate(90deg);*/
            transform-origin: center;
        }
        
        .html_header_top.html_header_sticky #main {
    		padding-top: 0;
				}
				#av_section_1 {
				    height: 100vh;
				}
				#menu-item-shop,#menu-item-search {
				display: none;
				}
				#top #content1 .av-small-burger-icon {
    		transform: scale(1);
				}
				.html_cart_at_menu.html_main_nav_header #top .main_menu .menu>li:last-child {
				    padding-right: 0;
				    margin-right: 0;
				}
				.avia-menu.av_menu_icon_beside {
			    padding-right: 0;
			    margin-right: 0;
			    border-right-width: 0;
			    border-right-style: none;
				}
				.html_av-overlay-side-classic #top .av-burger-overlay li a {
    			border-bottom-style: none;
				}
				@media only screen and (min-width: 768px) {
				  .responsive #top #content1 .av-main-nav .menu-item-avia-special.av-burger-menu-main {
				      display: block!important;
				  }
				  #top #content1 .av-main-nav > li.menu-item  {
				    display: none!important;
				  }
					.html_av-overlay-side #top .av-burger-overlay li {
   					 margin: 0;
 				   height: 50px;
					}
				  #content1 .av-main-nav-wrap {
				      float: right;
				  }
				}
				#header {
					visibility: hidden;
				}
				body {
				margin-right: 100px
				}
				#content3 {
				height: 300px;	
				}
				#top .social_bookmarks li {
 				 display: inline-block;
 				 clear: both;
  				margin-bottom: 10px;
				}
    `;
    document.head.appendChild(style);

    // Move the logo to #content2 and rotate it
    const logo = document.querySelector('.avia-standard-logo');
    if (logo) {
        const content2 = document.getElementById('content2');
        content2.appendChild(logo);
        logo.classList.add('rotated-logo');
    }

    // Move the menu to #content1
    const menu = document.querySelector('.main_menu');
    if (menu) {
        const content1 = document.getElementById('content1');
        content1.appendChild(menu);
    }

    // Move the social bookmarks to #content3
    const socialBookmarks = document.querySelector('.social_bookmarks');
    if (socialBookmarks) {
        const content3 = document.getElementById('content3');
        content3.appendChild(socialBookmarks);
    }
});
</script>
  <?php
}
add_action( 'wp_footer', 'create_a_sidebar_header_with_burger_menu', 99 );

Best regards,
Mike

Hey Antonio,
Please check the transparency logo at “Opzioni di trasparenza” under the normal logo:

Best regards,
Mike

Hi,
Sorry I was thinking about the sidebar and not the sidebar header. For the sidebar header menu items, Try adding this code to the end of your child theme functions.php file in Appearance ▸ Editor:

add_filter('wp_nav_menu_items', 'do_shortcode');
function go_back_shortcode() {
    return '<a href="javascript:history.back()" class="go-back-link">Go Back</a>
            <script>
            document.addEventListener("DOMContentLoaded", function() {
                var goBackLink = document.querySelector(".go-back-link");
                if (goBackLink) {
                    goBackLink.parentElement.classList.add("go-back-parent");
                }
            });
            </script>';
}
add_shortcode('go_back', 'go_back_shortcode');
function custom_go_back_css() {
    echo '
    <style>
    .go-back-parent a:not(.go-back-link) {
        padding: 0 !important;
        margin: 0 !important;
    }
    </style>
    ';
}
add_action('wp_head', 'custom_go_back_css');

Then in the menu item use a hash tag “#” as the URL and add this shortcode [go_back] to the title:

Then on the frontend you will have a working “Go Back” menu link:

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

Hey reqonsult,
It looks like that is how long it takes your server to serve the video. I see your site also has many CORS errors for your fonts before the video loads, this could be slowing your site down as it has the also deal with these. It looks like you may have built the site on a temp domain and the fonts are still loading from there, try checking this.
But nonetheless the video loads quickly when I check, if you want to hide the fallback image on desktop for this one page try this css:

@media only screen and (min-width: 768px) { 
#top.page-id-94 .avia-slideshow .avia-slide-wrap {
	background-image: none !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 reqonsult,
Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

#top #aufeinenblick .custom-color-heading a {
    text-decoration: none;
}

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

Best regards,
Mike

Hey lelouxwebdesign,
In your sidebar add a Custom HTML widget with this code:
<a href="javascript:history.back()">Go Back</a>

then in the post sidebar you will see a “Go Back” link

you can style it as you wish and clicking it will send the visitor to the last page they viewed.
If you want to use a button, you can create a buton with the shortcode wand and use this as the manual link: javascript:history.back()

[av_button label='Go Back' icon_select='yes' icon='ue831' font='entypo-fontello' button_type='' link='manually,javascript:history.back()' link_target='' download_file='https://' attachment='' attachment_size='' downloaded_file_name='' size='large' position='center' label_display='' title_attr='' size-text='' av-desktop-font-size-text='' av-medium-font-size-text='' av-small-font-size-text='' av-mini-font-size-text='' margin='' margin_sync='true' padding='' padding_sync='true' av-desktop-margin='' av-desktop-margin_sync='true' av-desktop-padding='' av-desktop-padding_sync='true' av-medium-margin='' av-medium-margin_sync='true' av-medium-padding='' av-medium-padding_sync='true' av-small-margin='' av-small-margin_sync='true' av-small-padding='' av-small-padding_sync='true' av-mini-margin='' av-mini-margin_sync='true' av-mini-padding='' av-mini-padding_sync='true' color_options='' color='theme-color' custom_bg='#444444' custom_font='#ffffff' btn_color_bg='theme-color' btn_custom_grad_direction='vertical' btn_custom_grad_1='#000000' btn_custom_grad_2='#ffffff' btn_custom_grad_3='' btn_custom_grad_opacity='0.7' btn_custom_bg='#444444' btn_color_bg_hover='theme-color-highlight' btn_custom_bg_hover='#444444' btn_color_font='theme-color' btn_custom_font='#ffffff' btn_color_font_hover='white' btn_custom_font_hover='#ffffff' border='' border_width='' border_width_sync='true' border_color='' border_radius='' border_radius_sync='true' box_shadow='' box_shadow_style='0px,0px,0px,0px' box_shadow_color='' animation='' animation_duration='' animation_custom_bg_color='' animation_z_index_curtain='100' hover_opacity='' sonar_effect_effect='' sonar_effect_color='' sonar_effect_duration='1' sonar_effect_scale='' sonar_effect_opac='0.5' css_position='' css_position_location=',,,' css_position_z_index='' av-desktop-css_position='' av-desktop-css_position_location=',,,' av-desktop-css_position_z_index='' av-medium-css_position='' av-medium-css_position_location=',,,' av-medium-css_position_z_index='' av-small-css_position='' av-small-css_position_location=',,,' av-small-css_position_z_index='' av-mini-css_position='' av-mini-css_position_location=',,,' av-mini-css_position_z_index='' id='' custom_class='' template_class='' av_uid='' sc_version='1.0' admin_preview_bg='']

Best regards,
Mike

Hi,
Thank you for your mockup, I didn’t find a way to do this so I opened a Feature Request for you.
You can subscribe to it here to track it, or if you have further input for it.
Thank you for your patience and for using Enfold.

Best regards,
Mike

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

@media only screen and (max-width: 767px) { 
	.responsive #top .logo.avia-standard-logo {
		left: 37%;
		position: relative;
	}
}
@media only screen and (min-width: 768px) and (max-width: 989px) { 
	.responsive #top .logo.avia-standard-logo {
		left: 43%;
		position: relative;
	}
}
@media only screen and (min-width: 1200px) { 
.logo.avia-standard-logo {
	  left: 20%;
}
}

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