Make Resvonsive Layout With CSS3

Smartphone revolution brings new features to the web development, it is time to change your website design into a responsive design instead of maintaining a separate mobile version . Responsive design will automatically adjust itself based on the screen size of the media devices. This post explain you how to use CSS 3 @media property and working with Internet Explorer using Modernizr. Download Script     Live DemoTry live...

Read more

Menu Bar With jQuery For Blogger

In this tutorial im gonna explain how to add Bouncing  with jQuery.It  have nice hover effect. Every menu aredifferent  with colors. Im   using   jQuery and  HTML,  Just check out demo.Its easy to add to blogger. get my all menu bar here1. Log in to blogger account and Click drop down. 2. Now select "Template" Like Below.3. Now you can see Live on blog, Click EDIT HTML Button"4. Now click Proceed button.   ...

Read more

How To Make Sparate Box Posts in Blogger

In this tutorial, we're going to divide (separate) our posts in boxes (frames), so each post will have it's own "house", and you'll be able to see background between them. See below what I'm blabing about:Ok. You should keep in mind:► this is the example for the Blogs that already have a customized (stylized) Post area► this example was made in Minima Blogger template (so your code may be a bit different, but the procedure is the same)► it doesn't...

Read more

How To Remove Showing Posts With Labels Blogger

Here's one more thing which folks find irritating. Or unnecessary. When you click on one of your labels, blogger filters your posts tagged with that particular label. That's great, but we don't need a big box saying the same thing. If you like it though, even better. But maybe your readers don't...So, if you want to remove it, follow me. It's an easy one.Log in to your Blogger account, Back-up your template, then go to:DASHBOARD -- LAYOUT --...

Read more

Border In Blogger

In Blogger default templates (like Minima), you can see that all kinds of borders are present. Borders around header, borders between posts and sidebar gadgets. In the control menu, Fonts and colors, we are allowed just to change the color of the border. But there's so much more to it....First, let's check the styles for the borders that we can use:none: no border at alldotted: series of dots.dashed: series of short line segments.solid:...

Read more

How To Sparate Gadget Sidebar Blogger

You should keep in mind:► this is the example for the Blogs that already have a customized (stylized) Sidebar (colorized, borderized..)► this example was made in Minima Blogger template (so your code may be a bit different, but the procedure is the same)► it doesn't matter if you have "heavily" customized template, you can apply these setting anywayUNDERSTAND THISWe have to imitate the main style of our sidebar-wrapper (the one that carries the...

Read more

How To Make Cool Widget Blogger

How to tweak and style each widget (gadget) differently! Meaning:► each of your widgets (Labels, Archive, Links, custom widget) can have it's own looks (color, font, borders, images....anything!)► remember that WIDGET is the same thing as GADGET Ok, here's the simple example: I've chosen to differ my widgets a bit, so I changed a the style of Labels, Links, Archive and Picture widget. I choose these widgets just for this example. Remember that...

Read more

How Add Icon Beside Sidebar Title Blogger

This time, we'll learn how to place a small icon or picture right beside the Sidebar widget/gadget title.Now, we want to achieve this:There are 4 steps to get this working:1. Find the icon (picture) you like, optimize it2. Upload the pic to a free web host (to get the URL)3. Make a CSS style for the sidebar headings (titles)4. Play with the CSS style (customize)***1. This is a fun part. Find the pic (icon) you like, design one, crop it, cut it,...

Read more

How Modify Footer Columns Blogger

In the article "How to add columns to Blogger Footer" we've learned about the basic (barebone) implementation of extra columns in Blogger footer.This time, we'll try to customize them a bit. This is optional, of course. You will learn how to:► control the style of your new footer► add some colors to it► change the link color (footer links can be in different color than the main link color)► customize links► change the headings style....In the first...

Read more

How Add Columns Blogger Footer

We are going to add some columns to our Blogger Footer. If you're using one of the Blogger default templates, you've noticed that in your Footer section, you only have a horizontal Add a Gadget element that has the same width like the Blog.We can do better. Let's start with adding 3 columns in the footer, and place the default one on the bottom.Advantages:► you can place more widgets (gadgets)► rearrange them as you want► your main content area...

Read more

Move Date Under Posts Title Blogger

In this tutorial we'll learn how to move (change the position) of the Date in Blogger. We will move it UNDER (below) the Post Title (by default, it's ABOVE it). We'll have to tweak the HTML code a bit. Until Blogger provides automated way of doing this....And I hope it will.If you're ready, let's do it. First thing is backing up your Blogger template. I'll show you 2 ways of doing this. I suggest to follow the example 1. If you'll have problems,...

Read more

Customization Posts Title Blogger

How to customize your blogger Posts Title...we can add some background picture behind the post title, or borders, change font...........................well, a lot.Before doing any customization, back up your template. Just in case....Let's start with the beginning. Heh.For customization, we will use the CSS style in the code section that corresponds to our Post Title:.post h3 {margin:.25em 0 0;padding:0 0 4px;font-size:140%;font-weight:normal;line-height:1.4em;color:$titlecolor;}.....Attention:this...

Read more

Customization Sidebar Blogger

In this tutorial, I'll explain how to customize Sidebar Titles in Blogger. How to change their clothes. By default, they are kind of "naked" and empty.But there's a lot that can be done. We can give them some background color, even a picture, an icon beside them, borders, lines......WHAT CAN WE DO IN BLOGGER OPTIONS?Well, not much. You can change the Font Color of the title, Size, weight and Font family.But in some templates (like Minima), the...

Read more