Hi,

Thank you for the info.

You can try this css code to adjust the height of the slider on smaller screens.

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

  /* Add your Mobile Styles here */
  #top #wrap_all .av-k5zwtv35-b503e223437d26141b6108faf533b96b .avia-slideshow-inner {
    height: 80vh !important;
  }

  #top #wrap_all .av-k5zwtv35-b503e223437d26141b6108faf533b96b .avia-slideshow-inner li,
  #top #wrap_all .av-k5zwtv35-b503e223437d26141b6108faf533b96b .avia-slideshow-inner li div,
  #top #wrap_all .av-k5zwtv35-b503e223437d26141b6108faf533b96b .avia-slideshow-inner li div img {
    height: 100%;
    object-fit: cover;
  }
}

Result:

Best regards,
Ismael

Hi,

Thank you for the update.

It seems to be working correctly in the staging site. We set the button border radius from 20px to 30px.

Please make sure to purge the cache before checking the page. It’s also recommended to temporarily disable file compression settings while editing the site.

We also created a test page. (see private field)

Best regards,
Ismael

Hey Stefan,

Thank you for the inquiry.

You can enable the Enfold > Performance > Delete old CSS and JS files? option to automatically delete these files. This option is located at the very bottom of the Performance panel. If the files persist, you can manually delete them (make sure to create a backup first), then resave the theme options to regenerate the dynamic scripts and stylesheets.

You can also disable the file compression settings in Enfold and instead enable the compression option in your caching plugin, or install a dedicated optimization plugin such as Autoptimize or BWP Minify.

Hope this helps.

Best regards,
Ismael

Hi,

Thank you for the update.

Try to add this code to the functions.php file to sort items on the blog page by modified date and on the songs page by published date:

function ava_pre_get_posts_mod($query) {
    if (!is_admin() && $query->is_main_query()) {
        if (is_page(1230)) {
            $query->set('orderby', 'date');
            $query->set('order', 'DESC');
        }

        if (is_page(574)) {
            $query->set('orderby', 'modified'); 
            $query->set('order', 'ASC');
        }
    }
}
add_action('pre_get_posts', 'ava_pre_get_posts_mod');

Best regards,
Ismael

Hey SikoraEDV,

Thank you for the inquiry.

We may need to inspect the page to properly check the issue. Please create a test page with the embed code or widget, then provide the site URL in the private field.

Best regards,
Ismael

Hi,

You’re quite welcome! Let us know if you have more questions. Have a nice day.

Best regards,
Ismael

Hi,

Thank you for the update.

It seems to be working when applied directly in the browser. Please make sure you copied the code correctly, or provide the login details in the private field so we can check it.

Best regards,
Ismael

Hi,

Thank you for the inquiry.

Try to add this css code to adjust the spacing around the timeline container:

.avia-timeline-container {
    position: relative;
    padding: 0 10px;
}

Let us know the result.

Best regards,
Ismael

Hey schub1981,

Thank you for the inquiry.

We may need to inspect the elements on your site in order to provide an appropriate solution. Please provide the site URL in the private field. Have you tried adjusting the color options in the Enfold > General Styling > Logo Area tab?

In the meantime, to adjust the color of the burger menu icon on mobile view, try to use the following css code:

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

  /* Add your Mobile Styles here */
  .header_color .av-hamburger-inner,
  .header_color .av-hamburger-inner::before,
  .header_color .av-hamburger-inner::after {
    background-color: #da2727;
  }

  .html_av-overlay-side-classic #top .av-burger-overlay li li .avia-bullet,
  .html_av-overlay-side.av-burger-overlay-active #top .av-hamburger-inner,
  .html_av-overlay-side.av-burger-overlay-active #top .av-hamburger-inner::before,
  .html_av-overlay-side.av-burger-overlay-active #top .av-hamburger-inner::after {
    background-color: #da2727;
  }
}

Best regards,
Ismael

Hi,

Thank you for the inquiry.

The masonry element seems to be loading correctly on our end. Would you mind providing a screenshot of the issue? You can use platforms like Savvyify, ImgBB, PostImages, or Dropbox to upload and share the screenshot.

Best regards,
Ismael

Hey dweddell,

Thank you for the inquiry.

The image displayed in the grid items is actually 495x400px, but the items must be resized based on the container’s maximum width, which also affects the rendered size of the images.

For single portfolio pages, try to add the following code to the functions.php file to use the original (full-size) version of the portfolio featured image:

add_action( 'init', 'ava_set_image_size_for_single_portfolio' );

function ava_set_image_size_for_single_portfolio() {
    if ( is_singular( 'portfolio' ) ) {
        global $avia_config;
        $avia_config['size'] = 'full';
    }
}

Best regards,
Ismael

Hi,

Thank you for the inquiry.

Most of the color styling options are located under Enfold > General Styling. You can check the preview to see which element a specific field controls. If you can’t find the correct setting there, you can also edit the element in the Advanced Layout Builder and adjust the color options in the Styling tab.

To adjust the color of the phone number, please add this code in the Quick CSS field:

#top .header_color .phone-info a {
    color: #ffffff;
}

You may need to toggle or temporarily disable the Enfold > Performance > File Compression settings to make sure that the changes take effect.

Let us know the result.

Best regards,
Ismael

Hi,

Thank you for the update.

We modified the avf_social_icons_options filter a bit and moved it around line 64 of the functions.php file. We also added the social icon in the Enfold > Social Profiles panel. Please make sure to purge the cache before checking the page.

image host
Best regards,
Ismael

Hey tonyska,

Thank you for the inquiry.

Which blog layout (Grid, Small, Multi-author, List etc.) did you select? If it’s set to Grid Layout, you should be able to use the avia_post_slide_query filter to adjust the sorting of the items and utilize conditional functions to apply different sorting for specific pages or templates.

Example:

add_filter('avia_post_slide_query', 'avia_post_slide_query_mod');
function avia_post_slide_query_mod($query) {
    if (is_page(123)) {
        $query['orderby'] = 'menu_order';
        $query['order'] = 'ASC';
    }
    elseif (is_home()) {
        $query['orderby'] = 'date';
        $query['order'] = 'DESC';
    }

    return $query;
}

Replace 123 with the actual ID of the song page.

Each song is a blog post, and I organized them on my songs page by posting excerpts in order.

How do you post excerpts in a specific order?

Best regards,
Ismael

Hi,

Good to know! Please don’t hesitate to open another thread if you have more questions.

Have a nice day.

Best regards,
Ismael