AddThis Analytics for Share Buttons in your Blogger Blog

It’s heartening to know that others read and are helped by your articles and blog posts. According to eHow, my articles have about 20,000 unique views. Google indicates a smaller number for my blog. When readers share articles or posts, they do so because of the value of the information or story, and the author benefits because the site is brought to the attention of search engines when such sharing activity occurs.

Thus, many months ago, I had joined such sites as StumbleUpon (SU), Digg and SlashDot, and used them to promote my articles. Ehow facilitated sharing, but I also wanted to add share buttons from these and other sites to my blog. I installed the SU Badge (SUB), and when Google touted their Share Buttons (GSB) with Gmail, Blogger, Twitter, Facebook, and Google Buzz, I incorporated them also. No matter how I tried to vary the code or what guidance I gleaned from the forums, these GSB appeared in a row below the SU Badge (SUB) rather than next to it, which didn’t look right to me. The prospect of individually adding more share buttons seemed too cumbersome.

AddThis, with analytics enabled, would give readers of my blog a wider variety of ways to share with others as well as the convenience of e-mail and printing the post, and it would keep track of sharing activities and provide helpful data to me. Aesthetically, I prefer the AddThis setup over GSB because the former display in color. GSB are shown in shades of gray, and individual buttons only colorize when the cursor hovers.

There are defaults and a host of customization available for AddThis. I endeavored to incorporate AddThis buttons, and remove the redundant SUB and GSB from my posts. I am not an expert in HTML, so this involved lots of trial and error, but I wanted to share with you how I accomplished this.

Start at AddThis and Join Now, to create your account. Scroll down to Select your service and Select a style. Mine is a Blogger blog, so I chose Blogger, and a toolbar, and checked Enable clickback analytics.  Click Get the code, and it takes you to another page.  Click Copy Code and it’s automatically copied to your clipboard.  Log into your Blogger blog. I’m using the old layout, so from the Dashboard, click Design, then Edit HTML and check Expand Widget Templates.

Always download the template before editing. It just takes a moment, and will save you time and aggravation if you make an error. An additional helpful step is to save a text file of the expanded template (Select All > Copy > Paste into a new document) to make editing easier. I add different types OF emphasis and color for newly inserted code to make it stand out, and I place a note about the new code on the first page of the template document—its name, color of text and on what page it is found—and incorporate the code’s name into the document’s name to make it easier to find the document with a certain new code, for example: Template-08-30-2010-AddThis.doc.

The AddThis code must follow <“div class=’post-footer’"> [Note: quotes are added to lines of code so they will be displayed in the blog: otherwise, the website treats them like any other HTML code and hides them from view.]. Using Edit > Find in the text template of my blog, the line was located near the top of page 14, which appears to be not quite halfway through the template.

From the approximate location of the line of code in my template document, I was able to find it in the corresponding area of the expanded template, pasted the code—which was copied to my clipboard from the website, NOT from a template document—clicked Save and was pleased to see no errors when viewing the blog. Note that whenever you copy code from a Word document, lots of unwanted code comes along, too, so paste the code into a text file or a Writer file from OpenOffice.org, and copy again from there to paste into the template.

Time to get rid of the SUB and GSB. I wasn’t exactly sure where their code ends and the rest of the template continues: I had inserted <"!-- STUMBLEUPON BADGE BEGIN -->" and <"!-- GOOGLE SHARE BUTTONS BEGIN -->" at the beginning of each (I thought), but nothing at the end.
Two lessons learned: Always insert an end comment so there will be no question where the code ends;
When you find the existing code after which new code is to be added, add the “begin” comment AFTER that line of code.

As I said, don’t forget to save the template before you make any changes, no matter how small! I saved the template, and then deleted the code AFTER my BEGIN comments for SUB and GSB (to leave place markers, just in case), but did not save the template. The preview of the blog showed that the whole body of text was gone. Uh oh.
I returned to the template and made several alterations in the code, but the text of each blog post was still missing.  After making so many edits, I wasn’t sure how much code belonged to SUB and GSB. Remember how I said at the beginning that one should always download the full template before editing? To the rescue! I now uploaded the template that has AddThis installed AND shows the body of text. Whew. The other solution would be to make absolutely certain when you last saved the template and what the blog looked like at the time: if you haven’t saved it since making several edits, you can Clear Edits, which will remove all edits back to the time the template was saved—not back to the very beginning when you initially designed your blog!

