Avoid adding anchors (#) in the URL with pages using Shortcodes Ultim

I finally figured out how to solve this problem.

To prevent the URL from changing when an accordion is opened, you can use JavaScript to remove the functionality that modifies the URL through a code to be added to the javascript file (in .js) in your theme’s options present at this level:

Appearance > Theme file editor > Find a .js file.

If you don’t have any javascript files, as was my basic case, here’s a general approach on how to do this:

1) Create a JavaScript file in your child theme:

Access your child theme’s directory via FTP or your hosting’s file manager.

Then Create a new file, for example custom-js.js, and place it in a directory named js or at the root of the child theme.

2) Add the following JavaScript code:

Open the custom-js.js file and add the following code:

document.addEventListener('DOMContentLoaded', function() {
    document.querySelectorAll('.su-spoiler-title').forEach(function(element) {
        element.addEventListener('click', function(event) {
            event.preventDefault();
        });
    });
});

3) Activate the Javascript file from functions.php:

Open your child theme’s functions.php file and add the following code:

function my_custom_scripts() {
    wp_enqueue_script('my-custom-js', get_stylesheet_directory_uri() . '/js/custom-js.js', array('jquery'), '1.0.0', true);
}
add_action('wp_enqueue_scripts', 'my_custom_scripts');

Basically, this code will activate the javascript file on your site, as I understand it.

After adding this code, the # anchors will no longer appear in the url of any pages containing the accordion shortcodes you open.