Saturday, 8 November 2014

Simple Css3 Drop Down Navigation Menu Bar For Blogger :

Simple Css3 Drop Down Navigation Menu Bar For Blogger



 Css3 Drop Down Navigation Menu Bar


In this tutorial im gonna explain how to add simple Css3 drop down  menu  bar for your  blogger  There are small icons  on  sub  menu. This  menu bar  works  with every internet  browsers.You can   link with  your main  pages by  using  this  navigation. Im   using  Css3  and  HTML, Just check out demo.Its easy to add to blogger get my

1. Log in to blogger account and Click drop down. 

Demo

2. Now select "Template" Like Below.

Demo

3. Now you can see Live on blog, Click EDIT HTML Button"

4. Now click Proceed button.
    
5. Find this tag by using Ctrl+F    ]]></b:skin>

6. Paste below code Before ]]></b:skin> tag






7. Go to blogger and click Layout 

8. Click Add Gadget and select 'HTML/Javascript

9. Paste below code.





Replace # with your links.

10. Now save your HTML/JavaScript'.
    You are done...


Please Like This  Post   >>




read more...

Wednesday, 5 November 2014

Popular Posts With Automatic Numbering Bubbles

Popular Posts With Automatic Numbering  Bubbles


Popular posts widget is an effective tool to increase your blog pageviews and engage readers more on your blog. It fetches and ranks posts based on most visited pages using your Google analytics data.


Add Popular Posts Widget

  1. Go to Blogger > Layout
  2. Click "Add a Gadget"
  3. Choose "Popular Posts"  from the list
  4. You will need to configure its settings as shown in the image below: uncheck "image thumbnail" and also "snippet"   Its better that you display at most 7-9 posts. Less is good and clean.

Popular Posts With Automatic Numbering  Bubbles

    5.  Save it



Customize Popular Posts Plugin

Now you need to change the default styles and change its look to our desired design using Custom styles.
  1. Go To Blogger > Template
  2. Backup your Template
  3. Click Edit HTML
  4. Search for </b:skin>.  Click the black arrow to expand the code.

Skin


5.  Paste the following Styles just above </b:skin>









Customization:
  • To change the background color of the Square bubble edit #292D30
  • To change the text color of the bubble edit #ffffff
  • By default the shape of the bubble is Square. To change it to Circle simply add the following code just after box-shadow: 1px 2px 9px #666666
  • Border Radius ; 15 px

   6. Save your template and you are all done!

Visit your blog to see it working just perfectly.
If you would wish to add it inside a Multi Tab Widget just like we have done on our blog, then you can find several tutorials on our blog that were released years ago on Multi Tabs. Please read one below:

Autor : Mian Fx   

Please Like And Share 


read more...

Monday, 3 November 2014

Add Beautiful Label Cloud Widget In Blogger

Add Beautiful Label Cloud Widget In Blogger




Add a beautiful and stylish effect in Blogger labels. By this you can give a beautiful CSS effect to your Blogger  Labels. By default Blogger cloud widget  is not well beautiful but we can make it

more beautiful and stylish CSS effect to your labels. It can make a good  impression to you blog readers and this will appear on the right side of you site template. For this cause today i am making a post on Labels Widget so lets start our work.


How To Add Label Cloud Widget In Blogger?


To add this widget follow these simple steps:-
  • Go to Blogger > Template > Edit HTML
  • Now search for ]]></b:skin> using ctrl+f
  • Paste the following code above ]]></b:skin>





  • Save your template and you are done
Autor : Mian Fx




read more...

How To Create The Perfect Landing Page For Your Website

 Create The Perfect Landing Page For Your Website


Landing pages can be powerful, if used effectively. The first page visitors see when they land on your website is the landing page, so by definition, a simple static homepage or content page can be a landing page too. Customized landing pages sure help users in some cases, what do search engines think about? Today, we'll talk about landing pages that are frowned upon, and things that will make your landing pages great.

How search engines look at landing pages

For the most part, search engines encourage webmasters to have landing pages as they are good for channeling sales. But what they don’t endorse is low-quality pages that only have a call to action and a conversion link - no content of value. Here’s what Google looks at when ranking landing pages;
  • Originality – It goes without saying that the content on the page shouldn't be present anywhere else on the web.
  • Relevance – This is what the Google Panda is all about. A page should deliver what was promised in the title and meta description on the results page. It makes for a poor user experience if users have to work for the desired information (further clicks, content hidden or subdued by within other irrelevant content etc.)
  • Availability – The information should be readily available. I have seen websites ask for email subscription in a popup, which only disappears after you comply. Hiding information behind an opt-in form or an unnecessary call-to-action won’t score you any points with search engines.

How to improve your landing pages

