Forum Replies Created
-
AuthorPosts
-
Hey Stilecatalini,
Your menu items a white text on a black background, please explain further what you want to change, perhaps a mockup would help.

Best regards,
MikeHey Stilecatalini,
I believe that you mean your burger menu overlay, but you are using a full screen overlay and it doesn’t have a animation from one direction or another.
The menu items in it are from up to down already.Best regards,
MikeSeptember 17, 2023 at 7:25 pm in reply to: Only mobile device page speed insights performance score is low #1419395Hey schweg33,
How small do you want them to be on mobile?
Do you also want the text below then to be smaller?
What screen size do you want them to be the regular size, 768px and up?Best regards,
MikeSeptember 17, 2023 at 7:10 pm in reply to: Related articles and blog Hover Effect “slightly zoom in” possible? #1419392Hey ariane1001,
Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:.slide-entry-wrap a:hover img { animation: zoom 2s; animation-fill-mode: forwards; } @keyframes zoom { to { transform: scale(1.2) } }After applying the css, please clear your browser cache and check.
Best regards,
MikeSeptember 17, 2023 at 7:04 pm in reply to: Add image link without causing it to highlight upon hover #1419391Hi,
Thank you for your patience, I see that you are using the Code Snippets plugin so I will add the customizations in it,
I also see that you are using the heading setting Logo left, menu below, I disabled the Shrinking Header because it didn’t give enough room for the search box. The following code will only show the search bar on screens larger that 990px when there is enough room.
So first I added the function to add the widget to the header as a code snippet:add_action( 'ava_main_header', 'enfold_customization_header_widget_area' ); function enfold_customization_header_widget_area() { dynamic_sidebar( 'header' ); }Then the custom header widget with a search widget:

