How To Create A Social Button

One of the great things about this is that you can pick your own colors. You can change them for every lens or you can just pick one set of colors and use them exclusively. That's what I do because to me, changing the colors for every lens just isn't worth the effort.

You'll need 3 colors that compliment each other. The first color needs to be dark. That will be the upper background. The second color needs to be noticeably lighter. That will be your outline color. The third color needs to be very light. This is your lower background color.

<p><u style="display: block; margin-top: -1em; text-decoration: none;"></u></p><p style="text-align: center; font-size: 9pt; color: #f90; font-family: Arial; font-weight: bold; float: right; margin: 0px 0px 15px 30px; line-height: 14pt; background-color: #FFF0F5; border: solid 2px #FFC0CB; -moz-border-radius: 10px; -webkit-border-radius: 10px; text-align: right; width: 14em; padding: 0px;"><i style="text-align: center; display: block; background-color: #B22222; color: white; font-family: Trebuchet MS; font-size: 10pt; padding: 2px; -moz-border-radius-topleft: 6px; -webkit-border-top-left-radius: 6px; -moz-border-radius-topright: 6px; -webkit-border-top-right-radius: 6px; border-bottom: solid 2px #FFC0CB;">Share This Article</i><b style="display: block; padding: 3px; text-align: center; margin: 0px;"><img align="top" src="URL TO TWITTER LOGO" /> <a rel="nofollow" href="http://twitter.com/home?status=Reading%20this:+http://www.squidoo.com/XXXX" target="_blank" title="Twitter">Tweet it!</a>  <img align="top" src="URL TO STUMBLUPON LOGO" /> <a rel="nofollow" href="http://www.stumbleupon.com/submit?url=http://www.squidoo.com/XXXX" target="_blank" title="StumbleUpon">Stumble it!</a><br /><img align="top" src="URL TO FACEBOOK LOGO" /> <a rel="nofollow" href="http://www.facebook.com/sharer.php?u=http://www.squidoo.com/XXXX/&t=NAME%20YOUR%20LENS" target="_blank" title="Facebook">Like it!</a>    <img align="top" src="URL TO PINTEREST LOGO" /> <a rel="nofollow" href="PINTEREST URL" target="_blank" title="Pinterest">Pin it!</a></b></p><p style="padding: 10px;"></p>

The green text is the first color you'll change. That's the lower background color so use the code for your lightest color.

Next is the red text. That's your outline. Change it to your medium shade and there's 2 different spots here so make sure to change them both.

Now the blue text. That's your upper background so use the code for your darkest color.

<p><u style="display: block; margin-top: -1em; text-decoration: none;"></u></p><p style="text-align: center; font-size: 9pt; color: #f90; font-family: Arial; font-weight: bold; float: right; margin: 0px 0px 15px 30px; line-height: 14pt; background-color: #FFF0F5; border: solid 2px #FFC0CB; -moz-border-radius: 10px; -webkit-border-radius: 10px; text-align: right; width: 14em; padding: 0px;"><i style="text-align: center; display: block; background-color: #B22222; color: white; font-family: Trebuchet MS; font-size: 10pt; padding: 2px; -moz-border-radius-topleft: 6px; -webkit-border-top-left-radius: 6px; -moz-border-radius-topright: 6px; -webkit-border-top-right-radius: 6px; border-bottom: solid 2px #FFC0CB;">Share This Article</i><b style="display: block; padding: 3px; text-align: center; margin: 0px;"><img align="top" src="URL TO TWITTER LOGO" /> <a rel="nofollow" href="http://twitter.com/home?status=Reading%20this:+http://www.squidoo.com/XXXX" target="_blank" title="Twitter">Tweet it!</a>  <img align="top" src="URL TO STUMBLUPON LOGO" /> <a rel="nofollow" href="http://www.stumbleupon.com/submit?url=http://www.squidoo.com/XXXX" target="_blank" title="StumbleUpon">Stumble it!</a><br /><img align="top" src="URL TO FACEBOOK LOGO" /> <a rel="nofollow" href="http://www.facebook.com/sharer.php?u=http://www.squidoo.com/XXXX/&t=NAME%20YOUR%20LENS" target="_blank" title="Facebook">Like it!</a>    <img align="top" src="URL TO PINTEREST LOGO" /> <a rel="nofollow" href="PINTEREST URL" target="_blank" title="Pinterest">Pin it!</a></b></p><p style="padding: 10px;"></p>

The green text is where you'll put the url's of the pictures you uploaded to your photo sharing site.

The red X's are where you put the last part of your lens url.

The orange text is the name of your lens. Just put one word at a time and if it's more than 3 words, make sure to put %20 between the words (with no spaces).

The blue text is the url for Pinterest. This is a little complicated because you'll have to view the page source of your lens in order to get it. Make sure you're in the live lens and not the workshop. Otherwise, it won't show. Right click on the lens and then click on "view source".