Open "Leave a Review" modal when URL has #review_submit_modal hash

[IvanM]

Hi HivePress team,

I have a question about the “Leave a review” modal on listing pages.

Use case

After a booking is completed on our platform, we send the customer an email with a direct link to the listing so they can leave a review.

Ideally the link would look like this:

https://my-site.com/listing/my-listing-slug/#review_submit_modal

When the customer opens this URL, I would like the review modal to open automatically so they can start typing the review immediately, without having to scroll and click the “Leave a review” button.

Current behavior

At the moment, when I append /#review_submit_modal to the listing URL:

• The page loads correctly.

• The URL hash is present in the address bar.

• But the review modal does not open automatically. The customer still has to manually click the button that opens the review form.

So it seems that nothing in the front end is listening for that specific hash on page load.

Logged in vs logged out users

One more detail that complicates things:

• When a visitor is logged in, the “Leave a review” button targets the review modal (for example #review_submit_modal).

• When a visitor is logged out, the same button targets #user_login_modal instead, which correctly opens the login modal first.

However, the review link in the email is the same for everyone, and we cannot know in advance whether the user will be logged in or not when they click it.

Ideally the behavior would be:

• If the user is logged in and opens .../#review_submit_modal, the review modal opens directly.

• If the user is logged out and opens .../#review_submit_modal, HivePress opens the login modal first and after a successful login:

  • redirects back to the same listing

  • and then automatically opens the review modal.

What I am looking for

What is the recommended HivePress way to implement this flow?

More specifically:

1. Is there any built in hash or query parameter that HivePress already supports for opening the review modal automatically on page load?

2. If not, is there an official JS hook, event, or API that we should use to programmatically open:

   • the review modal, and

   • the login modal, with a redirect back to the review modal after successful login?

3. If this is not currently supported, would you consider adding native support for:

   • opening the review modal when a certain hash or query parameter is present

   • handling the login redirect logic so that logged out users can still follow the same review link and end up in the review modal after login?

I can add a small custom JS snippet if needed, but I would like to avoid brittle hacks that may break in future updates, so any guidance on the proper selectors, hooks, or filters to use would be very helpful.

Thank you in advance for your help and for any best practices you can share.

Best regards,
Ivan

[kseniia]

Hi,

Thanks for the suggestion! We’ll add it in the next update. It makes sense to open the modal when the URL anchor contains the modal ID. If it’s urgent, you can achieve this with custom JavaScript code, for example, using jQuery to check the URL on page load event, and if that anchor exists, open the modal.

[ferrand]

Hi Ivan,

I had the same use case and ended up solving it with a small JS snippet that doesn’t touch HivePress core and uses the same “Write a review” link that HivePress already outputs.

From the hivepress-reviews template:

// templates/listing/view/page/review-submit-link.php

<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>

So:

• If the user is logged in → the link is href="#review_submit_modal".

• If the user is logged out → the link is href="#user_login_modal".

Instead of trying to manually open the modal from scratch, I just:

1. Check if the URL hash is #review_submit_modal.

2. Programmatically “click” that hp-listing__action--review link on page load.

3. Let HivePress’ own JS open the correct modal (review form or login).

Here is the snippet I’m using (added via a small plugin / Code Snippets and hooked into wp_footer):

add_action( 'wp_footer', function () {
    // Only run on single listing pages.
    if ( ! is_singular( 'hp_listing' ) && ! is_singular( 'listing' ) ) {
        return;
    }
    ?>
    <script>
        (function () {
            function openReviewFromHash() {
                // Only react to this specific hash.
                if (window.location.hash !== '#review_submit_modal') {
                    return;
                }

                // Match HivePress’ "Write a review" link:
                // - logged in:  href="#review_submit_modal"
                // - logged out: href="#user_login_modal"
                var link =
                    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 (link) {
                    link.click(); // Uses HivePress’ own modal logic.
                }
            }

            if (document.readyState === 'loading') {
                document.addEventListener('DOMContentLoaded', openReviewFromHash);
            } else {
                openReviewFromHash();
            }
        })();
    </script>
    <?php
} );

How this behaves

• Email link:
  You can send users to:

  https://my-site.com/listing/my-listing-slug/#review_submit_modal
  
  

• If they’re logged in when they open it:
  The script finds the href="#review_submit_modal" review link and clicks it → the review modal opens automatically.

• If they’re logged out:
  The script doesn’t find the review link, but it finds href="#user_login_modal" and clicks that → the login modal opens immediately instead of them having to scroll and click.

After login, the exact redirect behavior depends on the HivePress login flow, but at least the email link already:

• Jumps to the right listing URL

• Opens the right modal automatically (review vs login)

For a fully automatic “log in and then reopen the review modal” flow, it would be amazing if HivePress exposed a small JS event (e.g. hpLoginSuccess) or documented the best way to hook into the login modal success. The snippet above works well as a lightweight workaround in the meantime because it only interacts with the existing .hp-listing__action--review.hp-link element instead of calling any internal JS APIs directly.

[IvanM]

Hey ferrand,

Huge thanks for sharing this! I just implemented your snippet and it works perfectly - the modal now opens both for logged-in users and after login for logged-out users.

This solves a really big UX problem for us with post-booking review emails. Really appreciate you taking the time to post the code and explain the logic behind it.

All the best,
ivan

[kseniia]

Hi,

Thanks for sharing the solution. It might be a great help to others.