MatrixAdapt | Logiciel de gestion d'Entreprise, Création et référencement des sites web

seo Dofollow your comment 2013

Seo Master present to you:

By default blogspot templates make the urls in the comment fiedls as no follow.Means search engines wont follow these links.In my blog the comments field is followed.Means you will get inlinks to your blog(which are followed by search engines).This may encourage commentors to comment on your blog.So if interested you can comment on my blog.Spammers please dont hurt me..

Ok now i should tell you how to implement the do follow attribute in your blog
As i always say open up your template html.



<a expr:href='data:comment.authorUrl'rel='nofollow'<data:comment.author/></a>

Delete the one in Bold and you are done..

I suggest you to remove all the rel='nofollow' tags in your template so that you can make sure of it..

I have removed all the nofollow tags in my blog template..So comment on.I am waiting for yours.Any suggestions questions or anything will do.. Update: The comments here are no longer DO FOLLOW

2013, By: Seo Master

seo How To Remove Blogger Navbar? 2013

Seo Master present to you:

When browsing Blogger powered weblogs hosted on blogspot.com domain or custom domain, there is always a NavBar (Navigation Bar or Banner) that appears on top of the blog. The Blogger NavBar contains Search Blog textbox, Flag Blog to notify Blogger about objectionable contents on the blog, Next Blog link to visit another blog randomly, plus links to create a blog or sign in to Blogger.

Here are the steps to remove the Blogger Navigation bar /Blogger Nav Bar

1.Login to your blogger account
2.From your Dashboard opt for Layout
3.Now choose Edit Html
4.You will see your template code there.
5.In that template code find



]]></b:skin>

and replace it with



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

6.Now opt for SaveTemplate.
7.Affter saving the template take a look at your template and your blogger navigation bar must have disappeared. :)

If you still cant figure this out see the video below. See the video below...

2013, By: Seo Master

seo How to change the Blogger Favicon ? 2013

Seo Master present to you:

How To While using IE Firefox or Opera you will see an icon on the tab when u visit a page.This is called favicon.By default blogspot blogs have a favicon which looks ugly.See it here at the top of the post.So how to remove it?

Goto Blogger Template>Edit Html
There find the title tag which looks like



<head>
<title> <data:blog.pageTitle/> </ title>
...
 <link href='URL.ico' rel='shortcut icon' type='image/x-icon'/>
