Hi,

Thank you for the screenshot.

You may need to disable the parallax effect and set the Background Repeat to “Scale to Fit” to make sure that the entire image is visible within the background positioning area.

Best regards,
Ismael

Hi,

It’s not really necessary to use transparent PNG images as spacers. You can simply use css to adjust the margin or padding of the button or the element above it.

Best regards,
Ismael

Hi,

Glad to know it’s working. Yes, you can use it with the Grid Row element, but you may need to adjust the css a bit.

#top #wrap_all .av-custom-gradient-section {
  background-color: transparent;
  background-image: linear-gradient(180deg, #FFFFFF21 23%, #FFCBA4 93%);
  opacity: 1;
  transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
}

To apply different gradient colors, add another Custom CSS Class name to the element, such as “av-custom-gradient-section av-gradient-black-to-white” or “av-custom-gradient-section av-gradient-red-to-white”, then specify the gradient with this css:

#top #wrap_all .av-gradient-black-to-white {
  background: rgb(0,0,0);
  background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(255,255,255,1) 65%);
}

#top #wrap_all .av-gradient-red-to-white {
  background: rgb(255,0,0);
  background: linear-gradient(0deg, rgba(255,0,0,1) 0%, rgba(255,255,255,1) 65%);
}

You can use this tool to generate the gradient CSS properties: https://cssgradient.io/

To apply a background image with a gradient, you’ll need to use the Color Section element. As instructed above, you need to enable the color overlay.

Best regards,
Ismael

Hey Ksenia,
Your Enfold version is very old: v3.3.2, we are now at v7.0.1
Your PHP version is 7.4.33, which is also outdated.
You should first update your theme with the following steps, and then update your PHP to v8+, if you don’t know how to do this please ask your webhost.
To update your version of Enfold you will need to download the latest installable WP version from your Theme Forest account and upload it to your WordPress ▸ Appearance ▸ Themes ▸ Add Themes ▸ Add New

after you choose the zip file and click install, you will see a This theme is already installed message because you are updating, you can continue

then you will see the Theme updated successfully message.

Please note that we don’t expect any issues with these steps, but it is always a good idea to first create a full backup of your site (files + database) with your webhost backup tool, not a WP backup plugin. Since there are may different webhosts ask your webhost for help creating a full backup.

Best regards,
Mike

Hey mariahanselle,

Did you make sure that you pick a high resolution version of the image in the right hand sidebar while picking it from the WordPress gallery?

Best regards,
Rikard

Hi,

Thank you for using Enfold.

avia_deep_decode

is a core function needed to properly convert HTML characters in ALB elements. And it is not recommended to remove/change it.

As all builders also our ALB has some overhead that slow down backend pageload.
Consider to switch to a hoster that provides higher performance – and try to increase memory for php and WP.

For frontend use caching plugins to speed up pageload – and check that your images are optimized and the dimension uploaded does not exceed the maximum size needed.

Hope this helps you.

Best regards,
Günter

Hey mosaic,

Thank you for the inquiry.

Please note that the specified size of 705x705px is the maximum dimension of the thumbnail. The generated thumbnail will not be cropped to this dimension and will still retain its aspect ratio. For example, if the uploaded image has a landscape orientation and is larger than 705px, the generated masonry thumbnail will have a maximum width of 705px, but the height might vary based on the calculated ratio. You may need to select a different thumbnail such as magazine, portfolio or portfolio_small.

Best regards,
Ismael

Hey Christian,

Thank you for the inquiry.

The image used as the background is quite large, sized at 2000x1126px. You may want to reduce the dimensions of the image before uploading it and make sure it is compressed to improve page speed. Please refer to the article below for more info on site optimization.

— https://gtmetrix.com/wordpress-optimization-guide.html

Best regards,
Ismael

Hi,

Thank you for the update.

The slider and gallery images are still visible when we checked the site. This screenshot was taken from the FR site.

View post on imgur.com

Best regards,
Ismael

Hey nicolealbaek,

Thank you for the inquiry.

There is no overlay option for the Column element, but you can apply a background in the Styling > Background panel. For the gradient effect, you can use the Color Section element, toggle the Styling > Background Overlay > Enable Overlay? option, then apply the class name “av-custom-gradient-section” in the Advanced > Developer Settings > Custom CSS Class field. Add this code to override the default overlay color with a gradient.

#top #wrap_all .avia-section.av-custom-gradient-section {
  background-color: transparent;
  background-image: linear-gradient(180deg, #FFFFFF21 23%, #FFCBA4 93%);
  opacity: 1;
  transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
}

Best regards,
Ismael

Hey Sandra,

Thank you for the inquiry.

Could you provide a screenshot of the changes you’d like to make? You can use platforms like Savvyify, Imgur, or Dropbox to upload and share the screenshot. If you need to adjust the background position and size of the image, you can try this css code:

.avia-section.av-1ajoc0o-f5dcf8e4d3d46a245540e44c381d48ec .av-parallax .av-parallax-inner {
    background-repeat: repeat;
    background-position: 70% 50%;
    background-attachment: scroll;
    background-size: contain !important;
}

Best regards,
Ismael

Hi,

You can try this css code to adjust the display of the header on mobile view:

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

  /* Add your Mobile Styles here */
  .responsive #header_main .container {
    height: 130px !important;
  }

  #top .avia_search_element.av-m8j6ucsp-f1ed25db4fcf2e1d4ba1dd7653626aed #s.av-input-field {
    line-height: 33px;
    height: 33px;
    color: #bed028;
    font-size: 14px;
  }

  #top #searchform_element {
    margin-bottom: 0;
  }

  #top .avia-section.av-m8h8o2m6-a6ff6f0926c56ce5cb244fa93948b320 {
    background-color: transparent;
    background-image: unset;
    margin-top: 5px;
    margin-bottom: 0px;
    position: absolute !important;
    margin-top: 0;
    z-index: 5000;
    margin-top: -40px;
  }

  #top .av-main-nav-wrap ul {
    margin: 0;
    padding: 0;
  }
}

View post on imgur.com

Best regards,
Ismael

Hey distortedimage,

Please try to toggle the file compression options and activate the option to delete old CSS and JS files under Enfold->Performance. We cannot login to your site since the default WordPress login page is redirecting to the front page.

Best regards,
Rikard

Hey lara666,

Thank you for the inquiry.

Unfortunately, slider videos are disabled on mobile views by default, so you’ll need to provide a fallback image. If you really need to display the video on mobile view, you can either use the Video element or create a slider using the Layer Slider plugin.

Best regards,
Ismael

Hey Munford,

Thank you for the inquiry.

Background videos are disabled on mobile devices by default. You will need to apply a fallback image, which will be displayed in place of the video in mobile view.

Best regards,
Ismael