Showing posts with label wordpress. Show all posts

Thursday, 24 January 2013

Top 5 wordpress plugins

Wordpress best 5 plugins

In my previous posts i give you many new blogger widgets which help you to start your blog as a professional blogger But, some of my friends ask me about wordpress and they said me that why i,m not posting about wordpress it is also a good platform for bloggers and then i think that in this week i only post about wordpress . Wordpress is one of the top blogging platform and many bloggers are using wordpress as a blogging platform. Today i,m going to tell you about top 5 wordpress plugins which help you when you are a beginner . Wordpress is not easy as blogger you have to add separate plugins for each functions but if you know that how to add plugins correctly and how to use them correctly then you become a pro blogger.
here's the list of top 5 plugins for wordpress which are better for beginners to start their blogging career with wordpress.

Top 5 wordpress plugins:

All in one seo pack

All in one seo pack is a really good plugin for beginners because it automatically optimize your blog post for search engine optimization. This will help you to get visitors to your blog from search engine. You only need to enter details about your post title, description and meta keywords that are related to your post .

Commentluv

Commentluv is a comment plugin which is installed in your comment system and whenever any user comment on your blog commentluv gives him a opportunity to add a link of his blog . peoples are always searching about commentluv enabled blogs so if you installed this plugin you can get high traffic to your blog.

smush.it

Smush.it is a plugin which automatically optimize your images . Mean if you upload heavy sized image then it will automatically optimized by smush.it and it does not create any effect on your blogs loading time.

Google analytics

Google analytics is one of the most important plugins for wordpress because it will tell you about your user, that how many users visit your blog and how many of them are returned visitors and how many of them are unique visitors. So i really recommend to install it in your wp blog.

Tweetily

Tweetily is one of the most used plugin for wordpress because whenever you publish a post on your blog it will automatically tweet it in your twitter account so you dont need to manually tweet separate posts in your blog

I hope you like my post about wordpress plugins please share it with your friends and keep visiting daily . Thank you

expandable search box like wordpress for blogger

Expandable search boxes with Hover effect

Today i,m going to tell you that how to add expandable search box with or without hover effect. these search boxes are very beautiful and cool to use . These search boxes are made for wordpress site i,m sure you seen them on one of the wordpress blog but you can add them to blogger . It makes your blog more beautiful and creative it is user friendly and it does not have any effect on your blogs speed .

You can watch live demo of these search boxes in my demo blog

Now we are going to add this in blogger Follow my steps.

Steps

1. Goto your blogger account

2. goto page elements and add a gadget

3. select html/javascript and paste below code in it .

For search box with hover effect

<style>
#apple #search {

}

#apple #search input[type="text"] {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1HYSgZHvIWLEmso58qaBf1id4gsaL3gWYsto_ETb6LuXjBmrSl7XZ9qDQi-LcwSWztDVEpMhSJMiqcYuV2N8pMsu8aWfUOfBEGt9jw__ih3UuXrPv0dR5nBa2Ve3vCI9-FN3FDFnizL0/s1600/search-white.png) no-repeat 10px 6px #444;
border: 0 none;
font: bold 12px Arial,Helvetica,Sans-serif;
color: #d7d7d7;
width:150px;
padding: 6px 15px 6px 35px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
text-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
-moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
-webkit-transition: all 0.7s ease 0s;
-moz-transition: all 0.7s ease 0s;
-o-transition: all 0.7s ease 0s;
transition: all 0.7s ease 0s;
}

#apple #search input[type="text"]:focus {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1nlMf81GlYpMM89GUGLD8fL1OCGWuqh7IfdMfp-RYLRGBNuwxLf_VFVFRLoi0S-50RnxlJW5A7kk0xyDS_O5SJIoC7xzoYsWIlr70sVzRoSWnEoFRUE4PaN5HC31j087PP8m2Fs1kkFA/s1600/search-dark.png) no-repeat 10px 6px #fcfcfc;
color: #6a6f75;
width: 200px;
-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(0, 0, 0, 0.9) inset;
-moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(0, 0, 0, 0.9) inset;
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(0, 0, 0, 0.9) inset;
text-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
}
</style>
<div id="apple">
<form method="get" action="/search" id="search">
<input name="q" type="text" size="40" placeholder="Search..." />
</form>
</div>

For Search box without hover effect (white)

<style>
#white #search {

}

#white #search input[type="text"] {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1HYSgZHvIWLEmso58qaBf1id4gsaL3gWYsto_ETb6LuXjBmrSl7XZ9qDQi-LcwSWztDVEpMhSJMiqcYuV2N8pMsu8aWfUOfBEGt9jw__ih3UuXrPv0dR5nBa2Ve3vCI9-FN3FDFnizL0/s1600/search-white.png) no-repeat 10px 6px #fcfcfc;
border: 1px solid #d1d1d1;
font: bold 12px Arial,Helvetica,Sans-serif;
color: #bebebe;
width: 150px;
padding: 6px 15px 6px 35px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
text-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;
-webkit-transition: all 0.7s ease 0s;
-moz-transition: all 0.7s ease 0s;
-o-transition: all 0.7s ease 0s;
transition: all 0.7s ease 0s;
}

