Hi,

Great, I’m glad to hear that you found a solution. Please open a new thread if you should have any further questions or problems.

Best regards,
Rikard

Hi,

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

.coupon button {
  min-width: 100px;
  width: 100px;
}

Best regards,
Rikard

Hey StephenStamp,
Do you mean like the sort in our demo shop

this seems to work when I try. But to change these options I believe you need to use a plugin like this one or perhaps there is a official woocommerce plugin that will do this, but I don’t see any woocommerce options that will change these.

Best regards,
Mike

Hi,
Thanks for your patience, this is a older thread, I don’t recognize the screenshots that you provide, but most of the threads that I have seen all use javascript to capture the click and send it to GTM, it sounds like you have this part figured out but you want to use classes instead, I would expect that using a clstom class to trigger click would work for any element, like a image, or a button, these are clickable elements. If it will only work on the link “a” tag why don’t you add “a” after your custom class like .customClass a ?
But if you would like to request a new feature, the Dev Team has opened a new Github Feature Request for users to place requests and follow them as the Dev Team reviews them.

Best regards,
Mike

Hey menainfosec,
For your category page please go to Enfold Theme Options ▸ Blog Layout ▸ Blog Layout and choose List Layout – excerpt, or Grid Layout.
For the author you can go to the user profile and add info in the Biographical Info, or you can create a custom page and use a redirect plugin, or if you are really handy with PHP you can edit the author.php file but this is very advanced and may be tricky if you want to set it up for many authors.

Best regards,
Mike

Hey khrntanya,
Thank you for your patience, try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

.ajax_search_response h4,
.header_color .av_ajax_search_title {
	color: #d90f38;
}

the expected results:

Best regards,
Mike

Hey marxsvjetlana64,
Thank you for your patience, the YITH plugin doesn’t work with Enfold because the plugin doesn’t seem to provide correct css to work with our page structure, I tried examining the css but it is just too big of a job to make it work with Enfold, and we are limited to providing support for third party plugins.
If you really want this to work you could probably hire a freelancer on Upwork to rewite the css for you.

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 dillionline,
Try adding this code to the end of your child theme functions.php file in Appearance ▸ Editor:

function remove_ALB_post_state( $post_states, $post ) {
	if("! has_blocks( $post->ID )") {
		unset($post_states['wp_editor']);
	}
	if("!= Avia_Builder()->get_alb_builder_status($post->ID)") {
		unset($post_states['avia_alb']);
	}
	return $post_states;
}
add_filter('display_post_states','remove_ALB_post_state',999,2);

If you are not using a child theme you could use the WP Code plugin then add a new snippet, in the top right corner use the PHP snippet as the code type:

then add the above code and save.

Best regards,
Mike

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

#top ol li a:hover {
	color: red;
}

Best regards,
Mike

Hi,
Thank you for your patience as I understand what you would like to achieve, a full width changing image with a logo in the center at the top of every, post, page, & archive.
I note a few limitations, first none of our sliders offer a random image on page load, so they would always start with the same image and rotate in order. Second you would like to add this to the top of every, post, page, & archive without editing each post & page, etc.
So try this custom code to create this, if you are not using a child theme you could use the WP Code plugin then add a new snippet, in the top right corner use the PHP snippet as the code type:

then add this code and save:

function random_image_slider_shortcode($atts) {
    // Define default attributes and override with user-defined attributes
    $attributes = shortcode_atts(
        array(
            'mobile_height' => '300px', // default mobile height
            'desktop_height' => '500px', // default desktop height
        ),
        $atts
    );

    // Define your image URLs here
     $images = array(
        'https://example.com/wp-content/uploads/image1.jpg',
        'https://example.com/wp-content/uploads/image2.jpg',
        'https://example.com/wp-content/uploads/image3.jpg',
        'https://example.com/wp-content/uploads/image4.jpg',
        'https://example.com/wp-content/uploads/image5.jpg',
    );
    // Start building the output
    $output = '<div id="random-image-slider" class="avia-section container_wrap fullsize" style="height: ' . $attributes['desktop_height'] . '; background-size: cover; position: relative;">';

    // Add logo overlay
    $output .= '<img src="https://example.com/wp-content/uploads/logo.png" style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);" alt="Logo">';

    // Add script for changing the background image
   $output .= '<script>
        (function() {
            var images = ' . json_encode($images) . ';
            var currentIndex = Math.floor(Math.random() * images.length); // Start at a random index
            var container = document.getElementById("random-image-slider");

            function changeImage() {
                container.style.backgroundImage = "url(" + images[currentIndex] + ")";
                currentIndex = (currentIndex + 1) % images.length;
            }

            changeImage(); // Initial call to set the first image

            setInterval(changeImage, 3000); // Change image every 3 seconds

            // Responsive height adjustment
            function adjustHeight() {
                var windowHeight = window.innerHeight;
                var isMobile = window.matchMedia("(max-width: 768px)").matches;
                container.style.height = isMobile ? "' . $attributes['mobile_height'] . '" : "' . $attributes['desktop_height'] . '";
            }

            window.addEventListener("resize", adjustHeight);
            adjustHeight(); // Initial call to set height
        })();
    </script>';

    $output .= '</div>';

    return $output;
}