After successfully inserting AddThis and correctly removing the SUB and GSB (after hours of trial and error—I did say I’m not an expert in HTML), here’s what the section of code looks like:

I left the comment lines in place for now: in case you want to insert the SUB and/or GSB, the exact locations (and vital lines of blog code to keep) are clear.

I wondered what types of alterations were possible within AddThis, so I went to Customizing AddThis  and decided on AddThis Toolbox and Choosing your Destinations for a large assortment of share buttons. Because I found out about most of these sites from seeing their share buttons on others’ sites or articles, perhaps my readers will be introduced to new destinations and be interested to join one or more.

AddThis only gave part of the code, down to the last “/div.”  I changed Destinations to Bookmark and Share. Here’s the full code as it must be inserted, with comments:
Notice that you still need the last bit of the default AddThis code at the end of the section.

The option to e-mail was now presented twice at the end of each post—under Special Services (the section just completed) and again above Links to this post. I wanted to keep the e-mail button that is part of AddThis analytics, and remove the latter, which had been set up in Blogger. This is easily accomplished. Sign into your Blogger blog, click on the Page Elements tab, just to the left of the Edit HTML tab. In the box labeled Blog Posts, click Edit, which causes Configure Blog Posts to pop up. Here, I unchecked Show Email Post Links. Beneath that, the option to Show Share Buttons refers to GSB, not AddThis Share Buttons, so I unchecked that as well (just for neatness, because I’d already removed GSB’s code), and clicked Save at the bottom of the pop-up.


Finished! AddThis Share Buttons have been added, previous—now extraneous—buttons have been removed, and the blog correctly displays as intended.

Bing Webmaster Tools

 
Bing is getting more recognition on the Internet, and to distinguish itself from the others, this search engine advertises itself as a decision engine. Bing is available on the iPhone and is the search engine that Facebook uses. This week, WebProNews reported that Bing will provide about one third of Yahoo! Search results, and that Bing’s redesigned webmaster tools are now available.

With Bing’s rise in importance and new webmaster tools, I wanted to get Bing’s feedback about this site, and learned that I needed to go to Bing Webmaster Tools Add a Site and do just that.*

Adding this blog’s address was just the beginning. Bing needed to be sure that I own the website before they would give me any information about it. They gave me a 32-digit authentication code and wanted me to prove ownership by adding the code to my site.

Back here on this Blogger blog, I opened the Dashboard, chose the “Design” tab and then selected “Edit HTML” and went down to “Edit Template.” Before even thinking about adding a meta tag to the HTML, as recommended I made a backup copy** of the template by clicking “Download Full Template” and filing it in my Blog folder.

Next, I copied my assigned meta tag code from the Bing site, came back to this blog, still open to “Design/Edit HTML” and pasted the meta tag in the blog’s template, immediately after "head" (quotes replace < and >, absent from this paragraph so the word will display) in the HTML code. After doing this, don’t forget to click the box on the lower right that says “Save Template.”

With the meta tag in place, Bing quickly authenticated my website, and now—finally—I could get feedback on my site. To do so, go to Bing Webmaster Tools, look down for SITES and click on the name of your site. That takes you to the Dashboard, which presents the site’s activity: Clicks, Impressions, Pages Indexed, Pages Crawled, Pages with Crawl Errors, Index Summary, and Traffic Summary. Data for my website showed that it had not yet been crawled by Bing. I started this blog in April and don’t get a lot of traffic—invite your friends please! ;) It’s only three months later now, so this finding isn’t surprising.

When I initially took the steps of authenticating my website and looking at the webmaster tools last month (I’m going back through them as I write this), there was a section called “Related tools” on the left of the webmaster page, under “Resources.” I no longer see this feature in the same place on Bing but, as I mentioned earlier, Bing has redesigned their webmaster tools.

