Hi,

Thank you for the update.

The first css code that we suggested above should make the submenu scrollable horizontally. Just wrap it inside a css media query to apply it on mobile view only.

@media only screen and (max-width: 767px) {
    #top .av-submenu-container .container {
        overflow: scroll;
    }
}

Can we access the site? Please provide the login details in the private field.

Best regards,
Ismael

Hi,

Thank you for the update.

We can now access the login page but the password for the username that you provided above seems to be incorrect. Please check the info carefully.

Did you try to install the Classic Widgets plugin that we suggested above?

Best regards,
Ismael

Hi,

You might have to define the maximum height of the 360 container again, but only for mobile view. Look for this code.

#main #container.wc360-container {
    width: 100%;
}

And replace it with:

#main #container.wc360-container {
    width: 100%;
    max-height: 400px;
}

Adjust the max-height value as necessary.

Best regards,
Ismael

Hi,

Thank you for the info.

The css media query that you copied is invalid, it is missing the only keyword, which we already corrected in the Quick CSS field. This is the correct one.

@media only screen and (max-width: 767px) {
  /* Add your Mobile Styles here */

}

Again, you can move it back in the Quick CSS field.

Best regards,
Ismael

Hi,

Thank you for the info.

The rest of the image is not visible because of this css code.

#main #container.wc360-container {
    width: 100%;
    max-height: 300px;
}

You have to remove the max-height property and make sure to place the code inside a css media query.

Example:

@media only screen and (max-width: 767px) {
  /* Add your Mobile Styles here */

}

Best regards,
Ismael

Hey Eleina_Shinn,

Thank you for the inquiry.

1.) Are you referring to the slider buttons? You can use this css code to adjust the size or style of the butotn on mobile view.

@media only screen and (max-width: 767px) {
    .avia-button.avia-size-large {
        padding: 11px 20px 9px;
        font-size: 11px;
        min-width: 99px;
    }
}

2.) It seems to be displaying as it should as shown in the screenshot below.

Screenshot: https://postimg.cc/QB5V1YTD

Best regards,
Ismael

Hi,

Thank you for the info.

Did you add any custom html tags (e.g script or input tags) in the page? These tags could break the layout of the page and cause the builder to function or behave incorrectly.

You should also try to re-create the page from scratch if none of the suggestions above are working.

Best regards,
Ismael

Hi,

Thank you for the update.

Unfortunately, there is no dedicated widget area for the portfolio category sidebar, so you may have to add the widgets in the Displayed Everywhere widget area and use a plugin to control their visibility.

You can also modify the sidebar.php file and add a new condition to display a different widget area on portfolio category pages. In the file, look for this code around line 65.

  // general shop sidebars
            if ($avia_config['currently_viewing'] == 'shop' && dynamic_sidebar('Shop Overview Page') ) : $default_sidebar = false; endif;

Below, add a new condition.

  // portfolio category sidebars
            if ($avia_config['currently_viewing'] == 'portfolio' && dynamic_sidebar('Portfolio Category') ) : $default_sidebar = false; endif;

You will then have to register a new sidebar or widget area called “Portfolio Category”.

register_sidebar(array(
			'name' => 'Portfolio Category',
			'before_widget' => '<section id="%1$s" class="widget clearfix %2$s">',
			'after_widget' => '<span class="seperator extralight-border"></span></section>',
			'before_title' => '<h3 class="widgettitle">',
			'after_title' => '</h3>',
			'id'=>'av_portfolio_category'
		));

The new widget area should display in the Appearance > Widgets panel afterwards.

Best regards,
Ismael

Hey J.,

Thank you for the inquiry.

You can set the Table element’s Styling > Table Styling > Table Design settings to “Minimal” and add a bit of css to completely remove the borders.

.responsive .avia_responsive_table .avia-data-table {
    border: 0;
}

tr:first-child th, tr:first-child td, td {
    border: 0;
}

Did you mute the video in the layer slider? Please note that only muted videos are allowed to autoplay in the browser.

Best regards,
Ismael

Hey Jorge,

Thank you for the inquiry.

That option is not available by default but it can done using a custom script. Why do you have to reload the page?

This is an example of the script that reloads the page after clicking the lightbox close button (mfp-close).

// reload the page on lightbox close
function ava_custom_script(){
	?>
	<script>
	(function($) {
		$(document).ready(function() {
			$(".avia_image").on("click", function() {
				setTimeout(function() {
					$(".mfp-wrap").on("click", function(e) {
						var target = e.target;
						if(target.classList.contains("mfp-close")) {
							location.reload();
						}
					});
				}, 500);
			});
		});
	})(jQuery);
	</script>
	<?php
	}
add_action('wp_footer', 'ava_custom_script');

Best regards,
Ismael

Hi,

Thank you or the info.

Looks like you are using a third party plugin (Ubermenu) to create the tab style menus. Is there an option in the plugin where you can display the content of the tab on click instead of hover? Currently, the parent menu item closes immediately once you attempt to close the active tab or when you try to access the next items.

You may need to contact the plugin authors for additional assistance.

Best regards,
Ismael

Hi,

It seems to be working as it should as shown in the screenshot below.

Screenshot: https://imgur.com/a/jaYIvfK

The first image (morgan2), which is unattached, is uploaded directly in the media library and added to a post called “Unattached Post” using the Image element, so the the Advance Layout Builder is active on this one. The second (morgan4) and third image (morgan3) are attached to the “Unattached Post” post because they were uploaded directly in the page using the Image element. The fourth one (morgan1) is attached to a post called “Attached Post”, which is using the default block editor. In both editors, the behavior is the same.

So if you do not want the images to be attached to a post or page, make sure to upload them directly in the Media > Library pane, edit a page, add any image element (sliders, gallery etc) and select them from there.

Best regards,
Ismael

Hi,

Thank you for the update.

This css breaks the menu items with long titles and causes them to merge into a single line.

#top #wrap_all .av-main-nav ul>li>a {
line-height: 0em !important;
}

Adjusting the top and bottom padding as suggested above should decrease the total height of the submenu.

#top .av-main-nav ul a {
    padding: 20px 20px;
}

Please make sure to toggle or temporarily disable the Enfold > Performance > File Compression settings after the modification.

Best regards,
Ismael

Hey allespalettibystefan,

Thank you for the inquiry.

You can edit the widgets in the sidebar via the Appearance > Widgets panel. Widgets within the Displayed Everywhere widget area are displayed by default, but you can use plugins like If Widget or Widget Logic to control the visibility of the widgets.

// https://wordpress.org/plugins/if-widget/
// https://wordpress.org/plugins/widget-logic/

Best regards,
Ismael

Hi,

Thank you for the screenshot.

Did you try the css code above? It should adjust the width and position of the mega menu container when the screen width is equal or less than 1280px.

Best regards,
Ismael