#white #search input[type="text"]:focus {
width: 200px;
}
</style>
<div id="white">
<form method="get" action="/search" id="search">
<input name="q" type="text" size="40" placeholder="Search..." />
</form>
</div>

For search box without hover effect(dark)

<style>
#dark #search {

}

#dark #search input[type="text"] {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1nlMf81GlYpMM89GUGLD8fL1OCGWuqh7IfdMfp-RYLRGBNuwxLf_VFVFRLoi0S-50RnxlJW5A7kk0xyDS_O5SJIoC7xzoYsWIlr70sVzRoSWnEoFRUE4PaN5HC31j087PP8m2Fs1kkFA/s1600/search-dark.png) no-repeat 10px 6px #444;
border: 0 none;
font: bold 12px Arial,Helvetica,Sans-serif;
color: #777;
width: 150px;
padding: 6px 15px 6px 35px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
text-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
-moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
-webkit-transition: all 0.7s ease 0s;
-moz-transition: all 0.7s ease 0s;
-o-transition: all 0.7s ease 0s;
transition: all 0.7s ease 0s;
}

#dark #search input[type="text"]:focus {
width: 200px;
}
</style>
<div id="dark">
<form method="get" action="/search" id="search">
<input name="q" type="text" size="40" placeholder="Search..." />
</form>
</div>

NoW save It and its done
please share it with others thank you

wordpress like blogger template

wordpress style blogger template

DEMO | DOWNLOAD

There are many free templates around internet but very few are stylish looking with complete optimized look and speed. You see some of big blogs using very beautiful and stylish templates in their blogs but you cant find them on internet because, they create these templates only for their blog and they dont want them in internet. Like that you see wordpress templates these wordpress templates are very beautiful and also these templates are optimized for SEO . peoples always find templates for blogger in the style of wordpress

So, i have a template which is very cool in looking and it is very fast so i think everybody like this template.
this template is created by fabthemes and NBT convert it into blogger.
there are many features in this templates

FEATURES

Social buttons
search box
popular post widget
post in the box
Wordpress style
fast speed
SEO optimized

How to link social buttons to your profiles

Go to blogger > dashboard > html > edit html
now click proceed
Find below code

<ul class='social'>
 <li> <a href='http://www.facebook.com/username'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhb0wBEHht47gy936QsigKLl3K7MeqMRk4ML8nNMwe1V1FiXqjmjDDC0Yh1WlSvg2mxvSelYwWlrKAglHkA5IIaYvkmjv74JGrhxhyGDWcr9m4x0uy4FfOtAvqAvbBDQGqlqG-7_vhTY_M/s1600/facebook.png'/></a> </li>
 <li> <a href='https://plus.google.com/profileid'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjf18cCRSwPfjt4u3RCFWMQ1F08LGaWd-ZFLShXyw18GseJyzeFyWC94oPXW6Z-HP7TENMdsV65voQx_djIn8CD2KdaDEQB2pFLyjMZ15YNq0AS5XVqmL2et5Ay3QeXeuNK68boRw-RSeA/s1600/google.png'/></a> </li>
 <li> <a href='https://twitter.com/twitter'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggkO3pJ2twazgT1pgxIRb2-x9fkOgSxy4fjUNA4apGk2MW01HFHJy-m3m6zXW5woEoztlb4h-Bsr9JjxcUYrol5WOo44NwfCnIjaMv56PghsjjVCoxxoEdbMp0G5-Vq-EV6mfirnbMeMU/s1600/twitter.png'/></a> </li>
</ul>

Now change these url's with yours

http://www.facebook.com/username

https://plus.google.com/profileid

https://twitter.com/twitter

For setting help please vist http://newbloggerthemes.com/gordon-blogger-template/

I can also help You if you have any question please tell me

How to remove addthis logo from addthis welcome bar

Removing of addthis logo

In my previous post i tell you that how to add/install addthis welcome bar in blogger.com 's blog . but some people having problem with their addthis bar mean that they want to remove addthis plus button from the left side of addthis bar . So now i,m going to tell you about the removing of addthis logo from the side of addthis bar .
first goto addthis.com and copy thae whole code provided by addthis and paste it in your blogger template as i said in my previous post and then cutomize it with your colours .
Now the main part is here these are some steps to remove the branding logo of addthis from the side of addthis welcome bar .

premium editorial wordpress template

.