add_shortcode('random_image_slider', 'random_image_slider_shortcode');

In the code above change the 5 images to your image urls, and ensure to use full urls to the images, and also change the image url in the logo overlay.
If you just wanted to use this script and add the element manually to your pages you could use this shortcode in a code block:

[random_image_slider mobile_height="300px" desktop_height="500px"]

Note that you can change the height of the element for mobile and desktop. Also note that if you use large square images the whole image will not show on every device, the image will be cropped to the height that you set, also this will not be full width when used in a code block element, this is an example of the results:

Now since you want this added automatically to the top of every, post, page, & archive create a second PHP snippet in the WP Code plugin and add this code:

add_action('ava_after_main_title', 'ava_after_main_title_mod');
function ava_after_main_title_mod() {
	if(is_single() || is_page() || is_archive() ) {
		echo do_shortcode('[random_image_slider mobile_height="300px" desktop_height="500px"]');
	}
}

You can change the heights to suit, since this is added to the pages while the page is being created the element will be full width:

Give this a try.

Best regards,
Mike

Hey havi,

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

@media only screen and (max-width: 767px) {
.hr .hr-inner {
  width: 100%;
}
}

Best regards,
Rikard

Hi,
Thank you for your patience, I don’t find a filter solution but this css solution seems to work well, in this example I want to only show the category “oil painting” on a specific page using the masonry element and enable the sorting for the tags “available” and “sold”

I have used the the tags “available” and “sold” also on other categories to simulate your issue:

now in the masonry element I sort my tag for the two tags “available” and “sold”

now on the page both categories “oil painting” & “order” show even though I only want “oil painting” to show the sorting tags:

so I use this css with the page ID and the only category that I want to show:

.page-id-7542 .av-masonry-entry:not(.category-oil-painting) {
	display: none;
}

and now only “oil painting” with the tags “available” and “sold” show:

and the sorting works fine:


please give this a try, and if you need help with finding the page ID or category classes please link to your page so we can examine and help.

Best regards,
Mike

Hi,
First add the custom class specialHeight to each 1/4 column that you want the button the hot pepper image to line up below the special heading.
You don’t need to add this to the third odd item or items with no button or image.
Then typically I would add the following script to the end of your child theme functions.php file in Appearance ▸ Editor, but I see that you are not using a child theme so you could use the WP Code plugin then add a new snippet, in the top right corner use the PHP snippet as the code type:

then add this code and save.

function custom_specialHeight_script() { ?>
  <script>
(function($){
  $('.flex_column_table').each(function(){  
     var $specialHeading = $('.specialHeight .av-special-heading',this);
     var specialHeadingHeight = Math.max.apply(Math, $specialHeading.map(function(){
         return $(this).height();
     }).get());
     $specialHeading.height(specialHeadingHeight);
  });
  var resizeId;
  window.addEventListener('resize', function() {
      clearTimeout(resizeId);
      resizeId = setTimeout(doneResizing, 300);
  });
  
  function doneResizing(){
      location.reload();
  }

})(jQuery);
</script>
  <?php
}
add_action( 'wp_footer', 'custom_specialHeight_script', 99 );

I did this for you on your test site.

Best regards,
Mike

Hi,
Try adding the custom class first to Smokin Q

Best regards,
Mike

Hey micheladalcastagne,
I was not able to see your screenshot because it requires a login, so I had to guess, try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

#top .container_wrap {
    border-top-style: none;
}

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

Best regards,
Mike

Hi,
I see that whenever a page is edited there is a permissions error for core WordPress files:

one is for a plugin “easy pricing” and I see and error that your Rest API has been disabled, so you made have other plugin conflicts.
comparing the wayback page with your current one, I only see the your headings have a color of #666 now and were #222 but the font sizes is the same, and you icon element font was 21px and now 16px. The problem is that the wayback page uses the Autoptimize cache and now you are not, Autoptimize often breaks the cache styles due to multiple minifying, typically people notice the error and the disable Autoptimize to correct, so I’m not sure if you didn’t realize the error until now when Autoptimize has been disabled and the cache cleared.
When I examine your general style you are using the font color #666 so this leads me to believe that this color is correct and the Autoptimize version was wrong.
I recommend disabling the above plugin and any others that are causing the permissions & Rest API errors.

Best regards,
Mike

Hi,

Thanks for the update, we’ll close this thread for now then. Please open a new thread if you should have any further questions or problems.

Best regards,
Rikard

Hi,

Please add it to functions.php in your child theme.

Best regards,
Rikard

Hey,

We are sorry for the inconvenience. We’ve just released 5.6.12.

Please update Enfold to this version.

Regards,
Yigit

Hi,

We are sorry for the inconvenience. We’ve just released 5.6.12.

Please update Enfold to this version.

Best regards,
Yigit