asmiera bloggy: cara aku/saya/beta/hamba/patik edit blog ;p ( lebih kpd tutorial & setelah diubahsuai sedikit )
 

cara aku/saya/beta/hamba/patik edit blog ;p ( lebih kpd tutorial & setelah diubahsuai sedikit )

takmo banyak cakap lagi , jum tutorial :128: . senang punya lahh .

mula mula , gy kat dashboard>design>edit HTML . lepas tuh , follow jea step dalam gambar bawah ny . tekan pada gambar ntk gambar yg besar .




okay . mula mula kita ubah background belakang dulu . tekan CTRL+F , dan masukkan code di bawah ini dalam kotak find ,,
body {

bawah perkataan body { tuhh , korang akan jumpa code bawah ni :
background: $bgColor;
margin: 0; padding: 0px;
font: x-small Verdana, Arial;
text-align: center;
color: $textColor;
font-size/* */:/**/small;
font-size: /**/small;
yg tulisan warna purple tuh , paste kan dgn code url(URL IMG korang) repeat fixed . sebagai contoh :
body { background:url(https://lh4.googleusercontent.com/-3AZWa5nVNf0/TYPyYS_PvhI/AAAAAAAAAK4/f-g70JPnhOk/s1600/pies_by_squidpig-500x237+copy.jpg) repeat fixed;
margin: 0;
padding: 0px;
font: x-small Verdana, Arial;
text-align: center;
color: $textColor;
font-size/* */:/**/small; font-size: /**/small;
}
tekan preview .


untuk buang background biru pada header, CTRL+F code :
#header-wrapper {
akan jumpa code ini :
#header-wrapper {
margin:0;
padding: 0;
background-color: $headerCornersColor;
text-align: $startSide;
}
tulisan warna purple , paste kan dengan perkataan transparent . lepas tu , CTRL+F code :
#header {
akan jumpa code ini :
#header {
width: 760px;
margin: 0 auto;
background-color: $headerBgColor;
border: 1px solid $headerBgColor;
color: $headerTextColor;
padding: 0;
font: $headerFont;
}
tulisan warna puple , paste kan dgn perkataan transparent . yg warna hijau , tukarkan kepada 0px . akan jadi seperti ini :
#header {
width: 760px;
margin: 0 auto;
background-color:transparent;
border: 0px solid $headerBgColor;
color: $headerTextColor;
padding: 0;
font: $headerFont;
}
tekan preview .


background biru tadi dah hilang . tapi , nampak macam blog ni kecil bukan ? jadi untuk tambah kelebaran saiz blog , CTRL+F code :
#content-wrapper {
akan jumpa code :
#content-wrapper {
width: 760px;
margin: 0 auto;
padding: 0 0 15px;text-align: $startSide;
background-color: $mainBgColor;
border: 1px solid $borderColor;
border-top: 0;
}
tulisan warna purple , tukarkan dengan 850px (bergantung kpd kelebaran saiz blog yg diingini) . kemudian , CTRL+F code :
#main-wrapper {
akan jumpa code :
#main-wrapper {
margin-$startSide: 14px;
width: 464px;
float: $startSide;
background-color: $mainBgColor;
display: inline; /* fix for doubling margin in IE */
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
kedua dua warna puple , tukarkan dgn perkataan left . tulisan warna hijau , tukarkan dgn 25px . yg warna merah , tukarkan dgn 480px . kemudian , CTRL+F code :
#sidebar-wrapper {
akan jumpa code :
#sidebar-wrapper {
margin-$endSide: 14px;
width: 240px;
float: $endSide;
background-color: $mainBgColor;
display: inline; /* fix for doubling margin in IE */
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
yg warna purple , tukar dgn right . warna hijau , tukar dgn 25px . warna merah , tukar dgn 280px . sila tekan preview .


ntk hilangkan nav bar tuh , tekan link http://wanhazel.blogspot.com/2011/03/tutorial-buangremove-navbar-pada-blog.html . tekan preview , puas ? tekan save template okay .

tapi bahagian header tak cantik sebab kosong jea . jadi awak awak semua boleh buat header sendiri okay . guna photoshop ke , photoscape ke , guna paint pun boleh . lepas tuh kalau nak upload ke blog , terus pergi kat page element . tgk gambar di bawah ,,


tick pada '' and 'shrink to fit' okay . contoh header :


pada header , akan nampak senget bukan ? cuba awak preview . okay kalo nak atasi , sila CTRL+F code :
#header {
akan jumpa code :
#header {
width: 760px;
margin: 0 auto;
background-color:transparent;
border: 0px solid $headerBgColor;
color: $headerTextColor;
padding: 0;
font: $headerFont;
}
warna purple , tukar kpd 850px . warna hijau , gantikan dgn padding-top:5px . then , finish ! boleh preview , dan save template . di bawah ini adalah hasil tutorial saya bersama anda semua blogger-emoticon.blogspot.com.


tata dan selamat mencuba . kalau tk phm , boleh tanya . jgn malu okay kumako .

2 suka cakap cakap:

  1. s m a r t l a h . j e l e z n i y ..

    ReplyDelete
  2. siapakah anda ? hihhi ,, btw thanks ^^,

    biase aje nyy ;)

    ReplyDelete

suka ? comment lahh :)

Powered by Blogger.