<b:skin><![CDATA[/*

and immediately after that add the following code after proper editing
Remember to replace URL of your icon file file with your icon file's url

2013, By: Seo Master

seo Remove Subscribe to: Posts (Atom) Link 2013

Seo Master present to you:

How to Remove "Subscribe to: Posts(Atom)" Link From Blogger ... Remove “Subscribe to: Posts(Atom)” Link From Blogger. You can locate this links bellow every post or page, near to page navigation.
In every post page there is a link like “Subscribe to: Post Comments(Atom)”
In every page other then post page it may be like “Subscribe to: Post (Atom)”

How to Remove "Subscribe to: Posts(Atom)" Link From Blogger Blogs : Remove "Subscribe to: Posts(Atom)" Link From Blogger.

1. Login to your Blogger Account

2. Go to Design > Edit HTML

3. Click on the Check box which says "Expand Widget Templates"

4. Now Find this line of code in your template( Use Ctrl + F )



<b:include data='feedLinks' name='feedLinksBody'/>

5.Delete this line
6.Save your Template and the "Subscribe to: Posts(Atom)" link will be completely removed from your Blog.

Or

HOW TO HIDE THIS LINKS?

Go to Blogger Dashboard > Design tab > Edit HTML tab
Check Expand Widget Templates checkbox
Then serach for the following line of code and remove it.
```
<b:include name='feedLinks'/>
```
Finally Save Your template.

HOW TO HIDE THIS LINKS BY CSS?

There is another way to hide this links By CSS

You just copy the below code and paste it before ]]></b:skin> tag

.blog-feeds{display:none !important;}

Please Leave Your Valuable Comments about this post and subscribe to feed for latest Updates!

2013, By: Seo Master

seo Popular Posts Widget Grid Layout 2013

Seo Master present to you:

Template Hacks. A few days back, I published the JavaScript version of the Recent Posts widget, and I loved the Grid Layout of the Widget. One of the most popular Widgets used by Bloggers is Blogger’s Official Popular Post Widget. So I decided to edit the gadget, and give it the Grid Style.
How does the Gadget Look like after tweaking it?

How To Apply This Tip Hack?

So Here are the Steps to make your Popular Posts Widget act like an Image Grid

1. Go to the Layout Page and add the Popular Posts Gadget, if you haven’t already added it.

2. Edit the Gadget Settings so that it displays the Thumbnails and not the Snippet

3. Now Go to Template/Design > Edit HTML . DO NOT Click on the Expand Widget Templates checkbox. Leave it unchecked, and look for PopularPosts1 (Do a Ctrl +F to find it in your template) and you will get some line like this

<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'/>

4. Change This line to

<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
<b:includable id='main'>
  <b:if cond='data:title'><h2><data:title/></h2></b:if>
  <div class='widget-content popular-posts'>
    <ul>
      <b:loop values='data:posts' var='post'>
      <li>
        <b:if cond='data:showThumbnails == "false"'>
          <b:if cond='data:showSnippets == "false"'>
            <!-- (1) No snippet/thumbnail -->
            <a expr:href='data:post.href'><data:post.title/></a>
          <b:else/>
            <!-- (2) Show only snippets -->
            <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
            <div class='item-snippet'><data:post.snippet/></div>
          </b:if>
        <b:else/>
          <b:if cond='data:showSnippets == "false"'>
            <!-- (3) Show only thumbnails -->
            <div class='item-thumbnail-only'>
              
                <div class='item-thumbnail'>
   <a expr:href='data:post.href' expr:title='data:post.title'>
    <b:if cond='data:post.thumbnail'>
                    <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
       <b:else/>
        <img alt='' border='0' expr:height='data:thumbnailSize' src='http://www.matrixar.com/-erTXCq61ULM/TmHYAQBZ0GI/AAAAAAAACCs/6cBX54Dn6Gs/s72-c/default.png' expr:width='data:thumbnailSize'/>
       </b:if>
                  </a>
                </div>         
             </div>
            <b:else/>
            <!-- (4) Show snippets and thumbnails -->
            <div class='item-content'>
              <b:if cond='data:post.thumbnail'>
                <div class='item-thumbnail'>
                  <a expr:href='data:post.href' target='_blank'>
                    <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
                  </a>
                </div>
              </b:if>
              <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
              <div class='item-snippet'><data:post.snippet/></div>
            </div>
            <div style='clear: both;'/>
          </b:if>
        </b:if>
      </li>
      </b:loop>
    </ul>
    <b:include name='quickedit'/>
  </div>
</b:includable>
</b:widget>

5. Save your Template

6. Now Go to Template Designer > Advanced > Add CSS and paste the following CSS snippet there, and apply to your Blog

.popular-posts .item-thumbnail{float:left;}
.popular-posts ul{padding-left:0px;}
.popular-posts ul li {list-style-image: none;list-style-type: none;display:inline;}

The image URL present in the Widget Code is the Default Thumbnail which will be displayed if the post doesn’t have a thumbnail associated with it. You can modify it to get a custom default thumbnail. You can spice up the CSS to make the grid look more eye catching. I would leave that to you :)

Reverting Back to the old one

If you are not satisfied by the way it looks, then revert it back. Here are the steps:

Just Remove the Popular Posts Widget from the Layout Page.If you need the original version, then add it back again
Remove the CSS which you added to Template Designer > Advanced > Add CSS
That’s it.

I think that this Hack would work out well on Recipe and Photography Blogs. Try it out, and let me know if it is useful :)

Source: http://www.bloggerplugins.org

2013, By: Seo Master

seo Resize Popular Posts Image thumbnails 2013

Seo Master present to you:

Resize Blogger popular post thumbnails, I got a question in a comment how to change the thumbnail size in Blogger popular post gadget, in my Trim Blogger popular post snippets right article. Here's how to do it, hack is similar to my previous popular post hacks.

DEMO In Page

Code: CSS
apply this hack manually by adding below CSS code just above/before ]]></b:skin> tag in your template,



#random-posts img{float:left;margin-right:10px;border:1px solid #999;background:#FFF;width:36px;height:36px;padding:3px}
#recent-posts img{float:left;margin-right:10px;border:1px solid #999;background:#FFF;width:36px;height:36px;padding:3px}
#PopularPosts1 img{float:left;margin-right:10px;border:1px solid #999;background:#FFF;width:36px;height:36px;padding:3px}

seo Pinterest Integration Tips for Bloggers 2013

Seo Master present to you:

The internet has fallen in love with Pinterest, and what’s not to love? This fast-growing online destination offers a smorgasbord of images to appease the visually-crazed, and is just social enough to make it a great networking tool. Thanks to the combination of these two elements, Pinterest has become an object of interest to bloggers far and wide.

Even if you don’t have a presence on Pinterest, there is a great chance that your audience does. This means you at least need to give it consideration. For those who are ready to go, the following tips will explain how you can effectively integrate Pinterest with your blogging efforts.

1. ADD A “PIN IT” BUTTON TO YOUR BLOG POSTS

If you follow trends across the social web at all, you knew it wouldn’t be long before Pinterest came out with a button that connects it to the rest of the world. With the Pin It button, you can provide an easy way for people to share your content on their Pinteret boards. Luckily, adding this button to your post is a simple process.

Login to your Pinterest account.
Grab the button code from the “Goodies” section.
Add the code to the HTML area of your blog post and you’re done!
2. MAKE YOUR POSTS PINTERST-FRIENDLY

You’ll see a few videos here and there, but the main activity on Pinterest is sharing images. This is why I highly recommend including images in most, if not all of your posts. If you include at least one image, then readers can pin your entire blog post to a board. You definitely want this type of exposure, so when you go to crank out that next post, don’t forget to complement it with a high quality image or two.

3. USE A PINTEREST PLUGIN

If WordPress is your blogging platform of choice, then you may want to consider using a plugin to support your integration efforts. There are quite a few to choose from, with Pinterest Plugin, Pinterest Galleries, and Pinterst Follow Button being some of the most popular options. While there are no official plugins available for Blogger, there are tools you can use to add Pin It and Follow buttons to your blog.

4. ADD BOARDS TO YOUR BLOG

Most bloggers focus on getting their blog posts on Pinterest, but you can also reverse this and add boards to your blog. There are a couple of ways to do this. You can use a plugin like Pinterest RSS Widget, or code the functionality into your theme, which of course, requires some programming knowledge. You could also use a service like IFTTT, a tool that automates the process for blogs using Pinterest-inspired themes. Keep in mind that the aforementioned methods are all specific to WordPress.

5. NETWORK WITH FELLOW PINNERS

Pinterest may not be the conventional social network, but it falls in the same category as the rest of them nonetheless. You can juice this site for its rich networking capabilities by connecting with other users. Comment on their pins. Like them. Repin them. This is the same approach you want to take when marketing on any social network. Spread the love, steer clear of the spammy advertising tactics, and rubbing shoulders with the Pinterest faithful could send some nice traffic to your blog.

6. TRACK YOUR EFFORTS

So you’ve made the move to integrate Pinterest with your blogging efforts. How’s everything going? Hopefully you have a good tracking system that will allow you to find out. When combing over your reports, you mainly want to find out who is coming in from Pinterest, and what they are doing once they reach your blog. Whether it’s JetPack for WordPress or the Blogger-friendly Google Analytics, there are several tools that can provide these insights.

HOW TO ADD THE PINTEREST PIN IT BUTTON TO BLOGGER?

ADDING PIN IT SCRIPT FOR BLOGGER

Login to Blogger Dashboard > Choose your Blog and Click the More Options Dropdown
Select the Template > Click on Edit HTML > Proceed
Check/Tick the Expand Template Widgets checkbox

Search for </head> and place the below code before it!

<script type="text/javascript" src="http://bloggerblogwidgets.googlecode.com/svn/trunk/w2b_blogger_pinit.js"></script>

ADDING PIN IT BUTTON SCRIPT

Search for <data:post.body/>

Place the Bellow Pin It Button script before or after it

- If you add the below code before the <data:post.body/> then it will appear the Before the Post Content.
- If you add the below code after the <data:post.body/> then it will appear the After the Post Content.

<b:if cond='data:blog.pageType == &quot;item&quot;'> 
<div expr:id="&quot;w2bPinit-&quot; + data:post.id" style="display: none;visibility: hidden;height: 0;width:0;overflow: hidden;" class="w2bPinitButton"> 
	<data:post.body/>
	<script type="text/javascript">
		w2bPinItButton({ 
			url:"<data:post.url/>", 
			thumb: "<data:post.thumbnailUrl/>", 
			id: "<data:post.id/>", 
			defaultThumb: "http://www.matrixar.com/-YZe-IcKvGRA/T8op1FIjwYI/AAAAAAAABg4/j-38UjGnQ-Q/s1600/w2b-no-thumbnail.jpg", 
			pincount: "horizontal" 
		}); 
	</script> 
</div> 
</b:if>

defaultThumb Set the Default Thumbnail Image URL.

pincount

Set the Pin it Count Style.

ADDING STYLINGS

Add the below styling before ]]></b:skin> tag.

.w2bPinitButton{ 
	float: left; /* Customize left/right */ 
	margin-right:10px; /* Customize margin-left/margin-right */ 
	display: block; 
	padding:4px;
}

Customize the Float and Margin properties according to your need.

I hope this Pin it Button is helpful to you. Please share it with your Friends and Leave your Comments.

Source: way2blogging.org

2013, By: Seo Master

seo Custom Permalinks for Blogger 2013

Seo Master present to you:

This feature is currently available in Blogger’s Draft Version. So if you would like to check it out, head straight over to http://draft.blogger.com and create a new post. In the post options you will see a permalink option.

If you select the “Automatic URL” (the default option), then Blogger will generate the permalink on it’s own. If you want to specify a custom URL, opt for the “Custom URL” option and you can enter your custom post permalink over there. It will allow you to enter alphabets, hyphens and underscores. It will just ignore underscores. So I just used a combination of hyphens and alphabets to create my post permalink

The Final Permalink will be something like

http://your.blogspot.com/yyyy/mm/the custom URL that you specified

In my case it came to something like;

http://myblog.blogspot.com/yyyy/mm/custom-permanent-link.html

2013, By: Seo Master

seo How to make custom 404 error page 2013

Seo Master present to you:

"The 404 or Not Found error message is a HTTP standard response code indicating that the client was able to communicate with the server, but the server could not find what was requested." In simple words the page that will be displayed when the actual page is not found is called a 404 Error Page. Till now Blogger’s error page was a plain old design with more of orange in it and was not customizable. Now Blogger Error pages use the same template . This would help template designers in making up custom 404 Pages.This tutorial will help you in setting up a Custom 404 page for your Blog. How to make custom 404 error page

By Default, your Blogger Error page will display this error message

You can Change this message to something else from the Blogger Settings.

The option is there at Settings > Search preferences > Custom Page not Found

If you want more than just a message, then we will have to fill up this text area with some HTML Code.. This is how my Error page Looks like

Instructions

Login to your Blogger account and go to the Template page and proceed to Edit HTML
Click on the Expand Widget Templates Check box so that your entire template comes up

Now Look for </head> and immediately before that paste this snippet

<b:if cond='data:blog.pageType == "error_page"'>
<style type="text/css">
.status-msg-wrap {
    font-size: 100%;
    margin: none;
    position: static;
    width: 100%;
}
.status-msg-border {
    display:none
}
.status-msg-body {
    padding: none;
    position: static;
    text-align: inherit;
    width: 100%;
    z-index: auto;
}
.status-msg-wrap a {
    padding: none;
    text-decoration: inherit;
}
</style>
</b:if>

This code snippet will reset the default styling given to the Blogger Message Wrapper.

Save the template and go to a page on your blog which doesn’t exist.
You should be able to see the change now. The grey background and the border around the 404 status message would no longer be there.

Now Let’s see how we can improve the look and feel of our 404 page. I would suggest you to use inline CSS styles to improve the look and Feel of your 404 message.Here is a sample HTML template which you can paste into the text box atSearch preferences > Custom Page not Found.

<h3>Your requested page was not found</h3>
<p>Sorry, we cannot find the page that you are looking for. It might have been removed, had its name changed, or is temporarily unavailable.<br/>
Please check that the Web site address is spelled correctly.</p>
<b>Other things to try:</b><br/>
<ul>
<li>Go to our <a href="/">home page</a>, and use the menus or links to navigate to a specific post.</li>
<li>
<form method="get" action="/search">
<table width="100%">
<tr>
<td><input type="text" style="width:95%;padding:2px;" value="Search this blog.." onfocus="if (this.value == &quot;Search this blog..&quot;) {this.value = &quot;&quot;}" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Search this blog...&quot;;}" name="q"></td>
<td><input type="button" Value="Search"></td>
</tr>
</table>
</form>
</li>
</ul>

