Friday, February 19, 2010
How to make a sitemap in blog
Today I will show you how to register at Google Webmasters and edit its tools to add a sitemap to your blog that increase the SEO and make your site appear in search engines
- First open Google Webmaster Homepage and press on Sign in to Webmaster Tools as the following:
- Enter your e-mail and password in this page as the following:
- When you write the e-mail, it will redirect you to Google Webmaster tools and press on Add a Site, Write your blog URL without "www" as the following:
- After adding your blog URL this page will appear to you, Copy the meta tag as the following:
- In the Dashboard Click on Layout -> Edit HTML and paste the meta tag code after
<head>code as the following and press Verify on the previous page :
- It will verify your blog site and then you will be redirected to your Google webmaster tools, press on Sitemaps as the following:
- For free blogspot blogs press on Submit a Sitemap and add the following code "atom.xml?redirect=false&max-results=100" as the following:
- But for the bloggers who have their own domain and host you should go to Xml Sitemaps and make your own sitemap file then upload it to your host and write it in " Submit a sitemap"
FeedBurner Options ( III ) - Chicklet Chooser
In this post I will show you how to add Chicklet Chooser option that's responsible for subscribing in a reader, you may put it under every post to make visitors subscribe your posts ,If you don't have a FeedBurner account then try this (How to make a FeedBurner account) Then make the following steps:
- After making your account you have to go to this link (My Feeds)
- You will find your Feed Links choose the submitted link as the following:
- Here's your Feed Page, at first you will Find the Analyze page ( it's giving you information about the visitors and subscribers ) Then press on Publicize:
- Then press on Chicklet Chooser as the following ( If you want to know How to add E-mail subscription option Click Here ) :
- Then choose the style of your Chicklet ( I prefer the second one ):
- then copy the HTML code under every post .. as the following:
- At last it will be shown as the following:
Be on touch with me and leave your comments
Thursday, February 18, 2010
FeedBurner Options ( II ) - FeedCount - Styles
I will show you the second option in the FeedBurner, How to add FeedCount Option with different styles that's responsible for counting the number of Subscribers everyday, If you don't have a FeedBurner account then try this (How to make a FeedBurner account) Then make the following steps:
Changing the styles:
It will appear as the following
It will appear as the following
- After making your account you have to go to this link (My Feeds)
- You will find your Feed Links choose the submitted link as the following:
- Then Press on Publicize and then on FeedCount option:
- copy this HTML code to the place you want in your blog
Changing the styles:
-
Change the URL "http://feeds.feedburner.com/blogtricksfeeds" to your own feedburner link
This is the standard form of FeedCount
<p><a href="http://feeds.feedburner.com/blogtricksfeeds"><img src="http://feeds.feedburner.com/~fc/blogtricksfeeds?bg=99CCFF&fg=444444&anim=0" height="26" width="88" style="border:0" alt="" /></a></p>
It will appear as the following
-
The animated form: you can choose the animation number (RedText) as:
<p><a href="http://feeds.feedburner.com/blogtricksfeeds"><img src="http://feeds.feedburner.com/~fc/blogtricksfeeds?bg=99CCFF&fg=444444&anim=1" height="26" width="88" style="border:0" alt="" /></a></p>
- You can change text "readers" to the text you want by adding the Red Text as the following:
<p><a href="http://feeds.feedburner.com/blogtricksfeeds"><img src="http://feeds.feedburner.com/~fc/blogtricksfeeds?bg=99CCFF&fg=444444&label=Viewers&anim=1" height="26" width="88" style="border:0" alt="" /></a></p>
It will appear as the following
Check out this Template
While browsing I found a nice template that I liked ... So I will show It to You
For Demo, Click Here
For Download, Click Here
| Language: | English |
| Properties: | 2 Columns, Adapted from Wordpress, Fixed width, Green, Right sidebar |
| Categories: | Geometric, Personal pages |
For Demo, Click Here
For Download, Click Here
FeedBurner Options ( I ) - Email Subscriptions
In this post I will show you how to make E-mail Subscriptions options that's responsible for sending message everyday to your subscribers containing new posts of the day ,If you don't have a FeedBurner account then try this (How to make a FeedBurner account) Then make the following steps:
Tonight I will Continue the options .. Chicklet Chooser and Feed Count
- After making your account you have to go to this link (My Feeds)
- You will find your Feed Links choose the submitted link as the following:
- Here's your Feed Page, at first you will Find the Analyze page ( it's giving you information about the visitors and subscribers ) Then press on Publicize:
- I will show you how to add the following two options, First choose E-mail Subscriptions as the following:
- Press on Activate to activate this service as the following:
- In this page choose your language and copy the HTML (then on the Dashboard -> Layout -> Add a Gadget -> HTML/JavaScript ) and paste it in the content of your gadget:
- At last it will be as the following in my blog:
- You can press on Communication Preferences and write the e-mail verification form that will be sent to your subscribers :
- You can press on Delivery Options and choose the schedule e-mail delivery time (The Time that e-mails will be sent to your subscribers) :
Tonight I will Continue the options .. Chicklet Chooser and Feed Count
Wednesday, February 17, 2010
How to Make a Feedburner account
Today I will show you how to make a Feedburner account and tomorrow I will show you how to add options in it:
- Open Feed Burner Site and write your e-mail and password as the following:
- In the selected text write your blog address as www.e-blogtricks.blogspot.com or any address you use:
- In this page you have to choose Atom class (the link beside it is the new link of Feed posts, save it) and then press next:
- In the Feed title write your blog title and in Feed address write it's name without spaces:
- at last it gives you a page congratulating you and telling you that you have done press next:
How to add a Page in your blog
Recently, blogger launched the most waited option in blogs . Adding Static pages to your blog:
At the Dash Board:
At the Dash Board:
- Click on Edit Posts as following image:
- Click on Edit Pages as the following:
- Click on "New Page" Button because you haven't add any pages yet:
- Now write your title and the content of your page
- Then click on Publish as the following:
Tuesday, February 16, 2010
Some Widgets
Here's some widgets that I liked and I will show it to my lovely visitors:
- Yahoo Media Player: With this very useful widget, you can
easily add a simple media player to your blog which can auto detect mp3 links and create an embedded player. This tool is very useful for especially audio,music blogs.
- whos.amung.us:This is a real time visitor tracking widget and displays the number of people currently on your site and what pages they are reading. You don't need any sign-up's to grab this widget.
- iPod music player: This is a very useful widget, as it gives you full songs of all English and Arabic singers and it don't need any sign-up's to grab this widget
- Search box: This is a useful and easy Search box that can be added by a given code and it don't need any efforts or sign-up's to make it.
- Google Translate Widget: This widget lets your non-English speaking visitors to quickly
translate your webpage in their native language with just one click. It's the same added to my blog
How to remove navbar from your blog
in the Dashboard click on Layout then Edit Html
and then all what you have to do is to find the following code
height:0px;
visibility:hidden;
display:none;
}
and then all what you have to do is to find the following code
#navbar-iframe { and write the following code below it :height:0px;
visibility:hidden;
display:none;
}
- Hint: if there's any changes in your template code as height:1px; or display:visible; you will have to delete it and change it by the previous codes
How to Change Background color & image in blog template
I will show you how to change the background color of your template; as all of people want to change it but they cant :(
In the Dashboard go to Layout -> Edit Html and do the following:
background-color: #0c0c0c;
PLEASE, Continue Reading it's very interesting
In the Dashboard go to Layout -> Edit Html and do the following:
- If you want to change the background color of your template, you have to find body { and change the the red text to the required color:
background-color: #0c0c0c;
- If you want to change the background color of your sidebar only then find the following code and change the red text to your required color:
#sidebar-wrapper {
background-color:#B38481;
PLEASE, Continue Reading it's very interesting
- If you want to change the background color of main post column only then find the following code and change the red text to your required color:
#main-wrapper {
background-color:#B38481;
- If you want to change background image of your template then insert this code and change the URL Image to the image link you want:
body {
background-image: url(URL address of your image);
- If you want to change the background image of the sidebar then insert this code under body { code that we talked about and change the URL Image to the image link you want:
#sidebar-wrapper {
background-image: url(URL address of your image);
- If you want to change the background image of the post main column then insert this code under body { code that we talked about and change the URL Image to the image link you want:
#main-wrapper {
background-image: url(URL address of your image);
How to add Alert Message to your blog
You can add Alert message when visitors open your blog
Alert with Ok button as the following:
You can change the red text or "Welcome to Blog Tricks ..... " to any thing you want
Alert with Ok button as the following:
- In the Dashboard
- Press on Layout
- Then press on Add a Gadget anywhere in your blog,
- Then choose HTML/JavaScript then copy the following code into the content:
<script type="text/javascript">
alert('Welcome to Blog Tricks, Here you can find all you need about blog tricks')
</script>
You can change the red text or "Welcome to Blog Tricks ..... " to any thing you want
How to add Back To Top Icon Link
I found this nice trick so I will show it to you
All what you have to do is to go to Dashboard -> Layout -> then press on Add a Gadget in the place of the "Blog Posts", If you don't have This element you gonna take a look for this topic (How to add more Gadgets in your blog) look at this picture, that's the place where you had to add your gadget:
Then after pressing on Add a Gadget you gonna press HTML/JavaScript then copy the following code by changing the ImageURL to your image link:
All what you have to do is to go to Dashboard -> Layout -> then press on Add a Gadget in the place of the "Blog Posts", If you don't have This element you gonna take a look for this topic (How to add more Gadgets in your blog) look at this picture, that's the place where you had to add your gadget:
Then after pressing on Add a Gadget you gonna press HTML/JavaScript then copy the following code by changing the ImageURL to your image link:
<a style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer;" href='#' title='back to top'><img src="YourImageURL" /></a>
Monday, February 15, 2010
How to change Author comments body
this is an important post as I will show you how to change Author comments form and body ..
go to Dashboard -> Layout -> Edit HTML. Before editing your template, you may want to save a copy of it. so press on Download Full Template.
Click on the “Expand Widget Templates”
Press CTRL+F and find "comments-block", you will get the following block of code (In Black). Add the code (In Red)
********
*********
Then press CTRL + F and find "comment-body" you will find this code (it may differs from blog to other) :
Now add the following code above it :
go to Dashboard -> Layout -> Edit HTML. Before editing your template, you may want to save a copy of it. so press on Download Full Template.
Click on the “Expand Widget Templates”
Press CTRL+F and find "comments-block", you will get the following block of code (In Black). Add the code (In Red)
********
<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt class='comment-author' expr:id='"comment-" + data:comment.id'>
<a expr:name='"comment-" + data:comment.id'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' el='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>
<b:if cond='data:comment.author == data:post.author'>
<dd class='blog-author-comment'>
<p><data:comment.body/></p>
</dd>
<b:else/>
<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
</b:if>
<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='"#comment-" + data:comment.id' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>
</dl>
*********
Then press CTRL + F and find "comment-body" you will find this code (it may differs from blog to other) :
#comments-block .comment-body {
margin:.25em 0 0;
}
#comments-block .comment-body p {
margin:0 0 .75em;
}
Now add the following code above it :
.blog-author-comment {
margin:.25em 0 0;
}
.blog-author-comment p {
margin:0 0 .75em;
padding:5px 10px;
border:1px dotted #254117;
background:#C3FDB8;
}
- You can change background color to any color you want
Subscribe to:
Posts (Atom)