Dec 16, 2016

How to Find Your Most Popular Posts in Google Analytics

Determining which posts are your most popular of the yearNow that year is winding down, you should be looking back at your analytics to see which posts ended up being the most popular on your site.  Knowing which posts are your most trafficked is good in terms of determining what kind of content you should be sharing in the future, and also if you plan on doing a “look back” post or a roundup of your most popular posts of the year.

Today I’m going to share how to figure out which posts were your most popular ones. I’ll show you how to determine both your top posts written THIS year, as well as your most popular posts overall. (The posts that saw the most traffic this year, no matter which year they were written.)

Aug 26, 2016

How to Confirm Google Analytics is Installed Correctly

How to confirm GA is correctly installed on your blogGoogle Analytics is the gold standard of traffic monitoring software.  When site owners talk about their monthly page views or uniques, they are almost always referring to their numbers form Google Analytics.  This tracking software is the most accurate and therefore should be installed on your blog if you ever need access to your traffic statistics (don’t EVER use numbers from Blogger!)

However.. this accuracy is only true if you have Google Analytics installed CORRECTLY on your site.   This means the tracking script should be installed only one time, and in the correct location on the page.  If you have duplicate versions of the tracking code or have it installed too early in your head section, you can get falsely inflated analytics.

To demonstrate just how dramatic this inflation can be, I did an experiment on my own site.  I installed a second tracking code into my html and then watched my traffic over the next 4 days.  This is what happened:
Pageviews
My page views doubled and my bounce rate dropped to about 10%.  
As much as I wish those numbers were true.. They are completely an artifact of the duplicated code. 

Aug 13, 2016

How to Use Google Analytics to Determine Why Blog Traffic is Changing

Why Blog Traffic is Changing in Google Analytics

Often bloggers are faced with sudden and/or long term increases or decreases in blog traffic. Determining the cause of these changes isn’t alway the easiest thing to do.   Luckily, the data stored in your Google Analytics account can yield a lot of information about exactly why you page views are changing.

Jul 21, 2016

How to Add An Image Slider to Posts on Blogger


How to create a clickable image slider in a blogger post

Slideshows have been the hot new fad on blogs lately.  Many blogs have them on the sidebar, in the header and within the post content itself.  They are a great way to add a lot of images to a single post without making readers scroll and scroll to the bottom of the page.  They also can help loading time since they only pull one image at a time.  If the images are clickable you can also use sliders as a way of rounding up your old content.. almost like a fancy ‘navigation’ tool.

Jul 19, 2016

How to Paginate A Blogger Post


How to paginate long blogger posts into mutliple pages

Over a year ago, I shared a tutorial on how to split you Blogger post into multiple pages.  

It was an okay way of paginating, but the setup was clunky.  There were a lot of moving parts. It was far from ideal for beginning bloggers.

My Favorite Books For Growing My Blog.


Today I'm sharing my favorite books that I used for growing my blog.

Jul 15, 2016

How to Add Breadcrumb Navigation Menus At the Top of Your Blog Posts

How to Install breadcrumb navigation on your blogger blog
Breadcrumb navigation is becoming a more and more relevant when it comes to a blog’s user friendliness (which trickles down to search engine friendliness).   Most SEO and marketing experts agree that breadcrumb paths are a positive addition to almost any site, especially those where the content can be categorized with some sort of hierarchy. Today we’re going to discuss exactly what breadcrumb navigation is, why it is important and how you can install it on your Blogger blog if you don’t have it already. 

What is breadcrumb navigation?

Breadcrumb paths are the horizontal menus found at the top of a post or page that show the hierarchy of post content.  On Blogger, the cascade is typically:  Home >> Post Category >> Post Title

The term “Breadcrumb” is a homage to the fairy tale Hansel and Gretel where the children left a trail of breadcrumbs to find their way out of the forest.  In that same way, your breadcrumb navigation shows the path of your content. (Although not necessarily in the order you actually got there.) It is more of a roadmap of your site structure to help users navigate through your content.

I have been using breadcrumb navigation on my DIY site for a while now and it has been great for reader retention and increasing pages per session.  This is what they breadcrumbs look like on my blog:
Breadcrumb menu example



Why are breadcrumbs so important? 

Breadcrumb navigation is extremely important especially on large commerce sites.  For example, Amazon prominently uses breadcrumb paths on their site:
Amazon breadcrumb path
and even though the structure of most blogs is not nearly as complex as Amazon, it still can be very valuable for a good user experience and SEO.



BENEFITS OF BREADCRUMBS FOR USER EXPERIENCE:

1. Aids in navigation: Having a breadcrumb path allows for easy discovery of related content. Since most blogs are written chronologically, the “next” and “last” post navigation options may not result in related or relevant content.  They are typically easy to understand for most users (and not as difficult to find as your menus in your header or sidebar) and don’t take up a lot of space or slow down you site.

2. Reduces Bounce Rate: Having a breadcrumb trail available has been proven to reduce a page’s bounce rate. By giving users an easy way to find related content they are less likely to leave after they have finished reading the content on the current page. I also increases time on site and pages per session.

