Hey Darren Dittrich,

Thank you for the inquiry.

And one more: is this v4.0 Enfold compatible with the latest WP 6.8.1 and PHP7.4?

The latest version of the theme is 7.1.1, so the version currently installed is a bit outdated. You may need to download the latest version from your ThemeForest account and update the theme manually via FTP.

— https://kriesi.at/documentation/enfold/theme-update/#update-via-ftp

It would also be good if we could register a support account, and possibly have this purchase tranferred to (Email address hidden if logged out) since the person who bought this plugin is no longer associated with this site.

Unfortunately, we don’t handle any sales-related inquiries in the forum. You will need to forward this issue to the ThemeForest team.

Let us know if you need more info.

Best regards,
Ismael

Hey Ernst Grubbauer,
Thank you for the login, please note that your version 4.1.2 is not compatible with PHP 8+, and it can not be updated in the theme, due to how Envato (Theme Forest) changed from a API key to a Token. Unfortunately this occurs when a old “developer” buys the theme in their Envato account and doesn’t create an account for the customer. Envato will not transfer the license nor issue a new license.
Due to our exclusive contract with Envato we can not issue licenses.
Your customer should create an account with Envato and purchase a new license The upside to this is that by purchasing a new license you will also get 6 months of support on our forum to help with any issues. I recommend upgrading to a full year of support for just a little more, as the cost of the theme and a full year of support costs the same as a single hour of support from many developers. .
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 using the contact form is not appropriate for support questions, please log in to the support forum and open a new thread if you need further assistance.
After you purchase a new license you can register for the support forum and post your questions.

Best regards,
Mike

Hi,

Thank you for the screenshots.

How did you set the font? It’s only loading on the homepage, probably because you have selected the fonts in the layer slider settings and it only loads on pages where the slider is present. You will need to manually load the fonts on other pages as well.

 	<link href="https://fonts.googleapis.com/css?family=Jost:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i%7CFraunces:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">

Please try this code in the functions.php file:

function ava_load_custom_fonts() {
    wp_enqueue_style(
        'ava-custom-google-fonts',
        'https://fonts.googleapis.com/css?family=Jost:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i|Fraunces:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i',
        false
    );
}
add_action('wp_enqueue_scripts', 'ava_load_custom_fonts');

Best regards,
Ismael

Hi,

However, I believe there may have been a misunderstanding regarding the issue. The problem is not with the icon itself or its aria-hidden attribute, but with the structure and function of the link that wraps the icon.

If we’re not mistaken, the issue occurs because the SVG icon includes the aria-hidden attribute, which makes it unreadable to accessibility tools. As a result, the parent link is marked as “suspicious” since the icon is hidden and the link lacks any accessible text or description. The span avia_hidden_link_text, which contains the word “Search” also has its display property set to none, making it inaccessible to screen readers as well.

Removing the aria-hidden attribute from the SVG icon or adjusting the visibility of the avia_hidden_link_text should help.

#top .avia_hidden_link_text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

You can also try editing the enfold/includes/config-enfold/functions-enfold.php, around line 125, change the text “Search” to “Click here to search”.

$items .=			'<span class="avia_hidden_link_text">' . __( 'Click Here to Search', 'avia_framework' ) . '</span>';

According to https://wave.webaim.org/, screen readers tend to better interpret buttons or links when it contains more descriptive text.

View post on imgur.com

If this doesn’t help, you can always try the suggestions above.

Let us know the result.

Best regards,
Ismael

Hey hostworks,

Thank you for the inquiry.

You’ll find the main wrapper that contains all the content in the themes/enfold/header.php file, so creating or overriding the template in your child theme is the cleanest approach. Look for this code around line 279:

<div id='main' class='all_colors' data-scroll-offset='<?php echo avia_header_setting( 'header_scroll_offset' ); ?>'>

Let us know if you have more questions.

Best regards,
Ismael