then I added this code to place the widget after the logo in the header:function header_widget_placement() { ?> <script> window.addEventListener('DOMContentLoaded', function() { (function($){ var width = $(window).width(); if ((width >= 990)) { $('#header_main .widget').detach().insertBefore('.av-logo-container .inner-container #menu-item-shop'); } else {} })(jQuery); }); </script> <?php } add_action('wp_footer', 'header_widget_placement', 99);then this css to style and order the header elements:
@media only screen and (max-width: 989px) { #header_main > .widget { display: none; } } @media only screen and (min-width: 990px) { .av-logo-container .inner-container { display: flex; flex-direction: row-reverse; } .av-logo-container .inner-container .widget { display: flex; order: 3; flex-basis: 65%; } #header_main > .widget { display: none; } .av-logo-container .inner-container .widget #searchform { width: 100%; } .av-logo-container .inner-container .widget #searchform .ajax_search_response { background-color: #fff; z-index: 3; } .av-logo-container .inner-container #menu-item-shop { display: flex; order: 2; } }Best regards,
MikeSeptember 17, 2023 at 4:01 pm in reply to: No way to modify buttons in pre-existing full width slider. #1419387Hi,
The project page that you linked to is using the Portfolio Grid element to display your portfolio items in a single column, so it shows each portfolio title and manual excerpt on the left and the featured image on the right:

and when you click on an item you go to the portfolio page that shows more images an details, so you can modify the portfolio pages.
If you don’t want to link to the portfolio pages you have the option Open a preview of the entry (known as AJAX Portfolio)

which will open on the same page and you can show more images.

you can add the images to show in the portfolio item under Ajax Portfolio Preview Settings at the bottom of the screen:

Let us know if this helps.Best regards,
MikeHi,
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,
MikeSeptember 17, 2023 at 3:29 pm in reply to: menu con categorie prodotto sempre allineate orizzontalmente su una riga #1419385Hi,
To move your account & search menu items next to the cart icon:

this is only needed for screens larger than 990px, because on mobile it’s already next to the burger menu:

Add this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:@media only screen and (min-width: 990px) { .account-menu { position: absolute; z-index: 3; height: 46px; right: 0; width: 150px; line-height: 46px; text-decoration: none; text-align: center; top: 38%; margin: -23px 0 0 0; } .account-menu .cart_dropdown { top: 85%; } .account-menu #menu-item-wc-account-icon { display: inline-block; height: 46px; width: 46px; float: left; } .account-menu #menu-item-search { display: inline-block; height: 46px; width: 46px; float: left; } .account-menu .menu-item-account-icon a { line-height: 46px !important; width: 46px; height: 46px !important; display: inline-block; } .account-menu #menu-item-search a { line-height: 46px !important; width: 46px; height: 46px !important; display: inline-block; } }Then add this code to the end of your child theme functions.php file in Appearance ▸ Editor:
function move_account_search_nexto_cart() { ?> <script> window.addEventListener('DOMContentLoaded', function() { (function($){ var width = $(window).width(); if ((width >= 990)) { $(".menu-item.cart_dropdown ").wrapAll("<span class=account-menu></span>"); $('#avia-menu #menu-item-wc-account-icon').detach().insertBefore('.account-menu .cart_dropdown'); $('#avia-menu #menu-item-search').detach().insertBefore('.account-menu .cart_dropdown'); } else {} })(jQuery); }); </script> <?php } add_action('wp_footer', 'move_account_search_nexto_cart', 99);Best regards,
MikeHi,
Thank you for the link to your site, I see that your image has a white border edge in the image, and as I understand you want a tan inner border to cover this over, try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:.single-post .single-small.with-slider .small-preview img { width: 200px; height: 200px; outline: 10px solid #f4ecdf; outline-offset: -9px; }and remove your css above, then clear your browser cache and any cache plugin, and check.
Best regards,
MikeHi,
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,
MikeSeptember 17, 2023 at 12:02 am in reply to: menu con categorie prodotto sempre allineate orizzontalmente su una riga #1419370Hey bassato,
It looks like there is enough room in your menu for more items, Please see the screenshot in the Private Content area.
Or do you mean at smaller screen sizes, if so you should make the mobile menu show until the desktop menu will fit on the screen, such as 1215px with this css:
Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:@media only screen and (max-width: 1215px) { #top #header .av-main-nav > li.menu-item { display: none!important; } #top #header .av-burger-menu-main { cursor: pointer; display: block!important; } }Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.
After applying the css, please clear your browser cache and check.Best regards,
MikeHi,
Unfortunately it is the youtube player that is landscape and it is in a iframe so it can’t be changed.Best regards,
MikeHi,
Right now your image looks like this:

if you try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:#top .av-masonry-image-container { background-position: unset; background-size: contain; background-repeat: no-repeat; }it should look like this:

but you will need to make sure all of your images are square, unlike this one:

Best regards,
MikeHey gb,
I see some of your links are not correct like:https://youtube.com/shorts/9ZafcCqlvZo?si=2JGuq_VNX95XKV86
they need to have /watch? like
https://www.youtube.com/watch?v=DwGfJaiR330
perhaps youtube doesn’t allow “shorts” to be seen but on there site? Try uploading them as regular videos.Best regards,
MikeSeptember 16, 2023 at 11:25 pm in reply to: No way to modify buttons in pre-existing full width slider. #1419363Hi,
Have you tried adding phone number link in the topbar at Enfold Theme Options ▸ Header ▸ Extra Elements ▸ Phone Number or small info textBest regards,
MikeHi,
Thanks for the login, if you plan on using the WPSearch perhap you should use it’s shortcode so it will have the correct functionality, I see that you have not set it up yet.

To add the search bar in the header you will need to add a Header Widget Area like you linked to above, but in that case there is not enough room there on mobile devices, are you sure you don’t want to add it under the menu so there is more room and east for people to use?Best regards,
MikeHi,
The text color is white I’m not sure why, I think it’s from a plugin, you seem to also have HTML code in your text fields, this may have happened if you copied text from somewhere else and pasted it, this could have added unclosed HTML tags into your page, I believe in a older thread you were having problems with broken HTML code like this.
To change the text to black so you can see it try creating a new WP Code snippet with this code:function correct_admin_textbox(){ ?> <style>.wp-admin.js .tmce-active .wp-editor-area {color: #000;} </style> <?php } add_action('admin_head', 'correct_admin_textbox', 1);Your WordFence plugin would not let me add it, I think it will help.
Best regards,
MikeHi,
Thank you for your patience and the password to your site but I don’t see a user name, please include.
I see the [avia_search] shortcode in your topbar, it looks like you have not added the code to the end of your child theme functions.php file in Appearance ▸ Editor:add_shortcode('avia_search', 'get_search_form');or if you did the symbols may be converted, please ensure to copy the code from the forum and not an email notification so the symbols are not converted. You said that you are using SearchWP, did you add the code for it to be the search for your site? And doesn’t it have it’s own shortcode, this page explains how to adjust the SearchWP shortcode for the options you want, you should end up with something like this:[searchwp_search_form engine="default" var="searchvar" button_text="Find Results"](this code may not work on your site, follow the instructions)
Your asking for a Amazon search bar, have you thought about adding a larger one like in our Knowledge Base Demo below your menu? We have a search bar element:

that will allow you to adjust the style better it you want a big search bar like on Amazon.Best regards,
MikeHey ijnavas,
To add nine social media icons per team member you will need to make the social icons smaller like this:.team-social a { text-decoration: none; position: relative; border-radius: 30px; padding: 0; background: #fff; margin: 3px; display: inline-block; height: 17px; line-height: 17px; width: 15px; } .avia-team-member .team-social { font-size: 10px; }Best regards,
MikeHey ijnavas,
If you are placing each team member element in a column then you could add a button under it, otherwise you could install our Special Character Translation plugin, please see our documentation: Using special characters to allow shortcode in the Team Member Description and the use the shortcode wand to create a button and add it ensuring to replace the brackets in the shortcode with ###91### and ###93###Best regards,
MikeSeptember 16, 2023 at 8:36 pm in reply to: Problem Slider volle Breite ist nicht an oberen Rand zu bekommen. #1419350Hi,
Thank you for your patience, when I check your site the header starts transparent showing the background image, and when you start to scroll the header becomes white, this is the correct standard behavior. I believe that you are asking for the header to always be transparent so the page always shows though it, is this correct?
Or do you want the header to have a sky background image?Best regards,
MikeHi,
Thank you for your patience, I see that the mega menu classes are not added to your menu, but when I switch to the parent theme the mega menu classes are added, so it seems to be something in your customized child theme, I’m not able to view your child theme functions.php but it looks like you have added ACF to create a custom child theme panel to your child theme, perhaps this is where the issue is. I don’t have experience with ACF and it is outside of our support to debug the conflict, I recommend trying to disable this customization so the mega menu will work correctly, or if someone built this for you to ask them for assistance.Best regards,
MikeSeptember 16, 2023 at 8:05 pm in reply to: Only mobile device page speed insights performance score is low #1419347Hi,
yas28 I see that there is a empty space under your sliders, this is from the smushit plugin, please disable the lazy load option in the plugin or disable the plugin and this should correct itself.
It gets confusing when we are working on more than one site per thread, so please open a new thread so we can assist, Thanks for understanding.Best regards,
MikeSeptember 16, 2023 at 7:56 pm in reply to: Only mobile device page speed insights performance score is low #1419346Hi,
Thank you for your patience, I checked your site for mobile and found that your Time-To-First-Byte is almost 3s:

this is not good, everything after that loods well, for desktop the TTFB is under a second so your whole site loads in about 2 seconds.
I found in your WP-Optimize cache settings a setting for mobile was Generate separate files for mobile devices, but this didn’t help, so I don’t see any other difference in your site between mobile and desktop, typically the TTFB is based on your server response to the page request and often that will be fast and the bottle neck is after that, for example my demo site has a TTFB .991

and there is no difference between the desktop & mobile.
I recommend checking your Cloudflare CDN if you are still using it and see if there is some mobile setting, and also check your server for any settings, it seems that somewhere a mobile request is treated differently but I’m not sure where.Best regards,
MikeSeptember 16, 2023 at 6:51 pm in reply to: Responsive behaviour of picture to cover column height at all times #1419343Hey CJGVD,
Thank you for your patience, in your grid row element example it look like to have added an image element inside of the grid element, instead try adding the image as a background image to the grid and set the Background Image Position as center center

on my test page I set each grid row element as 50% of the height and the image fills the cell size:

the only issue is the when the grid becomes a single column at mobile the cells with the background image have no content so the height doesn’t match as the equal height is not applied:

To correct I added the custom class equal-height-mobile-grid to the grid row elements, my test page has three:

and added this code to the end of my child theme functions.php file in Appearance ▸ Editor:function grid_row_elements_equal_height_for_mobile() { ?> <script> window.addEventListener('DOMContentLoaded', function() { (function($){ var width = $(window).width(); if (width < 767) { $('.equal-height-mobile-grid').each(function(){ var $columns = $('.flex_cell .flex_cell_inner',this); var maxHeight = Math.max.apply(Math, $columns.map(function(){ return $(this).height(); }).get()); $columns.attr('style', 'height: '+ maxHeight +'px !important'); }); } else {} })(jQuery); }); </script> <?php } add_action('wp_footer', 'grid_row_elements_equal_height_for_mobile', 99);and now on mobile the image cell is equal height:

Please give this a try.Best regards,
Mike -
AuthorPosts









