Hi,

@Jason: You have probably enabled the Top Header before. If you really need to keep the left sidebar or header and still include a search field on the page for mobile view, you can try adding a Search element from the Advanced Layout Builder.

Please open another thread if you have more questions.

Best regards,
Ismael

Hi,

Thank you for the info.

We adjusted the code in the Quick CSS field a bit. It should be working correctly now.

@media only screen and (min-width: 769px) {
  /* Add your Desktop Styles here */
  #top .fullsize .template-blog .big-preview {
      padding: 0 0 10px 0;
      width: 40%;
  }

  .av-alb-blogposts .post-entry {
      display: block;
  }

  .av-alb-blogposts .big-preview.single-big a {
      height: 100%;
  }

  .av-alb-blogposts .big-preview.single-big a img {
      object-fit: contain;
  }

  #top .fullsize .template-blog .post-title {
      text-align: left;
      font-size: 30px;
      padding: 15px 0;
      max-width: 800px;
      margin: 0 auto;
  }

  #top .fullsize .template-blog .post-meta-infos {
      text-align: left;
  }

  #top .fullsize .template-blog .post .entry-content-wrapper {
    width: 60%;
    float: left;
  }

  #top .fullsize .template-blog .blog-meta {
      display: none;
  }

  #top .fullsize .template-blog .big-preview {
      padding: 0 0 10px 0;
      width: calc(40% - 50px);
      float: left;
      margin-right: 50px;
      min-height: 200px;
  }
}

@media only screen and (min-width: 989px) {
  #top .fullsize .template-blog .big-preview img {
    min-width: 494px;
  }
}

Best regards,
Ismael

Hey derdschuh,

Thank you for the inquiry.

Try adding this css code to properly resize the testimonial items on smaller screens:

@media only screen and (max-width: 1366px) {

  /* Add your Mobile Styles here */

  #top .av-minimal-toggle .toggle_content .avia-testimonial {
    width: 50%;
    display: block;
    float: left;
  }
}

@media only screen and (max-width: 768px) {

  /* Add your Mobile Styles here */

  #top .av-minimal-toggle .toggle_content .avia-testimonial {
    width: 100%;
    display: block;
    float: none;
  }
}

Result:

Best regards,
Ismael

Hey RENZCOM,

Thank you for the inquiry.

Try to add this css code to adjust the header height in tablet landscape view:

@media only screen and (max-width: 1366px) {
    .responsive.html_mobile_menu_tablet #top #header_main>.container .main_menu .av-main-nav>li>a, .responsive.html_mobile_menu_tablet #top #wrap_all .av-logo-container {
        height: 90px;
        line-height: 90px;
    }
}

Best regards,
Ismael

Hi,

You need to remove this css code if you want the featured image to resize automatically based on screen size. This rule sets a minimum height of 630px for the image, preventing it from shrinking while resizing the window. It does preserve the aspect ratio using object-fit: cover.

#top.single-post .fullsize .template-blog .big-preview img {
    width: 1200px;
    min-height: 630px;
    object-fit: cover;
}

Best regards,
Ismael

Hey Chris,

The update to 7.1.3 has to be done manually from the version you are running, please refer to my replies in this thread: https://kriesi.at/support/topic/enfold-4-5-theme-update-update-failed-download-failed-a-valid-url-was-not-pro/#post-1021541
You can either update manually via FTP: https://kriesi.at/documentation/enfold/how-to-install-enfold-theme/#theme-update, or upload the theme as if it was new under Appearance->Themes->Add New Theme.
If that doesn’t work then please try to delete the whole theme folder, then replace it with the new version. Make sure that you have backups of the site before starting updating.
Also please read this after you have updated: https://kriesi.at/documentation/enfold/theme-registration/

We can’t say if your site will stay the same or not, it depends on what has been done to it. You can export the theme settings under Enfold->Import/Export though, and make sure that you have a backup of your old site before updating anything.

Best regards,
Rikard

Hi,

@Jason: As mentioned in the previous thread, the search icon only works for the Top Header. It is disabled by default for the left and right sidebar/header layouts. If you need the search icon to display, you’ll have to modify the avia_append_search_nav function in the enfold/includes/config-enfold/functions-enfold.php file.

