Multi-Colored Popular Posts Widget for Blogger powered CSS3

     

Popular Posts Widget is a Widget providing by Blogger and we can add it to our Blog. This Widget displays the Most viewed posts of your blog, that may be of Month or in Week or All the time. You can select how Popular posts are to be displayed.By default it shows an image(if the post has) and Title of Post followed by the content of post wrapped by 20-25 Words. This article is a tutorial to Style that Popular posts Widget to an Awesome Multi - colored Popular posts Widget. This trick is done using simple CSS3 rather than using complex JavaScripts. A great feature of this trick is each Post shown in each Flat UI color, so these colors catches your Blog visitor's eyes and they have the tendency to take that post even if the Post is not so good. Sign in to your Blogger Account and Active Popular Posts Widget

First Add Popular post Widget to Blogger

• Go to Layout -> Select "Add a Gadget" and take Popular Posts Widget from the Widget List appear.
• Give Title of widget, select how the popular posts should be appeared(in Month,or Week or All time) and click Save 

Go to Template -> Edit HTML, Find ( Ctrl + F ) ]]></b:skin>

Copy the following code and Paste just above it

<!-- Popular posts multi colored UI theme -->

#PopularPosts1 ul{margin:0;padding:5px 0;list-style-type:none}

#PopularPosts1 ul li{position:relative;margin:5px 0;border:0;padding:10px}

#PopularPosts1 ul li:first-child{background:#ff4c54;width:97%}

#PopularPosts1 ul li:first-child:after{content:"1"}

#PopularPosts1 ul li:first-child + li{background:#ff764c;width:87%}

#PopularPosts1 ul li:first-child + li:after{content:"2"}

#PopularPosts1 ul li:first-child + li + li{background:#ffde4c;width:84%}

#PopularPosts1 ul li:first-child + li + li:after{content:"3"}

#PopularPosts1 ul li:first-child + li + li + li{background:#c7f25f;width:81%}

#PopularPosts1 ul li:first-child + li + li + li:after{content:"4"}

#PopularPosts1 ul li:first-child + li + li + li + li{background:#33c9f7;width:78%}

#PopularPosts1 ul li:first-child + li + li + li + li:after{content:"5"}

#PopularPosts1 ul li:first-child + li + li + li + li +li{background:#7ee3c7;width:75%}

#PopularPosts1 ul li:first-child + li + li + li + li + li:after{content:"6"}

#PopularPosts1 ul li:first-child + li + li + li + li + li +li{background:#f6993d;width:72%}

#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after{content:"7"}

#PopularPosts1 ul li:first-child + li + li + li + li + li + li +li{background:#f59095;width:69%}

#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after{content:"8"}

#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li{background:#c7f25f;width:66%}

#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after{content:"9"}

#PopularPosts1 ul li:first-child:after,

#PopularPosts1 ul li:first-child + li:after,

#PopularPosts1 ul li:first-child + li + li:after,

#PopularPosts1 ul li:first-child + li + li + li:after,

#PopularPosts1 ul li:first-child + li + li + li + li:after,

#PopularPosts1 ul li:first-child + li + li + li + li + li:after,

#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after,

#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after,

#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after{position:absolute;top:20px;right:-15px;border-radius:50%;background:#353535;width:30px;height:30px;text-align:center;font-size:28px;color:#fff}

#PopularPosts1 ul li .item-thumbnail{float:left;border:0;margin-right:10px;background:transparent;padding:0;width:70px;height:70px;}

#PopularPosts1 ul li a{font-size:13px;color:#444;text-decoration:none}

#PopularPosts1 ul li a:hover{color:#222;text-decoration:none}

#PopularPosts1 img{

-moz-border-radius: 130px;

-webkit-border-radius: 130px;

border-radius: 130px;

-webkit-transition: all 0.3s ease;

-moz-transition: all 0.3s ease;

transition: all 0.3s ease;

padding:4px;

border:1px solid #fff !important;

}

#PopularPosts1 img:hover {

border-radius: 0 0 0 0;