Hey Jake,
While I don’t expect any issues with updating from v3.85 to v7.1.1, I recommend creating a full site backup with your web host backup tool, not a plugin, as good practice.
If they are not using a a Child Theme check the functions.php for any customizations that they may have added, it will be lost in the update. If they are using a child theme, and have any customized php files like header.php or footer.php or any element php files, save these to your computer and remove them from the server before updating. With a version this old they will cause errors, you will need to copy the new version of the files and make the changes to them before adding them to the child theme.
Typically a good practice is to create a staging site first and update it and then compare the two sites for any difference, if this works fine then update the live site.
If you have any further questions please register to our support forum here and create a new thread and we will gladly try to help you.
You have asked your question through the contact form which is not for support requests.
Thank you for your understanding and for using Enfold.

Best regards,
Mike

Hi,

Try to replace the content of the class-responsive-mega-menu.php file with the following code:

— https://pastebin.com/s3N87rGC

Let us know the result.

View post on imgur.com

Best regards,
Ismael

Hi,

Thanks for reaching out.

The theme automatically increases the image quality to 100%, but the WordPress default is only 82%. This can be adjusted by using the following filters in the functions.php file:

add_filter("avf_jpeg_quality", "avf_set_quality_mod", 9999, 1); 
add_filter("avf_wp_editor_set_quality", "avf_set_quality_mod", 9999, 1); 
function avf_set_quality_mod($quality) { $quality = 60; return $quality;}

We recommend setting this to 70 or lower, then install an image compression plugin such as ShortPixel or Smush to further reduce file size and optimize the images. You may need to regenerate the thumbnails after the quality adjustment.

— https://wordpress.org/plugins/force-regenerate-thumbnails/

Best regards,
Ismael

Hey syberknight-tb,
Unfortunately, we don’t have an element that will achieve this for you in the theme, while there are many plugins that may work for you, when I check some of them they don’t quite match, but if you spend more time testing each one you may find one.
I was able to create something that may work for you using javascript and HTML in a shortcode, on mobile it shows 1 1/2 team member cards with prev & next arrows and loop when you click to the end:

on tablet it shows 2 1/2 cards:

and on desktop it shows 3 1/2 cards:

As is it holds 8 cards, you can add more or have less, you will need to edit the HTML to add your images and text, hopefully you will be able to do this:

Try adding this code to the end of your child theme functions.php file in Appearance ▸ Editor, If you are not using a child theme you could use the WP Code plugin then add a new snippet, in the top right corner use the PHP snippet as the code type:

and ensure that it is activated, then add the code below and save.

