Showing posts with label Blogger. Show all posts
Showing posts with label Blogger. Show all posts

Thursday, February 6, 2014

How to Fix / Remove Duplicate Meta Description in Blogger Posts and Homepage

How to Fix / Remove Duplicate Meta Description in Blogger Posts and Homepage

This post shows how to remove duplicate meta description in blogger posts and homepage.

To fix duplicate meta descriptions in blogger follow these easy steps:
    Go To Blogger > Template
    Backup your template
    Click Edit HTML
Search for the following code

<meta expr:content='data:blog.metaDescription' name='description'/>


Now replace above code into

<b:if cond='data:blog.url != data:blog.homepageUrl'>
<meta expr:content='data:blog.metaDescription' name='description'/>
</b:if>

Monday, January 13, 2014

Stop Domain Country - Specific URL Redirecting from Blog

Stop Domain Country - Specific URL Redirecting from Blog

Add the following code to <head> tag to stop Domain Country - Specific URL Redirecting from Blog or Blogspot.
<script type="text/javascript">
var blog = document.location.hostname;
var slug = document.location.pathname;
var ctld = blog.substr(blog.lastIndexOf("."));
if (ctld != ".com") {
var ncr = "http://" + blog.substr(0, blog.indexOf("."));
ncr += ".blogspot.com/ncr" + slug;
window.location.replace(ncr);
}
</script>

Sunday, November 10, 2013

Remove Blog Name from Blogger Post Title

Remove / Delete / Hide Blog Name from Blogger Page Post Titles


You just need to do a simple edit on your template.

Hoto Design -> Edit HTML from Blogger Dashboard.

Find this code from html code. 
<title><data:blog.pageTitle/></title>

and replace it with the following code below
<b:if cond='data:blog.pageType == &quot;index&quot;'> 
<title><data:blog.title/></title> 
<b:else/><title><data:blog.pageName/></title></b:if>
After replacing the code, save the template. That is it!

Friday, November 8, 2013

How to Add / Put a Background Image to Blogger with Pictures

How to Add / Put a Background Image to Blogger with Pictures

You can easily add / put your own background image or picture to your Blog using this tutorial.

How to Add a Background Image to Blogger

To Change Background Image:
  • Goto -> Dashboard menu from the blogger and then select the template menu

  • Blogger Template Designer page will be open and select the background option from that menu.

  • Upload your background image which you want to upload using upload menu.


  • Browse background image and upload it and save your blogger template.
After saving your template you can open your blog, your updated background imate will be shown..


Tuesday, November 5, 2013

Fix Duplicate Meta Description Tags in Posts and Homepage from Blogger

Fix Duplicate Meta Description Tags in Posts and Homepage from Blogger

Learn how to remove Duplicate Meta Description Tags from Blogger. This tutorial will helps you to remove duplicate Meta Description Tags in blog posts and homepage.

Backup your template and Follow these easy steps:
 Go To Blogger -> Template
Click Edit HTML
Search for the following code,
<b:if cond='data:blog.metaDescription != &quot;&quot;'>
<meta expr:content='data:blog.metaDescription' name='description'/>
</b:if>

Now replace the old code with following set of codes..
<b:if cond='data:blog.url != data:blog.homepageUrl'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.metaDescription != &quot;&quot;'>
  <meta expr:content='data:blog.metaDescription' name='description'/>
</b:if>
</b:if>
</b:if>
Now save your template and open your blog’s homepage and check source code. Its all done..

Thursday, September 19, 2013

How to Hide or Delete Blog's Title, Description in Blogger Header

Follow below steps to hide or delete blog title and description from blogger header.

Step 1 : go to blogger dashboard

Step 2 : click on template

Step 3 : click on edit template



Hide Blog Title:

To do this login at Blogger.com and click on Layouts link on Dashboard. Then click on Edit Html subtab of Template tab. First backup your template. 

