Tutorial : Date Header Luar Body Blog

by:   No comments    
categories: 


bagi pengguna Washed denim macam nie..

.Dashbord > Design > Edit HTML

.Ctrl F and search code .date-header {


akan jumpa macam ni :

.date-header {
margin: 1.5em 0 0;
font-weight: normal;
color: $dateHeaderColor;
font-size: 100%;
}
Okay,delete code tu semua dan gantikan dengan yang bawah ni :-

.date-header {
height:40px;
margin:-15px -20px -500px -115px;
padding: 30px 300px 105px 10px;
background: url(Url Gambar Anda) no-repeat;
position:absolute !important; position:relative; float:right;
text-align: center;
font: normal normal 12px Century Gothic;
color: #4D4D4D;
}
Preview dan save template

bagi pengguna Template lak cam nie :


.Dashbord > Design > Edit HTML
.Ctrl F dan search code h2.date-header {


Copy dan paste code ni di bawah h2.date-header {

height:40px;
margin:-15px -20px -500px -115px;
padding: 30px 300px 105px 10px;
background: url(Url Gambar Anda) no-repeat;
position:absolute !important; position:relative; float:right;
text-align: center;


Code full dia macamkat bawah nie :
h2.date-header {
height:40px;
margin:-15px -20px -500px -115px;
padding: 30px 300px 105px 10px;
background: url(Url Gambar Anda) no-repeat;
position:absolute !important; position:relative; float:right;
text-align: center;
font: normal normal 12px Century Gothic;
color: #4D4D4D;
.Preview dan save template .


Nota
Gantikan Url gambar korang tu dengan gambar korang.
Jenis font dan warna font tu boleh tukar ikut korang.


Tutorial : Gambar Jadi Melengkung ( Entry & Sidebar )

by:   1 comment    
categories: 
Pergi ke Dashboard - Design - Edit HTML
Ctrl+F , cari code dekat bawah nie.
/* Header
Copy paste code nie ATAS code ayat korang cari tadi
img { filter: alpha(opacity=100); opacity: 6; }
img:hover { filter: alpha(opacity=75); opacity: 7; -webkit-transition: 0.5s; }
img {
-webkit-transition: 0.5s;
border-radius: 12px;}

nanti dia akan jadi macam ni :

img { filter: alpha(opacity=100); opacity: 6; }
img:hover { filter: alpha(opacity=75); opacity: 7; -webkit-transition: 0.5s; }
img {
-webkit-transition: 0.5s;
border-radius: 15px;}
/* Header
----------------------------------------------- */



lepas tue preview kalau tak de masalah boleh lah save.


Tutorial : Buang navigation Bar Template Denim

by:   1 comment    
categories: 
.dashboard>design>Edit HTML
.cari code di bawah ni...ctrl+f atau f3

/* Variable definitions
.dah jumpa copy code di bawah ni dan paste atas code tadi..ctrl+c untuk copy

#navbar-iframe {
display: none !important;
}

.nanti orang punya code akan jadi macam ni

-----------------------------------------------
Blogger Template Style
Name: Washed Denim
Designer: Darren Delaye
URL: www.DarrenDelaye.com
Date: 11 Jul 2006
-----------------------------------------------
*/
#navbar-iframe { display: none !important; }
/* Variable definitions
====================

5.dah jadi macam ni..kamu preview dulu..kalau dah puas hati save saja..


Tutorial : Recent Post Berbackground

by:   No comments    
categories: 


.Dashboard>Design>Page Elements>Add a Gadget

.Klik HTML/Javascript

.Kemudian copypaste code di bawah ni dalam HTML/Javascript  tu.


<center><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--
#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:270px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:208px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background: url(" URL BACKGROUND");
border-bottom-right-radius: 10px;
border-top-right-radius: 10px;
border-left: 2px solid #FAC1F3;;
}
#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background: url("URL BACKGROUND");
border-bottom-right-radius: 10px;
border-top-right-radius: 10px;
border-left: 1px solid #FAC1F3;;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}
.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}
-->
</style>
<script language='javascript'>
imgr = new Array();
imgr[0] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
imgr[1] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
imgr[2] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
imgr[3] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
imgr[4] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
showRandomImg = true;
boxwidth = 255;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 70;
thumbheight = 70;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = true;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 30;
home_page = "URL BLOG korang";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
<script src='https://sites.google.com/site/unwanted86/javascript/animatedrecentpost.js' type='text/javascript'></script>
</div></center>


ABC boleh tukar di sini



Tutorial : Scroll Box Untuk Blog Archive

by:   No comments    
categories: 
.Dashboard > design > edit html > Expand widget templates.

.Cari ctrl + f <div id='ArchiveList'>

.Jumpa code nie kan <div class='widget-content'> kat atas code Achivelist tadi kan..

.Gantikan Code yang korang jumpa tue tadi <div class='widget-content'> dengan <div class='widget-content' style='overflow:auto; height:200px'> 

.Save

ABC boleh tukar mengikut kesesuaina blog korang k..
Subscribe to: Posts (Atom)