It will give you something similar to my 404 page.
If you are creative, you can add more stuff to the 404 pages. You can find a list of really creative 404 pages on HongKiat for inspiration

Detecting an Error Page

Blogger has introduced a new page type called "error_page" and you can detect it using b:if conditional tags.

The following condition checks if a page is an error page or not.

<b:if cond='data:blog.pageType == "error_page"'>
This is an Error Page
</b:if>

Changing the Error Page Title

By default the title of the Blogger Error Page is your Blog Title. If you want to change it to something else, you can Edit your template and change

<title><data:blog.pageTitle/></title>

<b:if cond='data:blog.pageType == "error_page"'>
<title>Page Not Found</title>
<b:else/>
<title><data:blog.pageTitle/></title>
</b:if>

If you are using my Title Tag Hack or derivatives of that available on the internet, then you will have to change

<!-- Start www.bloggerplugins.org: Changing the Blogger Title Tag -->
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<title><data:blog.pageTitle/></title>
<b:else/>
<title><data:blog.pageName/><b:if cond='data:blog.pageName'> - </b:if><data:blog.title/></title>
</b:if>
<!-- End www.bloggerplugins.org: Changing the Blogger Title Tag –>

<!-- Start www.bloggerplugins.org: Changing the Blogger Title Tag -->
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<title><data:blog.pageTitle/></title>
<b:else/>
<b:if cond='data:blog.pageType == "error_page"'>
<title>Page Not Found</title>
<b:else/>
<title><data:blog.pageName/><b:if cond='data:blog.pageName'> - </b:if><data:blog.title/></title>
</b:if>
</b:if>
<!-- End www.bloggerplugins.org: Changing the Blogger Title Tag –>