Often the best sources of best practices are search engines themselves. Both Google and Bing have support pages to help webmasters design a better landing page experience for their users. Here are some useful best practices;

Pack a punch of value and relevance - This means centering the text around the text you used in your ads, and around y our keyword. It means providing useful information directly relating to your product and the keyword. Essentially, it all boils down to one thing; providing the information necessary to convince a user why they need your product.

Make content easily accessible - Make sure users can find your contact information, either on the landing page or through an easily-accessible about page. Make sure that, any time you ask for personal information, you’re explaining why you need it. Make sure that any sponsored links or affiliate ads are clearly marked. Make sure that you aren’t hiding anything from your potential customers.

Improve navigation - A segregated landing page reduces choice, but it hurts your ranking. Work to make it as easy as possible for users to find answers to any questions they may have. If they can’t find it on the landing page itself, make sure you clearly link to a page where the information can be found. Avoid using pop-ups as anything other than exit converters.

Speed - Make sure your landing page loads quickly. More so than a normal organic search, a PPC landing page needs to load extremely quickly. If your page takes longer than a second to load, users are going to bounce and you’re going to be wasting money on clicks.
You also need to make sure you’re following Google’s advertising policies, or you risk being removed from their PPC systems entirely.

We'll soon share examples of great landing pages that we think are inspiring. If you have any in mind, feel free to ping us and we'll include them. 'til then, stay tuned :)

Autor : Mian Fx 






read more...

Sunday, 12 October 2014

Profile Picture in Google Search Results

Profile Picture in Google Search Results

You might have noticed Google search results  includes information about the author. It has a link to the Author’s Google Plus Profile and it also displays the Author’s Profile Picture.This tutorial will guide you in doing the same with your Blog.
Before we Start, here is a preview of what we are talking about

Profile Picture in Google Search Results

How to Make Google Know that you are the Author of a Blog


This process involves kind of a two way verification. In your blog you should tell the Google Crawlers that  this guy with this Google Profile is the author of the entry.
Now Google has to verify that the Blogger has provided the correct Google Plus Profile.So it will see if that guy’s Google Plus profile links back to your Blog. If it does, then Google can confirm that he/she is the author and it may display his/her profile information in the Google Search Results.
Note: Even of you do all this, there is no guarantee that Google will display your Profile Details in search.

Now lets’ try doing it

There are two methods of setting up this two way verification. We will have a look at simplest of those

a. For a Single Author Blog.

Every page on your Blog should tell Google that this Google Plus guy is my Author. To do that, there should be a link to your Google Plus profile on every page on your Blog. This link should have the rel attribute set to author
You can do that by adding the following link code to some HTML/JavaScript Widget



The Link in red should be replaced by your Google Plus Profile URL. You can replace the thing in Green with anything you want.  When you add this as an HTML/JavaScript Widget, you are telling Google that every page on your Blog was written by the guy with the Google Plus Profile which you have mentioned in the link. It is not mandatory that you should add this link in a Gadget. You can add the link anywhere in your Template. The only thing is that it should be there on every page of your Blog.
Now we have to help Google in conforming this.To do that  your Google Plus profile should link back to your Blog’s home page.
So Edit your Google Plus Profile and add a link to your Blog’s Home Page.

Profile Picture in Google Search Results

Now you have successfully completed the steps. Read the last part of this post to know how you can verify if you did everything right.
b. For a Multi Author Blog.
The method is almost the same for a Multi Author blog as well. The only difference is that each post on the Multi Author Blog should link to the corresponding author.
If you are not good with Blogger Template Codes, then you can manually add the Google Plus profile link to each Post(so that each post will link to the corresponding author’s Google Plus Profile). If you are good with the template codes, then you can use the following code.




Author1Name and Author2Name should be replaced by the  name of the Authors(their Blogger Name). The red links should be replaced by the Google Plus Profile  link of the corresponding Author. You can change the green text to anything you want. If you have more than 2 authors, you can just repeat the repeating block.(I have commented it so that you can properly identify the repeating one).
You have to pasted this code in your template below



And




And




Now each of the Blog Author’s Google Plus Profile should link back to your Blog’s home page.

Verifying if everything worked properly

You can use the Rich Snippets Testing Tool to verify if you have done everything properly. Give a post URL in the text box at http://www.google.com/webmasters/tools/richsnippetsand preview how your page will appear on the search engine. You should see something like this when you do a preview.
Profile Picture in Google Search Results

Asking Google To Consider displaying your Profile in Search Results

Now you have successfully added the Author snippets to your Blog. This doesn’t mean that Google will start to show your Profile details right away. We don’t know how they do it. Right now we only see these working for some quality blogs. Here is an authorship request formwhich might help you
Autor : Mian Fx 
read more...
 
Copyright © 2014 US Blogger Lab • All Rights Reserved.
back to top