Hi,

Thank you for the info.

The password for the username is incorrect, unfortunately. Please check it carefully or provide another valid account so that we could access the dashboard.

Best regards,
Ismael

Hey Stefan,

Thank you for the inquiry.

How did you set the Product Grid element to display the categories? Please post the site or page URL so that we could inspect the element.

We might be able to use the snippets provided in the following thread and customize it a bit so that the description displays below the product image.

// https://stackoverflow.com/questions/19249756/how-to-display-woocommerce-category-description

Best regards,
Ismael

Hey barabasone,

Thank you for the inquiry.

Try to apply a unique class name (Advanced > Developer Settings > Custom CSS Class) to the 1/5 column elements containing the descriptions, use “description-column” for example, then use the following css code to adjust the width of the columns on mobile view.

@media only screen and (max-width: 767px) {
.description-column {
    width: 48% !important;
    margin-left: 1%;
    float: left;
    clear: none;
}
}

// https://kriesi.at/documentation/enfold/add-custom-css/#enable-custom-css-class-name-support

But due to the columns’ predefined styles, the layout might look a bit different compare to the screenshot.

Another solution is to create another set of text description or specifications that is fully configured for mobile view. You may need to place all text and the required html structure in a single text block and apply the custom styles accordingly. Using css flex might be of help in this case.

// https://css-tricks.com/snippets/css/a-guide-to-flexbox/

The html structure might look like this.

<div class="left-column">
descriptions or specifications here</div>
<div class="right-column">
descriptions or specifications  here</div>

Best regards,
Ismael

Hi,

@CodeSamurai: Thank you for the info. Did you install a different minification plugin?

@CloudyPro: Have you tried using a different compression plugin? Most cache plugins also have this option by default, so you might have to test the options or the plugin settings to find out which combination works best for your server.

Best regards,
Ismael

Hi,

Great! Glad to know that you have found a solution. In hindsight, using Javascript is bit of an overkill. Please feel free to open a new thread if you need anything else.

Have a nice day.

Best regards,
Ismael

Hi,

You can use this css code to apply a border around the button on mouse hover.

#top .avia-button:hover .avia_button_background {
	border: 1px solid green !important;
}

But you have to adjust this css code, and remove the top margin.

.second-button .avia-button {
	border: 10px solid #FFF !important;
	z-index: 2;
	z-index: 2;
	float: none !important;
	margin-top: -35px;
}

Then add this css code to pull the button upwards.

.second-button {
	top: -35px;
	position: relative;
}

Best regards,
Ismael

Hi,

Sorry for the delay. We edited the snippet or filter in the functions.php file a bit, and added the spotify icon and associate the custom font icon to it. This is the adjusted filter in the functions.php file.

// Register new icon as a theme icon
function avia_add_custom_icon($icons) {
	$icons['apple']	 = array( 'font' =>'newicons', 'icon' => 'uf179');
	$icons['spotify']	 = array( 'font' =>'newicons', 'icon' => 'uf327');
	return $icons;
}
add_filter('avf_default_icons','avia_add_custom_icon', 10, 1);

// Add new icon as an option for social icons
function avia_add_custom_social_icon($icons) {
	$icons['apple'] = 'apple';
	$icons['spotify'] = 'spotify';
	return $icons;
}
add_filter('avf_social_icons_options','avia_add_custom_social_icon', 10, 1);

You can now edit the spotify icon in the Enfold > Social Profiles panel.

Best regards,
Ismael

Hi,

Thank you for the screenshot.

We could not reproduce the issue on our end and for some reason we cannot inspect the site using the browser inspector. Did you disable it, or install a plugin that blocks browser inspection?

The background of the cells are probably not displaying correctly on mobile devices because it is fixed. Please try to revert the background-attachment property back to scroll on smaller screens.

@media only screen and (max-width: 767px) {
    .flex_cell {
	background-attachment: scroll !important;
    }
}

Best regards,
Ismael

Hey Jak73,

Thank you for the inquiry.

This process might take a while, but you can ask Google to recrawl the site or the URLs so that they could re-index the pages and the images.

// https://developers.google.com/search/docs/advanced/crawling/ask-google-to-recrawl

The sitemap is showing the appropriate number of images on every page as you can see in the sitemap page below. Did you recently install a different SEO plugin? (see private field)

If possible, please refrain from opening duplicate threads.

// https://kriesi.at/support/topic/images-are-not-indexed-by-google/

Best regards,
Ismael

Hi,

Thank you for following up.

It was not working properly because of a few invalid color values in the General Styling panel. There was a color option containing double hash tags and a missing one on the other. We corrected the values and saved the theme options. We also removed the shortcode in the private field because it seems to be breaking the layout of the page. Have you tried using the Widget Area element in the advance layout builder instead of adding the shortcode directly?

Best regards,
Ismael

Hi,

You are welcome! Glad it is working properly now.

1.) The avf_builder_boxes is still in used or still valid, but it is no longer used to enable the Advance Layout Builder for custom post types. You can use the filter to customize the default meta boxes for certain post types such as the Layout box or the Enfold Shortcode Parser when necessary.

2.) These filters just enable the Post Type dropdown or select field for certain elements such as the Portfolio Grid or Blog Posts. You do not need it to enable the ALB for a specific post type.

Best regards,
Ismael

Hi,

This will just prevent WordPress from loading all these data on every page load, and will only fetch them when necessary such as when compressing files or when regenerating the minified css or scripts.

Best regards,
Ismael

Hi,

Sorry for the delay. The URL or the value of the id property is automatically generated by the testing tool based on the ID of the element with the type Answer. It is not generated by the theme. And based on the screenshot, it does not seem to be showing any errors or warning — it is supposed to be in red or orange if the schema is incorrect or invalid.

Best regards,
Ismael

Hi,

The quantity buttons are actually a custom implementation from the theme and are intentionally disabled or hidden on mobile devices due to the space limitation.

Best regards,
Ismael

Hi,

The previous css code is not working because the columns in the row is set to have equal height. To adjust the breakpoint of equal height columns, please use this css code.

@media only screen and (max-width: 1300px) {
    .responsive #top #wrap_all .av-break-at-tablet-flextable, .responsive .av-layout-grid-container.av-break-at-tablet {
        display: block;
    }

    .responsive #top #wrap_all .flex_column.av-break-at-tablet, .responsive #top #wrap_all .av-break-at-tablet .flex_cell {
        margin: 0;
        margin-bottom: 0px;
        margin-bottom: 20px;
        width: 100%;
        display: block;
    }
}

Best regards,
Ismael