Source: http://www.bloggerplugins.org

2013, By: Seo Master

seo Facebook Like Button to Blogger 2013

Seo Master present to you:

Facebook Like button add it to Blogger.few days ago, face book surprised us by launching a lot of social plugins, one of them, actually the most popular one yet is the famous like button,
In this tutorial you’ll learn how to add it to your blogger blog.

Step 1. adding it to your template.

The button code,

<b:if cond='data:blog.pageType == &quot;item&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/> </b:if>

where to add it ?

Log into your blogger account, then go to Layout >> Edit Html.
Before doing any thing you must check Expand Widget Templates box.

And find the next Code<div class='post-header-line-1'/>
And after it, paste your button code
What, If you didn’t find the code above in your template, The try to find the following,<data:post.body/>

And paste the button code Before it.
click Save Template and you are done.
Step 2. Customize your button & Demo.
in the above code you can customize 3 parts. and i’ve colored them to make it easy for you to recognize,
in the above code change the following parts,
like this part controls the verb that appear on your button, keep it as you see or change it to recommend if you want.
arial this part controls the font type, keep it or change it to one of the following,

lucida+grande
segoe+ui
tahoma
trebuchet+ms
verdana
light this part controls your button color theme, and you have three options, light, evil, or dark
Update, How to make it appear on your home page.

