Tutorial Membuat Template blogger tahap 2
ok saya akan melanjutkan tutorial membuat template blogger bagi yang baru tau tentang posting ini silakan baca tutorial sebelumnya di sini bagi yang sudah baca tutorial sebelumnya sekarang bacaartikel yang ini Ok langsung kita mulai aja.
untuk memperjelas seperti apa template yang nanti akan kita buat saya sidah mengambarkan rancanagan template ini, kira-kira jadinya akan seperti gambar berikut:
Nantinya template ini bisa kalian kembangkan sesuka kalian sendiri.
sekarang kita mulai pembuatan template tahap dua
●Buka File yang kemarin sudah kita buat yaitu file Template.html di NOTEPAD yang bila di buka di Web browser hasilnya seperti ini Klik
●Tambahkan kode seperti di dalam kotak ini di atas kode </head>
<style type="text/css">
</style>
●Jadinya akan seperti ini
<html>
<head>
<title>Belajar Membuat Template Blogger</title>
<style type='text/css'>
</style>
</head>
<body>
Membuat template blogger
</body>
</html>
●Setelah itu ganti tulisan Membuat template blogger yang ada di bawah kode <body> dengan kode-kode di kotak ini:
<div id="wrapper">
<div id="header">Header</div>
<div id="nav">menu navigasi</div>
<div id="wall">
<div id="post-wraper">
<div id="artikel-wow">isi postingan</div>
</div>
<div id="sidebar-wrapper">
<div id="sidebar">sidebar</div>
</div>
<div id="footer">footer</div>
</div>
●Jadinya akan seperti ini:
<html>●Save file tersebut
<head>
<title>Belajar Membuat Template Blogger</title>
<style type="text/css">
</style>
</head>
<body>
<div id="wrapper">
<div id="header">Header</div>
<div id="nav">menu navigasi</div>
<div id="wall">
<div id="post-wraper">
<div id="artikel-wow">isi postingan</div>
</div>
<div id="sidebar-wrapper">
<div id="sidebar">sidebar</div>
</div>
<div id="footer">footer</div>
</div>
</body>
</html>
Bila di lihat pada Web Browser Jadinya akan Seperti ini KLIK
Ok sekian posting Tutorial Membuat Template blogger tahap 2
Tutorial Membuat Template blogger tahap 1
Kali ini saya akan share tutorial buat template blogger langsung ajahnih caranya
Tools:
*Notepad
●Buka Notepad dan ketik seperti di kotak bawah ini
<html>
<head>
<title>Belajar Membuat Template Blogger</title>
</head>
<body>
Membuat template blogger
</body>
</html>
●Save dengan format template.html kurang ebih seperti gambar di bawah ini
Penjelasan Kode-kode di atas :
| TAG | Penjelasan |
|---|---|
| <html> | Mendefinisikan root dari suatu dokumen HTML |
| <head> | Mendefinisikan informasi tentang dokumen |
| <title> | Mendefinisikan judul untuk dokumen |
| <body> | Mendefinisikan tubuh dokumen |
Setelah itu buka file template.html di Web Browser kamu jadinya akan seperti Klik untuk melihat hasil
Ok posting membuat template blogger tahap 1 sampai di sini.
IDS twitter | IyunK21-Blog
nih bagi yang twitternya mau banyak followernya aku mau share IDS twitter yang sung aja
gak usah banyak bacot nih
IDS : KLIK
password : KLIK
ok sekian posting kali ini god bye...-===============================================::::::::::::::::::::::::::::::::::::::::::::::::::::::::::~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~++++++++++++++++++++++++++++++++XD
IDS : KLIK
password : KLIK
ok sekian posting kali ini god bye...-===============================================::::::::::::::::::::::::::::::::::::::::::::::::::::::::::~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~++++++++++++++++++++++++++++++++XD
Template gak jadi
Hehehe judulnya semerawut ya hehehe maaf, mau curhat dikit.
Awalnya sih mau buat template untuk di share di blog ini karena saat saya buat jadinya hancur berantakan gakjadi deh tapi saya banga dengan template hancur itu soalnya template itu original buatan saya. bagi yang mau template hancur saya sediakan link downloadnya nih scernshotnya:
Gimana hancurbenerankan apa aku bilang nih templatenya
DOWNLOAD TEMPLATE HANCUR
DOWNLOAD TEMPLATE HANCUR
Background dengan CSS1 | IyunK21-Blog
kali ini saya akan share background yang menarik dengan mengunakan CSS nih screnshotnya:
background:
-webkit-radial-gradient(black 15%, transparent 16%) 0 0,
-webkit-radial-gradient(black 15%, transparent 16%) 8px 8px,
-webkit-radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
-webkit-radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
background:
-webkit-radial-gradient(black 15%, transparent 16%) 0 0,
-webkit-radial-gradient(black 15%, transparent 16%) 8px 8px,
-webkit-radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
-webkit-radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
background-color:#282828;
background-size:16px 16px;
background:
radial-gradient(black 15%, transparent 16%) 0 0,
radial-gradient(black 15%, transparent 16%) 8px 8px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
