Saturday 18 August 2012

Add super slider gallery on your blospot/blogger

Hi friends this widget is very nice because it is as wordpress cool plugins  now how can add you this widget now follow simple steps that you can add easily.

Now follow easy steps for adding this widget------>>>>>>>

* First go to your blogger dashboard .

* Click on the design tab and edit html.

* Now expand your template and find ]]></b:skin> 

* Now  copy below code and paste before  ]]></b:skin> 

#slick-slider{   
 <b><span style="color: red;">width:800px;</span>       </b>margin:20px auto;    
 margin-bottom:20px;    
 padding:0;    
 }   
   
 .slick-slider-container,.titles{    
 color:white;    
 width:100%;    
 height:170px;         
 overflow:hidden;    
 background:url(http://upic.me/i/z4/bg_dark.png) ;    
 padding:20px 10px 10px 10px;   
 -moz-border-radius: 12px;    
 -khtml-border-radius: 12px;    
 -webkit-border-radius: 12px;    
 border-radius: 12px;    
 }    
 .titles{width:140px;padding:10px 15px;height:55px;}    
 .product{    
 width:370px;    
 height:150px;    
 background:url(http://upic.me/i/gv/product_bg.png) repeat-x;    
 padding:10px 0 0 0;    
 float:left;    
 margin-bottom:40px;    
 -moz-border-radius: 12px;    
 -khtml-border-radius: 12px;    
 -webkit-border-radius: 12px;    
 border-radius: 12px;    
 }    
 .product .pic{float:left;width:128px;height:128px;    padding:0 10px 5px;margin-top:-15px;}    
 .product .link,.product .price{font-size:10px;    text-transform:uppercase;padding:4px 0;}    
 .product .price{color:#CCCCCC;}    
 .product .title{font-size:16px;font-weight:bold;}    
 a, a:visited {color:#00BBFF;text-decoration:none;    outline:none;}    
 a:hover{text-decoration:underline;}


* Now again search </head> tag by ctrl+F key.

* Now copy below script and paste </head>

NOTE:)  You can add this below header by find this <div id='header-wrapper'>

For above post find <div id='header-wrapper'>

* Now save your template you are done.

No comments: