Hey Keasyconciergerie,

Double post, closing. https://kriesi.at/support/topic/enfold-never-more-2/

Best regards,
Rikard

Hi,

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,

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

@media only screen and (min-width: 768px) and (max-width: 989px) {
  .responsive.html_mobile_menu_tablet #top #header #header_meta .social_bookmarks {
    display: block;
  }
}

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

@media only screen and (max-width: 767px) { 
#top #wrap_all .all_colors #av_section_1 h1 {
    font-size: 35px;
}
}

It will make the H1 text at the top of the page linked below 35px on mobile instead of the 65px that it is now on desktop.
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,

Thank you for the info.

Please remove the filter in the functions.php file and replace the modification in the archive.php file with the following:

$atts =array (
				'link' => 
				array (
				  0 => 'category',
				),
				'term_rel' => 'IN',
				'wc_prod_visible' => '',
				'wc_prod_hidden' => 'hide',
				'wc_prod_featured' => '',
				'prod_order_by' => '',
				'prod_order' => '',
				'date_filter' => '',
				'date_filter_start' => '',
				'date_filter_end' => '',
				'date_filter_format' => 'yy/mm/dd',
				'period_filter_unit_1' => '1',
				'period_filter_unit_2' => 'year',
				'page_element_filter' => '',
				'sort' => 'yes',
				'query_orderby' => 'date',
				'query_order' => 'DESC',
				'caption_elements' => 'title excerpt',
				'caption_styling' => '',
				'caption_display' => 'always',
				'img_copyright' => '',
				'size' => 'fixed masonry',
				'orientation' => '',
				'image_size' => 'masonry',
				'gap' => '1px',
				'columns' => 'flexible',
				'av-desktop-columns' => '',
				'av-medium-columns' => '',
				'av-small-columns' => '',
				'av-mini-columns' => '',
				'items' => '12',
				'paginate' => 'none',
				'color' => '',
				'custom_bg' => '',
				'img_copyright_font' => '',
				'av-desktop-font-img_copyright_font' => '',
				'av-medium-font-img_copyright_font' => '',
				'av-small-font-img_copyright_font' => '',
				'av-mini-font-img_copyright_font' => '',
				'img_copyright_color' => '',
				'img_copyright_bg' => '',
				'animation' => 'active',
				'animation_duration' => '',
				'animation_custom_bg_color' => '',
				'animation_custom_bg_color_multi_list' => '',
				'animation_z_index_curtain' => '100',
				'overlay_fx' => 'active',
				'img_scrset' => '',
				'lazy_loading' => 'disabled',
				'av-desktop-hide' => '',
				'av-medium-hide' => '',
				'av-small-hide' => '',
				'av-mini-hide' => '',
				'alb_description' => '',
				'id' => '',
				'custom_class' => '',
				'template_class' => '',
				'element_template' => '',
				'one_element_template' => '',
				'show_locked_options_fakeArg' => '',
				'av_uid' => 'av-3lh7ch',
				'sc_version' => '1.0',
				'ids' => false,
				'action' => false,
				'post_type' => 
				array (
				  'post' => 'post',
				  'page' => 'page',
				  'attachment' => 'attachment',
				  'revision' => 'revision',
				  'nav_menu_item' => 'nav_menu_item',
				  'custom_css' => 'custom_css',
				  'customize_changeset' => 'customize_changeset',
				  'oembed_cache' => 'oembed_cache',
				  'user_request' => 'user_request',
				  'wp_block' => 'wp_block',
				  'wp_template' => 'wp_template',
				  'wp_template_part' => 'wp_template_part',
				  'wp_global_styles' => 'wp_global_styles',
				  'wp_navigation' => 'wp_navigation',
				  'acf-taxonomy' => 'acf-taxonomy',
				  'acf-post-type' => 'acf-post-type',
				  'acf-field-group' => 'acf-field-group',
				  'acf-field' => 'acf-field',
				  'product' => 'product',
				  'product_variation' => 'product_variation',
				  'shop_order' => 'shop_order',
				  'shop_order_refund' => 'shop_order_refund',
				  'shop_coupon' => 'shop_coupon',
				  'shop_order_placehold' => 'shop_order_placehold',
				  'alb_elements' => 'alb_elements',
				  'alb_custom_layout' => 'alb_custom_layout',
				  'rm_content_editor' => 'rm_content_editor',
				  'portfolio' => 'portfolio',
				  'avia_framework_post' => 'avia_framework_post',
				),
				'offset' => 0,
				'container_links' => 'active',
				'link_dest' => '',
				'lightbox_text' => '',
				'container_class' => 'av-masonry-entries',
				'auto_ratio' => 1.7,
				'set_breadcrumb' => true,
				'custom_markup' => '',
				'taxonomy' => 'category',
				'categories' => 
				array (
				),
			);

	        $blog = new avia_masonry($atts);
			$blog->get_element_styles();
			$blog->query_entries();

	        echo '<div class="entry-content-wrapper">' . $blog->html() . '</div>';

Also, you have to make sure that Grid Layout is selected in the Enfold > Blog Layout > Blog Layout settings.

Best regards,
Ismael

Hi,

Also, your new code you sent has destroyed the layout in the Desktop view.

Did you add this css code?

div .avia-table {
    background: transparent;
    width: 100%;
    clear: both;
    margin: 30px 0;
    table-layout: fixed;
}

If you didn’t add it, please include this css code to override the default style. Or post the login details in the private field so that we can add the modifications for you.

div .avia-table {
table-layout: auto;
}

Aren’t you checking the code before you are sending it out? This is getting quite frustrating.

Yes, we always check the modifications before sending it out to the users. The table seems to be displaying as it should when we checked the site on mobile view. Please check the screenshot in the private field.

I will tag the rest of the team so that they can check the modifications.

Best regards,
Ismael

Hey studiovene,

You have this in Quick CSS:

@media only screen and (max-width: 1220px) {
  #top .social_bookmarks { 
   display: none !important; 
  }
}

Please try removing it.

Best regards,
Rikard

Hi,

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

@media only screen and (max-width: 767px) {
  .responsive #top #wrap_all .main_menu {
    left: 0;
    right: auto;
  }
  .responsive #top .logo {
    width: 100%;
  }
  .responsive .logo img {
    float: right;
  }
}

Best regards,
Rikard

Hi,

Great, I’m glad to hear 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,

Thank you for the screenshot.

Please replace the css rule inside the css media query with the following.

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

We just set the height to auto and overflow property to hidden.

Best regards,
Ismael

Hi,
Do you want a different font sizes for the text in your topbar or do you mean for a text element on your page?
The “Font sizes” – “Textblock Font Sizes” and changing smaller screens settings should work if it is in a text element on your page.
Try disabling any caching plugins and check again. Also note that if you have set the font size in the Enfold Theme Options ▸ Advanced Styling, or with custom css, this may override the element setting.
If this doesn’t help please include an admin login in the Private Content area and tell us which text block you are working on so we can check.

Best regards,
Mike

Hi,

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

Best regards,
Rikard

Hi,

Glad to know that you managed to adjust the style of the sort buttons. Your modifications are actually the same as the ones we provided above, so it’s quite odd that the modification didn’t work. Anyway, to align the sort buttons to the center, you can add this css code:

#top .sort_by_cat {
    width: 100%;
    display: flex;
    justify-content: center;
}

And to increase the size of the grid items, you can adjust the Column count settings in the Styling > Columns tab.

Best regards,
Ismael