function team_carousel_shortcode() {
    ob_start(); ?>
    
    <div class="carousel-container">
        <button id="prevBtn">←</button>
        <div class="carousel">
            <div class="carousel-track">
                <!-- START: Team Members -->
        <div class="card"> <img src="/people-2-2-300x300.jpg" alt="Member 1"><p>Member 1<br>A short bio for the team member</p></div>
        <div class="card"> <img src="/people-2-2-300x300.jpg" alt="Member 2"><p>Member 2<br>A short bio for the team member</p></div>
        <div class="card"> <img src="/people-2-2-300x300.jpg" alt="Member 3"><p>Member 3<br>A short bio for the team member</p></div>
        <div class="card"> <img src="/people-2-2-300x300.jpg" alt="Member 4"><p>Member 4<br>A short bio for the team member</p></div>
        <div class="card"> <img src="/people-2-2-300x300.jpg" alt="Member 5"><p>Member 5<br>A short bio for the team member</p></div>
        <div class="card"> <img src="/people-2-2-300x300.jpg" alt="Member 6"><p>Member 6<br>A short bio for the team member</p></div>
        <div class="card"> <img src="/people-2-2-300x300.jpg" alt="Member 7"><p>Member 7<br>A short bio for the team member</p></div>
        <div class="card"> <img src="/people-2-2-300x300.jpg" alt="Member 8"><p>Member 8<br>A short bio for the team member</p></div>
        <!-- END: Team Members -->
            </div>
        </div>
        <button id="nextBtn">→</button>
    </div>

    <style>
    .carousel-container {
        position: relative;
        width: 80%;
        overflow: visible;
        margin: auto;
    }

    .carousel {
        overflow: hidden;
        width: 100%;
    }

    .carousel-track {
        display: flex;
        transition: transform 0.5s ease-in-out;
    }

    .card {
        box-sizing: border-box;
        padding: 10px;
        background: #e8e8e8;
        margin: 5px;
        border-radius: 8px;
        text-align: center;
        box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    }

    @media only screen and (max-width: 767px) { 
        .card { flex: 0 0 62%; }
    }

    @media only screen and (min-width: 768px) and (max-width: 1800px) { 
        .card { flex: 0 0 38%; }
    }

    @media only screen and (min-width: 1801px) { 
        .card { flex: 0 0 28%; }
    }

    .card p {
        color: #000;
     }
	.card img {
        width: 100%;
        height: auto;
        object-fit: cover;
        border-radius: 100%;
    }

    #nextBtn, #prevBtn {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        color: #000;
        border: 2px solid #000;
        padding: 10px;
        cursor: pointer;
        z-index: 10;
    }

    #prevBtn { left: -50px; }
    #nextBtn { right: -50px; }
    </style>

    <script>
    document.addEventListener('DOMContentLoaded', function () {
        const track = document.querySelector('.carousel-track');
        const cards = document.querySelectorAll('.card');
        const prevBtn = document.getElementById('prevBtn');
        const nextBtn = document.getElementById('nextBtn');

        let currentIndex = 0;
        let cardWidth = cards[0].offsetWidth + 20;

        function updateCarousel() {
            const shift = currentIndex * cardWidth;
            track.style.transform = translateX(-${shift}px);
        }

        function moveToNext() {
            currentIndex++;
            if (currentIndex >= cards.length) {
                currentIndex = 0;
            }
            updateCarousel();
        }

        function moveToPrev() {
            currentIndex--;
            if (currentIndex < 0) {
                currentIndex = cards.length - 1;
            }
            updateCarousel();
        }

        nextBtn.addEventListener('click', moveToNext);
        prevBtn.addEventListener('click', moveToPrev);

        window.addEventListener('resize', () => {
            cardWidth = cards[0].offsetWidth + 20;
            updateCarousel();
        });
    });
    </script>

    <?php
    return do_shortcode(ob_get_clean());
}
add_shortcode('team_carousel', 'team_carousel_shortcode');

Then add this shortcode in a code block element on your page: [team_carousel]
Feel free to adjust the colors in the css in the code.

Best regards,
Mike

Hey Sonia,

Sorry for the delay. The theme automatically sets the quality of uploaded images to 100%, but this should not be the reason why the generated files are larger than the originals. Did you install any plugins related to images or compression?

If necessary, you can reset the image quality to the WordPress default by adding this code to the functions.php file.

add_filter("avf_jpeg_quality", "avf_set_quality_mod", 9999, 1);
add_filter("avf_wp_editor_set_quality", "avf_set_quality_mod", 9999, 1);
function avf_set_quality_mod($quality) { $quality = 70; return $quality;}

You may need to regenerate the thumbnails afterward.

— https://wordpress.org/plugins/force-regenerate-thumbnails/

Make sure to create a site backup or restore point before regenerating the thumbnails.

Best regards,
Ismael

Hey Sven,
Your site is reporting a 404 error (file not found) for your icon fonts:

This affects your social icons and the other icons on your page:

It looks like the only fonts loading are from this location: /wp-content/uploads/themepunch/gfonts/ which may be from a plugin, or perhaps your WP Rocket plugin is causing the fonts to not load.
The first step is to disable all of your plugins and check again. If this doesn’t help leave all of your plugins disabled and include a admin login so we can examine.
I see that you are using a child theme, if you have a old copy of header.php or footer.php in your child theme, please remove these, as this is the top reason for errors after updating.

Best regards,
Mike

Hi,
Thank you for your patience, when I test your snippet above I find that the quotes have been converted to curly quotes which break the code.
If I correct them first, they work correctly in the code block element:


