Hey FlatText,

Thank you for the inquiry.

We edited the html and the javascript or jQuery script a bit, then add a few css code to hide the option initially.

jQuery:

$(".ywapo_input_container_checkbox").on("click", function() {
	var checked = $(this).find("input").is(":checked");
	var option = "." + $(this).find(".ywapo_option_label").text().toLowerCase();

	if(checked) {
		$(option).toggle();
	} else {
		$(option).css("display", "none");
	}
});

HTML:

-- checkboxes here --
<div class="ywapo-option">
    <p class="breakfast">Breakfast</p>
    <p class="lunch">Lunch</p>
    <p class="dinner">Dinner</p>
</div>

CSS:

.ywapo-option p {
    display: none;
}

We are not sure if this fiddle link is going to expire, so we added the changes above.

// https://jsfiddle.net/zmy8xuf0/15/

Best regards,
Ismael

Good morning there!

We took screenshots of the site on Firefox and Microsoft Edge. The menu item is displaying properly on both browsers. Please check the screenshots below.

Screenshot: https://postimg.cc/gallery/5zCXmfc

We are not really sure why it is not displaying on your end.

Best regards,
Ismael

Hi!

Yes, that is possible. We wrapped the code inside a css media query so that it will only affect the desktop view. Please try it again.

Cheers!
Ismael

Hey Colferg,

Thank you for the inquiry.

You should edit the column containing the text blocks with right alignment and apply a unique class name or ID to it so that you can style it differently on mobile view.

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

You can use this css code to adjust the text alignment of the text block and remove the left margin of the column.

@media only screen and (max-width: 767px) {
    .custom-css-name {
	margin-left: 0 !important;
    }

    .custom-css-name .avia_textblock p {
	text-align: center !important;
    }
}

Make sure to replace “custom-css-name” with the actual class name of the column.

Best regards,
Ismael

Hey Marc,

Thank you for the inquiry.

You can try this css code to hide the grid content container initially and only display it on hover.

.grid-content {
	opacity: 0;
	transition: all 0.5s;
	position: absolute;
	bottom: 0;
	width: 100%;
}

.grid-entry:hover .grid-content {
	opacity: 1;
}

Best regards,
Ismael

Hey laptophobo,

Thank you for the inquiry.

You may need to modify the iconbox shortcode file directly. You will find the title attribute or markup around line 580:

$linktitle = $title;

				switch( $linkelement )
				{
					case 'both':
						if( $title ) 
						{
							$title = "<a href='{$link}' title='" . esc_attr( $linktitle ) . "' $blank>$linktitle</a>";
						}

						$display_char_wrapper['start'] = "a href='{$link}' title='"  . esc_attr($linktitle) . "' {$blank}";
						$display_char_wrapper['end'] = 'a';
						break;
					case 'only_icon':
						$display_char_wrapper['start'] = "a href='{$link}' title='" . esc_attr($linktitle) . "' {$blank}";
						$display_char_wrapper['end'] = 'a';
						break;
					default:
						if( $title ) 
						{
							$title = "<a href='{$link}' title='" . esc_attr( $linktitle ) . "' {$blank} >$linktitle</a>";
						}

						$display_char_wrapper['start'] = 'div';
						$display_char_wrapper['end'] = 'div';
						break;
				}

Best regards,
Ismael

Hey Spiru_show1,

Thank you for the inquiry.

Please make sure that PHP Zip Archive extension is enabled. For more info, please check the following thread.

// https://kriesi.at/support/topic/adobe-fonts-in-enfold/#post-1305076

Best regards,
Ismael

Hey Iloivar,

Thank you for the inquiry.

Did you install the Classic Editor plugin? Please try to disable it and toggle or temporarily disable the Enfold > Performance > File Compression settings afterwards. Purge the cache before checking the editor again. You should also select your preferred editor in the Enfold > Theme Options > Select Your Editor settings.

Best regards,
Ismael

Hey jleclair87,

Thank you for the inquiry.

You can use this css to adjust the font size of the contact form response text.

.avia_ajax_form .ajaxresponse {
   font-size: 2em;
   font-size: 32px;
}

Best regards,
Ismael

Hey marcie73,

Thank you for the inquiry.

For the tag archive page, you can use this code in the functions.php file to replace div with h1.

/**
	 * Show an archive description on taxonomy archives.
	 */
	function woocommerce_taxonomy_archive_description() {
		if ( is_product_taxonomy() && 0 === absint( get_query_var( 'paged' ) ) ) {
			$term = get_queried_object();

			if ( $term && ! empty( $term->description ) ) {
				echo '<h1 class="term-description">' .  wp_kses_post( $term->description )  . '</h1>'; 
			}
		}
	}

And modify the hooks that we created previously. Try to replace it with:

// ADD PRODUCT CATEGORY DESCRIPTION IN RIGHT PLACE
add_action("after_setup_theme", function() {
	if(is_product_category()) {
             add_action( "woocommerce_before_shop_loop", "woocommerce_taxonomy_archive_description", 10 );
        }
	add_action( "woocommerce_before_shop_loop", "woocommerce_before_shop_loop", 10 );
}, 20);

Best regards,
Ismael

Hey langs24,

Thank you for the inquiry.

The icons are not displaying correctly because the site where it is loaded from or retrieved is different from the actual domain. Are you doing any redirection, or did you set WordPress to load from a different domain?

You may need to set a CORS policy to allow fonts or resource from a different domain.

// https://kriesi.at/documentation/enfold/icon/#icons-are-showing-as-rectangular-boxes-

Best regards,
Ismael

Hi,

Thank you for the info.

The tab section works well with static content or content with definite height. It has issues with element that dynamically changes on user interaction such as the masonry element and iframes loading content from external sources. To fix the issue with the pagination or the load more button, you may need to add this script in the functions.php file.

function ava_custom_script_tab_resize(){
	?>
	<script type="text/javascript">
        (function() {
           $('.av-masonry-load-more').on('click', function() {
            setTimeout( function() {
                $(window).trigger('av-content-el-height-changed');
            }, 1000);
           });
        })();
	</script>
	<?php
}
add_action('wp_footer', 'ava_custom_script_tab_resize');

And for the iframe issue, this might be needed.

 function ava_enqueue_custom_script_resize() {
    if ( wp_script_is( 'avia-default', 'registered' ) ) {
        wp_add_inline_script( 'avia-default', "(function($){	
            var int = window.setInterval(function(){
                console.log('tick');
                $(window).trigger('resize');
                $(window).trigger('av-content-el-height-changed');
            }, 2000);

            $(window).on('load', function() {
                setTimeout( function() {
                    clearInterval(int);
                }, 1000 );  
            });
        })(jQuery);" );
    }
 }
 add_action( 'wp_enqueue_scripts', 'ava_enqueue_custom_script_resize', 9999);

Best regards,
Ismael

Hi,

Thank you for the info.

Would you mind posting the login details in the private field so that we could check the site properly? Please make sure that the Appearance > Editor panel is accessible.

Best regards,
Ismael

Hi,

@EFESQU: Updating the theme to the latest version (4.8.3) should help. If not, try to revert jQuery to an older version by using the following plugin.

// https://wordpress.org/plugins/enable-jquery-migrate-helper/

Best regards,
Ismael

Hey rmieniawski,

Thank you for the inquiry.

The size of the featured image on post with sidebar is set to 845x321px by default. You can adjust it directly in the functions.php file (line 195).

$avia_config['imgSize']['entry_with_sidebar'] 	= array('width'=>845, 'height'=>321);	

Or by using the following plugin.

// https://wordpress.org/plugins/simple-image-sizes/

Best regards,
Ismael