Best regards,
Ismael

Hey jerry,

I see that you are running an old version of the theme, could you try to update to the latest version (7.1.3) to see if that helps please? The update to 7.1.3 has to be done manually from the version you are running, please refer to my replies in this thread: https://kriesi.at/support/topic/enfold-4-5-theme-update-update-failed-download-failed-a-valid-url-was-not-pro/#post-1021541
You can either update manually via FTP: https://kriesi.at/documentation/enfold/how-to-install-enfold-theme/#theme-update, or upload the theme as if it was new under Appearance->Themes->Add New Theme.
If that doesn’t work then please try to delete the whole theme folder, then replace it with the new version. Make sure that you have backups of the site before starting updating.
Also please read this after you have updated: https://kriesi.at/documentation/enfold/theme-registration/

Best regards,
Rikard

Hi,

Thank you for the update.

Try adding this css code to remove the black bars and extend the video so that it goes underneath the header.

#top .av-video-slide embed, #top .av-video-slide iframe, #top .av-video-slide object, #top .av-video-slide video {
    object-fit: cover;
}

Best regards,
Ismael

Hi,

This CSS is hiding it:

@media only screen and (max-width: 1295px) {
  #top #header .av-main-nav > li.menu-item {
    display: none !important;
  }
}

Maybe you have added it under Appearance->Customise?

Best regards,
Rikard

Hey svweb,

Thank you for the inquiry.

Did you add this css code? It shifts the main container upward, causing it to overlap with the header.

#main {
    margin-top: -150px!important;
}

This is how it should look normally without the css modification.

Try to replace it with this css code:

@media only screen and (min-width: 768px) {

  /* Add your Desktop Styles here */
  #main {
      margin-top: -150px!important;
  }
}

Best regards,
Ismael

Hi,

Thank you for the update.

Looks like the script is working, but the isotope script still re-arranges the masonry items, placing the 4th item at the very end of the set. The isotope script is responsible for the masonry effect and sorting. Have you tried deleting that particular post (date August 13, 2025) and recreating it from scratch? You could try rephrasing the title a bit and adjust the image size.

Best regards,
Ismael

Hey AmyEdwards,

Thank you for the inquiry.

You can add the following css code to display the account and search icons on mobile view, but you’ll need additional style adjustments for the search field since you’re using a custom search option. We recommend reaching out to the script or plugin authors for additional assistance.

@media only screen and (max-width: 768px) {

  /* Add your Mobile Styles here */

  #top #header .av-main-nav>#menu-item-wc-account-icon {
    display: block !important;
  }

  #top #header .av-main-nav>.menu-item.menu-item-search-dropdown {
    display: block !important;
  }
}

Best regards,
Ismael

Hi,

Thank you for the update.

Try to include this css code inside the css media query above:

#top .av_header_glassy.av_header_transparency #header_main {
    background-image: none;
    background-color: black;
}

This will disable the gradient background and replace it with a solid black color.

Best regards,
Ismael

Hey Michael,

Thanks for reaching out to us. The update to 7.1.3 has to be done manually from the version you are running, please refer to my replies in this thread: https://kriesi.at/support/topic/enfold-4-5-theme-update-update-failed-download-failed-a-valid-url-was-not-pro/#post-1021541
You can either update manually via FTP: https://kriesi.at/documentation/enfold/how-to-install-enfold-theme/#theme-update, or upload the theme as if it was new under Appearance->Themes->Add New Theme.
If that doesn’t work then please try to delete the whole theme folder, then replace it with the new version. Make sure that you have backups of the site before starting updating.
Also please read this after you have updated: https://kriesi.at/documentation/enfold/theme-registration/

Best regards,
Rikard

Hi,

Thank you for the inquiry.

You can try this css code to force the mobile menu to display on tablet view and smaller screens.

@media only screen and (max-width: 1366px) {

  /* Add your Mobile Styles here */
  .responsive #top .av-main-nav .menu-item-avia-special {
    display: block;
  }

  .responsive #top .av-main-nav .menu-item {
    display: none;
  }
}

Let us know the result.

Best regards,
Ismael