Hi,

As mentioned above, this will require modifications that are outside the scope of support. Please forward the files mentioned above to the developers. So far, we haven’t encountered another thread with the same issue or request.

If you have any additional questions at this time we kindly ask that you open them up in a separate thread. The longer threads get in the forum, they become more difficult to support as they tend to drift off topic and they also make it troublesome for users trying to search for solutions. Keeping threads relevant to their original inquiry ensures that we can keep better track of what has been resolved and that users can more effectively find answers to similar issues they might be experiencing.

Thanks!

Best regards,
Ismael

Hi,

1.) We can’t reproduce the issue on our end. Have you tried using a difference device?

2.) Unfortunately, this will require modifications that are beyond the scope of support.

3.) You can replace the previous woocommerce_sale_flash filter with the following code to automatically calculate and display the percentage discount:

add_filter('woocommerce_sale_flash', 'avf_woocommerce_sale_badge', 10, 3);
function avf_woocommerce_sale_badge($badge, $post, $product) {
    if ($product->is_on_sale()) {
        $regular_price = floatval($product->get_regular_price());
        $sale_price    = floatval($product->get_sale_price());

        if ($regular_price > 0 && $sale_price > 0) {
            $percentage = round((($regular_price - $sale_price) / $regular_price) * 100);
            return '<span class="av-custom-sale-badge">-' . $percentage . '%</span>';
        }
    }
    return $badge;
}

If you have any additional questions at this time we kindly ask that you open them up in a separate thread. The longer threads get in the forum, they become more difficult to support as they tend to drift off topic and they also make it troublesome for users trying to search for solutions. Keeping threads relevant to their original inquiry ensures that we can keep better track of what has been resolved and that users can more effectively find answers to similar issues they might be experiencing.

Thanks!

Best regards,
Ismael

Hi,
Unfortunately, I found that the mega menu column titles do not add the menu-item classes or the custom classes like the regular menu items


After much research, I found no way to correct this, but I was able to add a unique custom class to each mega menu column title in your burger menu with this javascript:

document.addEventListener('DOMContentLoaded', function () {
  const burger = document.querySelector('.av-burger-menu-main');
  let columnClassAdded = false;

  if (burger) {
    burger.addEventListener('click', function () {
     
      setTimeout(() => {
        if (columnClassAdded) return;

        const columnTitles = document.querySelectorAll('#av-burger-menu-ul li.av-width-submenu');

        columnTitles.forEach((el, index) => {
          el.classList.add('menu-column-title-' + (index + 1));
        });

        columnClassAdded = true;
      }, 100);
    });
  }
});

I added this to your WP Code plugin as a javascript snippet, it adds:
menu-column-title-1 with the number changing for each title, since you currently have six of them it goes to menu-column-title-6
with menu-column-title-1 = Collections and menu-column-title-6 = Being Seen.
The css to make Erosion Stories of Paria Canyon blue I added this:

#av-burger-menu-ul .menu-column-title-2 > a {
	color: blue !important;
}

So using this structure you can style the mega menu column titles in the burger menu, and for the other menu items use the custom classes as above, note that you will need to add a greater-than symbol in your css, like this:

#av-burger-menu-ul .gal > a {
color: blue !important;
}

so the siblings also don’t change.
Give this a try and let us know if you find any other issues.

Best regards,
Mike

Hi,

We modified the script in the functions.php file a bit. It should be working correctly now. Please make sure to purge the cache or remove the browser history before testing. (see private field)

/* Masonry erweitern */
add_action( 'wp_footer', 'av_click_sort_button_by_tag', 100 );
function av_click_sort_button_by_tag() {
    ?>
    <script>
   (function ($) {
	   $(function () {
			const urlParams = new URLSearchParams(window.location.search);
			const tag = urlParams.get("sort_tag");
			console.log(tag);

			if (tag) {
				const buttonClass = tag + "_sort_button";
				const button = $("." + buttonClass + " .inner_sort_button")[0];
				console.log(button);

				if (button) {
					button.click();
				}
			}
		});
	})(jQuery);
    </script>
    <?php
}

Best regards,
Ismael

Hi,

Please try this instead:

#top #menu-item-search a {
  z-index: 1;
  position: relative;
  padding-right: 10px;
}

Best regards,
Rikard

Hi,

FacetWP is one of the most advanced filtering and sorting plugins available for WordPress. If it doesn’t meet your requirements, there may not be better alternatives. However, you can try the plugins listed below.

— https://wordpress.org/plugins/filter-everything/
— https://wordpress.org/plugins/ymc-smart-filter/
— https://wordpress.org/plugins/search-filter/

Best regards,
Ismael

Hey Jochen,

Thank you for the inquiry.

This should be possible with a custom script. Please try this code in the functions.php file:

add_action( 'wp_footer', 'auto_click_sort_button_by_tag', 100 );
function auto_click_sort_button_by_tag() {
    ?>
    <script>
    document.addEventListener("DOMContentLoaded", function () {
        const urlParams = new URLSearchParams(window.location.search);
        const tag = urlParams.get("tag");

        if (tag) {
            const buttonClass = tag + "_sort_button";
            const button = document.querySelector("." + buttonClass);

            if (button) {
                button.click();
            }
        }
    });
    </script>
    <?php
}

This should automatically activate the corresponding masonry sorting button based on the value of the ?tag= parameter in the URL. For example:

https://site.com/masonry?tag=images

Best regards,
Ismael

