WooCommerce: “Share your Purchase on Twitter” @ Thank You Page

Boom! I was thinking of a way to show a “Share your Purchase on Social Media” on my thank you page right after someone becomes an official supporter. So, I spent some time coding and – as always – now I’m going to spend some more time to share my hard work!

Leave a comment below if this was helpful – and if you want to test this out, you’re very welcome to become an official Business Bloomer fan of course ๐Ÿ™‚

WooCommerce: display a “Twitter Intent” button on the thank you page

PHP Snippet: Display a “Share your Purchase on Twitter” button @ WooCommerce Thank You Page


/**
 * @snippet       Display a "Share your Purchase on Twitter" button @ WooCommerce Thank You Page
 * @how-to        Get CustomizeWoo.com FREE
 * @sourcecode    https://businessbloomer.com/?p=22104
 * @author        Rodolfo Melogli
 * @compatible    Woo 3.5.3
 * @community     https://businessbloomer.com/club/
 */

add_action( 'woocommerce_thankyou', 'bbloomer_share_purchase_twitter', 5 );

function bbloomer_share_purchase_twitter( $order_id ) {

// CREATE TWEET CONTENT
$string = 'I%20just%20became%20an%20official%20Business%20Bloomer%20Supporter!%20Check%20out%20the%20benefits%20at:%20';

// SEE WHICH PRODUCTS ARE IN THE ORDER
$order = new WC_Order( $order_id );
$items = $order->get_items();
foreach ( $items as $item ) {
	$product_id = $item['product_id'];
	$product_name = $item['name'];
	$product_url = get_permalink( $product_id );
}

// GET THE LAST PRODUCT AND SEE IF BELONG TO WANTED LIST
$barmada = array( "21665", "21657", "21650" );
if ( in_array( $product_id, $barmada ) ) {

	// IF YES, CREATE THE THANK YOU PAGE "TWITTER BOX"
	echo '<h2 class="twitter-prod-h2">Share your purchase with the WooCommerce community!</h2>';
	echo '<div class="twitter-prod-wrapper"><div class="twitter-prod-div col2-set addresses">';
	echo '<div class="col-1">';
	if ( has_post_thumbnail( $product_id ) ) {
		$image = wp_get_attachment_image_src( get_post_thumbnail_id( $product_id ), 'single-post-thumbnail' ); 
		echo '<img width="100" height="100" src="' . $image[0] . '" class="alignleft twitter-prod-img">';
	}
	echo '<div class="twitter-prod-name">' . $product_name . '</div>';
	echo '<div class="twitter-prod-url"><small>' . $product_url . '</small></div>';
	echo '</div><div class="col-2">';

	// GENERATE THE CLICK TO TWEET A HREF, NOTE "$string"
	?>
		<a class="button twitter-prod-button" target="_blank" href="https://twitter.com/intent/tweet?text=<?php echo $string ?>&url=https://businessbloomer.com/club/&hashtags=BloomerArmada,WooCommerce"><img width="25" height="25" src="https://businessbloomer.com/wp-content/uploads/2017/03/Twitter_Logo_White_On_Image.png" class="twitter-prod-tw-icon"> Share your purchase on Twitter &rarr; </a>
		</div>
		</div>
		</div>
	<?php
}
}

And as I feel generous today, here’s the full CSS I used as well ๐Ÿ™‚


/* THANK YOU PAGE TWITTER */

.twitter-prod-wrapper {
    overflow: hidden;
}

.twitter-prod-div {
border: 4px solid #4099FF;
padding: 1em 2em 0;
background: #fcfcfc;
}

.twitter-prod-div .col-1, .twitter-prod-div .col-2 {
margin-top: 1.618em;
}

.twitter-prod-name {
color: #4099FF;
font-weight: bold;
}

.twitter-prod-tw-icon {
display: inline-block;
vertical-align: middle;
}

.twitter-prod-button {
float: right;
background: #4099FF;
border-color: #4099FF;
}

Where to add custom code?

You should place custom PHP in functions.php and custom CSS in style.css of your child theme: where to place WooCommerce customization?

This code still works, unless you report otherwise. To exclude conflicts, temporarily switch to the Storefront theme, disable all plugins except WooCommerce, and test the snippet again: WooCommerce troubleshooting 101

