Hi,
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,
Mike

Hi,
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,
Mike

Hi,
Glad Rikard could 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,
Mike

Hi,
Please open a new thread so we can assist, as this is not your thread so posting your admin login here will not be private and you will not see our comments in the Private Content area.
Thank you for your patience and understanding and for using Enfold.

Best regards,
Mike

Hi,
I found no errors in my testing, mine is MySql 8.1.27

Best regards,
Mike

Hi,
When I check the red boxes on mobile they are the correct size based on the text font size, Please see the first screenshot in the Private Content area.
If this is what you see than we can help adjust with css or you can follow your plan above that works for many people.
But I want to ensure that you are not testing the mobile view on a desktop screen by making the screen smaller, if you test this way please ensure to reload the page, Please see the second screenshot in the Private Content area.
If this is what you see then it is a testing error that real devices will not see, please let us know.

Best regards,
Mike

Hi,
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,
Mike

Hi,
Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

#top #wrap_all .av-burger-overlay .av-burger-overlay-scroll #av-burger-menu-ul > .av-active-burger-items > a {
    font-weight: 900;
    color: red !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.
Please see the screenshot in the Private Content area of the expected results.

Best regards,
Mike

Hi,
Please ensure that you are using the latest Enfold version, v5.6.10 if you just updated note that mailchimp updated their API, so double check that your API key is correct and then you will need to resave the API key in the theme and edit the page with the form and re-save it again for the form to load,
If this doesn’t help then please include an admin login in the Private Content area and link to a test page so we can be of more assistance.

Best regards,
Mike

Hi,
Thanks for the screenshot I believe that you want to embed one page into another and have the links open in the same embed section.
Such as embed the blog in one side of a grid row and then open the clicked posts in the same section, this is quite tricky but I believe that I have achieved it on this test page.

in the backend I have a grid row element and one side has a background image and the other side has a code block element:

the code block element has this code:

<div id="embedded-section"></div>

<script>
window.addEventListener('DOMContentLoaded', function() {
    (function($) {
        var initialContent = null; // Variable to store the initial content

        // Function to load content via AJAX
        function loadContent(url, initialLoad = false) {
            $.ajax({
                url: url,
                type: 'GET',
                dataType: 'html', // Explicitly expect HTML
                success: function(data) {
                    var content;
                    // Determine the selector based on whether it's the initial load
                    if (initialLoad) {
                        content = $(data).find('#av_section_1').html();
                    } else {
                        // Try the first selector
                        content = $(data).find('.av-main-single').html();
                        // If not found, try the second selector
                        if (!content) {
                            content = $(data).find('.post-entry').html();
                        }
                    }

                    // Check if content was found
                    if (content) {
                        if (!initialLoad) {
                            content = '<a href="#" class="back-link">Back</a>' + content; // Prepend back link to content
                        } else {
                            initialContent = content; // Save initial content if it's the initial load
                        }
                        $('#embedded-section').html(content);
                        bindLinkClicks(); // Re-bind click events to new links within the content
                    } else {
                        console.error('Requested content not found using the provided selectors.');
                        $('#embedded-section').html('Requested content not found.');
                    }
                },
                error: function(xhr, status, error) {
                    console.error('Error loading content:', error);
                    $('#embedded-section').html('Error loading content.');
                }
            });
        }

        // Bind click events to links within the embedded section
        function bindLinkClicks() {
            $('#embedded-section a').off('click').on('click', function(event) {
                event.preventDefault(); // Prevent default link behavior
                var linkUrl = $(this).attr('href'); // Get the URL of the clicked link
                
                if ($(this).hasClass('back-link')) {
                    // If the back link is clicked, load the initial content
                    $('#embedded-section').html(initialContent);
                    bindLinkClicks(); // Re-bind click events
                } else {
                    console.log('Attempting to load:', linkUrl);
                    loadContent(linkUrl); // Load content via AJAX, not initial load
                }
            });
        }

        // Initial loading of content with specific section
        loadContent('https://enfold.savvyify.com/embed-2', true);

        // Initial binding of click events on page load
        bindLinkClicks();
    })(jQuery);
});

</script>

Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.
Please change the url in the code to your page with the blog element, look for this part of the code:

// Initial loading of content with specific section
        loadContent('https://enfold.savvyify.com/embed-2', true);

Now the page that is embeded is a ALB page with a color section set to 100% height and a blog element inside:

by default the first color section of a ALB page has the ID av_section_1, this is important because it is what the script calls and will only show this section, not the header, footer, or sidebar, but set this page to no sidebar as the content width is affected.
Now to show the posts with no header, footer or sidebar we will use the class av-main-single for Classic Editor pages and if that is not found because it is a ALB post we will try post-entry, so when a post link is clicked the post will load in the same section:

Now since the back button on the browser won’t work we added a small “back” link at the top of the embed section:

Please give this a try.
Please note that this will only work for pages and links on your site.
Please note Page Preloading will interfere, so please disable.

Best regards,
Mike

Hi,
Thanks for the screenshot and the link to your site, there are a lot of customizations for the mega menu and looks complex, I tried to make some adjustments but they were not changing on the frontend as I would expect, are you sure that the FTP login you posted is for your staging site that you linked to? Please check.

Best regards,
Mike

Hey dowlassmoss,
Thank you for the link to your site, try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

@media only screen and (max-width: 480px) { 
	#top.home .avia-slideshow-button {
		display: none;
	}
}

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.
this will hide the buttons below 480px and then the caption will show.

Best regards,
Mike

Hi,
Thanks for the feedback, I have followed these steps, nosniff is set in the header, post-xxx.css files are generated on the pages, and I checked incognito on Windows in Chrome, Firefox, Brave & Edge and color section background images show correctly and I have no console log errors:

Best regards,
Mike

Hi,
Thanks, I see your site is using PHP v7.4.33, try updating to v8 and check again.

Best regards,
Mike

Hi,
Thanks for the feedback, I checked your page again and the two 1/5 column are hidden the reason you text column is not full width is because it is a 3/5 column, so I recommend adding the class cell-nodisplay to your text column and add another full width column with the class cell-dodisplay and try this css:

@media only screen and (min-width: 1440px) {
.cell-dodisplay {
display:none !important; }
}

Best regards,
Mike