Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • December 15, 2025 at 4:49 pm #1492533
    mistermagoo8691

    In the middle of the top menu bar on the mobile view, I’d like to place a “<=” button (or a menu item with an icon).
    This button/menu item should have a simple “javascript:history.back()” link so that the user can go back to the previous page.

    This is useful when the website is installed as a webapp and there is no browser around it.

    Could you please help me? I’ve seen some requests in the forum for a secondary menu in addition to the hamburger menu, but the PHP + CSS code mentioned seems quite complex for what I want to do.

    Here what I’d like to achieve…

    Back button

    Thanks in advance!
    Bye,
    A.-

    December 16, 2025 at 9:05 am #1492555
    Ismael

    Hey Angelo,

    Thank you for the inquiry.

    Try to add this code to the functions.php file to insert a go back button inside the header container.

    
add_action( 'ava_main_header', 'ava_main_header_mod' );
function ava_main_header_mod() {
    ?>
    <div class="ava-go-back-wrapper">
        <a href="javascript:history.back();" class="ava-go-back-button">Go Back</a>
    </div>

    <style>
        .ava-go-back-wrapper {
            display: none;
            justify-content: center;
            align-items: center;
            padding: 10px 0;
        }
        .ava-go-back-button {
            display: inline-block;
            padding: 8px 16px;
            background-color: #333;
            color: #fff;
            text-decoration: none;
            border-radius: 4px;
            font-size: 14px;
        }
        @media (max-width: 768px) {
            .ava-go-back-wrapper {
                display: flex;
            }
        }
    </style>

    <script>
        function closeBurgerMenu() {
            const burgerBtn = document.querySelector('.av-burger-menu-main .av-hamburger.av-js-hamburger');
            const overlay = document.querySelector('.av-burger-overlay');
            if (burgerBtn && burgerBtn.classList.contains('is-active')) {
                burgerBtn.classList.remove('is-active');
            }
            if (overlay) {
                overlay.style.display = 'none';
                overlay.style.opacity = '0';
            }
        }

        document.addEventListener('DOMContentLoaded', function() {
            closeBurgerMenu();

            const goBackBtn = document.querySelector('.ava-go-back-button');
            if (goBackBtn) {
                goBackBtn.addEventListener('click', function(e) {
                    e.stopPropagation();
                    closeBurgerMenu();
                    setTimeout(function() {
                        history.back();
                    }, 50);
                });
            }
        });

        window.addEventListener('pageshow', function(event) {
            if (event.persisted) {
                closeBurgerMenu();
            }
        });
    </script>
    <?php
}

    Best regards,
    Ismael

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