Skip to main content

Customize Label cloud widget of blogger with Hover effects.

By
Hi guys welcome back to worldtech360.In this post i am gonna deal with blogger labels.Usually Labels are used to categories your blog posts.By using Labels on your blog or website you tell the readers what type of topics you deal with.So in order to make the labels more attractive,in this post i am gonna show how to customize the label widget with hover effect.So let's see how to do this.
Customize Label cloud widget of blogger with Hover effects.

Steps:

1.Open Blogger>>Layout.
2.Click "Add widget" and select "Labels" form it.
3.Now a window will pop up and choose display as cloud instead of list as shown below.
choose cloud from display of labels widget.
4.Now move to Template >>Edit HTML.
5.Search for ]]></b:skin> and paste the below code above it.
/*-----Labels Cloud widget by worldtech360.com ----*/
.label-size{
  background-color:#ffffff;
  border:2px solid #2AA4CF;
  float:left;
  font-family:georgia;
  font-size:12px;
  margin:0px 1px 1px 0px;
  padding:7px;
  text-transform:uppercase;
  box-shadow:rgba(0, 0, 0, 0.45098) 0 1px 11px;
}

.label-size:hover {
  background-color:#ffffff;
  border:none;
  border-bottom-left-radius:12px;
  border-bottom-right-radius:12px;
  border-top-left-radius:12px;
  border-top-right-radius:12px;
  font-family:georgia;
  font-weight:bold;
  padding:7px;
  text-decoration:none;
  border-bottom-style:solid;
  text-color:#fff;
  border-bottom-color:#595b67;
  border-bottom-width:4px;
  box-shadow:rgba(0, 0, 0, 0.45098) 0 1px 11px;
}

6.Save you template and you will see the labels as shown below.
Look of labels before and after.
7.Done.
That's it friends i hope you enjoyed the post,if you have any queries feel free to ask us through comments.
Labels:

Comments

Post a Comment

Popular posts from this blog

How to make an Installation file(setup file) using Iexpress.

By
Hi guys welcome to worldtech360. In this tutorial or article I  am going to show you how to create an installation file(setup file) for the .EXE file which you have created using an inbuilt option in windows 7 named ‘ iexpress ’. So let’s see how to do this. Note: You can also create an installation file for .bat file files or .VBS files or any other files which are executable. Steps: 1. Choose an .EXE file or any other file for which you want to create a setup file or installation file. In this I am going to use .VBS file 2. Open Run and type “ iexpress ” or “ iexpress.exe ” and hit enter. 3. After hitting enter, iexpress wizard window will popup. On the screen you will see two options i.e. “ create new self-extracting directive file ” and the other is “ open existing self-extracting directive file ”. I recommend you to choose the first option as you are going to create a self-extracting file and click next. 4. In the next window select “ Extract files on...
4 comments
Read more

How to install Backtrack 5 R3 on Oracle VM virtual box

By
Hi guys in this tutorial i am gonna show you how to install Backtrack 5r3 using virtual box.This tutorial is only for Educational purpose,Don't try to use it in a wrong way.Before going into the discussion let see what exactly backtrack means?Backtrack is an operating system which is developed especially for hackers and other security professionals.Mostly if we want to hack a wifi password i.e WEP or WPA or if we want to do phishing we need certain tools to do it.But Backtrack reduces this burden as it contains a bag full of hacking software's like gerex,Social engineering tools and many more.So lets install backtrack 5 r3 using virtual box. Steps:  Requirements: Backtrack( CLICK HERE ). Virtualbox( CLICK HERE ). 1.Install the Virtual box and open it. 2.Now we see a screen like below. 3.Click on New button and a window will up asking to type the name,Type and version.Select the type as 'linux' and version as 'oracle' as shown below and hit next...
Post a Comment
Read more

How to Make Invincible folders using Charmap.

By
Every one of us have our confidential data residing on our desk and we try to be protect it by using various Folder locks (Paid and free version).But have you ever tried to protect it without using any software’s, if not in this tutorial i am gonna show you how to make a folder invincible and it works perfectly. This post will be useful for those who are not in a stage to buy the folder lock software’s. So let’s see how to do this. You can also check : How to lock a folder using notepad   Video Tutorial: Steps: 1. Open Run and type " charmap "(Run with Administrator rights). 2. Browse to the blank character in it as shown below and click on select and Copy the selected character. 3. Now select the folder which you want to make invincible and click F2 to rename it. Now paste the character which you have selected in the CHARMAP and press enter. Now you will see a folder without a name. 4. Right click on the nameless folder and click on properties and br...
Post a Comment
Read more