when using a code snippet like this the code block element is the correct element to use because the PayPal snippet is calling a function from the PayPal site which will run in the backend editor where you don’t want it to. The visual mode of the text editor will run the code, but the code block element will not.
If you really want to use the text block element, then use the code tab and do not switch to the visual tab. Here I show that this works, in the code tab you see the code and the preview shows the button:

at this point click “save” and not the visual tab and the button is shown in the editor, which means that WordPress is running the code in the text element in the backend.
Now you can update the page and view the frontend:

This is the corrected code snippet that I used:

<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_blank">
<input type="hidden" name="cmd" value="_s-xclick" />
<input type="hidden" name="hosted_button_id" value="H87UB2HDHP3GS" />
<table>
<tr>
<td>
<input type="hidden" name="on0" value="Options for Brondanw & Nantclwyd only"/>
Options for Brondanw & Nantclwyd only
</td>
</tr>
<tr>
<td>
<select name="os0">
<option value="Member">
Member £17.00 GBP
</option>
<option value="Guest">
Guest £19.00 GBP
</option>
<option value="2 Members">
2 Members £34.00 GBP
</option>
<option value="1 Member + 1 Guest">
1 Member + 1 Guest £36.00 GBP
</option>
<option value="Child under 16">
Child under 16 £10.00 GBP
</option>
</select>
</td>
</tr>
</table>
<input type="hidden" name="currency_code" value="GBP" />
<input type="image" src="https://www.paypalobjects.com/en_GB/i/btn/btn_cart_LG.gif" border="0" name="submit" title="PayPal – The safer, easier way to pay online!" alt="Add to Cart" />
</form>

Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.
To prevent your code snippet from changing if you want to edit the text block element in the future, such as adding text around the button, we will create a shortcode for your button, by adding this code to the end of your child theme functions.php file in Appearance ▸ Editor:

function paypal_button_shortcode() {
    ob_start(); ?>
    
    <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_blank">
        <input type="hidden" name="cmd" value="_s-xclick" />
        <input type="hidden" name="hosted_button_id" value="H87UB2HDHP3GS" />
        <table>
            <tr>
                <td>
                    <input type="hidden" name="on0" value="Options for Brondanw & Nantclwyd only" />
                    Options for Brondanw & Nantclwyd only
                </td>
            </tr>
            <tr>
                <td>
                    <select name="os0">
                        <option value="Member">Member £17.00 GBP</option>
                        <option value="Guest">Guest £19.00 GBP</option>
                        <option value="2 Members">2 Members £34.00 GBP</option>
                        <option value="1 Member + 1 Guest">1 Member + 1 Guest £36.00 GBP</option>
                        <option value="Child under 16">Child under 16 £10.00 GBP</option>
                    </select>
                </td>
            </tr>
        </table>
        <input type="hidden" name="currency_code" value="GBP" />
        <input type="image" src="https://www.paypalobjects.com/en_GB/i/btn/btn_cart_LG.gif" border="0" name="submit" title="PayPal – The safer, easier way to pay online!" alt="Add to Cart" />
    </form>

    <?php
    return ob_get_clean();
}
add_shortcode('paypal_button', 'paypal_button_shortcode');

Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.
Then in your text block element use this shortcode [paypal_button]

in the backend you will only see the shorcode:

and on the frontend the button shows:

Best regards,
Mike

Hi,

Will that happen wherever Masonry appears?

Yes, for some reason, it executes a function intended for Woocommerce. Try editing the file at enfold/config-templatebuilder/avia-shortcode-legacy/av-helper-masonry.php and look for the following code around line 1273:

if ( function_exists( 'WC' ) ) {
	avia_wc_clear_catalog_ordering_args_filters();
	$avia_config['woocommerce']['disable_sorting_options'] = false;
}

Replace it with:

if ( function_exists( 'WC' ) && ! class_exists( 'BigCommerce' ) ) {
	avia_wc_clear_catalog_ordering_args_filters();
	$avia_config['woocommerce']['disable_sorting_options'] = false;
}

Let us know if the issue persists.

Best regards,
Ismael