Then scroll down to this code :
#header h1 {
margin:5px 5px 0;
padding:15px 20px .25em;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em;
font: normal normal 200% Georgia, Serif;
display:none; /*<---Insert this line*/
}


Hide Blog Description:

To hide the blog description scroll down to this code in the blog template :

#header .description {
margin:0 5px 5px;
padding:0 20px 15px;
max-width:700px;
text-transform:uppercase;
letter-spacing:.2em;
line-height: 1.4em;
font: normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif;
color: #999999;
display:none; /*<---Insert this line*/
}

Saturday, August 31, 2013

Related Post Widget Without Thumbnail / Text Links for blogger

Learn how to add Related Post - Without Thumbnail (Text only) Widget for blogger.

One of the best ways to keep your readers spend time with your blog is to link new posts directly to other related posts that you've previously written or by simply displaying featured or related posts at the end of your article. Follow the instructions to know how to add the Text Related Post to your blog.

GOTO - Blogger -> Layout -> Add a Gadget

In Gadget menu Add a new Javascript/HTML widget and paste the following code.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<script src="http://blogger-related-posts.googlecode.com/files/related-posts-widget-1.0.js" type="text/javascript"></script>
<script type="text/javascript">
relatedPostsWidget({
   'containerSelector':'div.post-body'
   ,'loadingText':'loading...'
});</script>


Notè: Thè widgèt usès post labèls to display rèlatèd post links. Your rècènt posts will show up instèad, if labèls arè missing. Makè surè you'vè dèfinèd thèm. Hèrè's how to add thè codès if you prèfèr: 

From your bloggèr dashboard, click "Layout" on thè lèft panèl. 

Click "Add a gadgèt" and scroll down until you sèè HTML/JavaScript. Opèn it. 

Pastè thè abovè codès in thè contènt arèa thèrè. Savè it.

That's it. Your rèlatèd posts should show up at thè bottom of your articlè. It should hèlp you incrèasè pagè vièws and in turn dècrèasè bouncè ratès - Both positivè SèO signals.

Tuesday, June 25, 2013

Remove Navigation Bar on Blogger

Learn how to remove navigation bar on Blogger.

Note: Take template backup on before making changes to template
1.Login to your blogger account

2.Goto Layout option from Dashboard menu


3. Now choose Edit Html


4.You will see your template code there.


5.In that template code find using Ctrl+f button.

]]></b:skin>

and replace it with

#navbar-iframe,#navbar { display: none !important; }
]]></b:skin>

6. Save your Template.

Sunday, June 23, 2013

Add Star Ratings to Blogger Posts

Learn how to add star ratings to blogger posts:
  • Login your blogger account.
  • Go to the Edit HTML page in your blog's dashboard, and ensure you have checked the "expand widget templates" box.
  • Type following code in search box or Press Ctrl + F to find following code,
<div class='post-footer-line post-footer-line-1'>
  • If you cannot locate this, search for the following instead:
<p><data:post.body /></p>

Immediately after this line (either the post-footer or post.body), add the following section of code:
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <span class='star-ratings'>
    <b:if cond='data:top.showStars'>
    <div expr:g:background-color='data:backgroundColor' expr:g:text-color='data:textColor' expr:g:url='data:post.absoluteUrl' g:height='42' g:type='RatingPanel' g:width='180'/>
    </b:if>
    </span>
    </b:if>

Next, find this line in your Blogger template (this should be a little further down):
    <b:include name='nextprev'/>

Just after this line, paste the following section of code:
    <b:if cond='data:top.showStars'>
    <script src='http://www.google.com/jsapi' type='text/javascript'/>
    <script type='text/javascript'>
    google.load("annotations", "1");
    function initialize() {
    google.annotations.createAll();
    google.annotations.fetch();
    }
    google.setOnLoadCallback(initialize);
    </script>
    </b:if>

Then save your template.

Now when you view a post page on your blog, you will see the star ratings in your posts! Happy Blogging!