Allow static modal URLs regardless of user status

Hi there :waving_hand:

I’d love to request a small enhancement to the Reviews extension around the “Write a Review” button.

On single listing pages, the review-submit-link template outputs:

<a href="#<?php if ( is_user_logged_in() ) : ?>review_submit<?php else : ?>user_login<?php endif; ?>_modal"
   class="hp-listing__action hp-listing__action--review hp-link">
    <i class="hp-icon fas fa-star"></i>
    <span><?php esc_html_e( 'Write a Review', 'hivepress-reviews' ); ?></span>
</a>

This works great, but the href changes depending on whether the user is logged in (#review_submit_modal vs #user_login_modal). When I tried to add my own custom “Write a Review” button elsewhere on the page, it initially only worked when logged in because my JS selector matched only #review_submit_modal.

What I’m asking for

It would be really helpful if there were:

  • A small helper or filter/action to easily reuse the “Write a Review” trigger logic, or

  • An officially recommended way to add custom buttons (e.g. floating button) that open the same modal or login flow.

What I ended up doing (working solution)

For now I’m using a floating “Leave a Review” button added via wp_footer and a bit of JS that simply finds your original link (hp-listing__action--review) and clicks it, handling both logged-in and logged-out cases:

add_action( 'wp_footer', function () {

    // Only on single listing pages.
    if ( ! is_singular( 'hp_listing' ) && ! is_singular( 'listing' ) ) {
        return;
    }
    ?>

    <button id="mmb-floating-review-btn" type="button" aria-label="Leave a Review">
        ⭐ Leave a Review
    </button>

    <style>
        #mmb-floating-review-btn{
            position: fixed;
            right: 1.5rem;
            bottom: 1.5rem;
            z-index: 9999;
            padding: 0.75rem 1.25rem;
            border-radius: 999px;
            border: none;
            cursor: pointer;
            font-size: 0.95rem;
            font-weight: 600;
            background: #0f766e;
            color: #ffffff;
            box-shadow: 0 10px 25px rgba(15, 118, 110, 0.35);
        }
    </style>

    <script>
        (function () {
            document.addEventListener('DOMContentLoaded', function () {
                var btn = document.getElementById('mmb-floating-review-btn');
                if (!btn) return;

                btn.addEventListener('click', function (e) {
                    e.preventDefault();

                    // Logged-in:  href="#review_submit_modal"
                    // Logged-out: href="#user_login_modal"
                    var trigger =
                        document.querySelector('a.hp-listing__action--review.hp-link[href="#review_submit_modal"]') ||
                        document.querySelector('a.hp-listing__action--review.hp-link[href="#user_login_modal"]')   ||
                        document.querySelector('a.hp-listing__action--review.hp-link');

                    if (trigger) {
                        trigger.click();
                    }
                });
            });
        })();
    </script>

    <?php
} );

This works nicely on desktop and mobile, logged in and logged out, and can be dropped into a plugin or the Code Snippets plugin.

It would be awesome if something like this pattern (or a helper around it) were officially supported or documented so other site owners can easily add custom review buttons without having to dig through the templates.

Thanks for considering! :folded_hands:

Hi,

Thank you for the suggestion! We’ll consider adding such a developer API in future updates.

We also appreciate you sharing your solution, it’s very helpful for the community.