3. Gives user a frame of reference: Many site visitors will not land on a home or menu page but will instead find themselves on a single post.  A quick glance at the breadcrumb path makes it quickly obvious where exactly they are located on your site, relative to the rest of your content.  Additionally, the label the current post is categorized under provides insight into the type of content available on your site.

4. Allows for easy back tracking: Breadcrumb navigation makes it easier for a user to backtrack to a parent directory (or in blogger’s case, to an entire category label).  Since breadcrumb paths tend to narrow down content by increasing specificity, they allow users to ‘back out’ of a post into a larger segment of your site’s content. 

BENEFITS OF BREADCRUMBS FOR SEO:

All of the benefits for user experience chould technically also be listed under SEO benefits, since user friendliness and engagement is such an important factor when it comes to a page’s search engine rank.  There are also some ADDITIONAL SEO perks from having breadcrumb navigation available on your blog independant of user experience.    

1. SERP results markup: Google recently announced that they are updating the MOBILE algorithm to 
show breadcrumb paths instead of URLS on SERPs (Search engine results pages).  To insure your links show up that way requires some additional RDFa markup separate from the HTML for navigation.

With that markup search results now look different on mobile.
Google Fits Breadcrumbs into Search on Mobile 2. Keyword Density: Listing the keyword rich post and category names on each page increases the keyword density on your site.

3. Internal Linking: This navigation system links together similar content via the same category label. These additional links are beneficial SEO wise.

How do you install the breadcrumb navigation to your blog posts?  

It isn’t super difficult if you have a standard template.  Custom templates may be slightly more complicated, but for most blogs it is a few simple lines of HTML added to your template.  This is what this blog’s breadcrumb menu looks like using this tutorial.  Simple breadcrumb navigation

INSTALLING BREADCRUMBS ON A BLOGGER BLOG:

From your Blogger dashboard go to Template and create a backup. Next click on “Edit HTML”   Click INSIDE the window and search for: 
<b:include data='top' name='status-message'/>
Remember you need to click ON THE CODE and THEN hit “Control-F” or else you won’t actually search the HTML! 

Now Replace the highlighted text with the following (we are adding the navigation menu to the top of your posts):
<b:include data='top' name='status-message'/>
<b:include data='posts' name='breadcrumb'/>
Now you want to find this part of your code:
<b:includable id='main' var='top'>
Replace it with the following  (What we are doing here is adding code to generate the actual text in the menu itself) :
<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<!-- No breadcrumb on home page -->
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<!-- breadcrumb for the post page -->
<p class='breadcrumbs'>
<span class='post-labels'>
<a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == "true"'>  » <a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
</b:loop>
<b:else/>
»Unlabelled
</b:if>
» 
<span><data:post.title/></span>
</b:loop>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<!-- breadcrumb for the label archive page and search pages.. -->
<p class='breadcrumbs'>
<span class='post-labels'>
<a expr:href='data:blog.homepageUrl'>Home</a> » Archives for <data:blog.pageName/>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == "index"'>
<p class='breadcrumbs'>
<span class='post-labels'>
<b:if cond='data:blog.pageName == ""'>
<a expr:href='data:blog.homepageUrl'>Home</a>
 » All posts

<b:else/>
<a expr:href='data:blog.homepageUrl'>Home</a> » Posts filed under <data:blog.pageName/>
</b:if>
</span>
</p>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
<b:includable id='main' var='top'>
Finally we need to format how the menu appears.  To do this you have to add the CSS (styling) to the text.  Find: 
]]></b:skin>
Paste the following immediately before it:
.breadcrumbs {
padding:5px 5px 5px 0px;
margin: 0px 0px 15px 0px;
font-size:95%;
line-height: 1.4em;
}
This is CSS markup and you can change the way your menu looks by changing this text.  This is just the most basic formatting, but feel free to play with this code if you are comfortable with CSS.

For example, here is a much more complicated CSS markup you could use instead:
.breadcrumbs {
font-size: 14px;
background: #eeeeee;
background: -moz-linear-gradient(top, #eeeeee 0%, #cccccc 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#cccccc));
background: -webkit-linear-gradient(top, #eeeeee 0%,#cccccc 100%);
background: -o-linear-gradient(top, #eeeeee 0%,#cccccc 100%);
background: -ms-linear-gradient(top, #eeeeee 0%,#cccccc 100%);
background: linear-gradient(top, #eeeeee 0%,#cccccc 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#cccccc',GradientType=0 );
height: 25px;
line-height: 25px;
color: #454545;
border: solid 1px #cacaca;
width: 100%;
overflow: hidden; 
margin-bottom: 25px; 
padding: 0px
}
With that CSS this is what the menu would look like this on my blog:
CSS markup for Blogger Breadcrumb Menu

Depending on how comfortable you are with your template, you also can move your menu to different parts of your post.  I put mine under the title, but you could also put it in the footer or near the comments.  It really will depend on your layout.  The standard location is at the top of your post.

Now you should have everything you need to install this extra navigation option for your readers and will help drive those readers to all the other related content on your site.