Here’s quick but useful snippet — today’s Ask Sell with WP question comes from Brad:

Using Product Reviews Pro (or default reviews for that matter), is there a way to give each review ID hyperlinks? Not just the reviews tab 🙂 but make each and every review an actual shareable, true hyperlink. That way folks can share and post links to reviews.


You sure can! WooCommerce has plenty of hooks available in the review templates for us to output custom content like this. If you’d like to use this tutorial on your own site, be sure you know how to add custom code to your store.

I’m going to use the woocommerce_review_after_comment_text action to add a link after the comment (review) text for that review. This will let people get the review’s permalink with one click.

First, notice that WooCommerce gives us access to the $comment object with this hook. We’ll use that to generate the direct link to the comment, formatted like this: http://store.com/shop/product-slug/#comment-ID

We’ll then show an icon that lets customers click to get this link:

// Renders sharing links for product reviews after review text.
function sww_wc_render_review_link_icon( $comment ) {
        
    if ( $comment instanceof WP_Comment ) {
        echo '<span class="review-permalink">Direct link: <a href="' . esc_url( get_comment_link( $comment ) ) . '"><span class="dashicons dashicons-admin-links"></span></a></span>';
    }
}
add_action( 'woocommerce_review_after_comment_text', 'sww_wc_render_review_link_icon', 1 );

And we’re done! This adds a link to the bottom of each comment or review with its permalink.

WooCommerce review sharing link unstyled

However, given that’s pretty straightforward, let’s make this really pop. ?

I’m going to add some styles, along with a script to copy the URL when that icon is clicked so it’s super easy for my customers to share a review URL.

First, the styles. I’m going to make this text a bit less prominent, and shrink my permalink icon a tad to blend in with the “direct link” text with this snippet:

// Adds styles for review link section.
function sww_wc_review_link_styles() {
    ob_start();

    ?>
    <style>
    .woocommerce #comments .review-permalink {
        display: block;
        font-style: italic;
        font-size: 90%;
        margin: 10px 0;
    }
    .woocommerce #comments .review-permalink a .dashicons-admin-links {
        color: #333;
        font-size: 16px;
        vertical-align: bottom;
    }
    </style>
    <?php
    echo ob_get_clean();
}
add_action( 'wp_print_styles', 'sww_wc_review_link_styles' );

Now, I’ve got a less conspicuous “Direct link” section. It’s still noticeable, but it doesn’t compete with the review for attention as much now that it doesn’t use the primary link color.

WooCommerce review sharing link styled

Right now, while this looks nicer, the link opens the review URL in a new tab, making you copy that URL manually. I’m going to make this process a little smoother by changing the default click action — rather than opening the review permalink, I’m going to copy it to the clipboard and alert the customer of what we’ve done.

To do so, I’ll use snippet that loads a small bit of JavaScript to change the click action as well:

// Copies the review permalink on click
function sww_wc_add_review_permalink_copy() {

    // only add this to product pages
    if ( function_exists( 'is_product' ) && is_product() ) {
        wc_enqueue_js( '
            jQuery( document ).ready( function( $ ) {
                $( ".review-permalink a" ).on( "click", function( evt ) {
                    evt.preventDefault();
                    var temp = $( "<input>" );
                    $( "body" ).append( temp );
                    temp.val( $( this ).attr( "href" ) ).select();
                    document.execCommand( "copy" );
                    temp.remove();
                    alert( "Copied URL, ready to share!\n" + $( this ).attr( "href" ) );
                } );
            } );
        ' );
    }
}
add_action( 'wp_print_scripts', 'sww_wc_add_review_permalink_copy' );

Now we’re looking good! Clicking the “Direct link” icon will no longer open the review permalink; instead, it copies the link to the clipboard and informs the customer of this.

WooCommerce review sharing link copied

Product Reviews Pro compatibility

Finally, since the original question asked about Product Reviews Pro, let’s add a final compatibility snippet for those reviews and contributions. This snippet would be added in addition to the snippets above. It will use the same rendering styles and behavior, and adds the link text and icon to contribution templates, too:

/**
 * Renders sharing links for Product Reviews Pro contributions.
 *
 * @param string $template_name template name
 * @param string $template_path template path, unused
 * @param string $located template location, unused
 * @param string[] $args template arguments
 */
function sww_wc_prp_render_review_link_icon( $template_name, $template_path, $located, $args ) {

    // render sharing links after the contribution flagging target
    if ( 'single-product/form-flag-contribution.php' === $template_name && isset( $args['comment'] ) && $args['comment'] instanceof WP_Comment ) {
        sww_wc_render_review_link_icon( $args['comment'] );
    }
}
add_action( 'woocommerce_after_template_part', 'sww_wc_prp_render_review_link_icon', 1, 4 );

Now any contributions on my site with Product Reviews Pro will have this sharing link appended, too.

WooCommerce Product Reviews Pro review sharing link

That’s a wrap! Remember, be sure you know how to add custom code to your store to use these snippets, and now your customers can share reviews via social media or email.


Cover Photo Credit: Stefan Baudy (CC BY 2.0 license)

Note: This post may contain affiliate links, which means we get a commission from the plugin, theme, or service provider if you choose to purchase. Regardless of this, we are committed to providing high quality, unbiased resources. Have more questions? See our affiliate policy. You can use the plain links below if you prefer that we not receive a referral commission:


Your WooCommerce store can drive additional revenue by improving your email marketing. Try Jilt for free to increase sales with abandoned cart recovery emails, post-purchase follow-ups, and more!
Articles you may also like:

Posted by Beka Rice

Beka Rice manages the direction of Sell with WP content and writes or edits most of our articles to share her interests in eCommerce. Or she just writes as an excuse to spend more time jamming out to anything from The Clash to Lady Gaga. Who knows.

Leave a reply

Your email address will not be published. Required fields are marked *