Rebel Blogger Template

3 commentaires








Template Name : Rebel Blogger Template

Template Author : themelib

Designer : http://wpthemedesigner.com/

Basic Instructions : How to install a Blogger template

Descriptions : - 2 Columns, wp theme,Fixed ,Ads Ready,Fresh and clean Blogger template,, Gray color background,,Nice top menu bars,Top RSS,Search gadget ,Followers,Blogroll,Achieves,
Alternative text

Netdohoa Blogger Template

1 commentaires








Template Name : Netdohoa Blogger template

Template Author : netdohoa

Designer : http://www.netdohoa.com

Basic Instructions : How to install a Blogger template

Descriptions : - 2 Columns, Fixed ,wp theme,Ads Ready,Fresh and clean Blogger template,, Gray and white color background,,Nice top 2 menu bars,Search gadget ,Followers,Friends ,Categories, Blogroll,Achieves,
Alternative text

How to Add Bookmark Us Hyperlink to Blogger Blogs

1 commentaires



For your website to have traffic, people should remember your site and visit again. This problem was solved long time ago with browser's Bookmarks. Still, people are lazy and usually are not using it, unless you remind them. so you can add a quick "Bookmark this page" link in all your pages. Clicking on the link prompts the user with a dialog box to add the specified URL to the Favorites list.

Login To Blogger Go To > Design > Edit HTML.

and mark the tick box "Expand Widget Templates"

Then, find (CTRL+F) this code in the template.

</head>
And immediately before it, paste this code:
<script src='http://yourjavascript.com/0514111300/bookmark_this_page_royaltutor_net.js' style='text/javascript'/>
Now click Save Template.

Then, Go To > Design > Page Elements.

Simply add a Gadget of HTML/JavaScript type and add the code given below
<a href="javascript:bookmarksite('WEBSITE NAME GOES HERE', 'URL GOES HERE')">Bookmark This Site</a>
and to change the text to image / button , we should replace the word Bookmark This Site in the code with the following
<img src="URL-OF-BOOKMARK-BUTTON"/>
Finally save your template and you are done!
Alternative text

How to Change Feedburner Email Subject Line

4 commentaires


One of the best ways to build a loyal readership for your blog is to encourage visitors to subscribe via e-mail or RSS feed. FeedBurner is one of the most popular feed management solution that is available today for absolutely free of charge. Many bloggers use FeedBurner to manage their blog’s feed.

I noticed that the email subject line for my blog feed was always “Royal Tutor”. This does not give any information about what the email is about and the subscriber has to open the email before he can see the post title. Here’s how to tweak your FeedBurner settings so it will create dynamic Subject lines

1. Log in to your Feedburner account.
2. Click the name of the feed you want to update.
3. Click the “Publicize” tab.
4. Choose "Email Subscriptions" from the navigation menu 
5. That’ll open a sub-menu. Still in the left sidebar, click “Email Branding.”
6. Change what you want your subject line to be under the "Email Subject/Title" box.





If you update your blog more than once a day, click the box that says, “Change Subject when an email has 2 or more items” and use following codes:
Examples
  • To replace email subject line with your "last post title"
${lastestitemTitle}
  • To replace email subject line with your "last post title - blog name"
${latestItemTitle} - Your blog name
You can also use
Your Blog Name - “${latestItemTitle}” plus ${m} more
Your Blog Name (in this message: ${n} new items)

${n}: shows the total number of items
${m}: shows the number of items beyond the latest

So what are you waiting for?
Alternative text

Make Blogger Post Title Unclickable In Single Post Page

2 commentaires

 
If you want to make your blog post title unclickable in single post view then this tutorial is present for you. You might have notice that the titles of single post in this blog are unclickable.If not, view this post title. Then you see its unclickble. Now visit the homepage of this blog, then, look at any of the post titles. You can see the title is clickable and easily go inside the post by clicking the title of a post. So let’s do it,

