4 All About

Thursday, May 24, 2012

Customize Blogger Navbar, Change Background Color and Image

Recently, I wrote a post about hiding blogger navbar. At that time, some ideas came to my mind and I have done some experiments about changing navbar color and adding background image. Through template designer we can choose only limited no. of colors, may be 5 to 6 only. Now we can do some customization with navbar. Bloggers can choose the best matching color to the template and can use image as a background to make it looking cool, professional and part of a blog. This customization trick is very simple and easy to use, based on css code.

Changing Background Color

1-To change background color go to Html Editor and Expend Template.

2-Search the following code.

]]></b:skin>

Now paste the following css code before the searched code.


#navbar-iframe

background-color: red;

}

You can choose any color instead of red, for example “ #04C40B ”

Now preview template and save it.

Adding Background Image

Repeat 1st and 2nd step.

Now put the following css code before the searched code.


#navbar-iframe {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWArc1-9EzZO6RH3ucOBQ6NF8bJ_hIotR-1yfDufu0sFuR-mgAi0umjkRIJAweEvQZzi5TIUkIoaTYYEhdhT12Z5aDeTga_yOSyfbwgMmqu2Z36Wk78vk24K_AsuTVXrOSdvDYp-VkCkbn/h120/nbg.gif);

background-color: transparent;

background-repeat-x: repeat;

background-repeat-y: no-repeat;

background-size: 30px 30px;

}

Now save the template and you have done.

Below is how navbar will looks like.

This is the image we have used:

And url of this image is:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWArc1-9EzZO6RH3ucOBQ6NF8bJ_hIotR-1yfDufu0sFuR-mgAi0umjkRIJAweEvQZzi5TIUkIoaTYYEhdhT12Z5aDeTga_yOSyfbwgMmqu2Z36Wk78vk24K_AsuTVXrOSdvDYp-VkCkbn/h120/nbg.gif

You can use any image as a back ground, just change the image url ( Marked with red color) in the css code.
I hope you will like this trick.

Tuesday, May 22, 2012

Best Video Search Engines

We all know the popular and power full search engines i.e. Google, Bing and yahoo. But the world is not limited; there are some more video search engines to say them best. That can provide access to the best video contents because they are specialized to search videos. Some of these video search engines also allow users to upload videos to their own website.

VideoSurf www.videosurf.com

Videosurf is providing better search experience to the users because of their features. Users can select different database (YouTube, dailymotions and Vimeo etc.) of their own choice or select all of them to search videos. Videosurf also provide access to different scenes by showing frames of a clip horizontally below. User can also select category to go for more specific. These features makes it user friendly and easy to navigate, so makes it best.

Which one is the best it depends on user priorities.

Here is the list of best video search engines.

Tip: Submitting your videos to Search Engines can bring more visits to your video site.

Tuesday, May 15, 2012

Remove / Delete Blogger Navbar trick not working.

Previously, this outdated trick was used by bloggers to remove top navigation bar and was very popular. Basically this trick generates error in the template. But blogger service and interface is now upgraded and doesn’t sport this trick. So, trick is no more working and you cannot remove, delete or disable navigation bar in any way. Don’t worry; I know every blogger wants to make his blog professional, awesome and cool looking. Here is another alternate trick to Hide Blogger Navigation Bar. This blogger customization trick is based on CSS Code, 100% working.

What was the outdated trick?

Here are the simple steps of the trick to remove navbar from blogger.

Go to Html editor and expend the template.
Search for the following html tag.

<body>

Replace the <body> tag with the following Html code.



This step creates error in the template and no more working with the upgraded blogger html editor.

Save your template.

Sunday, May 13, 2012

How To Hide Blogger Navbar Using CSS Code

Everyone wants to hide blogger default navigation bar and this tip is most popular and widely used by blogger.com users. Everyone is trying to customize their blog to look awesome and professional. So, this navbar doesn’t looks professional. That is the reason everyone use this trick.

This tip is very simple and easy to apply based on CSS code, just follow these steps when logged in.

Backup your blog. Important!
Go to Edit Html and click expand template.
Search for the following Code.


]]></b:skin>

Now copy the following CSS code and past it just before the code “]]></b:skin>”

#navbar {
height: 0px;
visibility: hidden;
display: none;
}

Now, save your template and you have done, you can also preview before saving.

Now your blog will looks more professional.