Tampilkan postingan dengan label seo. Tampilkan semua postingan
Kamis, 03 Juni 2010
How To Embed URL,HTML,Forum Links Code below Blogger Posts
This tutorial will explain how to create a widget, for your visitors to link back to your article/blogger post.This was created by me(http://www.bloggertipandtrick.net/) and previously I had installed this widget to this site.Many visitors ask from me how to add this widget to their blogger blogs and so I decided to explain it.This widget will show 3 codes (Blog Post URL,HTML code to embed your post to a website,Forum Link to embed your post to a forum) below your blogger post.If you like to add this widget to your blogger blog,then follow the steps given below.
1.Login to your blogger dashboard--> layout- -> Edit HTML
2.Scroll down to where you see </head> tag .
3.Copy below code and paste it just before the </head> tag .

4.Now find below code:
5.Copy below code and paste it just after the <data:post.body/> .
NOTE : Don't change anything in above code.
6.Save your template and you are done.
1.Login to your blogger dashboard--> layout- -> Edit HTML
2.Scroll down to where you see </head> tag .
3.Copy below code and paste it just before the </head> tag .

<style type='text/css'>
.about-article{
background-color:#f9f9f9;
padding-bottom:5px;
padding-left:20px;
font-size:11px;
}
.about-article input{
background-color:#ffffff;
}
</style>
4.Now find below code:
<data:post.body/>
5.Copy below code and paste it just after the <data:post.body/> .
<b:if cond='data:blog.pageType == "item"'>
<div class="about-article"><p>If you find this article useful, please feel free to link to this page from your website or blog.</p><p class="noborder"><label for="aa-url">URL:</label><br /><input size="80" readonly="readonly" onclick="this.focus();this.select();" type="text" id="aa-url" value="<data:post.url/>" /></p><p><label for="aa-forum">HTML Link:</label><br /><input size="80" readonly="readonly" onclick="this.focus();this.select();" type="text" id="aa-forum" value="<a href=&quot;<data:post.url/>&quot;><data:post.title/></a>" /></p><p>
<label for="aa-forum">Forum Link:</label><br />
<input size="80" readonly="readonly" onclick="this.focus();this.select();" type="text" id="aa-forum" value="[url=<data:post.url/>]/<data:post.title/>[/url]" /></p>
<p align='center'><a href='http://www.bloggertipandtrick.net/' style='display:none;' target='_blank'>Widget by BloggerTipAndTrick</a></p>
</div><br/>
</b:if>
NOTE : Don't change anything in above code.
6.Save your template and you are done.
Senin, 19 April 2010
How To Add Official Google Buzz Button+Counter to Blogger
Now Google has introduced their Official Google Buzz Buttons.Buzz Buttons help people share stuff from your website in Google Buzz. You can add this buzz button to your blogger blog or website easily.Below I explain how to add this official Google buzz button to blogger with or without share count.
1.Log in to your dashboard--> layout- -> Edit HTML
2.Click on "Expand Widget Templates"
3.Scroll down to where you see this:
4.Now copy one of the below codes and paste it just before the above line.
Button 1 : Button + counter : Post count - On the top
Code:
Result:

Button 2 : Button + counter : Post count - On the side
Code:
Result:

Button 3 : Button only : Size - Normal
Code:
Result:

Button 4 : Button only : Size - Small
Code:
Result:

Button 5 : Link
Code:
Result:

5.Now save your template and you are done.
1.Log in to your dashboard--> layout- -> Edit HTML
2.Click on "Expand Widget Templates"
3.Scroll down to where you see this:
<data:post.body/>
4.Now copy one of the below codes and paste it just before the above line.
Button 1 : Button + counter : Post count - On the top
Code:
<div style='float:right; margin-right:10px;'>
<a title="Post on Google Buzz" class="google-buzz-button" href="http://www.google.com/buzz/post" data-button-style="normal-count"></a>
<script type="text/javascript" src="http://www.google.com/buzz/api/button.js"></script>
</div>
Result:

Button 2 : Button + counter : Post count - On the side
Code:
<div style='float:right; margin-right:10px;'>
<a title="Post on Google Buzz" class="google-buzz-button" href="http://www.google.com/buzz/post" data-button-style="small-count"></a>
<script type="text/javascript" src="http://www.google.com/buzz/api/button.js"></script>
</div>
Result:
Button 3 : Button only : Size - Normal
Code:
<div style='float:right; margin-right:10px;'>
<a title="Post on Google Buzz" class="google-buzz-button" href="http://www.google.com/buzz/post" data-button-style="normal-button"></a>
<script type="text/javascript" src="http://www.google.com/buzz/api/button.js"></script>
</div>
Result:

Button 4 : Button only : Size - Small
Code:
<div style='float:right; margin-right:10px;'>
<a title="Post on Google Buzz" class="google-buzz-button" href="http://www.google.com/buzz/post" data-button-style="small-button"></a>
<script type="text/javascript" src="http://www.google.com/buzz/api/button.js"></script>
</div>
Result:

Button 5 : Link
Code:
<div style='float:right; margin-right:10px;'>
<a title="Post on Google Buzz" class="google-buzz-button" href="http://www.google.com/buzz/post" data-button-style="link"></a>
<script type="text/javascript" src="http://www.google.com/buzz/api/button.js"></script>
</div>
Result:
5.Now save your template and you are done.
Minggu, 27 Desember 2009
How To Become Blogger Blogroll Nofollow
This is very important if you consider about your site SEO.Adding the nofollow attribute to your blogroll, would nullify any link juice with Google.If you like to add Nofollow attribute to your blogspot blogroll simply follow the steps below:
1.Login to your dashboard--> layout- -> Edit HTML
2.Click on "Expand Widget Templates"
3.Scroll down to till you see your Blogroll widget code :
(Note : You may also can find it by searching <b:widget id='BlogList )
Your Blogroll widget code will look like this:
4.Now add rel='nofollow' to your blogroll widget code as the example below:
5.Now save your template and you are done.
1.Login to your dashboard--> layout- -> Edit HTML
2.Click on "Expand Widget Templates"
3.Scroll down to till you see your Blogroll widget code :
(Note : You may also can find it by searching <b:widget id='BlogList )
Your Blogroll widget code will look like this:
<b:widget id='BlogList1' locked='false' title='Blogroll' type='BlogList'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<div id='blog-list-title'>
<h2 class='title'><data:title/></h2>
</div>
</b:if>
<div class='widget-content'>
<div class='blog-list-container' expr:id='data:widget.instanceId + "_container"'>
<ul expr:id='data:widget.instanceId + "_blogs"'>
<b:loop values='data:items' var='item'>
<li expr:style='data:item.displayStyle'>
<div class='blog-icon'>
<b:if cond='data:showIcon == "true"'>
<input expr:value='data:item.blogIconUrl' type='hidden'/>
</b:if>
</div>
<div class='blog-content'>
<div class='blog-title'>
<a expr:href='data:item.blogUrl' target='_blank'>
<data:item.blogTitle/></a>
</div>
<div class='item-content'>
<b:if cond='data:showItemThumbnail == "true"'>
<b:if cond='data:item.itemThumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:item.blogUrl' target='_blank'>
<img alt='' border='0' expr:height='data:item.itemThumbnail.height' expr:src='data:item.itemThumbnail.url' expr:width='data:item.itemThumbnail.width'/>
</a>
</div>
</b:if>
</b:if>
<b:if cond='data:showItemTitle == "true"'>
<span class='item-title'>
<b:if cond='data:item.itemUrl != ""'>
<a expr:href='data:item.itemUrl' target='_blank'>
<data:item.itemTitle/></a>
<b:else/>
<data:item.itemTitle/>
</b:if>
</span>
</b:if>
<b:if cond='data:showItemSnippet == "true"'>
<b:if cond='data:showItemTitle == "true"'>
-
</b:if>
<span class='item-snippet'>
<data:item.itemSnippet/>
</span>
</b:if>
<b:if cond='data:showTimePeriodSinceLastUpdate == "true"'>
<div class='item-time'>
<data:item.timePeriodSinceLastUpdate/>
</div>
</b:if>
</div>
</div>
<div style='clear: both;'/>
</li>
</b:loop>
</ul>
<b:if cond='data:numItemsToShow != 0'>
<b:if cond='data:totalItems > data:numItemsToShow'>
<div class='show-option'>
<span expr:id='data:widget.instanceId + "_show-n"' style='display: none;'>
<a href='javascript:void(0)' onclick='return false;'><data:showNText/></a>
</span>
<span expr:id='data:widget.instanceId + "_show-all"' style='margin-left: 5px;'>
<a href='javascript:void(0)' onclick='return false;'><data:showAllText/></a>
</span>
</div>
</b:if>
</b:if>
<b:include name='quickedit'/>
</div>
</div>
</b:includable>
</b:widget>
4.Now add rel='nofollow' to your blogroll widget code as the example below:
<b:widget id='BlogList1' locked='false' title='Blogroll' type='BlogList'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<div id='blog-list-title'>
<h2 class='title'><data:title/></h2>
</div>
</b:if>
<div class='widget-content'>
<div class='blog-list-container' expr:id='data:widget.instanceId + "_container"'>
<ul expr:id='data:widget.instanceId + "_blogs"'>
<b:loop values='data:items' var='item'>
<li expr:style='data:item.displayStyle'>
<div class='blog-icon'>
<b:if cond='data:showIcon == "true"'>
<input expr:value='data:item.blogIconUrl' type='hidden'/>
</b:if>
</div>
<div class='blog-content'>
<div class='blog-title'>
<a expr:href='data:item.blogUrl' rel='nofollow' target='_blank'>
<data:item.blogTitle/></a>
</div>
<div class='item-content'>
<b:if cond='data:showItemThumbnail == "true"'>
<b:if cond='data:item.itemThumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:item.blogUrl' rel='nofollow' target='_blank'>
<img alt='' border='0' expr:height='data:item.itemThumbnail.height' expr:src='data:item.itemThumbnail.url' expr:width='data:item.itemThumbnail.width'/>
</a>
</div>
</b:if>
</b:if>
<b:if cond='data:showItemTitle == "true"'>
<span class='item-title'>
<b:if cond='data:item.itemUrl != ""'>
<a expr:href='data:item.itemUrl' rel='nofollow' target='_blank'>
<data:item.itemTitle/></a>
<b:else/>
<data:item.itemTitle/>
</b:if>
</span>
</b:if>
<b:if cond='data:showItemSnippet == "true"'>
<b:if cond='data:showItemTitle == "true"'>
-
</b:if>
<span class='item-snippet'>
<data:item.itemSnippet/>
</span>
</b:if>
<b:if cond='data:showTimePeriodSinceLastUpdate == "true"'>
<div class='item-time'>
<data:item.timePeriodSinceLastUpdate/>
</div>
</b:if>
</div>
</div>
<div style='clear: both;'/>
</li>
</b:loop>
</ul>
<b:if cond='data:numItemsToShow != 0'>
<b:if cond='data:totalItems > data:numItemsToShow'>
<div class='show-option'>
<span expr:id='data:widget.instanceId + "_show-n"' style='display: none;'>
<a href='javascript:void(0)' onclick='return false;'><data:showNText/></a>
</span>
<span expr:id='data:widget.instanceId + "_show-all"' style='margin-left: 5px;'>
<a href='javascript:void(0)' onclick='return false;'><data:showAllText/></a>
</span>
</div>
</b:if>
</b:if>
<b:include name='quickedit'/>
</div>
</div>
</b:includable>
</b:widget>
5.Now save your template and you are done.
Kamis, 10 Desember 2009
How To Add Automatically Link To This Post Widget To Blogger
Do you like to add "Link To This Post Widget" under your blog post?This will help you to increase your site's backlinks for better SEO.So if you interested to add this useful widget to your blogspot blog follow the simple steps below.
1.Log in to your dashboard--> layout- -> Edit HTML
2.Click on "Expand Widget Templates"
3.Scroll down to where you see this:

4.Copy below code and paste it immediately after the line <data:post.body/> .
Note:You can change colors,font,... if you like.
5.Click on "Save Templates" and now you are done.
1.Log in to your dashboard--> layout- -> Edit HTML
2.Click on "Expand Widget Templates"
3.Scroll down to where you see this:

<data:post.body/>
4.Copy below code and paste it immediately after the line <data:post.body/> .
<div style='border: 0px solid #646464; padding: 2px 2px; margin:2px 2px;background-color:#ffffff;font-size:11px;'>
<p>If you like this please Link Back to this article...</p>
<textarea cols='60' id='bloglinking' name='bloglinking' onclick='this.focus();this.select()' onfocus='this.select()' onmouseover='this.focus()' readonly='readonly' rows='2'><a href="<data:post.url/>"><data:post.title/></a></textarea><br/>
</div><br/>
Note:You can change colors,font,... if you like.
5.Click on "Save Templates" and now you are done.
Selasa, 27 Oktober 2009
Complete SEO Guide For Blogger|Blogspot
This Article will provide you complete guide on search engine optimization (SEO) for blogger templates.If you have any other ideas please leave a comment.
Meta tags are very important for SEO.So you must add meta tags to your blogger blog for improve your seo.



Default page title for a single Blogger post is BLOG TITLE: POST TITLE. You can improve SEO by changing the title tags to POST TITLE ~ BLOG TITLE.

Heading Tag (h1, h2, h3, h4, h5) is also important for SEO. All of Blogger widgets (gadgets) title use h2 or h3 tags. If you want to improve SEO, you need to use h1 tag for post title.

Adding social bookmarking links can help you build your traffic and improve SEO.






You can use breadcrumb to provide easy navigation for your visitor and increase page views.

Meta Keywords and Description
Meta tags are very important for SEO.So you must add meta tags to your blogger blog for improve your seo.

- How Add META TAGS to Blogger(blogspot) blogs
- Add Different Meta tags to Different Blogger Posts
- How To Install Dynamic Meta Description Tags
Submit Your Sitemap to Search Engines

- HOW TO SUBMIT BLOGGER SITEMAP TO GOOGLE
- How To Submit Blogger Sitemap to MSN and Ask.com
- How To Submit blogger sitemap to yahoo
Change Blogger Default Title Tag

Default page title for a single Blogger post is BLOG TITLE: POST TITLE. You can improve SEO by changing the title tags to POST TITLE ~ BLOG TITLE.
Change Blogger Default Heading Tag

Heading Tag (h1, h2, h3, h4, h5) is also important for SEO. All of Blogger widgets (gadgets) title use h2 or h3 tags. If you want to improve SEO, you need to use h1 tag for post title.
Use Social Bookmarking Services

Adding social bookmarking links can help you build your traffic and improve SEO.
- How To Add Big Social Bookmarking buttons
- How To Add jQuery Social Bookmarks icons
- How To Add Sexy Social Bookmark to Blogger
- How To Add Addtoany Social Bookmarking Widget
- How To Add SocioFluid Bookmarking Widget
- How To Add Retweet Button in Blogger
- How To Add Save to del.icio.us button with Hit counts
- How To Add 'Digg it !!!' Link to blogger posts
- How To Add 'Stumble it' Link to blogger posts
- How To Add 'Reddit' Link to your blogger posts
- How To Add 'Twit this' Links to blogger posts
- How To Add 'del.icio.us' Links to blogger posts
- How To Add 'Share on Technorati' Links to blogger
Use Related Posts Widget

- How To Add jQuery Related Posts Widget for Blogger
- Nice Related Post Widget For Bloggers
- Add Related Post Widget to Blogger-Original Templates
- Add Related Post Widget to Blogger-Modified Templates
- Instant Related Post Widget For Blogger
Use Read More... Feature

- Auto 'Read More' Feature with Thumbnails
- Jquery Read More-Expandable Post in Blogger
- Add Auto 'Read More' Feature to blogger
- Add 'Read More' Feature to blogger
- How To Create Expandable Post Summaries
Use Recent Posts,Recent Comments Widgets

- How To Add Recent Posts Widget with Thumbnails
- How To Add Recent Posts Widget to blogger
- Add Scrolling Recent Posts Widget to blogger
- Add Recent Comments Widget For Blogger Blog
Use Popular Post Widget

Use Labels / Tag Clouds

Use Breadcrumb
You can use breadcrumb to provide easy navigation for your visitor and increase page views.
Submit Blog to Blog Directories

Jumat, 09 Oktober 2009
How To Change Heading Tag For Better SEO in Blogger
Heading Tag (h1, h2, h3, h4, h5) is very important for SEO. All of Blogger widgets (gadgets) title use h3 or h2 tags. So blogger template use h2 or h3 tag for post title.If you want to improve your site SEO, you need to use h1 tag for post title.
Follow the simple steps below to do it:
1.Login to your blogger dashboard--> layout- -> Edit HTML
2.Click on "Expand Widget Templates"
3.Scroll down to where you see below code :
Note: If you can't find above code search it replacing h3 with h2.
4.Now Replace above code with below code:
5.Now find ]]></b:skin> tag.
6.Copy below code and paste it just before ]]></b:skin> tag.
Note:You can change values of above code to match your template.
7.Click on "Save Templates" and now you are done.
Follow the simple steps below to do it:
1.Login to your blogger dashboard--> layout- -> Edit HTML
2.Click on "Expand Widget Templates"
3.Scroll down to where you see below code :
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>
Note: If you can't find above code search it replacing h3 with h2.
4.Now Replace above code with below code:
<b:if cond='data:post.title'>
<h1 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h1>
</b:if>
5.Now find ]]></b:skin> tag.
6.Copy below code and paste it just before ]]></b:skin> tag.
h1.post-title, .post h1 #Blog1 h1, #Blog2 h1 {
border-bottom:0px Dotted #000000;
border-top:0px Dotted #000000;
margin:.25em 0 0;
padding:0 0 4px;
font-size:150%;
font-weight:normal;
line-height:1.4em;
color:#1c3c6f;
}
Note:You can change values of above code to match your template.
7.Click on "Save Templates" and now you are done.
Kamis, 24 September 2009
How To Change Wordpress Permalink Structure For Better SEO
By default WordPress uses URLs containg a question mark and numbers for your permalinks and archives such as �http://yoursite.com?p=123". In order to increase keyword density of your site for better SEO, You must change that setting to a custom permalink structure.
In your WordPress admin area, click �Options� and then click �Permalinks�.
Select �custom� in the Customize Permalink Structure area and in the box next to �custom� enter this:
/%category%/%postname%
This will create URLs for your permalinks and archives that would look like this:
http://yoursite.com/yourcategory/title-of-your-post
Click �Update Permalink Structure� to save above setting.
Now you are done.
In your WordPress admin area, click �Options� and then click �Permalinks�.
Select �custom� in the Customize Permalink Structure area and in the box next to �custom� enter this:
/%category%/%postname%
This will create URLs for your permalinks and archives that would look like this:
http://yoursite.com/yourcategory/title-of-your-post
Click �Update Permalink Structure� to save above setting.
Now you are done.
Langganan:
Postingan
(
Atom
)