Forum Replies Created

Viewing 30 posts - 391 through 420 (of 66,623 total)
  • Author
    Posts
  • in reply to: Text around images #1487637

    Hey icarogioiosi,

    Thank you for the inquiry.

    You have to set the float property of the image to right or left. This will allow the surrounding text to flow around the image.

    Example:

    HTML:

    <img src="test.jpg" class="av-float-right" />Long text here..
    
    

    CSS:

    .av-float-right {
       float: right;
       margin: 10px;
       max-width: 242px; 
    }

    Let us know the result.

    Best regards,
    Ismael

    in reply to: Background color form payment step #1487636

    Hey Gianluca,

    Thank you for the inquiry.

    Where can we see the checkout page or one of the products? We tried clicking the “Buy Now” button, but it redirects us to the maintenance page. (see private field)

    Best regards,
    Ismael

    in reply to: Columns Not Stacking on iPad in Color Section #1487635

    Hi,

    Thank you for the update.

    Did you try the second set of css rules without the UID av-4hiz9z-633b1e0ab579d3c11a88073322c9de8f?

    You can also apply a unique css class name to the Grid Row element where the modification is needed, for example “av-custom-grid-eq-height”, and then use the following css code.

    .responsive #top #wrap_all .av-layout-grid-container.av-custom-grid-eq-height {
        display: flex;
    }
    
    .responsive #top #wrap_all .av-custom-grid-eq-height .flex_cell.av_one_half .flex_cell_inner,
    .responsive #top #wrap_all .av-custom-grid-eq-height .flex_cell.av_one_half .flex_cell_inner .avia-image-container,
    .responsive #top #wrap_all .av-custom-grid-eq-height .flex_cell.av_one_half .flex_cell_inner .avia-image-container div,
    .responsive #top #wrap_all .av-custom-grid-eq-height .flex_cell.av_one_half .flex_cell_inner .avia-image-container div div,
    .responsive #top #wrap_all .av-custom-grid-eq-height .flex_cell.av_one_half .flex_cell_inner .avia-image-container div div img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }
    

    https://kriesi.at/documentation/enfold/add-custom-css/#enable-custom-css-class-name-support

    Best regards,
    Ismael

    in reply to: I don’t know how to make a design #1487634

    Hey fiorettipau,

    Thank you for the inquiry.

    You can use the Column element, but you’ll need to apply some css modifications to control the height of each row. Set the images as the background of the columns, then insert a Text or Code Block element inside each.

    Please create a test page so we can inspect the elements and provide the appropriate modifications.

    Best regards,
    Ismael

    in reply to: Columns Not Stacking on iPad in Color Section #1487589

    Hi,

    Try to add this css code:

    .responsive #top #wrap_all .av-layout-grid-container.av-5enyt3-e3a17494e866bcf05416abe291c1d6a0 {
        display: flex;
    }
    
    .responsive #top #wrap_all .flex_cell.av-4hiz9z-633b1e0ab579d3c11a88073322c9de8f .flex_cell_inner,
    .responsive #top #wrap_all .flex_cell.av-4hiz9z-633b1e0ab579d3c11a88073322c9de8f .flex_cell_inner .avia-image-container,
    .responsive #top #wrap_all .flex_cell.av-4hiz9z-633b1e0ab579d3c11a88073322c9de8f .flex_cell_inner .avia-image-container div,
    .responsive #top #wrap_all .flex_cell.av-4hiz9z-633b1e0ab579d3c11a88073322c9de8f .flex_cell_inner .avia-image-container div div,
    .responsive #top #wrap_all .flex_cell.av-4hiz9z-633b1e0ab579d3c11a88073322c9de8f .flex_cell_inner .avia-image-container div div img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }

    If you need this applied to every grid row element using 1/2 + 1/2 layout, use this instead:

    .responsive #top #wrap_all .av-layout-grid-container {
        display: flex;
    }
    
    .responsive #top #wrap_all .flex_cell.av_one_half .flex_cell_inner,
    .responsive #top #wrap_all .flex_cell.av_one_half .flex_cell_inner .avia-image-container,
    .responsive #top #wrap_all .flex_cell.av_one_half .flex_cell_inner .avia-image-container div,
    .responsive #top #wrap_all .flex_cell.av_one_half .flex_cell_inner .avia-image-container div div,
    .responsive #top #wrap_all .flex_cell.av_one_half .flex_cell_inner .avia-image-container div div img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }
    
    

    View post on imgur.com

    Best regards,
    Ismael

    in reply to: Grid layout – keep post on top #1487587

    Hey Uli,

    Thank you for the inquiry.

    Yes, unfortunately, the grid layout doesn’t support sticky posts by default. This is still possible, but you’ll need to add the following modification to the functions.php file.

    
    // include sticky posts in grid layout
    add_filter('avia_post_slide_query', function ($query, $params) {
        $sticky_posts = get_option('sticky_posts');
    
        if (empty($sticky_posts) || !is_array($sticky_posts)) {
            return $query;
        }
    
        $sticky_posts = array_map('intval', $sticky_posts);
    
        if (!empty($query['post__in'])) {
            $query['post__in'] = array_unique(array_merge($sticky_posts, $query['post__in']));
        } else {
            $posts = get_posts([
                'post_type'      => $query['post_type'],
                'post_status'    => 'publish',
                'posts_per_page' => $query['posts_per_page'],
                'orderby'        => $query['orderby'],
                'order'          => $query['order'],
                'post__not_in'   => $sticky_posts,
                'fields'         => 'ids',
            ]);
    
            $query['post__in'] = array_merge($sticky_posts, $posts);
        }
    
        $query['orderby'] = 'post__in';
    
        return $query;
    }, 10, 2);
    

    Best regards,
    Ismael

    in reply to: hotspot anchor link no smooth scroll #1487585

    Hi,

    Please looks for this line:

    document.querySelectorAll('.av-image-hotspot .avia-tooltip .inner_tooltip a[href^="#"]').forEach(function(anchor) {
    

    Replace it with:

    document.querySelectorAll('.av-image-hotspot .avia-tooltip .inner_tooltip a[href^="#"], .av-image-hotspot .av-image-hotspot_inner').forEach(function(anchor) {
    

    Let us know the result.

    Best regards,
    Ismael

    in reply to: Unable to import font #1487584

    Hey Blatze,

    Thank you for the inquiry.

    Where did you get the font? Please note that the Font Manager is intended for Google Fonts, and you will need to upload the font directly to the manager to register the font properly. Also, make sure that the PHP ZipArchive extension is enabled. You may need to confirm this with your hosting provider.

    Best regards,
    Ismael

    in reply to: CLS issue color section #1487583

    Hi,

    As mentioned in our previous replies, the LCP issue is caused by the home_background-keil.svg image or the first section. You’ll need to either reduce the size of the section or background image, or replace it entirely for mobile view.

    After you installed the Preload LCP Image plugin, did you select the images to preload? Currently, home_background-keil.svg is not being preloaded. Reducing the file size of the image should also help — currently at 96.5 KB.

    Best regards,
    Ismael

    in reply to: Templates & Functionality #1487582

    Hey Russell,

    Thanks for reaching out again.

    We can now see the video and can confirm that the scroll animations in the old site can be recreated with Enfold. You can apply these animations to Column elements, and they should be automatically triggered on scroll. You can also utilize the Layer Slider plugin, which is natively included in the theme, to create hero sections or sliders.

    Unfortunately, presale questions are one-time and can’t be continued like forum discussions. You will need to acquire a theme license and then use the purchase code to register an account on the forum.

    https://kriesi.at/support/register/

    Once registered, you can open a thread using this form: https://kriesi.at/support/forum/enfold/#new-post

    Let us know if there’s anything else we can help with.

    Best regards,

    Previous Reply:
    ============================================================================================================
    Thank you for your interest in Enfold.

    The videos are not accessible, so we’re not able to view them. In any case, the theme comes with built-in demo content, so you don’t need to start from scratch. You can simply import a demo and then incorporate your existing designs, images, and content to match what you have in mind. It’s very user-friendly, with plenty of customization options and a powerful Advanced Layout Builder where most of the content creation and site building will take place.

    If you have any questions or need help with development, feel free to reach out to us here in the forum — we’re happy to help.

    You can preview the available theme demos below.

    https://kriesi.at/themes/enfold-overview/

    To help you get started, please check out the documentation.

    https://kriesi.at/documentation/enfold/

    Let us know if you have any more questions.
    ============================================================================================================

    Best regards,
    Ismael

    in reply to: Accessibility issue with the progress bar #1487581

    Hi,

    Thank you for the update.

    The screenshot was taken from the editor panel from one of the progress bar items. To see the same options, edit the Progress Bar element, click on one of the items, and go to the Styling tab, you should see the same options as shown in our screenshot. Let us know if you need more info.

    Best regards,
    Ismael

    Hi,

    Thank you for the screenshots.

    To get rid of the redundant link warnings, you can add the following script to the functions.php file to convert the title link into a < span > tag while still preserving the link functionality on click.

    add_action('wp_footer', function () {
        ?>
        <script>
        jQuery(document).ready(function($) {
            $('.grid-entry-title a').each(function() {
                var href = $(this).attr('href');
                var text = $(this).text();
                var span = $('<span>')
                    .addClass($(this).attr('class'))
                    .text(text)
                    .attr('data-href', href)
                    .css('cursor', 'pointer');
    
                $(this).replaceWith(span);
            });
    
            $(document).on('click', '.grid-entry-title span[data-href]', function() {
                var url = $(this).data('href');
                if (url) {
                    window.location.href = url;
                }
            });
        });
        </script>
        <?php
    }, 999);
    

    View post on imgur.com

    Let us know the result.

    Best regards,
    Ismael

    in reply to: Phone and email icon next text in heder extra elements #1487579

    Hi,

    Thank you for the update.

    Please include this css code to center-align the items in the phone info container:

    #top #header_meta .phone-info div {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    
    #top #header_meta .phone-info div .avia-icon-pos-left {
        margin-left: 10px;
        top: 0;
        position: relative;
    }

    Result:

    View post on imgur.com

    Best regards,
    Ismael

    in reply to: Portfolio Grid Settings #1487578

    Hi,

    Thank you for the update.

    Despite testing, I don’t understand the purpose of the line margin: 0 0 20px;

    It seems to be a default css rule that we missed to remove. You can remove it if it’s not affecting the layout. Please don’t hesitate to open another thread if you have more questions.

    Best regards,
    Ismael

    in reply to: navigation tool #1487577

    Hey icarogioiosi,

    Thank you for the inquiry.

    You can enable the title and breadcrumb by adjusting the Enfold > Header > Header Layout > Header Title and Breadcrumbs settings. Make sure the header is not set to transparent.

    View post on imgur.com

    Best regards,
    Ismael

    in reply to: Child theme #1487543

    Hey murtazaansari,

    Thank you for your inquiry.

    The child theme should be included in the package you downloaded from ThemeForest.

    If you have a moment, please register a new account on our support forum using the purchase code that came with the Enfold theme. You can register here: https://kriesi.at/support/register/

    Once registered, you can open another thread using the form here: https://kriesi.at/support/forum/enfold/#new-post

    Hope this helps.

    Best regards,
    Ismael

    in reply to: CLS issue color section #1487542

    Hi,

    Thank you for the update.

    The image home_backround-keil.svg is not being preloaded when we check the site, and its file size is still at 96.5 kB, which is relatively large for mobile view. Regardless, the performance score on mobile is now 91, and 95 on desktop. Have you tried using the Preload LCP Image plugin?

    Best regards,
    Ismael

    in reply to: Widget Area Abouve footer only on Woocommerce pages #1487540

    Hi,

    Great! Glad to know that you managed to resolved the issue. Let us know if you have more questions. Have a nice day.

    Best regards,
    Ismael

    in reply to: hotspot anchor link no smooth scroll #1487539

    Hi,

    We adjusted the scroll position a bit.

    const offsetPosition = elementPosition + 142;
    

    Please try it again:

    function av_hotspot_smooth_scroll() { ?>
      <script>
      document.addEventListener('DOMContentLoaded', function () {
        document.querySelectorAll('.av-image-hotspot .avia-tooltip .inner_tooltip a[href^="#"]').forEach(function(anchor) {
          anchor.addEventListener('click', function(e) {
            e.preventDefault();
    
            const targetID = this.getAttribute('href').substring(1);
            const targetElement = document.getElementById(targetID);
    
            if (targetElement) {
              const elementPosition = targetElement.getBoundingClientRect().top + window.pageYOffset;
              const offsetPosition = elementPosition + 142;
    
              window.scrollTo({
                top: offsetPosition,
                behavior: 'smooth'
              });
    
              history.pushState(null, null, '#' + targetID);
            }
          });
        });
      });
      </script>
    <?php
    }
    add_action( 'wp_footer', 'av_hotspot_smooth_scroll', 99 );
    
    

    Adjust the value 142 as needed.

    Best regards,
    Ismael

    in reply to: Adding structured data to just 1 page #1487538

    Hey peterolle,

    Thank you for the inquiry.

    You can use the wp_head or wp_footer hook to add the script to a specific page.

    Example:

    function ava_json_ld_mod() {
        /// replace placeholder slug-of-your-page with the actual slug or ID of the page
        if (is_page('slug-of-your-page')) { 
            ?>
            <script type="application/ld+json">
            {
              "@context": "https://schema.org/",
              "@id": "https://www.example.com/advancedCpp",
              "@type": "Course",
              "name": "Learn Advanced C++ Topics",
              "description": "Improve your C++ skills by learning advanced topics.",
              "publisher": {
                "@type": "Organization",
                "name": "CourseWebsite",
                "url": "https://www.examplecoursewebsite.com"
              },
              "provider": {
                "@type": "Organization",
                "name": "Example University",
                "url": "https://www.example.com"
              }
            }
            </script>
            <?php
        }
    }
    add_action('wp_head', 'ava_json_ld_mod');
    

    Make sure to the adjust the value of the is_page conditional function.

    Best regards,
    Ismael

    in reply to: Lazy load a color section? #1487537

    Hey goldengate415,

    Thank you for the inquiry.

    There is no native way to lazy load elements like color sections, unlike images, where you can control loading behavior using the loading attribute. It’s still possible to implement lazy loading using custom scripts, but it will not really improve performance and could even make it worse due to the added scripts. Unfortunately, it would require significant modifications to the theme that is beyond the scope of support. Thank you for your understanding.

    Best regards,
    Ismael

    in reply to: Portfolio Grid Settings #1487536

    Hey icarogioiosi,

    Thank you for the inquiry.

    You can add this css code to move the title to the right of the image, position it at the top, reduce the font size, remove the borders, and add space below each portfolio entry. Please make sure to toggle or temporarily disable the Enfold > Performance > File Compression settings, then purge the cache after adding the modification.

    
    #top .isotope-item.special_av_fullwidth .inner-entry {
        text-align: left;
        display: flex;
        flex-direction: row-reverse;
    }
    
    #top .grid-entry .inner-entry {
        box-shadow: none;
    }
    
    #top .isotope-item.grid-entry {
        margin-bottom: 20px;
    }
    
    #top .isotope-item.special_av_fullwidth .av_table_col .entry-title {
        margin: 0 0 20px;
        font-size: 16px;
    }
    

    If you have any additional questions at this time we kindly ask that you open them up in a separate thread. The longer threads get in the forum, they become more difficult to support as they tend to drift off topic and they also make it troublesome for users trying to search for solutions. Keeping threads relevant to their original inquiry ensures that we can keep better track of what has been resolved and that users can more effectively find answers to similar issues they might be experiencing.

    Thanks!

    Best regards,
    Ismael

    in reply to: Accessibility issue with the progress bar #1487535

    Hey amollde,

    Thank you for the inquiry.

    Have you tried adjusting the colors of the Progress Bar element in the Styling panel? Please see the screenshot below:

    View post on imgur.com

    Let us know if you need more info.

    Best regards,
    Ismael

    Hey amollde,

    Thank you for the inquiry.

    We are not seeing any redundant links on the homepage. Would you mind providing a screenshot of the issue? You can use platforms like Savvyify, Imgur or Dropbox to upload and share the screenshot. Here are the steps to follow:

    1.) Visit the website of your chosen platform, such as Savvyify, Imgur or Dropbox.
    2.) Locate the option to upload a file or an image.
    3.) Select the screenshot file from your computer or device and upload it to the platform.
    4.) After the upload is complete, you will be provided with a shareable link or an embed code.
    5.) Copy the link or code and include it in your message or response to provide us with the screenshot.

    Thank you for taking the time to share the screenshot. It will help us better understand the issue you’re facing and provide appropriate assistance.

    Best regards,
    Ismael

    Hey amollde,

    Thank you for the inquiry.

    We’ll forward the issue to our channel. Temporarily, you can edit the themes\enfold\includes\classes\class-privacy-class.php file, around line 1782, and look for this code:

    $output .=		'<a class="avia-privacy-reload-tooltip-link" aria-hidden="true" href="#" rel="nofollow" data-avia-privacy-reload-tooltip="' . esc_attr( $reload ) . '"></a>';
    

    Replace it with:

    $output .=		'<span class="avia-privacy-reload-tooltip-link" aria-hidden="true" data-avia-privacy-reload-tooltip="' . esc_attr( $reload ) . '"></span >';
    

    Let us know if this resolves the issue.

    Best regards,
    Ismael

    in reply to: Logo on Home Page not visible? #1487531

    Hey amollde,

    Thank you for the inquiry.

    Did you set the Logo and the Transparency Logo in the Enfold > Theme Options panel? Please make sure that both of these options have an image selected.

    View post on imgur.com

    You can also try this css code:

    #top .av_header_transparency.av_alternate_logo_active .logo a > img, #top .av_header_transparency.av_alternate_logo_active .logo a > svg {
        opacity: 1;
    }

    Best regards,
    Ismael

    in reply to: Move burger menu after cart icon #1487530

    Hi,

    Thank you for the info.

    Please add this css code to move the account and mobile menus after the cart icon.

    @media only screen and (max-width: 1024px) {
        .responsive #top #wrap_all .main_menu {
            display: flex;
            position: absolute;
            flex-direction: row-reverse;
        }
    }

    Let us know the result.

    Best regards,
    Ismael

    in reply to: CLS issue color section #1487445

    Hey Rastoffarai,

    Thank you for the inquiry.

    This is the image causing the LCP issue: photovoltaik-anlage-fockenbrock-elektrotechnik-2560×1707-01.jpg.

    It is currently 2560×1707 pixels, which is quite large. Consider resizing it to half that size or smaller (1024x683px), and make sure all site images are properly compressed. You can use optimization plugins like ShortPixel or Imagify for this.

    After resizing and compressing the images, use the following plugin to preload the “photovoltaik-anlage-fockenbrock-elektrotechnik” image.

    https://wordpress.org/plugins/preload-lcp-image/

    Let us know if the LCP issue continues.

    Best regards,
    Ismael

    in reply to: make entire column clickable in post slider #1487444

    Hi,

    Thank you for the update.

    We adjusted the script a bit. Please remove the previous modification and replace it with the following code:

    function ava_custom_script_mod() {
        ?>
        <script>
        // make post grid excerpt clickable
        jQuery(document).ready(function($) {
            $('article.slide-entry').each(function() {
                const $article = $(this);
                const link = $article.find('a.slide-image').attr('href');
    
                if (link) {
                    $article.css('cursor', 'pointer').on('click', function(e) {
                        if (!$(e.target).closest('a, button').length) {
                            window.location.href = link;
                        }
                    });
                }
            });
        });
        </script>
        <?php
    }
    add_action('wp_footer', 'ava_custom_script_mod', 9999);

    Best regards,
    Ismael

    in reply to: icon animation affects surrounding element #1487443

    Hi,

    Thank you for the inquiry.

    Try to add this css code to fix the icon in place, preventing it from affecting the size of the button while animating.

    #top .buttonpulse a.avia-button .avia_button_icon {
        position: absolute;
        left: 30px;
        top: 15px;
    }
    
    #top .buttonpulse a.avia-button .avia_iconbox_title {
        padding-left: 15px;
    }

    Let us know the result.

    Best regards,
    Ismael

Viewing 30 posts - 391 through 420 (of 66,623 total)