Hey a_edemirci,
We don’t have an element with this function, I recommend looking for a plugin to do this. Perhaps Filter Everything or one of these others.
I have not tried any of these, but it should be a good start for you.

Best regards,
Mike

Hi,
Thank you for your patience, try removing the css above and add this instead:

#top #menu-item-search a {
	z-index: 1;
  position: relative;
}

Best regards,
Mike

Hey schweg33,

I’m not sure that I fully understand your intentions, but there is no such functionality in the theme by default unfortunately. If you are looking to implement a custom solution, then you could try searching for similar solutions online to see if anything is available.

Best regards,
Rikard

Hi,

.main-title looks like a different font or font weight

Looks like the title is set to use a lighter font weight instead of the default 400. Did you configure the Heading elements in the Enfold > Advanced Styling tab? You can also adjust it with this css:

#top #wrap_all .main_color h1, #top #wrap_all .alternate_color h1, #top #wrap_all .socket_color h1 {
    font-weight: 400;
}

Regarding the burger/mobile menu, try to edit the Main Menu (Icon) elements in the Advanced Styling panel, or use this css code:

#top #wrap_all .av-burger-overlay .av-burger-overlay-scroll #av-burger-menu-ul li a {
    color: #ffffff;
    font-size: 18px;
    line-height: 1.8em;
}

.html_av-overlay-side #top #wrap_all div .av-burger-overlay-scroll #av-burger-menu-ul li:hover a, #top #wrap_all .av-burger-overlay .av-burger-overlay-scroll #av-burger-menu-ul li a:hover {
    background-color: #333366;
    color: #ffffff !important;
}

If you have any additional questions at this time we kindly ask that you open them up in a separate thread. The longer threads get in the forum, they become more difficult to support as they tend to drift off topic and they also make it troublesome for users trying to search for solutions. Keeping threads relevant to their original inquiry ensures that we can keep better track of what has been resolved and that users can more effectively find answers to similar issues they might be experiencing.

Thanks!

Best regards,
Ismael

Hi,

Do I need to add soms z-index code to ensure it’s always shown on top?

Yes, you have to adjust the z-index of the widget containing the search icon.

Best regards,
Ismael

Hi,

I’m not able to save this snippet into a widget code block because of some errors in the code.

You have to add the code in the functions.php file, then use the [avia_search] shortcode in a text or html widget. Please try it again.

Best regards,
Ismael

Hi,

Thank you for the update.

Try to use this shortcode instead:

function avia_search_cb() {
    ob_start();
    ?>
    <span id="menu-item-search" class="noMobile menu-item menu-item-search-dropdown menu-item-avia-special" role="menuitem">
        <a class="avia-svg-icon avia-font-svg_entypo-fontello"
        aria-label="Search"
        href="?s="
        rel="nofollow"
        title="Click to open the search input field"
        data-avia-search-tooltip='<?php echo esc_attr("
    <search>
        <form role='search' action='" . home_url() . "' id='searchform' method='get'>
<div>
                <span class='av_searchform_search avia-svg-icon avia-font-svg_entypo-fontello' data-av_svg_icon='search' data-av_iconset='svg_entypo-fontello'>
                    <svg version='1.1' xmlns='http://www.w3.org/2000/svg' width='25' height='32' viewBox='0 0 25 32' preserveAspectRatio='xMidYMid meet' role='graphics-symbol' aria-hidden='true'>
                        <title>Search</title>
                        <desc>Search</desc>
                        <path d='M24.704 24.704q0.96 1.088 0.192 1.984l-1.472 1.472q-1.152 1.024-2.176 0l-6.080-6.080q-2.368 1.344-4.992 1.344-4.096 0-7.136-3.040t-3.040-7.136 2.88-7.008 6.976-2.912 7.168 3.040 3.072 7.136q0 2.816-1.472 5.184zM3.008 13.248q0 2.816 2.176 4.992t4.992 2.176 4.832-2.016 2.016-4.896q0-2.816-2.176-4.96t-4.992-2.144-4.832 2.016-2.016 4.832z'></path>
                    </svg>
                </span>
                <input type='submit' value='' id='searchsubmit' class='button' title='Enter at least 3 characters to show search results in a dropdown or click to route to search result page to show all results' />
                <input type='search' id='s' name='s' value='' aria-label='Search' placeholder='Search' required /></div>
</form>
    </search>
    "); ?>'
        data-av_svg_icon="search"
        data-av_iconset="svg_entypo-fontello">
            <svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="25" height="32" viewBox="0 0 25 32" preserveAspectRatio="xMidYMid meet" role="graphics-symbol" aria-hidden="true">
                <title>Click to open the search input field</title>
                <desc>Click to open the search input field</desc>
                <path d="M24.704 24.704q0.96 1.088 0.192 1.984l-1.472 1.472q-1.152 1.024-2.176 0l-6.080-6.080q-2.368 1.344-4.992 1.344-4.096 0-7.136-3.040t-3.040-7.136 2.88-7.008 6.976-2.912 7.168 3.040 3.072 7.136q0 2.816-1.472 5.184zM3.008 13.248q0 2.816 2.176 4.992t4.992 2.176 4.832-2.016 2.016-4.896q0-2.816-2.176-4.96t-4.992-2.144-4.832 2.016-2.016 4.832z"></path>
            </svg>
            <span class="avia_hidden_link_text">Search</span>
        </a>
    </span>
    <?php
    return ob_get_clean();
}
add_shortcode('avia_search', 'avia_search_cb');

Best regards,
Ismael