
Tagged: main-menu, search icon
-
AuthorPosts
-
June 4, 2025 at 8:34 am #1485066
After update Enfold, the Search Icon To Main Menu does not appear in a site with “Stretched Or Boxed Layout: Boxed Layout; Logo And Main Menu: Top Header”.
Please see Private Content
Best regards,
OrianoJune 5, 2025 at 6:01 am #1485103Hey Oriano,
Thank you for the inquiry.
We’re not able to reproduce the issue on our end. Have you tried overriding the css or the position property in the Quick CSS field?
Please provide the site details in the private field so we can further check the issue.
Best regards,
IsmaelJune 6, 2025 at 11:36 am #1485143Hi Ismael
This is my the Advanced Styling Menu setting:
With the old Enfold, it works fine, the search icon appears correctly and the link works properly.
In new versions of Enfold (7.x.x), however, the search icon is not displayed.Best regards,
Oriano-
This reply was modified 3 weeks ago by
orianos.
June 6, 2025 at 1:14 pm #1485148Hi,
Thanks for the update. Could you post a link to where we can see the actual problem please?
Best regards,
RikardJune 9, 2025 at 9:52 am #1485232Hi Rickarg, The “problem” is in all the site, because is in the main menu search icon :(
Perhaps in the videos I linked and not in the pictures I attached, I failed to explain the problem in an understandable way :(
Please view the video I posted in the Private Content of my initial post (above).
In addition, as #Ismael requested, I also put in Private Content the data to access the site in production.Please tell me if I have not been clear.
Best regards
OrianoJune 9, 2025 at 10:04 am #1485234Hi Rickard, I’m sorry. I’m really “amazed” by this.
Please find Private Content the website in question.Best regards
OrianoJune 10, 2025 at 5:08 am #1485260Hi,
Thank you for the info.
We are not certain why the search SVG icon is not displaying, but we managed to work around the issue by adding this code in the Quick CSS field:
#top .menu-item-search-dropdown > a.avia-svg-icon svg:first-child, #top .menu-item-search-dropdown > a.avia-svg-icon img[is-svg-img="true"] { z-index: 1; }
We also added this script to make sure that when the SVG icon is clicked, it displays the AJAX search field.
add_action( 'wp_footer', 'av_custom_script', 100 ); function av_custom_script() { ?> <script> // trigger ajax search field document.addEventListener("DOMContentLoaded", () => { const svg = document.querySelector("#menu-item-search svg"); if (svg) { svg.addEventListener("click", (e) => { e.preventDefault(); e.stopPropagation(); const parentLink = svg.closest("a"); const parentLi = svg.closest("li"); if (parentLink) { parentLink.click(); } else if (parentLi) { parentLi.click(); } }); } }); </script> <?php }
Best regards,
IsmaelJune 10, 2025 at 8:40 am #1485266Hi Ismael, thanks for help, as always prompt and efficient (and friendly).
📌 Note lastly that I use Enfold on almost all the sites I manage, and this site is the only one that has had this problem. Moreover, it is a problem that only manifests itself with the latest versions of Enfold. On MAMP I have a version of the same site with Enfold 5.6.6 and the same icon displays correctly.
Best regards
OrianoJune 11, 2025 at 7:46 am #1485312Hi,
lastly that I use Enfold on almost all the sites I manage, and this site is the only one that has had this problem.
It’s probably an issue with the compression, a certain modification or one of the plugins. Please keep the above modifications for now and let us know if the issue occurs again on a different site.
Thank you for your patience.
Best regards,
Ismael -
This reply was modified 3 weeks ago by
-
AuthorPosts
- You must be logged in to reply to this topic.