in the button code there are two parts you’ll need to remove to make this button appear on your home page, the first line and the last line, if you still don’t under stand, please see the following parts and delete it before pasting the code to your template,<b:if cond='data:blog.pageType == "item"'>
</b:if>

OR

Facebook Like Button for Blogger

Step 1: Log in to Blogger and from the dashboard, go to Template tab.

Step 2: Click “Edit HTML” and check “Expand Widget Templates”.

Step 3: Find <data:post.body/> and immediately after/before it (or both if you want to have it on top and also at the bottom of the post) add the below code after generating it.
Button Options.

<b:if cond='data:blog.pageType != &quot;static_page&quot;'> <div style='float: left;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.canonicalUrl + &quot;&amp;send=false&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=35&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:35px;'/> </div> </b:if>

Step 5: Save your template.

2013, By: Seo Master

seo Search Description 2013

Seo Master present to you:

When using a search engine (such as Google.com), you probably see a blurb of text underneath your search results that helps you decide whether or not that’s the site you want. For example: This is what appears when you search for “Blogger.” The descriptive line of text that appears under the link is the search description.
If you don't specify a search description for your blog, search engines will establish one for you based on your blog’s content.

To create your own search description, just go to Settings | Search Preferences and click Edit next to "Description" to reveal a text field. Select Yes, write in your text, and click Save changes.
Settings to create a search description on Blogger

Settings to create a search description on Blogger

A few examples of blog search descriptions:

“A blog about social networking and web design.”
“A journal of my year in Paris.”
“Healthy southern-style cooking.”

Enabling this feature will display a “Search Description” option in the Post Settings panel that allows you to enter a search description for individual posts.
Search description for posts