-moz-transform: scale(1.2) rotate(-711deg) ;

-webkit-transform: scale(1.2) rotate(-711deg) ;

-o-transform: scale(1.2) rotate(-711deg) ;

-ms-transform: scale(1.2) rotate(-711deg) ;

transform: scale(1.2) rotate(-711deg) ;

}

<!-- popular posts multicolored UI theme -->

• Click on Preview Template (You can see the template without saving)
• Save the Template.

View Your Blog it is ready to attract users. I think this article will help you if so please share and Like us to spread our Blog.
If any problems with this trick don't hesitate to ask, do comment here...

How to Make Blog Fast and Faster

Hi, friends! Advance, I've posted about a trick to solve How to Make Blog Fast. That's Boost Blog Speed with CSS Compressor. But, now I will discuss some problems to make blog faster. Who don't want their blog become light, surely all of bloggers want it because our visitors can browse our blog easier.

Based on my experience, there are some tricks to make blog fast :

• Picture

Did you know, pictures with large size can make our blog become slower. So, it's better for you to decrease the use large-size picture. Both in template and also posts. You can use Photoshop Save for Web & Device trick.

• Widget

Over usage widget was one of problems which makes blog become slower. Especially if the widget contains heavy scripts. It's good for you to delete some widgets which unuseful such as clock, music player, pet, games, and so on. Use useful widget such as related posts, most popular articles, or maybe Google Friend Connect.

• CSS and Javascript

As we knew, CSS and javascipt can make our blog become good looking. But the side effect is it can make our blog become slowly. So you should decrease the usage or compress it for your blog. To compress Javascript, you can use Javascript Compressor.

Epilog How to Make Blog Fast and Faster: I think good blog should have a good looking and fast loading. But, don't reduce your creativity on blog. Stay blogging!

How-To: Reduce The Space Between Gadgets/Widgets [Blogger]

>

