Showing posts with label tricks. Show all posts
Showing posts with label tricks. Show all posts

Monday, 3 June 2013

Facebook Like Box Pop Up

To create a fan page with a like box, follow these steps:
1. Log in to your facebook account and click here to create a fan page
2. Select a page category depending on what you’re creating a fan page for. You should select Brand or Product if it’s a blog.
3. Select Website as sub-category
4. Enter Your site name in the next available space e.g abcd.com or anything
5. Agree to the terms and continue.
6. The next page takes you to where you’re asked to upload the page’s profile picture. You can use your blog’s logo
7. You can invite your facebook friends to like your fan page or import email contacts to notify about your new fan page
8. Enter the basic info about your blog or website on the next page.

Sunday, 2 June 2013

Create A Facebook Fan Page And Adding Like Box To Blogger

To create a fan page with a like box, follow these steps:
1. Log in to your facebook account and click here to create a fan page
2. Select a page category depending on what you’re creating a fan page for. You should select Brand or Product if it’s a blog.
3. Select Website as sub-category
4. Enter Your site name in the next available space e.g abcd.com or anything
5. Agree to the terms and continue.
6. The next page takes you to where you’re asked to upload the page’s profile picture. You can use your blog’s logo
7. You can invite your facebook friends to like your fan page or import email contacts to notify about your new fan page
8. Enter the basic info about your blog or website on the next page.

Related Post widget for Blogger with Images and Thumbnails

1.Manually ADD post widget for blogger



1. Log in to your Blogger account
2. Go to Template > Edit HTML
3. Click the box labelled “Expand Widget Template”
4. Search for this:
</head>
5. Paste this code above it:
<!--Related Posts widget for blogger Start-->
<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}

#related-posts h2{
font-size: 18px;
letter-spacing: 2px;
font-weight: bold;
text-transform: none;
color: #5D5D5D;
font-family: Arial Narrow;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
border-right: 1px dotted #DDDDDD;
color:#5D5D5D;
}
#related-posts a:hover{
color:black;
background-color:#EDEDEF;
}
</style>
<script type='text/javascript'>
var defaultnoimage=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIV9L9aL81Aa18EG7RR1nluTp5UinvIbxyEBDnkuEO-qelgk7EcDr9fqbLrbFtPIq6GU5QYwOVplT-rUvengzk3lZdJrlok6b8E1ltf7zuPLol8IZgc0QTEuosx9U2UCN8fjhUddL33Jey/s1600/no_image.jpg&quot;;
var maxresults=5;
var splittercolor=&quot;#DDDDDD&quot;;
var relatedpoststitle=&quot;Related Posts&quot;;
</script>
<script src='https://avdhootblogger.googlecode.com/files/avdhootblogger.relatedpostwidget.js' type='text/javascript'/>
<!-- remove --></b:if>
<!--Related Posts widget for blogger End-->
Customizations
If you want to change the default picture in case one of your post does not have any thumbnails then this will appear.so if you want to change the picture then change the URL in RED color.
If you want display more than 5 posts than change the value 5 from 
var maxresults=5;
If you do not want related post widget to appear in homepage also then delete the code in blue color.so your widget will only appear in posts only.

Add share buttons to Bloggger / Blogspot

1. Log in to your Blogger account
2. Go to Template > Edit HTML
3. Click the box labelled “Expand Widget Template”
4. Search for this:
</head>
5. Paste this code above it:
<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript">stLight.options({publisher: "ur-47c9cca-cf33-f245-f3f6-43ed7a58f34f"}); </script>
6. Now search for this:
<data:post.body/>
Note that you will have more than one of this if you’re using a magazine style template. You should keep trying them one after the other and check you blog each time you implement the code to know when it works.
7. Copy this code:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
.doncaprio-share-buttons
{
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
border:1px solid #BBBBBB;
background-color:#FFFFFF;
-webkit-box-shadow: #B3B3B3 5px 5px 5px;
-moz-box-shadow: #B3B3B3 5px 5px 5px;
box-shadow: #B3B3B3 5px 5px 5px;
padding: 5px;
margin: 10px;
}
</style>
<p align='center' class='doncaprio-share-buttons'>
<span class='st_facebook_hcount' displayText='Facebook'/>
<span class='st_plusone_hcount' displayText='Google +1'/>
<span class='st_twitter_hcount' displayText='Tweet'/>
<span class='st_pinterest_hcount' displayText='Pinterest'/>
<span class='st_digg_hcount' displayText='Digg'/>
<span class='st_stumbleupon_hcount' displayText='StumbleUpon'/>
<span class='st_fblike_hcount' displayText='Facebook Like'/>
</p>
</b:if>
If you want the buttons to appear above your posts, paste the code above <data:post.body/>.
If you prefer to have the share buttons just below your content, paste the code after<data:post.body/>.
You can as well put the code in both positions if you like.

