Hi,

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

Best regards,
Rikard

Hey rixi,

Thank you for the inquiry.

The theme creates custom queries or sorting for the Magazine or Blog Posts element, which cannot be adjusted by the plugin. If you want to adjust the order of the items, please use this filter in the functions.php file.

/** adjust the magazine element query **/
function avf_magazine_entries_query_mod($query, $params)
{
    if(is_page(123))
    {
       $query['order'] = 'ASC';
       $query['orderby'] = 'title';
    }
    return $query;
}
add_filter('avf_magazine_entries_query','avf_magazine_entries_query_mod', 10, 2);

You can also use the following filter to add more sorting options to the magazine element.

// https://kriesi.at/support/topic/reversing-the-order-of-specific-blog-posts/#post-1395842

Best regards,
Ismael

Hi,
The ID result_ajax_response_1 is only in the page DOM after the contact form is submited and won’t be there on the page load.
Note that this is inside on the ajaxresponse_1 ID, and on page load ajaxresponse_1 is empty.
I’m not sure what your options are with Page Patch criterium in GTM but perhaps you can also get the page ID so you will know what page it is.
You could also add a custom field to your pages which could be added to the body classes for better information than the page ID, see this thread for an example.

Best regards,
Mike

Hi,
For mobile try this slow scroll to anchor with offset function in your child theme functions.php, I tested in on your page by injecting it in the browser and it seemed to work well.

function slow_scroll_to_anchor_with_offset() { ?>
  <script>
(function($) {
	var width = $(window).width();
    if ((width <= 767)) {
  $('a[href*=#]:not([href=#])').click(function() {
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') 
&& location.hostname == this.hostname) {

      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
      if (target.length) {
        $('html,body').animate({
          scrollTop: target.offset().top - 80 //offset
        }, 1000);
        return false;
      }
    }
  });
  //Executed on page load with URL containing an anchor tag.
  if($(location.href.split("#")[1])) {
      var target = $('#'+location.href.split("#")[1]);
      if (target.length) {
        $('html,body').animate({
          scrollTop: target.offset().top - 80 //offset
        }, 1000);
        return false;
      }
    }
    } else {}
}(jQuery));
</script>
  <?php
}
add_action( 'wp_footer', 'slow_scroll_to_anchor_with_offset', 99 );

Best regards,
Mike

Hi,

Great, I’m glad that Mike could help you out :-)

Please let us know if you should need any further help on the topic, or if we can close it.

Best regards,
Rikard

Hi,
I’m not seeing a top margin for the first .flex_column_table, only after the first one. Are you hiding the first one with some custom css? Please link to your page so we can examine, perhaps you have a different issue.
The latest version is now v5.6.10

Best regards,
Mike

Hi,
Thanks for the video and the link to your site. Your plugin Autoptimize was causing the error, I disabled it and now your “2.0” image shows:

please clear your browser cache and check.

Best regards,
Mike

Hi,
I have checked your homepage on Windows in Chrome, Firefox, & Edge and the slider at the top with the button seems to be the same in each browser. I didn’t see any “zooming” on hover in the slider, but I did on a image lower on the page that looks like a office.
Above you write that the “zooming” only works when you are logged in, typically this would point to an error in the cached files since typically when you are logged in you are not served any cached files. Often when the theme and a plugin minifys the files an error can occur due to the nature of “minifying” which removes spaces & certain characters. It looks like your site is also using a CDN, cloudflare which could be serving the bad files.
Try disabling the Enfold Theme Options ▸ Performance ▸ JS & CSS file merging and compression and enable Enfold Theme Options ▸ Performance ▸ Delete old CSS and JS files, then clear and disable your caching plugin and your server cache and your CDN, it could take a few hours your your site to start serving the same files as when you are logged it, especially for cloudflare which can take up to 24 hours.

Best regards,
Mike

Hey domchocolate,
Thank you for your patience and the link to your site, to tab though the menu, skipping sub-menu items unless the down or up arrow keys are used please try this javascript in your child theme functions.php file in Appearance ▸ Editor:

function tab_though_menu_skipping_sub_menu_items_unless_down_or_up_arrow_keys_are_used() { ?>
  <script>
document.addEventListener('DOMContentLoaded', function () {
    const menuItems = document.querySelectorAll('.menu-item-has-children'); // Adjust this selector to match your menu structure

    // Initially set tabIndex to -1 for all sub-menu items to skip them in tab navigation
    menuItems.forEach(item => {
        let subMenuItems = item.querySelectorAll('.sub-menu a'); // Adjust this selector for your sub-menus
        subMenuItems.forEach(subMenuItem => {
            subMenuItem.tabIndex = -1;
        });

        item.addEventListener('keydown', function (e) {
            // Only proceed if the event target is a menu item that contains a sub-menu
            let subMenu;
            if (e.target.classList.contains('menu-item-has-children')) {
                subMenu = e.target.querySelector('.sub-menu'); // Adjust this selector for your sub-menus
            } else {
                // This ensures we get the sub-menu even if a child of the menu item was focused
                subMenu = e.target.closest('.menu-item-has-children').querySelector('.sub-menu');
            }

            let subMenuItems = subMenu.querySelectorAll('a'); // Assumes sub-menu items are anchor tags
            let focusedElement = document.activeElement;
            let currentIndex = Array.from(subMenuItems).indexOf(focusedElement);

            switch(e.key) {
                case 'ArrowDown':
                    // Move focus to the next sub-menu item
                    if (currentIndex < subMenuItems.length - 1) {
                        subMenuItems[currentIndex + 1].tabIndex = 0;
                        subMenuItems[currentIndex + 1].focus();
                        e.preventDefault(); // Prevent scrolling the page
                    } else {
                        // Optionally wrap around to the first item
                        subMenuItems[0].tabIndex = 0;
                        subMenuItems[0].focus();
                        e.preventDefault(); // Prevent scrolling the page
                    }
                    break;
                case 'ArrowUp':
                    // Move focus to the previous sub-menu item
                    if (currentIndex > 0) {
                        subMenuItems[currentIndex - 1].tabIndex = 0;
                        subMenuItems[currentIndex - 1].focus();
                        e.preventDefault(); // Prevent scrolling the page
                    } else {
                        // Optionally wrap around to the last item
                        subMenuItems[subMenuItems.length - 1].tabIndex = 0;
                        subMenuItems[subMenuItems.length - 1].focus();
                        e.preventDefault(); // Prevent scrolling the page
                    }
                    break;
            }

            // Reset tabIndex to -1 for items not focused to ensure they're skipped during tab navigation
            subMenuItems.forEach(subMenuItem => {
                if (subMenuItem !== document.activeElement) {
                    subMenuItem.tabIndex = -1;
                }
            });
        });
    });
});
</script>
  <?php
}
add_action( 'wp_footer', 'tab_though_menu_skipping_sub_menu_items_unless_down_or_up_arrow_keys_are_used', 99 );

I tested this on your site by injecting it in the browser and it worked good with your desktop menu.

Best regards,
Mike

• This reply was modified 2 years, 2 months ago by Mike. Reason: updated to correct error

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,

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,

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,

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

Best regards,
Rikard

Hey bemodesign,

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

#top .av-custom-form-color .button {
  border-color: green;
}

#top .av-custom-form-color .button:hover {
  border-color: blue;
  background-color: red;
  color: white;
}

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 Jon,

Thanks for the update. Please let us know if you should need any further help on the topic, or if we can close it.

Best regards,
Rikard