4 minutes reading time (807 words)

Standing Out in the Stream - Adding Interactive Posts to your Content

Standing Out in the Stream - Adding Interactive Posts to your Content

We've all seen the social sharing icons which appear at the bottom of many websites encouraging people to like and share your content, but what if you could have the message that your visitors are pushing out to their social streams become more interactive? Google+ has just introduced 'interactive Posts' which help your shared posts stand out from the crowd - this could be a real game changer for many websites and an interesting way to develop social interaction with your visitors' networks.

Imagine if you could have the ability for customers to share a product on your website to their social media networks encouraging their friends to buy it for them, with a clear 'call to action' button superimposed on the shared link taking their friends straight to your buy now page! 

What about if you have a poll on your website, and you could allow people to share to their networks with a 'vote now' button, giving people a cue to provide their thoughts?

Google has recently announced the availability of 'Interactive Posts' which "provide an easy and prominent way to allow users to share your site or app with their connections and invite them to take action, for example RSVP for an event."

This new development should have marketing professionals dancing in the street, because I anticipate that with careful use, interactive posts could result in driving new users to your site, improving conversions, and increasing engagement.

> Skip to the geeky bit!

Google+ Interactive posts

As a user of social media, knowing the 'intention' behind the link that has been shared by my friends (for example, if they want me to RSVP to an event, or they are sharing a link to a product on a shop, or suggesting that I read an article) means that I already have an idea of what might be at the 'other end' of the link and therefore informs the decision of whether I want to click on the link or not - if I click through I know roughly what to expect. 

Add to this a well optimised title, a graphic and a snippet of text from the page, and you have something that looks like the image above.

How could this be used on a Joomla! website?

There are many ways that this kind of feature could be implemented on a Joomla! website - it's quite new technology so I haven't seen anything in use to date, but some of the 100 available call to action interactive post labels which may have relevance to Joomla! extensions include:

  • Add to cart
  • Add to calendar
  • Apply for a job
  • Ask a question
  • Bid in an auction
  • Bookmark a website
  • Buy an item
  • Check in at a location
  • Comment on a post or an item
  • Report an error
  • Confirm attendance
  • Download a document
  • Find a table in a restaurant
  • Invite a friend to an event
  • Learn/read more about a topic
  • Pay a subscription
  • Watch a demo
  • Sign up for a newsletter or magazine
  • Vote in a poll
  • Let your friends know what you'd like for your birthday!!
  • Write a review

 How to implement Interactive Posts?

There are some fairly clear instructions on the Google+ API documentation page but basically you need to follow these steps:

  1. Create a Google APIs Console project and generate a client ID on the API Access pane.
  2. Include the following javascript just before your closing body tag:
  3. <script type="text/javascript">  (function() {
       var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
       po.src = 'https://apis.google.com/js/client:plusone.js';
       var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
     })();
    </script>
  4. Choose a label to use from the 100 call to action labels available - it is important to use these labels and not manually specify your own, as these are translated into the native language of the user viewing the post. This value is used in the data-calltoactionlabel parameter.
  5. Add the markup to your extension (ideally in a template override if it's not already being used in the core extension). You can do this by using a div, span or a button - see below - This will automatically render a button on page load - you can use the Javascript API to create interactive post buttons.

  6. <!-- Place the tag where you want the button to render -->
    <button class="g-interactivepost"
    data-contenturl="https://plus.google.com/pages/"
    data-contentdeeplinkid="/pages"
    data-clientid="xxxxx.apps.googleusercontent.com"
    data-cookiepolicy="single_host_origin"
    data-prefilltext="Engage your users today, create a Google+ page for your business."
    data-calltoactionlabel="CREATE"
    data-calltoactionurl="http://plus.google.com/pages/create"
    data-calltoactiondeeplinkid="/pages/create">
      Tell your friends
    </button>

  7. If you don't like the design of the buttons, you can create your own buttons and customise to your requirements.

The potential of this development is endless, and the range of areas in which it could be implemented to drive traffic to websites, generate user interaction and social sharing - I look forward to seeing it implemented by Joomla! developers soon!

0
Joomla! Facebook Page Hits 100,000 Fans
 

Comments

Already Registered? Login Here
No comments made yet. Be the first to submit a comment

By accepting you will be accessing a service provided by a third-party external to https://magazine.joomla.org/