CSS

Just Two days ago, I shared a collection of horizontal CSS menus for blogs and websites with you. Today, I would like to share CSS vertical menus collection with you. As you might know, CSS menus look great in a website. There are many benefits of using menus in a blog or website; the first benefit of using a CSS menu is: it attracts the visitors to click on the links inside the menu and the second benefit is: the menus are faster in loading, they don’t take much time to load in all browsers, Because with css you make the menus more readable for the browser. The css codes are just called in HTML page by a class or an ID selector. So, within just one word you can call them to be appeared on your blog. We will keep sharing CSS menus with you because there are thousands of stylish menus are there with different looks. We will also share a collection of drop down menus with you in our coming posts.

How to add CSS vertical menus to blog or website?

The procedure of adding any css menu to your blogger blog or website is quite simple and can be done within few steps. The menus we are sharing today are created with CSS and HTML. You can copy the entire code from the text box below in the list. And then go to your Blogger dashboard >> Layout >> Add a Gadget and paste the code inside that. Save the widget and view your blog to see the new added menu.

Remember:

These menus are vertical menus, therefore, they are mostly used in sidebar of your blog. Make sure you add them in sidebar for better result. The codes are with example pictures can be found below. Customization will be taught below the menu codes.

CSS Vertical Menu # 1:

CSS Vertical Menu # 2:

CSS Vertical Menu # 3:

CSS Vertical Menu # 4:

Customization:

After adding the code into an HTML/JavaScript in blogger you can customize the menu by yourself; for changing the links and anchor texts to your own just find below piece of code in the menu:

<ul><li><a href=”#”>About</a></li></ul>

All the links are inside the ul tag, so replace each (#) sign with your link and the text i.e About, Home, Services etc with your own anchor text. Save the widget and check the result by viewing your blog. All the CSS properties and values can also be customized according to your needs.

Note: The images which have been used in these menus are saved in my Picasa photo album, so you don’t need to do any extra work. Just use them and enjoy!

Comments are appreciated and sharing is also caring.

Follow me on Twitter

Follow me on Facebook

Follow me on Blogger

Our Website

Subscribe to me On YouTube

Learn Complete Web Designing Video Course In Urdu

Learning Web Designing Video course Online absolutely free aur wo bhi Urdu Zuban ma. It is a fantastic imagination. Because, in Pakistan people always try to find free stuff without any hesitation. So here we go, A complete Web designing course in Urdu language is for you with dozens of video tutorials by Online Ustaad. On this page you will start learning complete Web designing course in Urdu language absolutely free. First of all you will learn HTML in Urdu, Then CSS in Urdu, then JavaScript in Urdu, Then Dreamweaver in Urdu and finally you will learn Blogger in Urdu. Those who want to learn free web designing in Urdu may learn this complete course by watching all video tutorials below. There are five playlist of video tutorials.

1. HTML Video Training in Urdu

The very basic thing in web designing is HTML. Without knowing the HTML (Hyper Text Markup Language) you can not learn the other advance languages and tools. HTML is the basic language for showing the content of web pages on a web browser. So here is a complete video course of HTML in Urdu language. It is a playlist from my youtube channel and contains 12 video lectures. So you can play just one video and the another one will play automatically when the previous one is finished.

2. CSS  Video Training in Urdu

Having learnt HTML, CSS is the another cool language of Web designing. After getting the basic concept of HTML you must start learning CSS. CSS is the game of colors. It is used to define styles for a web page or entire website. You can define what background colors, font colors, font sizes and what styles will be used in Your website. CSS creates a fancy environment for web designers. So here is a complete video playlist of CSS training in Urdu language. You can learn it completely.

---

Follow me on Twitter

Follow me on Facebook

Follow me on Blogger

Our Website

Subscribe to me On YouTube