Login To Blogger Go To > Design > Edit HTML.

and mark the tick box "Expand Widget Templates"

Then, find (CTRL+F) this code in the template.

<b:if cond='data:post.title'><h2 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></h2>
Please note that this code block not be similar in your template. I use H2 tag. But in your case it might be H1 or H3Now, replace the above code with the following:

<b:if cond='data:post.title'><h2 class='post-title entry-title'><b:if cond='data:blog.pageType == "item"'><b:if cond='data:post.link'><data:post.title/><b:else/><b:if cond='data:post.url'><data:post.title/><b:else/><data:post.title/></b:if></b:if>
<b:else/><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></b:if></h2> 
 Now save the template and See how it work.

Alternative text

Collapsible Message Panels On Blogger

6 commentaires


collapsible-effect-blogger
When I was browsing a design blog called "impressivewebs", I found a header that could collapse itself. Impressed by the effect, I sat down to work out the logic and it was pretty simple to achieve it on blogger. In this article, I'll illustrate the collapsible effect with simple message panels while you may apply the same logic to your header or post area or to any widget of your choice.

COLLAPSIBLE MESSAGE PANELS ON BLOGGER - LIVE DEMO

So, take a look at the live demo by hitting the link above. I guess you liked it... Interested to add this on your blog, as well? Then, follow the steps below.
1. Navigate to "Design>>Edit HTML" and make a backup of your template by clicking on the "Download full template" link at the top of the page. Once the back up is over, search for the following piece of code.



]]></b:skin>
2. Just paste the following piece of code above the line mentioned at step 1.
.message_list {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 383px;
}
.message_list li {
    padding: 0;
    margin: 0;
    background: url(https://lh5.googleusercontent.com/-rFKQUJCuaBU/TkdtUFeNzGI/AAAAAAAABec/bn_KIzqh03c/s800/message-bar.png) no-repeat;
}
.message_head {
    padding: 5px 10px;
    cursor: pointer;
    position: relative;
}
.message_head .timestamp {
    color: #666666;
    font-size: 95%;
    position: absolute;
    right: 10px;
    top: 5px;
}
.message_head cite {
    font-size: 100%;
    font-weight: bold;
    font-style: normal;
}
.message_body {
    padding: 5px 10px 15px;
}
.collapse_buttons {
    text-align: right;
    border-top: solid 1px #e4e4e4;
    padding: 5px 0;
    width: 383px;
}
.collapse_buttons a {
    margin-left: 15px;
    float: right;
}
.show_all_message {
    background: url(https://lh3.googleusercontent.com/-SYzKGAtmZa8/TkdtUMVjh4I/AAAAAAAABeY/VXlnQnXlEQ4/s800/tall-down-arrow.png) no-repeat right center;
    padding-right: 12px;
}
.show_recent_only {
    display: none;
    background: url(https://lh6.googleusercontent.com/--99zjaBlqYY/TkdtURvdWRI/AAAAAAAABeg/Z8Yismgt5YY/s800/tall-up-arrow.png) no-repeat right center;
    padding-right: 12px;
}
.collpase_all_message {
    background: url(https://lh4.googleusercontent.com/-_mvlatWt3m4/TkdtUCz8LII/AAAAAAAABeU/mctqJi0fkbs/s800/collapse-all.png) no-repeat right center;
    padding-right: 12px;
    color: #666666;
}
Note: I've used an image for the title part of the image. You may replace the same with gradient colors using CSS. Refer the following article to do the same - Cross-Browser Gradient Effect Using CSS
3. Next, search for the following piece of code.
</head>
4. Paste the following piece of code just above the line mentioned in step 3. Save your template.
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
    //hide message_body after the first one
    $(&quot;.message_list .message_body:gt(0)&quot;).hide();
    //hide message li after the 5th
    $(&quot;.message_list li:gt(4)&quot;).hide();  
    //toggle message_body
    $(&quot;.message_head&quot;).click(function(){
        $(this).next(&quot;.message_body&quot;).slideToggle(500)
        return false;
    });
    //collapse all messages
    $(&quot;.collpase_all_message&quot;).click(function(){
        $(&quot;.message_body&quot;).slideUp(500)
        return false;
    });
    //show all messages
    $(&quot;.show_all_message&quot;).click(function(){
        $(this).hide()
        $(&quot;.show_recent_only&quot;).show()
        $(&quot;.message_list li:gt(4)&quot;).slideDown()
        return false;
    });
    //show recent messages only
    $(&quot;.show_recent_only&quot;).click(function(){
        $(this).hide()
        $(&quot;.show_all_message&quot;).show()
        $(&quot;.message_list li:gt(4)&quot;).slideUp()
        return false;
    });
});
</script>
Note: Do not include the first line in the script mentioned above if you've already added the latest jquery file on your blog. 
5. Now, paste the following piece of code in the document - HTML FOR COLLAPSIBLE EFFECT, anywhere inbetween your <body> and </body> tags - probably within the post editor (or) below <div class='main-wrapper'> (or) <div class='columns fauxcolumns'>.
6. That's it! Save your template or publish the article and view the same to enjoy the effect.

HTML CUSTOMIZATION - FOR CODE MENTIONED IN STEP 5
If you wish to generate the time for your messages (displayed at the top right) by default, then change the text that appears in between  <span class="timestamp"> and  </span> tags. Similarly, you can change the text from "NAME" and "CLIENT" with your names and clients respectively. I've added my name and a small message in the first few div tags for reference. Check the same (code mentioned in text document at step 5) for your reference.

I've tested the above effect on all the major browsers which includes, but not limited to, IE, FF, Chrome, Safari and Opera. Let me know if you find some bugs with the above coding. If you need assistance in extending this effect to other elements on your blog, then leave a comment below and I'll help you out when I'm free:) Do share your opinions about the article via comments!


Alternative text

Google Sitelinks Updated - An Improved Version

1 commentaires


google-sitelinks
Google has constantly been rolling out some prominent changes via updates on PR, Google+ Games, Authorship Markups, etc... Today, I noticed one such update which is about, the way in which the sitelinks show up on Google search. If you wonder what sitelinks are, they are basically links from your blog that appear below your domain name which Google feels useful to the reader - usually appears when a person searches for your domain name.

Earlier, Google used to display eight sitelinks - just links. But, now it's completely different. The recent update shows 12 sitelinks with a small snippet about your articles - not a snippet, probably the first phrase from your article. You may check out the screen shot below to better understand about the way in which the new sitelinks are displayed - sitelinks generated for "newbloggingtipz" on 19th August.

Since sitelinks are auto generated by Google with their special algorithms specifically written for the same, no one can actually tell you about getting sitelinks for your blog. However, I recommend you to read the following article which might probably fetch you one - How To Get Google Sitelinks For Your Blog? I also recommend you to install breadcrumbs for better results - Add Breadcrumb Navigation To Blogger.

Now, what if your unhappy with a link that appears below your domain name and you wish to remove the same. Very Simple! Login to your "Webmaster Tools" account and navigate to "Site Configuration>>Sitelinks" from your dashboard. Now, paste the URL you wish to remove and hit the "Demote" tab. That's it! Your done. 

You'll not see that link from the next day - takes time to process your request. As such, you can demote upto 100 URLs and they are effective only for 90 days which means they might pop up again after a period of 90 days. So, you need to demote them every 90 days. You can read more about this topic here - Sitelinks.

Let me know if you made use of the demote/deletion tool to display better links to your readers? And do share your knowledge about Sitelinks with us via comments...
Alternative text

 

Sponsors

Protected by Copyscape Web Copyright Protection

All For Blogs. Copyright 2011 All Rights Reserved powered by Revolution Church Theme hosted on Blogger