Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1439833

    Hello Support Team,
    I am currently utilizing the latest version (5.0.1) Enfold theme.
    I would like to explore the possibility of placing the built-in “Enfold table of contents” widget directly within the body of the blog posts, before the first heading, rather than in the Sidebar Blog.
    Could you please provide guidance on whether this is feasible within the Enfold template? If so, could you kindly provide instructions or suggestions on how to achieve this customization?
    Thank you very much for your assistance.

    #1439867

    Hey pnamroud,
    Our current version is 5.7
    If you are using the Advanced Layout Builder to create your posts you could add a widget element to your posts and add the TOC widget to the sidebar displayed in the widget element.
    2022-04-08_009.jpg
    If you are using the WordPress editor for your posts you could try this javascript TOC, first add this code to your post: <div id="toc"></div> in the “text” tab:
    Enfold_Support_5400.jpeg
    Then add 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:
    Enfold_Support_2680.jpeg
    then add this code and save.

    function custom_toc_script() { ?>
      <script>
    document.addEventListener('DOMContentLoaded', function() {
        htmlTableOfContents();
    } );                        
    
    function htmlTableOfContents( documentRef ) {
        var documentRef = documentRef || document;
        var toc = documentRef.getElementById("toc");
    	var content = document.querySelector(".single-post .entry-content"); 
    	var headings = content ? [].slice.call(content.querySelectorAll( "h1, h2, h3, h4, h5, h6")) : []
        //var headings = [].slice.call(documentRef.body.querySelectorAll('#content h1,#content h2,#content h3,#content h4,#content h5,#content h6'));
        headings.forEach(function (heading, index) {
            var ref = "toc" + index;
            if ( heading.hasAttribute( "id" ) ) 
                ref = heading.getAttribute( "id" );
            else
                heading.setAttribute( "id", ref );
    
            var link = documentRef.createElement( "a" );
            link.setAttribute( "href", "#"+ ref );
            link.textContent = heading.textContent;
    
            var div = documentRef.createElement( "div" );
            div.setAttribute( "class", heading.tagName.toLowerCase() );
            div.appendChild( link );
            toc.appendChild( div );
        });
    }
    
    try {
        module.exports = htmlTableOfContents;
    } catch (e) {
        // module.exports is not defined
    }
    	  </script>
      <?php
    }
    add_action('wp_footer', 'custom_toc_script');

    This is the result:
    Enfold_Support_5402.jpeg
    There are many TOC plugins available, if you would like a different style, the RankMath SEO plugin also includes a TOC that works with Enfold.

    Best regards,
    Mike

    #1441499

    Hi Mike, thanks for the answer, regarding the theme version, you mentioned that the current version is 5.7 however, when I check for updates I receive a message stating “No update available, you are running the latest version (5.0.1.)”.
    I have attached a link to a screenshot displaying this message for your reference (see private content)
    Could you please provide guidance on how I can successfully update my Enfold theme to version 5.7? Are there any specific steps I need to take or any troubleshooting procedures I should follow to resolve this issue?
    Thank you for your attention to this matter, and I look forward to your response.

    #1441519

    Hi,

    To update please download the latest installable WP version from your Theme Forest account and upload it to your WordPress ▸ Appearance ▸ Themes ▸ Add Themes ▸ Add New
    WordPress_Appearance_Themes_Add-Themes_Add-New.jpg
    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
    Installing_theme_from_uploaded_file_This_theme_is_already_installed.jpg
    then you will see the Theme updated successfully message.
    Theme_updated_successfully.jpg
    Then going forward your Token should work correctly.

    Best regards,
    Mike

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.