I use the elementor plugin for the table of content, But I have a code to minimize the table of content on the desktop. I want to disable the table of content everywhere my site that I use it.
My code is:
<script>
jQuery(document).ready(function($) {
var delay = 100; setTimeout(function() {
$('.elementor-widget-table-of-contents').addClass('elementor-toc--collapsed');
$('.elementor-toc__body').css('display', 'none'); }, delay);
});
</script>
How can I add this code correctly on my website?
You can use the plugin Code Snippets to add your snippet to all the pages of your website. It supports PHP snippets, but you can just echo your script:
<?php
echo "<script>
jQuery(document).ready(function($) {
var delay = 100; setTimeout(function() {
$('.elementor-widget-table-of-contents').addClass('elementor-toc--collapsed');
$('.elementor-toc__body').css('display', 'none'); },
delay);
});
</script>"
;
?>
Your client-side solution (jQuery/Javascript + CSS) is not a good idea to remove TOC because your source code will be dirty and didn't change.
You must solve this problem with logical solutions like changing Plugin's Settings or using PHP/Wordpress functions.
Here is a better solution:
https://wordpress.org/support/topic/hide-or-remove-table-of-content/
Good Luck