Gmail Custom Share Button

Sometime back I have published the article for custom social share button, now we can extend it for the gmail also.

Motive of the share button

The gmail share button should be flexible enough to have our own design.
There should no load of external JS files for your custom share button, to avoid the delay in page loading.
Should be Easy for integration.

Sample Buttons (you can change them as per your need)

Sample Code

<a id="ref_gm" href="https://mail.google.com/mail/u/0/?view=cm&fs=1&to&
su='.$title.'&
body='.$gmail_body.'&
ui=2&tf=1&pli=1?"
onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=no,scrollbars=no,height=400,width=600');return false;">
<img src="<Your Image>" alt="Gmail Share Button"/></a>

Above code is a working code and running at QueryHome.

Custom Social Share Button

While working with QueryHome we were looking how we can have custom share button for Facebook, LinkedIn, Twitter and Google+ with the following key target in our mind -

The social share button should be flexible enough to have our own design.
There should no load of external JS files for your custom share button, to avoid the delay in page loading.
Should be Easy for integration.
Custom social share button gives an option to share the dynamic contents.(avoid Open graph protocols)

Sample Buttons (you can change them as per your need)

Code

Facebook

<a id="ref_fb"  href="http://www.facebook.com/sharer.php?s=100&amp;
p[title]=<?php echo $title;?>&amp;
p[summary]=<?php echo $description;?>&amp;
p[url]=<?php echo urlencode($share_url);?>&amp;
p[images][0]=<?php echo $image_url;?>" 
onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=no,scrollbars=no,height=400,width=600'); 
return false;"><img src="your custom facebook button" alt="Facebook Custom Image"/></a>

Twitter

<a id="ref_tw" href="http://twitter.com/home?
status=<?php echo $title; ?>+
<?php echo urlencode($share_url);?>"  
onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=no,scrollbars=no,height=400,width=600');
return false;"><img src="your custom twitter button" alt="Twitter Custom Image"/></a>

Google+

<a id="ref_gp" href="https://plus.google.com/share?
url=<?php echo urlencode($share_url);?>"
onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=no,scrollbars=no,height=400,width=600');
return false"><img src="your custom gplus button" alt="G+ Custom Button"/></a>

LinkedIn

<a id="ref_lkd" href="http://www.linkedin.com/shareArticle?mini=true&
url=<?php echo urlencode($share_url);?>&
title=<?php echo strip_tags($title); ?>&
source=<?php echo urlencode($siteurl);?>"
onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=no,scrollbars=no,height=400,width=600');
return false;"><img src="your custom linkedIn button image" alt="LinkedIn Custom Button"/></a>

Above code is a working code and running at QueryHome.

Whatsapp Share Button For a Website

Many a times user open our website on Mobile Device and we want to provide a mechanism by which user can share your post his/her whatsapp network.

Here is the code/steps for the whatsapp sharing for your website

Step 1: Check if it is mobile device

Step 2: If it is mobile device add the following html code

<a href="whatsapp://send?text=Your Test along with your URL">

<img src="Whats App Sharing Image" alt="Whatsapp Share Button" title="Share on Whatsapp">

</a>

And you are done.

Above code is working on QueryHome

How to Forwarded Gmail Email to Another Gmail Account

Here is the process on how to Forwarded Gmail Email to Another Gmail Account?

Click the gear icon in the top right corner of the Gmail screen and select Settings from the drop-down menu that appears.
Select Forwarding and POP / IMAP Tabs.
In the forwarding box first you will see, at the top right click Add a forwarding address.
Enter the address in which you want to forward the Gmail email to the box in the future, please enter a new forwarding email address.
From the Gmail team with Gmail forwarding confirmation from the Gmail team at the address you are forwarding.
Highlight and copy eight-part code under the confirmation code.
Switch to Gmail in your browser.
To let Gmail, know, click on the field next to the email address to do with the received email and forward it to the address you’ve chosen. Select an option from the drop-down menu that appears. Whatever you choose, you will receive a copy of the email at the address you selected in the previous steps.
Keep a copy of Gmail in the Inbox gives Gmail instructions to leave the message as new and unread in your Gmail inbox. Mark Gmail’s copy, leave messages in Gmail inbox, but mark them as read.
From now on, all email messages in your Gmail account-less than spam-are copied to the account you specified.

Gmail Custom Share Button

Your comment on this post:

Related Articles

Code