Elegant link pop up title for your links in your blog...
------------- STEPS
-------------
- As usual, go to Layout > Edit HTML
Step 2
- Then use Ctrl+F shortcut key to find this ]]></b:skin> code tag
Step 3
- Paste this below code above the ]]></b:skin> code tag:
/* Titlepopup by syafzpic.com */
#titlepopup{
background:#323232;/*titlepopup background color*/
color:#f1f1f1;/*titlepopup font color*/
background:#323232;/*titlepopup background color*/
color:#f1f1f1;/*titlepopup font color*/
padding:2px 5px;
z-index: 20;
-moz-border-radius-bottomleft: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-topleft: 0;
-moz-border-radius-topright: 5px;
-moz-opacity: .87;
z-index: 20;
-moz-border-radius-bottomleft: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-topleft: 0;
-moz-border-radius-topright: 5px;
-moz-opacity: .87;
border:none;
display:none;
display:none;
position:absolute;
}
Step 4
- Paste this script code link in your <head> area or just paste it above the </head>
<script
src="http://s2.sigmirror.com/files/53531_qbkj8/jquery.js"
type="text/javascript"></script>
<script src="http://s2.sigmirror.com/files/53732_zbfhp/nice_appears.js" type="text/javascript"></script>
<script src="http://s2.sigmirror.com/files/53732_zbfhp/nice_appears.js" type="text/javascript"></script>
Step 5
- Save your template
Step 6
- Just use this code in any link that you wanted the popup title to be appear
<a href="PUT URL HERE" class="titlepopup" title="PUT THE URL TITLE HERE ">URL Name Here</a>
- PUT URL HERE = Replace this with URL link, for example: http://blogging-style.blogspot.com
- PUT THE URL TITLE HERE = Replace this with the pop up
title, for example: Visit me again.
- URL
Name Here = Replace this with the name of your URL, for example:
Blogger Tips and Style
----------------------- Finished
------------------------
<a href="http://www.syafzpic.com" class="titlepopup" title="Visit me at syafzpic.com ">SyafzPic</a>
Result = mouse-over to this word, SyafzPic
0 comments:
Post a Comment