For more background on SEO, read through this article in the Webmasters Help Center, and be sure check out their SEO Starter Guide (pdf.

Read more: http://support.google.com/blogger/?hl=en

2013, By: Seo Master

seo About Blogger and SEO 2013

Seo Master present to you:

The articles in this section are all guides to advanced features. Keep in mind that incorrect settings can result in unintended consequences.

Blogger now provides web savvy users with the option to manage search engine preferences. SEO -- an acronym for Search Engine Optimization -- helps increase traffic to your blog and connect your content with the intended audience. For more background on SEO, read through this article in the Webmasters Help Center, and be sure check out their SEO Starter Guide (pdf).

Most of our SEO options can be found under the Settings tab, under the Search Preferences section.
On this tab, you should see the following settings:

Description
Custom Page Not Found
Custom Redirects
Custom robots.txt
Custom robots header tags

Other options, such as image properties and header tags, are located in the Post Editor.

Ready to jump in? Head back to the SEO topic page to get started. Remember, you don’t have to check off every step to increase the SEO of your blog -- just work on the steps you feel comfortable with, as every little bit helps.

More: http://support.google.com/blogger/

2013, By: Seo Master

seo How to install Blogger Template - SMS 2013

Seo Master present to you:

How to install Blogger Template, How to install a Blogger XML template ? HOW TO INSTALL BLOGGER TEMPLATE. How to install a Blogger template? Why I can’t install a template? Blogger gives an error. How do I log in to my blog without the navbar? How do I customize my template?
How can I edit the menu of my template? How to go back from Dynamics Views to standard templates
Why the date is displayed as “undefined” or this is not show? Why some images in my template disappeared? How to add the comment form to my template? How do I add my feed of Feedburner to my blog? How do I translate my template to another language? What should I do after I install my template?
How to display the navbar again in my template? How to display the last posts or comments on the sidebar?
Why is my blog shows few entries per page?

[SMS] Synthesizing Multiple Sources Tutorial

1. Login to your blogger.com account.
2. Go to Blogger dashboard.
3. Go to Design tab.
4. Now click Edit Html tab.
5. Before editing your template, you may want to save a copy of it. Download Full Template
6. Upload a template from a file on your hard drive (.xml file extracted): click Choose file option button.
7. Now save your template.

<meta content='DESCRIPTION HERE' name='description'/>
<meta content='KEYWORDS HERE' name='keywords'/>

Replace DESCRIPTION HERE,KEYWORDS HERE as below.

DESCRIPTION HERE:Write your blog description

KEYWORDS HERE:Write the keywords of your blog separated by comma.

How To Configure Favicon:

<link href='YOUR-FAVICON-URL' rel='shortcut icon' type='image/vnd.microsoft.icon'/>

Now replace "YOUR-FAVICON-URL" with your Favicon address/url.

HOW TO DISPLAY THE LATEST POSTS OR COMMENTS ON THE SIDEBAR?

1. Go To Blogger (Dashboard → Design → Page Elements → Add a Page Element).
2. Select a Feed widget, and use the following URL’s:

To show the recent posts:
http://YOURBLOGNAME.blogspot.com/feeds/posts/default

To display the latest comments:
http://YOURBLOGNAME.blogspot.com/feeds/comments/default

HOW DO I CUSTOMIZE MY TEMPLATE?
For color and the font size, some Blogger templates offer an option to change it from the Dashboard (Dashboard → Design → Template designer → Advanced or Dashboard → Template → Customize → Advanced in the new Blogger design).

CAN I REMOVE THE CREDIT FOR THE TEMPLATE?

No, the vast majority of templates are licensed under a Creative Commons, GPL or similar license, thus removing the credits would be using an illegal copy of the same. You can simplify the credits or relocate, but not remove them. Remember that the templates are free, so keep the credits is a way to thank those who designed and / or adapt the template.
In this tutorial i am going to show you how to install blogger template in the new updated version of the blogger.
just simple follow the step and install a blogger template in updated blogger interface.

1. Login to your blogger account

2. Now just select Template and you can see bellow button at the right hand side.

3. Now just click on backup / restore button and one box will pop up (you can see it in bellow snapshot)

4. Now simply browse your template and click on upload and you have done !

You can also change the arrangement of the widgets using layout.

Or

Frequently Asked Questions

How to install a Blogger template?

0. If your are using Dynamic Views, you need first go to Design (Dashboard → Design) and then click on “Revert to previous template”.

1. Download the template and unzip the file (you can use a free unzipper software).

2. Go to your blog design section (Dashboard → Design → Edit HTML ).

In the new Blogger design: Dashboard → Template → “Manage” button.

3. Backup your previous template (Download full Template).

In the new Blogger design:

4. Find and upload the xml file.

5. If you see the following warning:

Click “keep widgets“.

6. Enjoy!

Why I can’t install a template? Blogger gives an error.

There are several possible factors that cause an error Bx-xxxx:

The code is directly copied, and Blogger did ‘t interpret it.
Temporarily Blogger is not accepting templates with certain codes or gadgets.

Possible solutions:

Remove widgets or gadgets that come with the template downloaded.
Clear your browser’s cookies.
Trying to upload the template with a different browser (Opera, Firefox, Chrome).
No copy and paste the code directly, upload the xml file.
Wait 24 hours and try again.

The Blogger navbar is just a plug and provides a shortcut to enter your blog, but you can always log in from Blogger.com.

How do I customize my template?

For color and the font size, some Blogger templates offer an option to change it from the Dashboard (Dashboard → Design → Template designer → Advanced orDashboard → Template → Customize → Advanced in the new Blogger design). Here, you can see the result directly in the template.

Major changes in the templates needed to know at least a little CSS and HTML. A quick way to modify a template is change the images in the CSS code, for others with the same dimensions. That is the process to change the header of a design, for example.

Additionally, some templates have their own settings instructions and customization, refer to the same download page of your template.

1. Most templates have a menu that can only be edited from the HTML (Dashboard → Design → Edit HTML or Dashboard → Template → Edit HTML in the new Blogger design). In many cases the code to look for is like:

 <li class='current'><a expr:href='data:blog.homepageUrl'>Home</a></li>
 <li><a expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;'>Posts RSS</a></li>
 <li><a expr:href='data:blog.homepageUrl + &quot;feeds/comments/default&quot;'>Comments RSS</a></li>
 <li><a href='#'>Edit</a></li>

There you can edit the expr:href=’…’ code, with your own links: href=’http://mylink…’. Also see the instructions in your template for more information.

2. Some templates include a link list widget or a pages widget to edit the menu directly from the Dashboard.

For link liks widget: Dashboard → Design → Page Elements. Or Dashboard → Layout in the new Blogger design.
For pages widget: Posting → Edit pages → New pages. Or Dashboard → Pages → New Page in the new Blogger design.

How to go back from Dynamics Views to standard templates

If you are using the new Blogger templates, called Dynamics Views, you don’t have access to most templates on the web.

To go back from Dynamics Views to standard templates you only need:

Go to Template designer (Dashboard → Design).
Click on “Revert to previous template”.

That’s it. Now each time you enter in ‘Design’ section, you will be able to upload custom templates again.

Why the date is displayed as “undefined” or this is not show?

Probably because you don’t choose the right date format. The format should be changed from the panel and usually the correct types are:

1. Dashboard → Settings → Formatting → Date Header Format

In the new Blogger design: Dashboard → Settings → Language and formatting → Date Header Format

2. Dashboard → Settings → Formatting → Timestamp Format

In the new Blogger design: Dashboard → Settings → Language and formatting → Timestamp Format

Read the instructions of your template located on the download page.

Why some images in my template disappeared?

Although we host the largest number of images in Blogger, images may suddenly disappear because:

The images were removed from the original hosting.
You use a own domain.

Solution: Download the template from Templates again, or from the page’s original author and re hosts the images on an external service such as Photobucket, or ImageShack.

How to add the comment form to my template?

Blogger recently added the Comments Form within the same template, below the individual posts, if your template does not have the form there, you may need to manually add it or activate it.

To add it manually:

Enter in the code of your template (Dashboard → Design → Edit HTML orDashboard → Template → Edit HTML in the new Blogger design) and search for:
```
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
```

Replace that code with the following:

<b:if cond='data:post.embedCommentForm'>
          <b:include data='post' name='comment-form'/>
        <b:else/>
          <b:if cond='data:post.allowComments'>
            <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
          </b:if>
        </b:if>

To activate it:

Enter the options panel comments (Dashboard → Settings → Comments).
And in the “Comment Form Placement” section, select: Embedded below post.

Note: If you are using the new Blogger design, you will need back to the classic version and follow the two step above.

How do I add my feed of Feedburner to my blog?

On the menu: Many templates show the feed in the top menu, to change the default feed for feedburner, go to your template code (Dashboard → Design → Edit HTML orDashboard → Template → Edit HTML in the new Blogger design) and search for:

<a expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;'>

Replace this with:

<a href='URL del feed en Feedburner'>

Now, in the settings panel of the feed ( Dashboard → Settings → Site Feed orDashboard → Settings → Other → Post Feed Redirect URL in the new Blogger design) also add your Feedburner URL.

How do I translate my template to another language?

Directly in the template code. (Dashboard → Design → Edit HTML or Dashboard → Template → Edit HTML in the new Blogger design), with a really simple process:

Using the browser search, find the text you want translate.
Replaces that text with your translation.
Repeat the process for all the words / phrases that you want to change.

The text within an image need to be changed with a image editor (eg. Gimp or Photoshop) and then, replace that image url with the edited image url.

What should I do after I install my template?

After installing a template, there are several things worth to check, update or modify, we recommend you to read our article with all the points.

Easy! Enter in the code of your template (Dashboard → Design → Edit HTML) and search for:

#navbar-iframe {
   height:0px;
   visibility:hidden;
   display:none
}