By default, Blogger sets a margin of (don't quote me on this) roughly 30px between gadgets/widgets. If you have a lot of gadgets or are using the HTML/Javascript gadget to add image titles like I have for a lot of my right sidebar, 30px between each gadget is just too much.

How adjust the space between Blogger widgets!?
To adjust the spacing between gadgets simply follow these easy steps.
Go to Template > Customize > Advanced > Add CSS
Paste in the following code:

.widget {
    margin: 5px 0 0 0;
}

Adjust the margin height. I have mine set to 5px.
Once you have entered this code and adjusted the width, you should be able to see the preview in the preview pane below. If you are happy with the size, click Apply to Blog.

Why Search Engine Optimization Is Needed To Make Your Website Popular?

Whenever a query is entered in the search engine and ‘enter’ is hit,  a list  of results  containing the query term is displayed. The websites mentioned at the top of the list are  preferred by the users as those  are  generally  more  relevant to the query. Some of  the  websites obtain a better rank in the web  world  because of  a  powerful and effective web  marketing   technique   known  as  SEO  or Search Engine Optimization.The site which uses this  technique  is  found  and ranked higher than  thousands of other websites in the search engine. It thus helps the site in getting traffic from the search engines.

The Working Of Search Engines

The truth of a search engine is that it is not a human. So the searching process is different from that of humans. A search engine views a web page in a different manner. It is more text driven. There are limitations in the intelligence and understanding of the search engines. They mainly look for the matching site items which are texts generally and get a nearby idea of what the site is all about.

The Different Processes

The search engines perform several processes such as crawling, processing, indexing, relevancy calculation and retrieving. Crawling For Improving The Seo First is the crawling process. The web is crawled by the search engine to see what is present there. The ‘spider’ or ‘crawler’ is the software which performs this task. The links are followed by the spiders from one web page to another and the findings are indexed. As there are over 20 billion websites, it is impossible for the crawler to pay a visit to each and every site daily for checking the modification or addition of new pages to the existing page. Sometimes spiders even end up not visiting a particular site for one or two months.

Indexing In Seo

After completing the process of crawling, indexing of the content is done. Giant databases store  the indexes for future retrieval. Words and expressions which properly describe the page are  identified and it is assigned to some particular or specific keywords. It is impossible for the humans to process such a huge amount of information but the search engines can do this work with ease. If the search engine can recognize the meaning of a page more appropriately then it helps the web page in getting higher rankings.


Processing, Relevancy Calculation And Retrieving

During a search request, the search engine processes the strings and compares it with the pages that are indexed in the database. Millions of web pages can contain the same string, so relevancy of the searched string with each of the indexed pages is calculated. There are many algorithms for calculating relevancy. The algorithms of the search engines keep on changing from time to time.  So in order to keep a higher ranking, the websites must stay updated and adapt with the new changes in algorithms. That is the reason SEO or Search Engine Optimization is needed. The last process is the retrieve of the results. The results are displayed in the browser.

4 Proven Tactics to Get More People to Read Your Blog (Quickly)

What is the essence of having a blog that does not have readers to read the content?

What is the essence of writing everyday without getting visitors to your blog?

Are you in a Dilemma over this?

Worry no more; just make sure that you read each and every line of this blog post!

As a blogger, we derive joy from our blog when we see loads of visits and comments by readers on our blog posts. This motivates us and tells us to work more to get even better results. Again on the other hand, no blogger will feel happy when he will see that his hard worked content is invisible to the world and no one is reading it.

A lot of bloggers are experiencing this problem. They might have tried various means to get more readers to their blog, but all to no avail. So I have a good news for you today. Now you don’t have to worry anymore. I’ll be sharing with you some proven methods to improve your blog’s visibility.

So, let’s get started with it!

1. Create Great Content.

For those who don’t know, a blogs success depends mainly on the quality of content it provides. And if you take a close look to every successful blogs around you, you will discovered that they didn’t become a top blog by luck or fluke, rather they became an authority by providing values to their readers.

Content creation as gone past the era of just putting words on paper, in this new era, you need to give people quality pieces that will educate and interest them. You should not just write for writing sake, rather you should write articles that people will love and be willing to share.

You may be wondering why your content is important for getting more visibility for your blog. The reason why your content is very important is because this is the only way to prove your expertise and attract more readers.

If you provide quality content and a reader comes across one of your post, you have a higher tendency of getting a comment and social media share from such reader; and If this reader shares your post on Facebook and Twitter, you tend to reach a new set of audience which is his/her followers and hence you get more visibility and readership for your blog.

When you create great posts that people will love and want to share, you will naturally get attention and recommendation from people. Readers will gladly share and recommend your blog to their friends, relative and tribes; thereby increasing engagement in your blog.

Creating great content is a surefire way of getting free promotion from people, and as you may have heard, “people tend to buy from people they know (trust), so why not create great contents for people and increase your readership?

2. Engage in Guest Blogging.


Take it or leave it Guest Blogging Works! A lot of bloggers like Bamidele Onibalusi, and Danny Iny have achieved great success with their blog within a short period of time with the help of guest blogging. They built authority blogs within a short period of time with no much extra effort other than guest blogging.

Guest blogging gives you the opportunity to showcase your blog and your skills to a new set of targeted readers that may end up becoming loyal readers; With guest blogging, you don’t need to worry about getting people to read your content, the host blog already has a followership of loyal readers who are eagerly waiting for your post!

With guest blogging, your content already has ready-made consumers who are eagerly awaiting what you have to offer them. All that is left for you is to take your time to come up with something educative and interesting! The kind of post that your host blog readers will love to read and share.

Take your time to go through your host blog’s recent posts (minimum of five) to have an idea of the kind of posts that the community there loves and come up with a good complimentary post on those subjects and send it in. Always try to stand out in crowd in guest blogging blogs.

If you are able to put in your best and you are able to come up with something Great, then you are on your way to more readers and visibility.

So, if you are struggling with getting more blog readers, I will strongly suggest you give guest blogging a trial and I know the result will amaze you.

3. Use Social Media.

Social media is one platform that you should never underestimate as a blogger! If you share good content and engage well you will be amazed to see the increase in readership of your blog. Social networking sites like Facebook and Twitter helps a lot in getting more exposure for your blog.

When I check my referral traffic statistics in analytics, I have found Facebook and Twitter to top the list of my referral traffic list and I believe this is the same for most bloggers out there.

If you want to really increase your blog visibility via social media, I will advise you to look for those social networking sites where you know people in your niche do engage pretty well, join them and connect with like minded people there.

Personally, I will always recommend Twitter and Facebook to anyone because they are the most widely used and they are quite effective for increasing a blog’s readership.

If you are looking to get more from social media, especially Twitter. I will recommend you make use of various social media tools that are available on the internet one of such tools, of which my favorite is JustRetweet. It is a tool that helps you get more tweets and retweets for your blog post and it is absolutely free to join.

4. Join Blog Communities.

Blog communities are great communities where bloggers from various walks of life in different countries come together to share their content and interact with each other.

I have benefited a lot from the love of blog communities especially BizSugar, which once topped the list of my referral traffic sources. If you want quick exposure and more readership for your blog, I can gladly tell you that blog community is the way to go for you.

Most blog communities are free to join and you get to share your content with the whole community. You get an instant visibility and traffic to your blog. You can join some blog communities like Blokube, Inbound, Tagza etc…

To get the best of blog communities, make sure you try to follow people in your niche and vote for their contents and they will probably do the same foe you too. You should also try to submit other peoples post once a while; also comment on other people’s submission and don’t just make everything to be all about your blog only!

Reduce Space Between Gadgets In Blogger blog

How to Reduce Space Between Gadgets(widgets) In Blogger blog:

<input type="hidden" name="IL_IN_TAG" value="1"/>

By default large space is there between gadgets(widgets) in blogger blogs.We can decrease or increase space between gadgets(widgets) in blogs.This posts will help you to reduce space with out adding any CSS code to blogger, just simply change(decrease) margin values in blogger template.
fallow the below simple steps to Reduce Space Between Gadgets(widgets) In Blogger blog
step 1 : go to blogger dashboard

step 2 : click on template

step 3 : click on edit HTML and tick expand widget templates box

step 4 : search below code

.main-inner .widget {
  background-color: $(widget.background.color);
  border: 1px solid $(widget.border.color);
  padding: 0 $(widget.padding.side) 15px;
  margin: 20px -16px;


decrease values in margin attribute
like
margin: 10px -10px;

if you want decrease more space give small values in margin attribute.

step 5 : click on save template.

How To Convert Blogspot To .Com Website Free

How To Convert Blogspot To .Com Website Free

<input type="hidden" name="IL_IN_TAG" value="1"/>

Blogger is a very popular and completly free blogging platform for bloggers. Blogger have very easy commands and feature. Blogger is very helpful for newbie bloggers. After setting up your free Blogger blog. You can convert it to a standard website completly free. Whereas in Wordpress you need to pay some money to convert your blog into a website. Here in this article we are discussing complete method of converting your blogspot blog into standard .com website.
Want to convert yourblog.blogspot.com to www.yourblog.com. Follow these steps

Convert Blogspot to .com

<input type="hidden" name="IL_IN_TAG" value="1"/>

First login to your blogger account. Then select the blog which you want to customize (if you have more than one blog)
After it click on Setting at the left bottom corner.

After it in the Blog Address column, click on Add a custom domain link.

Now click on Switch to advanced setting. And type the desired standard url (in www.ur url name.com format)

After typing url click on setting instruction. If it ask for Leave this Page then click on leave this page.

After doing it, a new page will open ask you to select domain type, then select top-level domain. When you select top-level domain, it will ask to add 2 CNAME and 4 A-record in you domain registrar control panel. Just login to your domain registrar account and add the record shown by setting instruction.

After adding records wait for at least one hour to update your DNS setting then return to your blogger account Setting>>Basic tab>>Publishing>>Add a custom domain>>Switch to advanced setting , then type your standard url (www.your url name.com format) and click on Save button.

Finish