The HTTP Compression and HTTP Conditional GET Test Tool is one item that previously had been available in the "Resources" section.  “What’s that?” you ask. I learned that the use of HTTP Compression and HTTP Conditional GET tool, if available in your browser, is for decreasing “bandwidth usage.” Bing wants to send only information that’s necessary/unique from the crawled site to the search engine, so that it can make the most of the information gleaned from each website it crawls.
 
Think of HTTP Compression as a tool that works similarly to compressing a document. Just as large files may need to be compressed into smaller (zip) files before an e-mail server will allow the attachment, HTTP Compression makes smaller, more compact files of data so that a search engine’s bots can communicate more efficiently between the site and the search engine.

HTTP Conditional GET is used by search engines to determine whether or not to crawl a site. The search engine will crawl and download a site (GET) only if the site has changed since the last time it was crawled (the condition in Conditional GET).  I used this tool to check my site. Results show that HTTP compression is enabled, HTTP conditional GET is not. These findings won’t change anything I do with this site—I just wanted to check it out.

Another item that used to easily be found on the webmaster site is the Backlinks Tool, which reveals—obviously—backlinks to your page, whether from other sites or from within your own pages. Lots more information can be found at this site as well.

Because I’m naturally curious and wanted to begin to become familiar with Bing’s webmaster tools, I investigated and decided to share what I found. If you don’t follow this particular post, don’t worry. Just know that there are webmaster tools available from Bing, and there is a process to get your site authenticated so you can use them.

I’ll check back from time to time to see if this site has been crawled by Bing, and to investigate whatever else Bing Webmaster Tools can offer. Checking the information from the HTTP Compression and HTTP Conditional GET Tool need not be repeated, as far as I’m concerned, but the Backlinks Tool will be revisited.

~~~
* You may recall that I had submitted this blog’s URL to Bing on April 28, but that was to bring it to the attention of Bing sooner rather than waiting for its routine crawling of the Internet to discover it. A RedGage member, commenting from the RedGage site on “Search Engines, AdSense Analytics and Facebook” had asked where one could submit URLs to search engines. Here are the sites where you can manually add URLs to Google, Bing, and Yahoo!  There's a place to add one URL (at a time), then a place for "Comments," which would be the title of your site or article, and finally these search engines want to be sure that a human--not a robot--is submitting the information, you need to enter what is written. If you make a mistake, you will get another chance with a new combination of letters and/or numbers.

~~~
** The backup template is easily imported into Blog’s template, found in the Dashboard under “Design/Edit HTML,” if necessary or desired. I also copied the entire expanded template into a Word document, as a backup to the backup—today I tried and failed to open the exported template, and don’t know if that’s due to my computer or the file itself. Of course, now I remember that Word sends extraneous code along with copied text, so I’ll copy the template into notepad, and make future backup copies in notepad to save this step.
If you ever needed to import a previous template and the import tool didn’t happen to work, you could always use your backup text file:

--Open the expanded template document. If it’s in Word, select all, copy all, and paste it to notepad to remove Word’s extraneous code. If it’s already in notepad, select all and copy all.
--Return to the blog and go to “Design/Edit HTML.”
--Click to show the expanded template, which contains the change you no longer want.
--Delete the entire code.
--Paste the “old” code back into the expanded template box and click “Save Template.”

Search Engines, AdSense Analytics and Facebook

If no traffic is driven to my pages, there will be no earnings. To help speed up the process by which the search engine "finds" my articles, I have previously added the URL of each article to Google. I just did the same with Bing.

AdSense Analytics are available for anyone who has an AdSense account and wants to sign up, so I did. However, Analytics are only be available for this blog and for Snipsly; not for Xomba, SheToldMe, or RedGage because those sites provide space to write WYSIWYG (What You See Is What You Get) but don't allow the writer to see or edit the HTML code that is behind WYSIWYG. From now on, when writing for Snipsly, I'll need to add my Google Analytics tracking code.

To receive up-to-the-minute announcements via Facebook, I found (and clicked "like" to become a fan of) Google Adwords, Google Analytics, Xomba, Kontera, and RedGage. RedGage doesn't seem to have much activity, so may not be sending helpful updates. Snipsly and SheToldMe are absent. There's supposed to be a way to link one's Facebook account with RedGage, but I've not be able to do that. Has anyone had success with this? I uploaded four photos of my African violets to RedGage. Take a look!