Delete it and that’s it.

How to display the last posts or comments on the sidebar?

Enter the administrator page elements (Dashboard → Design or Dashboard → Layout in the new Blogger design).
Add a new feed widget, with the following URL’s:To show the recent posts:
http://BLOGNAME.blogspot.com/feeds/posts/default
To display the latest comments:
http://BLOGNAME.blogspot.com/feeds/comments/default

Why is my blog shows few entries per page?

Blogger recently implemented a mechanism called “auto pagination” to reduce the loading time of its blogs. This mechanism is to show less Blogger entries per page if it detects that the page is heavy to load.

To avoid that this happens, you can try to decrease the load time of your blog, some recommendations are:

Optimizing images. For example, using Smush.it or a free image editor like Gimp.
Eliminate unnecessary gadgets.
Use “read more” in your longer posts.
Optimize CSS code. For example, with CSS Optimizer.

Fix: Wrong Description and Image on sharing posts to Facebook

When you share a post on Facebook, it will display a thumbnail picked from the post page along with a short description of the post. But in many cases Facebook fails to identify the correct image and description that it should use. This leads to irrelevant images and description coming up in Facebook when you or your readers share the post. This is totally annoying, and I had got many queries regarding this on my Facebook page and via email. So for those who are trying to figure a way out of this, here is the solution.

