AddThis button in your posts - Revision history

Angela at 13:45, 22 September 2009

Angela — Tue, 22 Sep 2009 13:45:58 GMT

←Older revision		Revision as of 13:45, 22 September 2009
Line 1:		Line 1:
-	~~==Platform==~~	+	{{moved}}
-	~~For use with [[Blogger]] blogs, but probably can easily be adapted to other template based platforms (e.g., [[WordPress]]).~~	+
-		+
-	~~==License==~~	+
-	~~[http://creativecommons.org/licenses/by-sa/2.5/ Creative Commons Attribution Share-Alike 2.5]~~	+
-		+
-	~~==Required Skills==~~	+
-	~~You should be able to edit and save your [[Blogger template]] file.~~	+
-		+
-	~~==Description== What does it do?~~	+
-	This hack, through use of JavaScript, will add a dropdown '''AddThis button''' to each of your posts. [http://www.addthis.com AddThis] is a free social bookmarking sharing tool that provides a ''one button for all'' functionality to your blog.	+
-		+
-	~~==Method==~~	+
-	* Open template file: on your dashboard, go to '''Layout \| Edit HTML''' to open the template file.	+
-	* Create a backup: click '''Download Full Template''' to download a backup copy before editing your template file (just in case).	+
-	* Check '''Expand Widget Templates''' to see the full template.	+
-	* Search for the following lines of code within the template (you will insert the ''AddThis code'', i.e. the hack, right above these lines):	+
-	~~<nowiki>~~	+
-	~~</div>~~	+
-		+
-	~~<div class='post-footer-line post-footer-line-2'></nowiki>~~	+
-	* Insert the JavaScript code so that the result looks like this:	+
-	~~<nowiki>~~	+
-	~~<!-- AddThis Bookmark Button BEGIN -->~~	+
-	~~<script type='text/javascript'>~~	+
-	~~expr:addthis_url = '<data:post.url/>';~~	+
-	~~expr:addthis_title = '<data:post.title/>';~~	+
-	~~expr:addthis_pub = 'JOHNDOE';~~	+
-	~~</script>~~	+
-		+
-	~~<span style='float:right; display:inline;'>~~	+
-	~~<script src='http://s7.addthis.com/js/addthis_widget.php?v=12' type='text/javascript'/>~~	+
-	~~</span>~~	+
-	~~<!-- AddThis Bookmark Button END -->~~	+
-		+
-	~~</div>~~	+
-		+
-	~~<div class='post-footer-line post-footer-line-2'></nowiki>~~	+
-	~~: You'll probably want to replace ''JOHNDOE'' (line 5) with your AddThis username. If you don't have an account, you can register to [http://www.addthis.com AddThis] for free.~~	+
-	* That's it! Just click '''Save Template''' and watch the result.	+
-		+
-	~~==Modifications (optional)==~~	+
-	When using the code as given here, the ''AddThis button'' will be placed in the post footer section, aligned to the right. Optionally, you can place the button in the post header section or elsewhere. Just paste the JavaScript code suitably. Remember to always make a backup of the template file prior to any changes! A broken template file can make your blog unusable and it's quite a mess to repair a template file manually.	+
-		+
-	~~Of course, you can change the ''float:right;'' statement (line 8) to ''float:center;'' or ''float:left;'' to align the button to the center or to the left, respectively.~~	+
-		+
-	~~==Sites Using This Hack==~~	+
-	* [http://www.playpacmanonline.net Pacman Games]	+
-		+
-	* [http://www.cashcratepays.com CashCrate Pays]	+
-		+
-	* [http://mikesmoneyclub.blogspot.com Make Money Online Blog]	+
-		+
-	* [http://ankerboje.blogspot.com Boat Builder's Blogbook]	+
-		+
-	* [http://www.digitalpurview.com/ Digital Purview]	+
-		+
-	~~==See Also==~~	+
-	* [[How to add a digg button to your blogger post]]	+
-	* [[PopMarks - Blog Buttons]]	+
-	* [[Social bookmark new blogger posts using AddThis]]	+
-	* [[Social bookmarking in Blogger beta]]	+
-		+
-	~~[[Category:Hacks]]~~	+
-	~~[[Category:Bookmarking]]~~	+
-	~~[[Category:New Blogger]]~~	+
-	~~[[Category:Platform Unknown]]~~	+

Esuranceitsanimated: /* Sites Using This Hack */

Esuranceitsanimated — Sat, 02 May 2009 19:27:55 GMT

Sites Using This Hack

←Older revision		Revision as of 19:27, 2 May 2009
Line 46:		Line 46:

	==Sites Using This Hack==		==Sites Using This Hack==
		+	* [http://www.playpacmanonline.net Pacman Games]
		+
		+	* [http://www.cashcratepays.com CashCrate Pays]
		+
		+	* [http://mikesmoneyclub.blogspot.com Make Money Online Blog]
		+
	* [http://ankerboje.blogspot.com Boat Builder's Blogbook]		* [http://ankerboje.blogspot.com Boat Builder's Blogbook]

Abhi: /* Sites Using This Hack */

Abhi — Mon, 17 Mar 2008 05:51:58 GMT

Sites Using This Hack

←Older revision		Revision as of 05:51, 17 March 2008
Line 48:		Line 48:
	* [http://ankerboje.blogspot.com Boat Builder's Blogbook]		* [http://ankerboje.blogspot.com Boat Builder's Blogbook]

-	[	+	* [http://www.digitalpurview.com/ Digital Purview]
-	http://www.digitalpurview.com/ Digital Purview]	+

	==See Also==		==See Also==

Abhi: /* Sites Using This Hack */

Abhi — Mon, 17 Mar 2008 05:50:52 GMT

Sites Using This Hack

←Older revision		Revision as of 05:50, 17 March 2008
Line 47:		Line 47:
	==Sites Using This Hack==		==Sites Using This Hack==
	* [http://ankerboje.blogspot.com Boat Builder's Blogbook]		* [http://ankerboje.blogspot.com Boat Builder's Blogbook]
		+
		+	[
		+	http://www.digitalpurview.com/ Digital Purview]

	==See Also==		==See Also==

Harvey at 12:30, 16 February 2008

Harvey — Sat, 16 Feb 2008 12:30:09 GMT

←Older revision		Revision as of 12:30, 16 February 2008
Line 7:		Line 7:
	==Required Skills==		==Required Skills==
	You should be able to edit and save your [[Blogger template]] file.		You should be able to edit and save your [[Blogger template]] file.
-
-	~~==Other Requirements==~~
-	~~You'll probably need an [http://www.addthis.com AddThis] account/username to use this hack. Don't worry, it's free.~~

	==Description== What does it do?		==Description== What does it do?
-	This hack, through use of JavaScript, will add a dropdown '''AddThis button''' to each of your posts. AddThis is a free social bookmarking sharing tool that provides a ''one button for all'' functionality to your blog.	+	This hack, through use of JavaScript, will add a dropdown '''AddThis button''' to each of your posts. [http://www.addthis.com AddThis] is a free social bookmarking sharing tool that provides a ''one button for all'' functionality to your blog.

	==Method==		==Method==
Line 40:		Line 37:

	<div class='post-footer-line post-footer-line-2'></nowiki>		<div class='post-footer-line post-footer-line-2'></nowiki>
-	: You'll want to replace ''JOHNDOE'' (line 5) with your AddThis ~~username. I'm not sure if it even works without a given~~ username. If ~~it does, there will be no need for~~ an ~~AddThis~~ account.	+	: You'll probably want to replace ''JOHNDOE'' (line 5) with your AddThis username. If you don't have an account, you can register to [http://www.addthis.com AddThis] for free.
	* That's it! Just click '''Save Template''' and watch the result.		* That's it! Just click '''Save Template''' and watch the result.

Harvey at 17:26, 15 February 2008

Harvey — Fri, 15 Feb 2008 17:26:28 GMT

←Older revision		Revision as of 17:26, 15 February 2008
Line 54:		Line 54:
	* [[How to add a digg button to your blogger post]]		* [[How to add a digg button to your blogger post]]
	* [[PopMarks - Blog Buttons]]		* [[PopMarks - Blog Buttons]]
		+	* [[Social bookmark new blogger posts using AddThis]]
	* [[Social bookmarking in Blogger beta]]		* [[Social bookmarking in Blogger beta]]

Harvey at 13:28, 15 February 2008

Harvey — Fri, 15 Feb 2008 13:28:37 GMT

←Older revision		Revision as of 13:28, 15 February 2008
Line 12:		Line 12:

	==Description== What does it do?		==Description== What does it do?
-	This hack, through use of JavaScript, will add an '''AddThis button''' to each of your posts. AddThis is a free social bookmarking sharing tool that provides a ''one button for all'' functionality to your blog.	+	This hack, through use of JavaScript, will add a dropdown '''AddThis button''' to each of your posts. AddThis is a free social bookmarking sharing tool that provides a ''one button for all'' functionality to your blog.

	==Method==		==Method==
Line 25:		Line 25:
	* Insert the JavaScript code so that the result looks like this:		* Insert the JavaScript code so that the result looks like this:
	<nowiki>		<nowiki>
-	<!-- ~~ADDTHIS CODE STARTS HERE~~ -->	+	<!-- AddThis Bookmark Button BEGIN -->
	<script type='text/javascript'>		<script type='text/javascript'>
	expr:addthis_url = '<data:post.url/>';		expr:addthis_url = '<data:post.url/>';
Line 35:		Line 35:
	<script src='http://s7.addthis.com/js/addthis_widget.php?v=12' type='text/javascript'/>		<script src='http://s7.addthis.com/js/addthis_widget.php?v=12' type='text/javascript'/>
	</span>		</span>
-	<!-- ~~ADDTHIS CODE ENDS HERE~~ -->	+	<!-- AddThis Bookmark Button END -->

	</div>		</div>

Harvey: /* Method */

Harvey — Fri, 15 Feb 2008 13:17:07 GMT

Method

←Older revision		Revision as of 13:17, 15 February 2008
Line 18:		Line 18:
	* Create a backup: click '''Download Full Template''' to download a backup copy before editing your template file (just in case).		* Create a backup: click '''Download Full Template''' to download a backup copy before editing your template file (just in case).
	* Check '''Expand Widget Templates''' to see the full template.		* Check '''Expand Widget Templates''' to see the full template.
-	* Search for the following lines of code (you will insert the ''AddThis code'', i.e. the hack, right above these lines):	+	* Search for the following lines of code within the template (you will insert the ''AddThis code'', i.e. the hack, right above these lines):
	<nowiki>		<nowiki>
	</div>		</div>

Harvey: /* See Also: */

Harvey — Fri, 15 Feb 2008 13:10:01 GMT

Harvey at 12:50, 15 February 2008

Harvey — Fri, 15 Feb 2008 12:50:32 GMT

←Older revision		Revision as of 12:50, 15 February 2008
Line 1:		Line 1:
	==Platform==		==Platform==
-	~~Specifically for~~ use with [[Blogger]] blogs.	+	For use with [[Blogger]] blogs, but probably can easily be adapted to other template based platforms (e.g., [[WordPress]]).

	==License==		==License==
Line 9:		Line 9:

	==Other Requirements==		==Other Requirements==
-	You need an [http://www.addthis.com AddThis] account/username to use this hack. Don't worry, it's free.	+	You'll probably need an [http://www.addthis.com AddThis] account/username to use this hack. Don't worry, it's free.

	==Description== What does it do?		==Description== What does it do?
Line 15:		Line 15:

	==Method==		==Method==
-	* Open template file: on your dashboard, go to '''Layout \| Edit HTML''' to open ~~your~~ template file.	+	* Open template file: on your dashboard, go to '''Layout \| Edit HTML''' to open the template file.
-	* Create a backup ~~of your template~~: click '''Download Full Template''' to download a backup copy before editing your template file (just in case).	+	* Create a backup: click '''Download Full Template''' to download a backup copy before editing your template file (just in case).
	* Check '''Expand Widget Templates''' to see the full template.		* Check '''Expand Widget Templates''' to see the full template.
-	* Search for the following lines of code (you will insert the ''AddThis code'', i.e. the hack, above these lines):	+	* Search for the following lines of code (you will insert the ''AddThis code'', i.e. the hack, right above these lines):
	<nowiki>		<nowiki>
	</div>		</div>
Line 27:		Line 27:
	<!-- ADDTHIS CODE STARTS HERE -->		<!-- ADDTHIS CODE STARTS HERE -->
	<script type='text/javascript'>		<script type='text/javascript'>
-	expr:addthis_url = '<data:post.url/>';	+	expr:addthis_url = '<data:post.url/>';
-	expr:addthis_title = '<data:post.title/>';	+	expr:addthis_title = '<data:post.title/>';
-	expr:addthis_pub = '~~USERNAME~~';	+	expr:addthis_pub = 'JOHNDOE';
	</script>		</script>

Line 40:		Line 40:

	<div class='post-footer-line post-footer-line-2'></nowiki>		<div class='post-footer-line post-footer-line-2'></nowiki>
-	: You'll want to replace ''~~USERNAME~~'' (line 5) with your AddThis username.	+	: You'll want to replace ''JOHNDOE'' (line 5) with your AddThis username. I'm not sure if it even works without a given username. If it does, there will be no need for an AddThis account.
	* That's it! Just click '''Save Template''' and watch the result.		* That's it! Just click '''Save Template''' and watch the result.

-	==Modifications==	+	==Modifications (optional)==
-	When using the code as given here, the ''AddThis button'' will be ~~place~~ in the post footer section ~~and~~ aligned to the right. Optionally, you can place the button in the post header section or elsewhere. Just paste the JavaScript code suitably.	+	When using the code as given here, the ''AddThis button'' will be placed in the post footer section, aligned to the right. Optionally, you can place the button in the post header section or elsewhere. Just paste the JavaScript code suitably. Remember to always make a backup of the template file prior to any changes! A broken template file can make your blog unusable and it's quite a mess to repair a template file manually.

	Of course, you can change the ''float:right;'' statement (line 8) to ''float:center;'' or ''float:left;'' to align the button to the center or to the left, respectively.		Of course, you can change the ''float:right;'' statement (line 8) to ''float:center;'' or ''float:left;'' to align the button to the center or to the left, respectively.
Line 58:		Line 58:
	[[Category:Bookmarking]]		[[Category:Bookmarking]]
	[[Category:New Blogger]]		[[Category:New Blogger]]
		+	[[Category:Platform Unknown]]

←Older revision		Revision as of 13:10, 15 February 2008
Line 51:		Line 51:
	* [http://ankerboje.blogspot.com Boat Builder's Blogbook]		* [http://ankerboje.blogspot.com Boat Builder's Blogbook]

-	==See Also:==	+	==See Also==
-	* [[~~Social bookmarking in Blogger beta~~]]	+	* [[How to add a digg button to your blogger post]]
	* [[PopMarks - Blog Buttons]]		* [[PopMarks - Blog Buttons]]
		+	* [[Social bookmarking in Blogger beta]]

	[[Category:Hacks]]		[[Category:Hacks]]