Statcounter in Blogger


1.Click on your Layout


2.Click on Add a Gadget




Saturday, 1 June 2013

Abtely Two Column Blogger Template

Techstop 2 Column Blogger Template

Pegasus 2 Column Template

Template author: BloggerTheme
Designer: Web2Feel
Description: Pegasus is a free blogger template adapted from WordPress with 2 columns, right sidebar, rounded corners and footer columns.

Colors Idea 2 Column Blogger Template

Template author: BloggerTheme
Designer: New WP Themes
Description: Prestij is a free blogger template adapted from WordPress with 3 columns, two right sidebars and a light colour. It’s got a simple, cool look.

Alfina 3 Column Blogger Template

Template author: BloggerTheme
Designer: New WP Themes
Description:
Alfina is a free blogger template adapted from WordPress with 3 columns, two sidebars on the left and right with a cool look. It sports a dark and gray colour.

My Menu 3 Column Blogger Template



Template author: BloggerTheme
Designer: New WP Themes
Description: My Menu is a free blogger template adapted from WordPress
with 3 columns and sidebar both on the right and left. It is a green theme taht loooks really cool.

Bionex 3 Column Blogger Template

Template author: BloggerTheme
Designer: New WP Themes
Description: Bionex is a free blogger template adapted from WordPress
with 3 columns and sidebar on the right and left.

Too Newsy Three Column Blogger Template

Template author: LiteThemes
Designer: Sophia Lucero
Description: Too Newsy is a free blogger template adapted from WordPress
with 3 columns, right sidebar and simple look


Atimex 3 column Blogger Template

Template author: BloggerTheme
Designer: New WP Themes
Description: Atimex is a free blogger template adapted from WordPress with
3 columns, sidebar on the right and left and simple look. It’s a dark theme that can actually make your blog stand out.

How To Install Blogger Templates

Log in to your Blogger account.

1.Now click on the drop down menu and choose Template.



2.Press Backup/Restore button located at the top right corner.



3.First you should download your existing template as a backup. So, click on "Download full template" button.



4.Now click on Choose File button and choose your new template which you want to apply to your blog.


5.Once you select your template, simply click on Upload button for final step.



You are done!


Best Free Blogging Platforms of 2013

1.       WordPress
2.       Blogger
3.       Blog.com
4.      Blogdive
5.       Jux
6.       Tumblr
7.       Posterous Spaces
8.       Blog.co.uk
9.       Blogetery
10.     Weebly
11.     FreeBlogit
12.    LiveJournal

Change Blogger Banner/Header


1.Click on your Layout,

2.You can access all of your sidebar gadgets/widgets (same thing), and your header and footer. You will see a space at the top to "Header".Click Edit



3.If you click that, a window will open that allows you to configure your header. You can upload a custom or free header here, an image of your own, or just type in a name. There are options to allow your header appear instead of the text, and you can shrink it to fit a certain size. So check out all the options before you click Save!

You are done!








Add Meta Tag In Blogger

1.Sign in into your blogger blog and click on template
2. Now select EDIT HTML 
3.Now find this code (press CTRL + F )
<b:include data='blog' name='all-head-content'/>

4. Now add bellow code just after the above code see in the figure.
<meta content='your description here' name='description'/> <meta content=' your keywords here' name='keywords'/> <meta content='your name' name='Author'/> <meta content='your email address' name='Email'/> <meta content='global' name='distribution'/> <meta content='5 days' name='revisit'/> <meta content='5 days' name='revisit-after'/> <meta content='document' name='resource-type'/> <meta content='all' name='audience'/> <meta content='general' name='rating'/> <meta content='all' name='robots'/> <meta content='index, follow' name='robots'/> <meta content='en' name='language'/> <meta content='IN' name='country'/> <meta content='blogger' name='generator'/>
Now add description , keyword , your name and your email address and just click on save and you have done !

Remove Blogger Navbar


Blogger have many features some are good some are bad. One of the blogger feature is navbar but most of the bloggers hates the navbar. I recommend to use Custom blogger template which is better then the blogger’s template. Well if you still want to use blogger’s template and wanted to remove the blogger navbar then simply follow the simple steps.

1. Login into your blogger blog. 
2. Go to template and click on Edit Html 
3. Now search <b:skin><![CDATA[ and paste the following code just after it. 
#navbar-iframe { 
display: none !important; 
}