Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Facebook, Twitter, and Google +1 buttons using only HTML (No Javascript)

I would like to know if there is a method to create "share" buttons for Facebook, Twitter and Google +1 using only HTML, without any Javascript having to be inserted into the code at any point.

For example, you can use the methods described below to create these buttons dynamically; however they all end up loading Javascript dynamically and creating their own code behind the scenes:

  • http://developers.facebook.com/docs/reference/plugins/like/
  • http://twitter.com/about/resources/buttons
  • http://www.google.com/webmasters/+1/button/
like image 304
Andrew Odri Avatar asked Jun 11 '12 23:06

Andrew Odri


People also ask

How do I create a twitter button in HTML?

Log in to your Twitter account. Go to https://publish.twitter.com/. Customize the follow button to your liking with the available options. Copy and paste the code into the HTML of your website wherever you would like the button to appear.

Can you use HTML on twitter?

No. There are just a few types of card that you can use - Summary, Summary Large image, App, or Player. None of these enable HTML functionality to be embedded. Twitter polls are a native feature of the platform and cannot be modified.


1 Answers

The following links will register the appropriate Likes, Tweets and +1s:

  • http://www.facebook.com/sharer.php?u=http://example.com
  • http://twitter.com/share?url=http://example.com&text=Description
  • https://plusone.google.com/_/+1/confirm?hl=en&url=http://example.com

These links will work for Wordpress:

Facebook

<a href="http://www.facebook.com/sharer.php?u=<?php if(is_home()){echo home_url();}else{the_permalink();} ?>" target="_blank" title="Share this page on Facebook">Like</a>

Twitter

<a href="http://twitter.com/share?url=<?php if(is_home()){echo home_url();}else{the_permalink();} ?>&text=<?php the_title(); ?>" target="_blank" title="Tweet this page on Twitter">Tweet</a>

Google +1

<a href="https://plusone.google.com/_/+1/confirm?hl=en&url=<?php if(is_home()){echo home_url();}else{the_permalink();} ?>" target="_blank" title="Plus one this page on Google">+1</a>
like image 145
Andrew Odri Avatar answered Oct 20 '22 18:10

Andrew Odri