Related content

  • WooCommerce: Redirect to Custom Thank you Page
    How can you redirect customers to a beautifully looking, custom, thank you page? Thankfully you can add some PHP code to your functions.php or install a simple plugin and define a redirect to a custom WordPress page (as opposed to the default order-received endpoint). This is a great way for you to add specific up-sells, […]
  • WooCommerce: How to Add a Custom Checkout Field
    Let’s imagine you want to add a custom checkout field (and not an additional billing or shipping field) on the WooCommerce Checkout page. For example, it might be a customer licence number – this has got nothing to do with billing and nothing to do with shipping. Ideally, this custom field could show above the […]
  • WooCommerce: Add Content to the Thank You Page
    A client of mine wanted to add some text to the thank you page, the page that customers see after they place an order via the default WooCommerce Checkout page. In this case scenario, they wanted to add a special coupon discount in order to entice buyers to go back to the website and buy […]
  • WooCommerce: Add Tracking Code / Script @ Thank You Page
    How do you add a tracking code to the WooCommerce Thank You Page? Well, with a simple snippet (and no plugin) you can! No matter whether you’re using Google AdWords, Facebook or other forms of marketing – the Thank You Page is such an important section of an ecommerce store and needs some TLC!
  • WooCommerce: Remove Link to Product @ Order Table
    There is a slightly annoying thing on the WooCommerce Thank-You Page and WooCommerce emails. Users looking at the order table can actually click on the Products they just purchased and abandon the page before taking the action you want them to take (see image below). So, I coded a simple PHP snippet to remove such […]

Rodolfo Melogli

Business Bloomer Founder

Author, WooCommerce expert and WordCamp speaker, Rodolfo has worked as an independent WooCommerce freelancer since 2011. His goal is to help entrepreneurs and developers overcome their WooCommerce nightmares. Rodolfo loves travelling, chasing tennis & soccer balls and, of course, wood fired oven pizza. Follow @rmelogli

21 thoughts on “WooCommerce: “Share your Purchase on Twitter” @ Thank You Page

  1. this doesn’t actually share what you bought though does it , it shares a generic message you add to the $string variable..

    1. Hello Stuart, thanks for your comment! You’re right, in this snippet I loop through the order to see if a certain product has been purchased, and then tweet a custom message. However, I’ve now added some PHP comments, and you can totally rework the snippet in regard to the $string and the $url parts, where you can respectively set the tweet content and tweet URL. By looping through the order you can store the product URLS and dynamically insert them into the tweet. Hope this helps ๐Ÿ™‚

  2. hi sir,
    i add above mention snippets i add in my child-theme but it not work

    1. Hey Hanmant, thanks for your comment! I just tested this again with Storefront theme and it works perfectly. Maybe your theme (or another plugin) is messing/conflicting with my snippet?

      To troubleshoot, go to WP Dashboard > WooCommerce > System Status: what errors do you see in red font?

      Also, take a look at this tutorial to see how to troubleshoot: https://businessbloomer.com/woocommerce-troubleshooting-mistakes-to-avoid/

      Finally, can you try switching temporarily to “Twentyseventeen” or “Storefront” theme and let me know if it works?

      Hope this helps!

      R

  3. Wow! it’s an excellent piece of code. Can be modified for other social networks also. Great !!!

    1. Indeed! Thank you Manas ๐Ÿ™‚

      1. cool snippet,

        rodolfo, how to add share to facebook also?

        Thankyou, kind regards

        1. Thank you Thomas ๐Ÿ™‚ Yes, this is possible – but unfortunately this is custom work and I cannot provide a complementary solution here on the blog. Thanks a lot for your understanding! ~R

  4. Thanks for sharing!

    1. Wonderful, thanks for your comment Jan!

  5. Rodolfo what a wonderful idea!
    What about if I use my own thank you page, will the snippet work?
    Thanks
    Lyse

    1. Hey Lyse! It will work only if you trigger the hook “woocommerce_thankyou” on your custom thank you page. You just need to add a line of PHP to the page in case ๐Ÿ™‚

  6. Dude! I didn’t even know i was looking for this! This is perfect to add to my Marin membership site for healers. I’ve been wracking my brain trying to think of a way to allow members to share with other healers in the community. This is perfect!!

    Thank you once again Rodolfo! Hope you’re enjoying Brazil (even in the rain) :o)

    Cheers!
    Js

    1. Brilliant! Thank you so much Jeffrey ๐Ÿ™‚

  7. This site has to be the single most underrated and underdiscovered gem on the internet

    1. Ahaha thank you so much Seb!

  8. Thank your I was searching something like this before, for a client store, next time may I can use this code

    1. Thank you so much Aleksei!

  9. More wonderful and actionable Free content, you are very generous Rodolfo.

    1. Denis, thanks so much for your feedback!

Questions? Feedback? Customization? Leave your comment now!
_____

If you are writing code, please wrap it like so: [php]code_here[/php]. Failure to complying with this, as well as going off topic or not using the English language will result in comment disapproval. You should expect a reply in about 2 weeks - this is a popular blog but I need to get paid work done first. Please consider joining the Business Bloomer Club to get quick WooCommerce support. Thank you!

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