Which image and Description does Facebook pick from your Post Page

Facebook regularly scrapes your page and caches the data to your servers. They look for meta data information(Opengraph tags and others) in your post page. The meta data can explicitly specify the image and the description to use when the page is shared.If Facebook doesn’t find any meta data, then their Algorithms will fetch some description and image from your Page. Facebook shows a wrong description or image when their Algorithms are not able to fetch the correct image and description from your Post Page.

We will solve both of these issues using two different techniques.

1. Fixing the Wrong Image Problem.

You might have noticed that comment avatars, and other irrelevant images come up when you share the post on Facebook . The solution to this is to specify the image in the page meta data. We will be using open graph tags for the same.

Go to Template > Edit HTML and just above

</head>

Paste the following code snippet.
You can alter the image URL in the above snippet. That image will be used when no post thumbnail is present.

<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/>
<b:else/>
<meta content='http://www.matrixar.com/-erTXCq61ULM/TmHYAQBZ0GI/AAAAAAAACCs/6cBX54Dn6Gs/s72-c/default.png' property='og:image'/>
</b:if>

Now when you share posts to Facebook, a proper post thumbnail will be displayed. If the post doesn’t have images, then the fall back image which we have specified in the snippet will be used. If you don’t see results right away , then it is because of the caching done by Facebook. You can force Facebook to update the cache by debugging the post URL using this tool.

2. Fixing the Wrong Description Problem

Wrong description comes up when Facebook is not able to recognize the content and structure of your page. This also can be rectified by using meta data, but since blogger doesn’t provide a post snippet tag outside the blog post widget, it is impossible to do that using valid HTML. So we will have to go for other alternatives. If meta data is not found, then Facebook normally uses the First paragraph in your page(which is big enough). So it will be a good idea to get used to the paragraph HTML tag <p>content</p>. The Blogger Post Editor doesn’t use paragraph tags but uses lots of line break tags instead. So if you are using the Blogger Post Editor, then you will have to go into the HTML mode of the post Editor, and make sure that you use paragraph tags(I do agree that it is a difficult thing to do). If you can’t take that headache, then you can use a third party Publishing Tool like the Windows Live Writer which has superior Editing Controls. After doing this, you will again have to force a Cache refresh using the Facebook Debug tool and your post should show a proper description on Facebook.

3. Scripts coming up in the Facebook Description

I had seen a couple of cases where JavaScript snippets come up in the Facebook Description. Facebook somehow mistook the script for content, and this is probably because of the way you have added the script. Go to your template and see if there are any special characters in front of that particular script tag. If you find one, then remove it, and force a Facebook Cache Refresh.

Source: [SMS] Synthesize Multiple Sources

2013, By: Seo Master

Design by Dev Nasser

Les nouveautés et Tutoriels de Votre Codeur | SEO | Création de site web | Création de logiciel

Or

HOW TO HIDE THIS LINKS?

HOW TO HIDE THIS LINKS BY CSS?

Reverting Back to the old one

HOW TO ADD THE PINTEREST PIN IT BUTTON TO BLOGGER?

ADDING PIN IT SCRIPT FOR BLOGGER

ADDING PIN IT BUTTON SCRIPT

ADDING STYLINGS

Instructions

Detecting an Error Page

Changing the Error Page Title

Frequently Asked Questions

How to install a Blogger template?

Why I can’t install a template? Blogger gives an error.

How do I log in to my blog without the navbar?

How do I customize my template?

How can I edit the menu of my template?

How to go back from Dynamics Views to standard templates

Why the date is displayed as “undefined” or this is not show?

Why some images in my template disappeared?

How to add the comment form to my template?

How do I add my feed of Feedburner to my blog?

How do I translate my template to another language?

What should I do after I install my template?

How to display the navbar again in my template?

How to display the last posts or comments on the sidebar?

Labels

Blog Arşivi