Showing posts with label Tutorial. Show all posts
Cara Menambah Background Image Di Blog
Blog jalz-cassieast.blogspot.com atau blog yang sedang anda kunjungi ini.. jika kamu amati... gambarnya selalu berganti ganti.. bagaimana bisa ya ^_^
pertama Saya Copy paste script ringan agar body bisa secara acak memilih background" yang telah diberi value" terlebih dahulu..
Lalu bagaimana admin bisa mengganti atau menambah gambar??
Kamu harus memahami pengaruh gambar untuk blog tentu saja... dengan pilih" gambar dan memformat total tampilan agar menyesuaikan dengan background yang tersedia
Cara menambah gambar (Kamu sebagai admin)
1.Pergi ke Design~~>lalu Elemen Laman
[jika kamu menggunakan template baru... maka langsung di tata letak]
Baca [Mengubah template lama ke template baru]
2. Pergi menuju script tersebut tersimpan.. jika saya menyimpanya di sidebar khusus...dibawah footer ~>
3.Edit Script Tersebut...
Maka Akan terlihat tampilan pengeditan
<script type='text/javascript'>
var bg = [
"http://a8.sphotos.ak.fbcdn.net/hphotos-ak-prn1/541250_333812280021785_1255343265_n.jpg",
"http://a3.sphotos.ak.fbcdn.net/hphotos-ak-ash3/528383_458611784168716_2073534726_n.jpg",
"http://a4.sphotos.ak.fbcdn.net/hphotos-ak-ash3/539375_458607984169096_363296720_n.jpg",
"http://a3.sphotos.ak.fbcdn.net/hphotos-ak-snc7/582596_458601794169715_1287936936_n.jpg",
"http://a3.sphotos.ak.fbcdn.net/hphotos-ak-ash3/178938_452393958123832_306101128_n.jpg",
"http://a6.sphotos.ak.fbcdn.net/hphotos-ak-prn1/554139_458196794210215_1561305808_n.jpg",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTYYW4TWu_yTqXMellCd3LYuyXX8daSCvthVbzpSA27nIj0D7WsmebVge4INZRS3B1InpX3hMY1bPV09r1YoLrbDUFETxLz_pMWCBAkfqK_aR2nqHFVxo7DrZz40Q1i6_LbklsmM_BRL0/s800/DBSK%2520Doushite.jpg",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitd4JGaAzo1MHWy2VmVrzUTZZ_TN_362SmI6e6IxSQoVMj1w3PmATEUwdv94A3pUX7kINLl5gPO3FtKz4Sb4g4uCxd58IE48Lt-80JiEPVUPbKX0b7mle01l-qjjhN4oEFKZ5mlS7VK_G6/s1600/red+ocean-1.jpg",
"http://a4.sphotos.ak.fbcdn.net/hphotos-ak-ash3/575018_458205180876043_564645691_n.jpg"
];
function gantiBg(){
var bgLeng = bg.length-1;
var i = Math.floor(Math.random()*bgLeng);
document.body.style.backgroundImage='url('+bg[i]+')';
}
gantiBg();
</script>
Dari Script diatas..
jika ingin menambah maka
silahkan ganti warna merah dan tambahkan dalam script diatas.. javascript ingin terhitung ringan dan bisa sebagai variasi blog anda.. agar visitor tidak bosan tentunya...
pertama Saya Copy paste script ringan agar body bisa secara acak memilih background" yang telah diberi value" terlebih dahulu..
Lalu bagaimana admin bisa mengganti atau menambah gambar??
Kamu harus memahami pengaruh gambar untuk blog tentu saja... dengan pilih" gambar dan memformat total tampilan agar menyesuaikan dengan background yang tersedia
Cara menambah gambar (Kamu sebagai admin)
1.Pergi ke Design~~>lalu Elemen Laman
[jika kamu menggunakan template baru... maka langsung di tata letak]
Baca [Mengubah template lama ke template baru]
Maka Akan terlihat tampilan pengeditan
<script type='text/javascript'>
var bg = [
"http://a8.sphotos.ak.fbcdn.net/hphotos-ak-prn1/541250_333812280021785_1255343265_n.jpg",
"http://a3.sphotos.ak.fbcdn.net/hphotos-ak-ash3/528383_458611784168716_2073534726_n.jpg",
"http://a4.sphotos.ak.fbcdn.net/hphotos-ak-ash3/539375_458607984169096_363296720_n.jpg",
"http://a3.sphotos.ak.fbcdn.net/hphotos-ak-snc7/582596_458601794169715_1287936936_n.jpg",
"http://a3.sphotos.ak.fbcdn.net/hphotos-ak-ash3/178938_452393958123832_306101128_n.jpg",
"http://a6.sphotos.ak.fbcdn.net/hphotos-ak-prn1/554139_458196794210215_1561305808_n.jpg",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTYYW4TWu_yTqXMellCd3LYuyXX8daSCvthVbzpSA27nIj0D7WsmebVge4INZRS3B1InpX3hMY1bPV09r1YoLrbDUFETxLz_pMWCBAkfqK_aR2nqHFVxo7DrZz40Q1i6_LbklsmM_BRL0/s800/DBSK%2520Doushite.jpg",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitd4JGaAzo1MHWy2VmVrzUTZZ_TN_362SmI6e6IxSQoVMj1w3PmATEUwdv94A3pUX7kINLl5gPO3FtKz4Sb4g4uCxd58IE48Lt-80JiEPVUPbKX0b7mle01l-qjjhN4oEFKZ5mlS7VK_G6/s1600/red+ocean-1.jpg",
"http://a4.sphotos.ak.fbcdn.net/hphotos-ak-ash3/575018_458205180876043_564645691_n.jpg"
];
function gantiBg(){
var bgLeng = bg.length-1;
var i = Math.floor(Math.random()*bgLeng);
document.body.style.backgroundImage='url('+bg[i]+')';
}
gantiBg();
</script>
Dari Script diatas..
Warna Merah :Url gambar yang akan dijadikan background random
Warna Kuning:sebagai penutup atau istilahnya solidasi dari url tersebut...jika url tidak ditemukan maka background berwarna "PUTIH" atau Blank
jika ingin menambah maka
"http://a8.sphotos.ak.fbcdn.net/hphotos-ak-prn1/541250_333812280021785_1255343265_n.jpg",
silahkan ganti warna merah dan tambahkan dalam script diatas.. javascript ingin terhitung ringan dan bisa sebagai variasi blog anda.. agar visitor tidak bosan tentunya...
Membuat Text Variatif di Blog
Image by Cool Text: Free Graphics Generator - Edit Image
Ingin Text anda seperti diatas??
Kunjungi Cooltext.com
pilih jenis gaya yang kamu mau...
Atur Sesukamu ^_^
Selamat mencoba ~>
Neon Text Effect di Blog
SELAMAT DATANG DI BLOG WILLYALVABETZ
Caranya~~~>
BlokmText diatas.. lalu klik kanan.. pilih (View Selection Source)
yang ingin membuat text seperti diatas.~~>ikut caranya dengan baik ^_^
Caranya~~~>
BlokmText diatas.. lalu klik kanan.. pilih (View Selection Source)
yang ingin membuat text seperti diatas.~~>ikut caranya dengan baik ^_^
Tag :
Tutorial
Hostingan Gambar Yang Mudah Dan Cepat
1. Facebook
2. Picassa Web Album (Google)
3.Photobucket
4. Wordpress
5.Twitter
6.tumblr
2. Picassa Web Album (Google)
3.Photobucket
4. Wordpress
5.Twitter
6.tumblr
Membuat Menu Navigasi Di Postingan Blog Keren
Menu Navigasi ... Menu yang tidak kalah penting yang harus di dalam blog... kenapa?? tentu saja agar Visitor mudah "Blogwalking" di Blog kita tentunya ^_^
Lalu bagaimana menu navigasi yang baik di dalam blog??
Tentu menu itu mungkin kita bisa menambahkan efek yang agak berbeda di blog kita agar orang lain terus mengunjungi blog kita ^_^
LAngsung Cabut yuk... mau menu navigasi kaya jalz??Kalau bingung Baca ini
Contoh demo bisa dilihat disini coba Kalian Ke Footer PAge tersebut... Sorot ujung layar bawah.. Pasti ada menu navigasi muncul disana
Demo Gambar
Langsung Check out Cara Bikinya yaw
1.Masuk Ke Blogger kamu
2. Masuk Ke Design/Template
3.Centang
4. Cari /b:skin [Gunakan CTRL+F agar lebih cepat]
5.Masukkan Kode Berikut
6.Save Template Mu
Ingat!!!
Kode berikut juga harus kamu ganti dengan pager !!
jika default template anda sudah seperti diatas.. maka tampilan akan jadi 100%
Good Luck!
Lalu bagaimana menu navigasi yang baik di dalam blog??
Tentu menu itu mungkin kita bisa menambahkan efek yang agak berbeda di blog kita agar orang lain terus mengunjungi blog kita ^_^
LAngsung Cabut yuk... mau menu navigasi kaya jalz??Kalau bingung Baca ini
Contoh demo bisa dilihat disini coba Kalian Ke Footer PAge tersebut... Sorot ujung layar bawah.. Pasti ada menu navigasi muncul disana
Demo Gambar
Langsung Check out Cara Bikinya yaw
1.Masuk Ke Blogger kamu
2. Masuk Ke Design/Template
3.Centang
4. Cari /b:skin [Gunakan CTRL+F agar lebih cepat]
5.Masukkan Kode Berikut
blog pager Jalz
*/.pager
{
width:800px;
margin:0 auto;
padding:10px 0 0;
}
#blog-pager
{
text-align:center;
clear:both;
text-transform:uppercase;
margin:0;
padding:0;
}
#blog-pager a { margin: 0 0 0 5px; overflow: hidden; position: fixed; text-indent: -9999px; width: 80px; height: 80px; z-index: 9; -moz-transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s; bottom: 1%; opacity: 0.1; }
#blog-pager a:hover { opacity: 1; }
.blog-pager-older-link { background: url(http://4.bp.blogspot.com/-18bHuKvg5ao/TnGg6N1EtWI/AAAAAAAAA6A/ZhKPackZ4WQ/s400/Next.png ) no-repeat scroll 0 0 transparent; right: 5px; }
.blog-pager-newer-link { background: url(http://4.bp.blogspot.com/-QbeWH7P8OSE/TnGg_zIB6nI/AAAAAAAAA6I/TmNTauVcj3U/s400/Prev.png ) no-repeat scroll 0 0 transparent; left: 0; }
6.Save Template Mu
Ingat!!!
Kode berikut juga harus kamu ganti dengan pager !!
<div class="pager">
<b:include name="nextprev">
<b:include name="nextprev">
jika default template anda sudah seperti diatas.. maka tampilan akan jadi 100%
Good Luck!
Cara Membuat SiteLink Blog
Sitelink... Apasih
mungkin dengan melhat review Cassieats bisa memahami ^_^
Yups.. jika pengunjung setia menuliskan url utama ..seperti blog saya jalz-cassieast.blogspot.com di Google maka yang muncul adalah seperti ini...
Sitelink pada dasarnya berganti ganti otomatis sesuai tread yang baru dan pengunjung..(Saya juga kurang tahu bagaimana sitelink bs berganti karena otomatis dari Mbah Google)
Lalu bagaimana membuatnya??
Check it out..
1.Masuk ke WEbmaster Tools terlebih dahulu di google.com/webmaster/tools
2.Pilih blog yang akan di edit.. Kalau belum paham silahkan baca [Cara Membuat Sitemap]
3.Pilih Configuration~> Site
4.Pilih url yang akan dijadikan sitelink ~~>
Notif: [Utamakan URL postingan yang sedang populer]
5.Selesai..
Tunggulah Mbah Google Mendirect Blog Anda ^_^
Baca juga : Belajar Css sederhana
Yups.. jika pengunjung setia menuliskan url utama ..seperti blog saya jalz-cassieast.blogspot.com di Google maka yang muncul adalah seperti ini...
Sitelink pada dasarnya berganti ganti otomatis sesuai tread yang baru dan pengunjung..(Saya juga kurang tahu bagaimana sitelink bs berganti karena otomatis dari Mbah Google)
Lalu bagaimana membuatnya??
Check it out..
1.Masuk ke WEbmaster Tools terlebih dahulu di google.com/webmaster/tools
2.Pilih blog yang akan di edit.. Kalau belum paham silahkan baca [Cara Membuat Sitemap]
3.Pilih Configuration~> Site
4.Pilih url yang akan dijadikan sitelink ~~>
Notif: [Utamakan URL postingan yang sedang populer]
5.Selesai..
Tunggulah Mbah Google Mendirect Blog Anda ^_^
Baca juga : Belajar Css sederhana
Tutorial Tampilan Baru Blog jalz tVXQ~
Ada yang pernah membaca Artikel panduan and review baru tampilan jalz cassieast ^_^ Yups... Tampilan jalz-cassieast yang saat itu belum sempurna saya sempurnakan sekarang.. tentunya dengan loading yang wus wus
Karena tampilan dan Interface baru.. maka saya membuat yang lebih update tentunya ^_^
Tutorial Jalz Gazine Mulai.....................
Check it out
~>Tampilan Home
~>Tampilan Search Beranda
~~>Tampilan Postingan
~~>tampilan Komentar
Tampilan Home...Tampilan yang akan akan sering dibuka oleh pengunjung tetap jalz-cassieast... Saya menyugukan Tampilan wus wus (Dengan rank kecepatan 92)
Lalu Check it tampilan dan interfacenya ~~>
Lihat Gambar diatas ~~>..Gambar ini akan anda temui di Interface Default jalz-cassieast..
Menu Dropdown di Atas akan mengarahkan Anda mencari postingan yang anda mau.. (Selain postingan yang saya tampilkan di Home )
===Gambar interface fixed homin==
Interface ini Jika Mengkliknya akan mengarahkan anda ke interface postingan blog ini
Interface Widget search ini Adalah widget ddefault yang saya tambahkan di blog ini karena selain cepat juga multifungsi daripada widget search luar ^_^
Interface Tampilan dari listing post jalz tentunya menyesuaikan dengan user ^_^ sehingga saya tampilkan seperti default ari blog" lain agar cassieats bisa memahami
Di Setiap Postingan saya beri Interface gambar melayang berikut agar kalian bisa kembali ke menu list post ^_^
Karena tampilan dan Interface baru.. maka saya membuat yang lebih update tentunya ^_^
Tutorial Jalz Gazine Mulai.....................
Check it out
~>Tampilan Home
~>Tampilan Search Beranda
~~>Tampilan Postingan
~~>tampilan Komentar
Tampilan Home...Tampilan yang akan akan sering dibuka oleh pengunjung tetap jalz-cassieast... Saya menyugukan Tampilan wus wus (Dengan rank kecepatan 92)
Lalu Check it tampilan dan interfacenya ~~>
Lihat Gambar diatas ~~>..Gambar ini akan anda temui di Interface Default jalz-cassieast..
Menu Dropdown di Atas akan mengarahkan Anda mencari postingan yang anda mau.. (Selain postingan yang saya tampilkan di Home )
===Gambar interface fixed homin==
Interface ini Jika Mengkliknya akan mengarahkan anda ke interface postingan blog ini
Interface Widget search ini Adalah widget ddefault yang saya tambahkan di blog ini karena selain cepat juga multifungsi daripada widget search luar ^_^
Interface Tampilan dari listing post jalz tentunya menyesuaikan dengan user ^_^ sehingga saya tampilkan seperti default ari blog" lain agar cassieats bisa memahami
Di Setiap Postingan saya beri Interface gambar melayang berikut agar kalian bisa kembali ke menu list post ^_^
Form Komentar Di Blog ini bisa menggunakan Social Media (FB+aiom dan lain lain)
dan form komentar blogger yang berdampingan.. Check it out ^_^
Lalu bagaimana cara berkomentar??
Klik Post your Comment! pada form
Lalu pilih Id-mu..
Berikut interface komentar dengan id blogger ^_^
bagi yang tidak ada akun google atau lainya ..bisa menggunakan Anymous Ataupun Name/Url
Format name / url bisa membantu para blogger dalam mencari backlink ^_^
Tapi ingat aturan berkomentar yang baik ya ^_^
Credit By:Jalz Aedan form komentar blogger yang berdampingan.. Check it out ^_^
Lalu bagaimana cara berkomentar??
Klik Post your Comment! pada form
Lalu pilih Id-mu..
Berikut interface komentar dengan id blogger ^_^
bagi yang tidak ada akun google atau lainya ..bisa menggunakan Anymous Ataupun Name/Url
Format name / url bisa membantu para blogger dalam mencari backlink ^_^
Tapi ingat aturan berkomentar yang baik ya ^_^
Cara Pasang Google Translate Lengkap Di Blog
Google Translate...
Siapa yang gak tau hayo?? katro ya kwkwkw
Mungkin Anda Pernah menemui interface yang seperti di bawah ini di blog saya..
Memang Interface ini keluar diakrenakan blog saya menggunakan Script google Pada Tampilan "Postingan" saja sehingga memudahkan user luar negeri untuk mentranslate blog saya ^_^
nah anda tentunya juga mau?? xD
check it out
3.Save
Siapa yang gak tau hayo?? katro ya kwkwkw
Mungkin Anda Pernah menemui interface yang seperti di bawah ini di blog saya..
Memang Interface ini keluar diakrenakan blog saya menggunakan Script google Pada Tampilan "Postingan" saja sehingga memudahkan user luar negeri untuk mentranslate blog saya ^_^
nah anda tentunya juga mau?? xD
check it out
1.Masuk Ke Elemen Laman kemudian tambahkan gadget..2. Lalu Tambahkan Kode Berikut
<div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: 'id'
}, 'google_translate_element');
}
</script><script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
3.Save
Cara Mem password Postingan Blog
hohohoho anyeong chingudeull~~ Cassieast..kali ini saya akan bercerita tentang password di postingan blog.. xD
blogger tentu saja berbeda dengan wordpress yang bisa mem password Postingan Blog wordpress dengan plugin yang tentu saja .. easy use atau istilahnya "Gampang" ...lalu blogger tidak punya fasilitas khusus untuk membuat seperti itu.. lha... bagaimana Caranya ?? kalau anda pernah membaaca widget melayang cassiopeia ataupun menu dropdown melayang versi jalz.. agak mudah mengikutinya
Passwordnya track berdigit 4 angka dari cover album di bawah
Check it out~~>
Nikmati hasilnya ~~~> jalz ~
blogger tentu saja berbeda dengan wordpress yang bisa mem password Postingan Blog wordpress dengan plugin yang tentu saja .. easy use atau istilahnya "Gampang" ...lalu blogger tidak punya fasilitas khusus untuk membuat seperti itu.. lha... bagaimana Caranya ?? kalau anda pernah membaaca widget melayang cassiopeia ataupun menu dropdown melayang versi jalz.. agak mudah mengikutinya
Passwordnya track berdigit 4 angka dari cover album di bawah
Check it out~~>
Nikmati hasilnya ~~~> jalz ~
Belajar Css Display Sederhana dan Mudah
Anyeong chingudeul cassieast yang blogger.... Saya Jalz Ae mau memberi tutorial Seputar CSS yang biasa kita gunakan dalam kehidupan blogger kita #cielah ~ xD
CSS?? Apasih??
Cascade Style Sheet atau biasa disebut CSS.. adalah sebuah kode" yang memang agak rumit xD yang dibuat sebagai dasaar dari tampilan blogger,,,
Cascade Style Sheet tentunya punya property dimana property itu digunakan untuk mempercantik tampilan blogger yang ada.. berbeda dengan html.. CSS lebih mudah dan sudah dikelompokan menjadi kelas kelas .. untuk memahaminya silahkan baca artikel Menu Dropdown Cassie Jalz ataupun Memperbesar Gambar
Lalu bagaimana Property CSS beserta valuenya?? Jalz Juga punya...
baca disini
Langsung Saja xD
pernahkah anda melihat kode seperti ini???
tanda page "{" yang saya beri tanda petik adalah tanda pembuka dari kode "page" dan css harus diberi penutup berupa "}" sebagai kebalikan dari "{" ^_^ faham?? inti css adalah buka dan tutup serta isi ~~>
langsung check out isinya
margin adalah jarak antar halaman ..
border adalah border ()garis yang mengelilingi page ...saya beri transparent agar border tersebut tak terlihat
background nya juga transparent.. tapi kenapa bisa ada gambarnya?? karena saya memberi page khusus pada html agar background bisa bergonta ganti ^_^ jika belum paham baca css html di atas ^_^
Dan penerapan dari page tersebut adalah~~~>lihat langsung kebawah
page di dalam blog saya adalah induk dari semua tampilan ~> artinya page=layar yang anda lihat sekarang
dan tentu saja dikelilingi oleh tag head(kepala tampilan) dan body (tubuh tampilan blog)
sekali lagi inti CSS adalah buka dan tutup .. jika tidak mudeng silahkan hubungi saya xD
CSS?? Apasih??
Cascade Style Sheet atau biasa disebut CSS.. adalah sebuah kode" yang memang agak rumit xD yang dibuat sebagai dasaar dari tampilan blogger,,,
Cascade Style Sheet tentunya punya property dimana property itu digunakan untuk mempercantik tampilan blogger yang ada.. berbeda dengan html.. CSS lebih mudah dan sudah dikelompokan menjadi kelas kelas .. untuk memahaminya silahkan baca artikel Menu Dropdown Cassie Jalz ataupun Memperbesar Gambar
Lalu bagaimana Property CSS beserta valuenya?? Jalz Juga punya...
baca disini
Langsung Saja xD
pernahkah anda melihat kode seperti ini???
#page {Kode ini Adalah kode utama dari halaman blog saya .. (Silahkan tekan ctrl+u dan cari kode page {)
width:1100px;
margin: 0px auto;
border: 1px solid transparent;
background: transparent;
}
tanda page "{" yang saya beri tanda petik adalah tanda pembuka dari kode "page" dan css harus diberi penutup berupa "}" sebagai kebalikan dari "{" ^_^ faham?? inti css adalah buka dan tutup serta isi ~~>
langsung check out isinya
- widht:1100px;
- margin:0px auto;
- border:1px solid transparent;
- background;transparent;
margin adalah jarak antar halaman ..
border adalah border ()garis yang mengelilingi page ...saya beri transparent agar border tersebut tak terlihat
background nya juga transparent.. tapi kenapa bisa ada gambarnya?? karena saya memberi page khusus pada html agar background bisa bergonta ganti ^_^ jika belum paham baca css html di atas ^_^
Dan penerapan dari page tersebut adalah~~~>lihat langsung kebawah
</head>
<body>
<div id='page'>
====================Bla bla bla ==========</div></body></head>
page di dalam blog saya adalah induk dari semua tampilan ~> artinya page=layar yang anda lihat sekarang
dan tentu saja dikelilingi oleh tag head(kepala tampilan) dan body (tubuh tampilan blog)
sekali lagi inti CSS adalah buka dan tutup .. jika tidak mudeng silahkan hubungi saya xD
Pengenalan Cara Pengetikan Dan Tips Posting
Anyeong chingudeul cassieast yang sedang berbahagia ataupun menggaulau...
tahukan blogger ^_^ tahu dong pasti.. tempat kita mencurahkan berbagai pengetahuan yang tentu saja.. gratis dan maksimal dimana blog tersebut akan menjadi gudang pengetahuan kita ^_^
postingan tentu saja hal yang sangat" penting bagi para blogger..
Sudahkah anda membaca Menarik Pengunjung blog dengan tag gambar dan Tips memilih template untuk blog
tapi kali ini saya akan menjelaskan tentang cara pengetikan yang benar dalam postingan blogger ^_^ dan tentu saja ini sudah saya terapkan dalam blog saya sendiri ^_^ so.. enjoy it...
Pertama-tama.. besarkan gambar diatas jika belum jelas kwkwkwkw ~~
Di gambar atas ada nomer" tidak jelas yang saya edit sendiri sebagai penanda...Walaupun cara pengetikan post pada blogger hampir sama bahkan mirip dengan microsoft windows ataupun open office...tapi tidak ada salahnya kita belajar lagi y ^_^
Langsung ke fungsi yooo
1.Undo:mengulang ke sesi sebelum kamu melakukan 1 action
2.Redo:memajukan satu sesi kedepan ketika kamu menekan undo terlebih dahulu tentunya
3. Font: memilih font yang digunakan.. jika ingin mengubah default font kamu bisa setting di EDIT html sendiri ya
4.Text: kamu bisa memilih ukuran font yang digunakan disini.. dalam blogger hanya ada 5 setting...
seperti smal,smaller,large ,larger ...kamu bisa lihat" dan explorasi sendiri
5.Saya kurang mengeti saat nomer 5.. tapi menurut saya ini adalah setting dari posisi text yang telah diblok(tentu saja setiap ingin menggunakan action kamu harus menggunakan blog text untuk menunjuk text yang akan diberi action)
6.Bold:Memberi action Tag B pada postingan .
7. Italic:memberi action garis miring pada postingan.. tentu saja berpengaruh pada google... text italic akan menghasilkan italic tag pada search engine seperti halnya tag bold
8.Underline:memberi action garis bawah pada text yang dipilih (dengan memblok terlebih dahulu)
9.Strike:membuat tag strike pada postingan dan membuat action garis coretan di tengah kata" yang telah dipilih (diblok)
10.Warna untuk font yang dipilih
11.text background ....
12..link.. dapat member link pada text yang diblok... lalu klik Link ..dan masukan link yang akan dituju saat kata tersebut di klik
misalnya menarik pengunjung dengan tag gambar
13.Upload Gambar
14.Upload Video
15.Jump break.. bisa melompatkan anda saat anda mengklik text ang telah diberi jump break
..
Setelah modifikasi selesai
anda bisa memilih opsi untuk post tersebut misalnya...
posting:akan diposting
Save:akan disimpan sebagai catatan{draft} blog
Prewiew:akan menampilkan hasil review ketikan anda
tahukan blogger ^_^ tahu dong pasti.. tempat kita mencurahkan berbagai pengetahuan yang tentu saja.. gratis dan maksimal dimana blog tersebut akan menjadi gudang pengetahuan kita ^_^
postingan tentu saja hal yang sangat" penting bagi para blogger..
Sudahkah anda membaca Menarik Pengunjung blog dengan tag gambar dan Tips memilih template untuk blog
tapi kali ini saya akan menjelaskan tentang cara pengetikan yang benar dalam postingan blogger ^_^ dan tentu saja ini sudah saya terapkan dalam blog saya sendiri ^_^ so.. enjoy it...
Di gambar atas ada nomer" tidak jelas yang saya edit sendiri sebagai penanda...Walaupun cara pengetikan post pada blogger hampir sama bahkan mirip dengan microsoft windows ataupun open office...tapi tidak ada salahnya kita belajar lagi y ^_^
Langsung ke fungsi yooo
1.Undo:mengulang ke sesi sebelum kamu melakukan 1 action
2.Redo:memajukan satu sesi kedepan ketika kamu menekan undo terlebih dahulu tentunya
3. Font: memilih font yang digunakan.. jika ingin mengubah default font kamu bisa setting di EDIT html sendiri ya
4.Text: kamu bisa memilih ukuran font yang digunakan disini.. dalam blogger hanya ada 5 setting...
seperti smal,smaller,large ,larger ...kamu bisa lihat" dan explorasi sendiri
5.Saya kurang mengeti saat nomer 5.. tapi menurut saya ini adalah setting dari posisi text yang telah diblok(tentu saja setiap ingin menggunakan action kamu harus menggunakan blog text untuk menunjuk text yang akan diberi action)
6.Bold:Memberi action Tag B pada postingan .
7. Italic:memberi action garis miring pada postingan.. tentu saja berpengaruh pada google... text italic akan menghasilkan italic tag pada search engine seperti halnya tag bold
8.Underline:memberi action garis bawah pada text yang dipilih (dengan memblok terlebih dahulu)
9.Strike:membuat tag strike pada postingan dan membuat action garis coretan di tengah kata" yang telah dipilih (diblok)
10.Warna untuk font yang dipilih
11.text background ....
12..link.. dapat member link pada text yang diblok... lalu klik Link ..dan masukan link yang akan dituju saat kata tersebut di klik
misalnya menarik pengunjung dengan tag gambar
13.Upload Gambar
14.Upload Video
15.Jump break.. bisa melompatkan anda saat anda mengklik text ang telah diberi jump break
16. Perataan pada postingan.. misalnya rata tengah ..kanan..kiri .. contoh sebagai berikut yang saya beri rata kanan
17. numbering.. memberi nomor otomatis .. sebagai tanda dari list ^_^
18.Bullet:sama seperti numbering tapi ini berbentuk symbol
19. parragraf ..menjorokan tulisan anda ke dalam...bisa juga sebagai tag
20..~~>not understand<<~
21.pengecekan kata yang anda gunakan ~~>
====================================================================
Selain fungsi tombol" diatas.. anda juga bisa menambahkan kreasi anda pada tag html
misalnya Modifikasi text berjalan (marquee) ataupun berkedip=kedip (blink)
Contoh:
..
Setelah modifikasi selesai
anda bisa memilih opsi untuk post tersebut misalnya...
posting:akan diposting
Save:akan disimpan sebagai catatan{draft} blog
Prewiew:akan menampilkan hasil review ketikan anda
Kiat Cerdas Memilih Template Untuk Blog
sehingga memudahkan pengindeksan halaman posting kita ke google .. tentu saja agar visitor datang..
Lah..bagaimana cara memilih template yang bagus?? karena banyak sekali template yang mengatakan "Saya Seo pakai saya" atau "Download template SEO" ..kamu bisa download di BTemplate atau website lain yang menyediakan template gratis..tapi kamu juga harus tau cara memilih kan ~~
Check it out mas bro Kiat Cerdas Memilih Template Untuk Blog~~~
1. Pilih h1 dan h2
Apa itu h1 dan h2?? .. itu adalah tag halaman posting agar template kita tambah seo.. sayangnya kebanyakan template menggunakan tag h3... lha bagaimana memperoleh tag h1 dan h2 dalam postingan?? nanti kita bahas lebih lanjut ~ dalam blog ini tentunya
2. Kecil dan Menarik
Kecil dan menarik??? apalagi ini?? hahaha
yang dimaksud kecil dan menarik pada tips ini adalah... file ukuran template kecil.. tapi ada daya tarik tersendiri seperti itu...untuk memperkecil ukuran template .kamu bisa gunakan kompresor css atau alat kompress lain
3.Meta tag Memadai
Meta tag memadai....kenapa saya bilang memadai?? karena meta tag tambah lengkap tambah bagus terindeks.. dulu saat saya menggunakan meta tag seadanya yang hanya berisi keyword dan deskripsi.. pengunjung blog paling banyak hanya 600 serta ranking alexa yang saya tunggu sampai bulu ketiak saya tumbuh hanya turun sekitar 10k... dan Apakah yang terjadi ketika saya membredeli meta tag?? pengunjung saya meningkat 1k perhari ~ bahkan bisa lebih...ranking alexa??? naek 7jt brow ~ keren kan
kamu bisa dapat meta tag seperti itu dengan memodifikasinya sendiri.. saya rekomendasikan menggunakan meta tag ini
4.Rapi
Rapi?? Perlukah template blog rapi??? hm... tentu saja... Kenapa tidak... seumpama blog itu adalah orang yang akan melamar kerjadi google ... walaupun bebas... waktu diterima masuk indekx...visitor masuk dan berkomentar " tampilan semrawut" bukankah sangat menyayat hati?? haha ~
6. Sub Menu Mudah Dipahami
Menu navigasi yang mudah juga sangat berpengaruh terhadap pengunjung yang datang.. mengapa? karena pengunjung yang masuk. bukan hanya melihat post..tapi melihat menu yang anda sediakan untuk mereka.. jika mereka kurang puas ataupun bingung ... tentu saja... mungkin mereka langsung meneka tombol close dari blog anda ~
7.Kesesuaian Gambar
Kalau ini sama saja dengan kerapian intinya...lucu kan kalau blog islami tapi berbackground salib?? pernah menemui?? tentuna tidak.. karena secara instinc para blogger faham kalau blog mereka identitas seperti tema... deskripsi dan lain lain yang harus serupa.. kecuali blog gado" atau blog yang menyediakan banyak informasi dan tidak jelas..
8.Widget
Widget...~~>hal inilah yang sering blogger newbie tambah"an dan dewakan.. kenapa?? karena mereka menginginkan blog mereka tampilan bagus...seharusnya bukan hanya bagus.. tapi juga profesional ... SEO juga harus diutamakan...
===================================================================
sekian dari pengalaman yang pernah saya temui tentang pemilihan template yang pas ~~
By:Jalz
Teknik Untuk Menarik Visitor Blog Dengan Tag Gambar
Teknik Untuk Menarik Visitor Blog Dengan Tag Gambar ?? apa itu ya xD
kalo belum paham silahkan baca Meta Tag Lengkap Jalz Ataupun Meta Tag Open Graph .... Pahami bahwa meta tag digunakan untuk meningkatkan Kualitas Blog anda sehingga tambah Seo..atau biasa disebut search engine optimization..istilahnya memudahkan search engine mengindex blog kita...untuk mengindek blog..search engine menggunakan search tag yang akan diarahkan ke blog" yang telah ada..
Ada pula tag seperti h1,h2,h3 atau seterusnya
atau bold tag italic tag seperti bentuk tulisan Bold,italic,ataupun underline..
tapi kali ini saya akan membahas Teknik Untuk Menarik Visitor Blog Dengan Tag Gambar ..bagaimana caranya???
Sebenarnya nama judul ini tak sesuai aslinya..berhubung saya tidak mengetahui namanya xD jadi saya beri nama tag gambar#plak
langsung cara pembuatan...
-------------------------------------------------------------
pada saat mengupload gambar kita akan memperoleh link ~> baca (Cara mengganti link target gambar)
Url itu diperoleh dari nama asli gambar sebelum diupload..misa nama gambar Jalz Cassieast maka linknya akan menjadi providergambar.com/jalz+cassieast.jpg
kira kira seperti itu...jadi usahakan saat mengupload gambar..gunakan kata kunci yang setidak nya orang cari di google..
sehingga bisa jadi orang itu mengklik SItus Web ini saat di google ,Tapi walau tak mengklik...kita tetap dapat visitor 1 saat org tersebut melihat gambarnya di google ^_^ enak bukan??
tapi jangan lupa...itu bukan semuanya..dibutuhkan juga meta tag yang bagus dengan tag lain yang juga tidak kalh pentingnya ^_^
kalo belum paham silahkan baca Meta Tag Lengkap Jalz Ataupun Meta Tag Open Graph .... Pahami bahwa meta tag digunakan untuk meningkatkan Kualitas Blog anda sehingga tambah Seo..atau biasa disebut search engine optimization..istilahnya memudahkan search engine mengindex blog kita...untuk mengindek blog..search engine menggunakan search tag yang akan diarahkan ke blog" yang telah ada..
Ada pula tag seperti h1,h2,h3 atau seterusnya
atau bold tag italic tag seperti bentuk tulisan Bold,italic,ataupun underline..
tapi kali ini saya akan membahas Teknik Untuk Menarik Visitor Blog Dengan Tag Gambar ..bagaimana caranya???
Sebenarnya nama judul ini tak sesuai aslinya..berhubung saya tidak mengetahui namanya xD jadi saya beri nama tag gambar#plak
langsung cara pembuatan...
-------------------------------------------------------------
pada saat mengupload gambar kita akan memperoleh link ~> baca (Cara mengganti link target gambar)
Url itu diperoleh dari nama asli gambar sebelum diupload..misa nama gambar Jalz Cassieast maka linknya akan menjadi providergambar.com/jalz+cassieast.jpg
kira kira seperti itu...jadi usahakan saat mengupload gambar..gunakan kata kunci yang setidak nya orang cari di google..
sehingga bisa jadi orang itu mengklik SItus Web ini saat di google ,Tapi walau tak mengklik...kita tetap dapat visitor 1 saat org tersebut melihat gambarnya di google ^_^ enak bukan??
tapi jangan lupa...itu bukan semuanya..dibutuhkan juga meta tag yang bagus dengan tag lain yang juga tidak kalh pentingnya ^_^
Membuat 3 Kolom Widget Dibawah Postingan Paling Ampuh
Pernah Lihat widget yang ada dibawah postingan??? ..pasti sering...tapi kenapa bisa ya?? padahal template default blogger atau mungkin template lain tersebut tidak ada tanda Add Gadget saat anda menggunakan template tersebut??
itu karena mereka menambahkan sendiri..Memang bisa?? ..bisa lah..langsung caranya mas bro ~~>
1.Login Blogger Kamu
2.Masuk Ke Menu Page Elemen/Elemen Laman<<~Agar Lebih mudah
---------ingat:!! jika belum yakin akan work...Backup Template Kamu terlebih dahulu
==========================================================
3.Selanjutnya Klik Kanan EDIT HTML dan centang
4. Cari </b:skin>
5.Pastekan kode berikut ~~>
#footer-bottom {
width: 900px;background:transparent;
position: relative;display:inline;
clear:both;
margin:0 auto 0;
color:#EB1E1E;
float: left;
padding:10px;
height:498;
}
#left-bottom {
width: 33%;
float: left;display:inline;
margin:10px 5px 0 5px;
padding:5px
}
#center-bottom {
width: 33%;
float: left;
margin:10px 5px 0;
padding:5px
}
#right-bottom{
width: 33%;
float: left;display:inline;
margin:10px 5px 0;
padding:5px
}
Note:
Warna Merah adalah ukuran dari Kolom tersebut...
33 % menandakan bahwa kolom tersebut akan berukuran 33% dari ukuran layar...
penggunaan hitungan % digunakan jika anda malas menghitung ukuran layar blog anda xD
Jika ingin 4 kolom maka harus 25%..seperti itu kira" xD
---------------------------------------------------------------------------------------------
Langsung Lanjut~~~~~~>
6.Cari kode <div id='footer'> atau <div id='footer-wrapper'>
Pastekan kode berikut dibawahnya.........
<div id='footer-bottom'>
<b:section class='footer-bottom' id='left-bottom' preferred='yes' showaddelement='yes'>
</b:section>
<b:section class='footer-bottom' id='center-bottom' preferred='yes' showaddelement='yes'>
</b:section>
<b:section class='footer-bottom' id='right-bottom' preferred='yes' showaddelement='yes'>
</b:section>
</div>
7.Save Template.......~> jadilah footer baru kamu ~>chukhae ya ^_^
Jangan lupa...tampilan bukan segalanya...kamu juga harus punya Meta tag yang bagus..
silahkan baca Meta Tag Lengkap Ala Jalz ataupun Meta Tag Open Graph Facebook ..
Happy blogging ~
itu karena mereka menambahkan sendiri..Memang bisa?? ..bisa lah..langsung caranya mas bro ~~>
1.Login Blogger Kamu
2.Masuk Ke Menu Page Elemen/Elemen Laman<<~Agar Lebih mudah
---------ingat:!! jika belum yakin akan work...Backup Template Kamu terlebih dahulu
==========================================================
3.Selanjutnya Klik Kanan EDIT HTML dan centang
4. Cari </b:skin>
5.Pastekan kode berikut ~~>
#footer-bottom {
width: 900px;background:transparent;
position: relative;display:inline;
clear:both;
margin:0 auto 0;
color:#EB1E1E;
float: left;
padding:10px;
height:498;
}
#left-bottom {
width: 33%;
float: left;display:inline;
margin:10px 5px 0 5px;
padding:5px
}
#center-bottom {
width: 33%;
float: left;
margin:10px 5px 0;
padding:5px
}
#right-bottom{
width: 33%;
float: left;display:inline;
margin:10px 5px 0;
padding:5px
}
Note:
Warna Merah adalah ukuran dari Kolom tersebut...
33 % menandakan bahwa kolom tersebut akan berukuran 33% dari ukuran layar...
penggunaan hitungan % digunakan jika anda malas menghitung ukuran layar blog anda xD
Jika ingin 4 kolom maka harus 25%..seperti itu kira" xD
---------------------------------------------------------------------------------------------
Langsung Lanjut~~~~~~>
6.Cari kode <div id='footer'> atau <div id='footer-wrapper'>
Pastekan kode berikut dibawahnya.........
<div id='footer-bottom'>
<b:section class='footer-bottom' id='left-bottom' preferred='yes' showaddelement='yes'>
</b:section>
<b:section class='footer-bottom' id='center-bottom' preferred='yes' showaddelement='yes'>
</b:section>
<b:section class='footer-bottom' id='right-bottom' preferred='yes' showaddelement='yes'>
</b:section>
</div>
7.Save Template.......~> jadilah footer baru kamu ~>chukhae ya ^_^
Jangan lupa...tampilan bukan segalanya...kamu juga harus punya Meta tag yang bagus..
silahkan baca Meta Tag Lengkap Ala Jalz ataupun Meta Tag Open Graph Facebook ..
Happy blogging ~
Meta Tag Lengkap Ala Jalz
Meta Tag Kata yang satu ini sudah tidak asing lagi bagi para Blogger..dimana kegunaan meta tag sendiri yang sangat penting dalam hubungan yang baik antara Search Engine dan Blog yang kita punya...sebelumnya kita pernah membahas Open Graph Meta Tag yang digunakan untuk membetulkan deskripsi blog kita di facebook serta Meta Tag yang Bisa digunakan agar menyesuaikan judulnya
Kita Akan Membahas meta tag utama yang akan digunakan di setiap post yang akan otomatis membantu artikel kita terindex di google juga ^_^
langsung saja cara pemasangannya ya ~~>
1.Login Blogger Kamu
2.Masuk Ke Menu Page Elemen/Elemen Laman<<~Agar Lebih mudah
3.Selanjutnya Klik Kanan EDIT HTML dan centang
4. Cari <b:skin>
5.Pastekan Kode Berikut Diatasnya ...
<b:include data='blog' name='all-head-content'/>
<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.pageTitle/></title><meta content='Deskripsi Home page kamu' name='description'/>
<meta content='Keyword Untuk homepage kamu ' name='keywords'/>
<meta content='Blogkamu.blogspot.com' name='subject'/>
<meta content=' Deskripsi Abstrak(Mirip deskripsi)' name='Abstract'/>
<b:else/><b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:blog.pageType == "item"'>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/>
<title><data:blog.pageTitle/></title>
</b:if><meta expr:content='data:blog.pageName + " Deskripsi Blog Kamu"' name='description'/>
<meta expr:content='data:blog.pageName + " Keyword Kamu"' name='keywords'/>
<meta expr:content='data:blog.pageName' name='subject'/>
<meta expr:content='data:blog.pageName' name='Abstract'/>
<b:else/>
<title><data:blog.pageTitle/></title><meta expr:content='data:blog.pageName + " Deskripsi Blog Kamu"' name='description'/>
<meta expr:content='data:blog.pageName + " Keyword Blog Kamu "' name='keywords'/>
<meta expr:content='data:blog.pageName' name='subject'/>
<meta expr:content='data:blog.pageName' name='Abstract'/>
</b:if>
</b:if>
<title><data:blog.pageTitle/></title>
<meta content='http://blogkamu.blogspot.com/' name='copyright'/>
<meta content='Nama Kamu Disini' name='author'/>
<meta content='Aeiwi, Alexa, AllTheWeb, AltaVista, AOL Netfind, Anzwers, Canada, DirectHit, EuroSeek, Excite, Overture, Go, Google, HotBot. InfoMak, Kanoodle, Lycos, MasterSite, National Directory, Northern Light, SearchIt, SimpleSearch, WebsMostLinked, WebTop, What-U-Seek, AOL, Yahoo, WebCrawler, Infoseek, Excite, Magellan, LookSmart, bing, CNET, Googlebot' name='search engines'/>
<meta content='KODE VERIFIKASI GOOGLE' name='google-site-verification'/>
<meta content='KODE VERIFIKASI BLOGCATALOG' name='blogcatalog'/>
<meta content='UTF-8' name='Charset'/>
<meta content='Global' name='Distribution'/>
<meta content='information' name='classification'/>
<meta content='General' name='Rating'/>
<meta content='INDEX FOLLOW' name='Robots'/>
<meta content='document' name='resource-type'/>
<meta content='follow,all' name='robots'/>
<meta content='INDEX,FOLLOW, all' name='robots'/>
<meta content='1 days' name='revisit'/>
<meta content='1 Days' name='Revisit-after'/>
<meta content='ID' name='language'/>
<meta content='ID' name='geo.country'/>
<meta content='Indonesia' name='geo.placename'/>
<meta content='global' name='distribution'/>
<meta content='blogger' name='generator'/>
<meta content='general' name='rating'/>
<meta content='global' name='target'/>
<meta content='index,follow,snipet' name='googlebot'/>
<meta content='follow, all' name='Googlebot-Image'/>
<meta content='follow, all' name='Scooter'/>
<meta content='follow, all' name='msnbot'/>
<META CONTENT='NOODP' Name='msnbot'/>
<meta content='follow, all' name='alexabot'/>
<meta content='follow, all' name='Slurp'/>
<meta content='follow, all' name='ZyBorg'/>
<meta content='follow, all' name='Scooter'/>
<meta content='ALL' name='SPIDERS'/>
<meta content='ALL' name='WEBCRAWLERS'/>
<link expr:href='data:blog.url' rel='canonical'/>
6.Save Template ^_^
Silahkan menikmati hasilnya ya ^________^
Tag :
Tutorial
Widget Melayang Cassiopeia Free Widget
Langsung aja...saya baru rilis widget baru..Float Free..Reviewnya kayak disamping...Kalo belum tau widget floating itu seperti apa ..lihat ~>Widget Share melayang Lengkap atau Menu Dropdown Melayang Silahkan pahami....Dari kedua widget itu bersifat float(Melayang mengikuti Layar)...
Langsung saja...Bagaimana Membuat ini...
Untuk widget yang satu ini cukup simple membuatnya ^_^
1.Login Blogger
2.Langsung melangkah ke Elemen halaman (Page element/elemen laman)
3.Klik Tambah Gadget
4.Tambahkan script Java/HTML ~> tambahkan kode berikut
<style type="text/css">
.barrightblogger{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiE2AoCb8q9Y5nkgLxk3kGcKn6eycWOR2tSCFEMCuHY1S1bJEIMs_QNDfggdTTYT1awuNsVvj1nftBpUDiP7gXRQMWFXxA5nrt9ICXc1R6dBeiAxYtzw6oV7EaLrZFecPMQFOstnaar7CGh/s1600/1.jpg');background-repeat:no-repeat;width:39px;height:345px;position:fixed;right:0px;top:50px; z-index:1000;}
.barrightbloggerc{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPhdv_xkNBUI8UTWifPLQkKXm7OCq4Z9Z2QJa2y5rFdFT6m6DS5jFBq-S4wdsV8frSPCvcOJjyv8thcotPNCpUEKKb4DfGNI7q5qX28c-VxXsU_c96S-ytQEeuxC3ANK7-G_aZbscW2ucA/s1600/2-bmp.png');background-repeat:no-repeat;width:400px;height:345px;position:fixed;right:0px;top:50px; z-index:1100;}
.barconteblogger{margin:5px 0 0 47px}
</style>
<div class="barrightblogger" onmouseout="this.className='barrightblogger'" onmouseover="this.className='barrightbloggerc'">
<div class="barconteblogger">
----------------Konten Kamu Disini-------------------------------
</div>
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiE2AoCb8q9Y5nkgLxk3kGcKn6eycWOR2tSCFEMCuHY1S1bJEIMs_QNDfggdTTYT1awuNsVvj1nftBpUDiP7gXRQMWFXxA5nrt9ICXc1R6dBeiAxYtzw6oV7EaLrZFecPMQFOstnaar7CGh/s1600/1.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;">
</a></div>
.barrightblogger{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiE2AoCb8q9Y5nkgLxk3kGcKn6eycWOR2tSCFEMCuHY1S1bJEIMs_QNDfggdTTYT1awuNsVvj1nftBpUDiP7gXRQMWFXxA5nrt9ICXc1R6dBeiAxYtzw6oV7EaLrZFecPMQFOstnaar7CGh/s1600/1.jpg');background-repeat:no-repeat;width:39px;height:345px;position:fixed;right:0px;top:50px; z-index:1000;}
.barrightbloggerc{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPhdv_xkNBUI8UTWifPLQkKXm7OCq4Z9Z2QJa2y5rFdFT6m6DS5jFBq-S4wdsV8frSPCvcOJjyv8thcotPNCpUEKKb4DfGNI7q5qX28c-VxXsU_c96S-ytQEeuxC3ANK7-G_aZbscW2ucA/s1600/2-bmp.png');background-repeat:no-repeat;width:400px;height:345px;position:fixed;right:0px;top:50px; z-index:1100;}
.barconteblogger{margin:5px 0 0 47px}
</style>
<div class="barrightblogger" onmouseout="this.className='barrightblogger'" onmouseover="this.className='barrightbloggerc'">
<div class="barconteblogger">
----------------Konten Kamu Disini-------------------------------
</div>
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiE2AoCb8q9Y5nkgLxk3kGcKn6eycWOR2tSCFEMCuHY1S1bJEIMs_QNDfggdTTYT1awuNsVvj1nftBpUDiP7gXRQMWFXxA5nrt9ICXc1R6dBeiAxYtzw6oV7EaLrZFecPMQFOstnaar7CGh/s1600/1.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;">
</a></div>
5.Untuk konten kamu..bisa kamu tambahkan widget music atau FAnpage Facebook...bahkan profilmu pun bisa !
6.Done~~ nikmati ya...Review Real Lihat gambar disamping~~>
Menu Dropdown Melayang Version 1 by Jalz~
Menu Dropdown Apa Sih??Melayang ??? gimana ya bentuknya ?? hahaha....
langsung check out reviewnya gan ^____^....ini dia..
tentunya saya membagi ini Bukan tanpa sebab...Setelah kemaren saya membahas Open Graph Meta Tag Untuk Facebook ...tentunya jika blog hanya terkenal pun tidak cukup...tampilan juga harus disesuaikan ^_^ ..contohnya saya memasang widget share lengkap seperti di samping ini..
Langsung saja...Gimana Cara Pasangnya ?? Check it out ~~>
1.Login Blogger Kamu
2.Masuk Ke Menu Page Elemen/Elemen Laman<<~Agar Lebih mudah
3.Selanjutnya Klik Kanan EDIT HTML dan centang
4. Cari </b:skin>
5.Pastekan Kode Berikut Diatasnya ...
* Menu Horizontal Dropdown
----------------------------------------------- */
#menuwrapperpic {background:#2a4375 top center;width:100%;margin:0 auto;padding:0 auto;border-bottom:1px solid #165D92;}
#menuwrapper {width:960px;margin:0 auto;height:41px; background:#2a4375;}
.clearit {clear: both;height: 0;line-height: 0.0;font-size: 0;}
#menubar {width:100%;}
#menubar, #menubar ul {padding: 0;margin: 0;list-style: none;font-family:Arial, sans-serif;}
#menubar a {display: block;text-decoration: none;padding: 13px 12px 12px 12px;font-size:12px;font-weight:bold;text-transform:none;color:#d1d8e5;border-left:1px solid #165D92}
#menubar a.trigger {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5DrpTYp-DV-I_oxiEKhTw0HbUPNUn7o_70sm4aIEOtIZHmTbJKBmwyJckM0GS6omq3sXzmt_QXq-AB7-kPpXZSe2PY_HOL21vwAlZFnO4jZFGShFQb9Q5gmTVEOs-s_vyHSxVkBHbOUY/s1600/arrow.gif);background-repeat: no-repeat;padding: 13px 24px 12px 12px;background-position: right center;}
#menubar li {float: left;position: relative;}
/* hide from IE mac \*/
#menubar li {position: static; width: auto;}
/* end hiding from IE5 mac */
#menubar li ul, #menubar ul li {width:165px;}
#menubar ul li a {text-align:left;color:#13598D;padding: 6px 12px;font-size: 12px;font-weight:bold;text-transform:none;font-family:Arial;}
#menubar li ul {z-index:100;position: absolute;display: none;background:#0F4E7D;padding-bottom:5px;}
#menubar li ul {-moz-border-radius-bottomleft:5px; -moz-border-radius-bottomright:5px; -webkit-border-bottom-left-radius:5px; -webkit-border-bottom-right-radius:5px; border-bottom-left-radius:5px; border-bottom-right-radius:5px;}
#menubar li ul {-moz-box-shadow:0 5px 5px rgba(0, 0, 0, 0.6); -webkit-box-shadow:0 5px 5px rgba(0, 0, 0, 0.6);filter:alpha(opacity=95);-moz-opacity:.95;opacity:.95;}
#menubar li:hover a, #menubar a:active, #menubar a:focus, #menubar li.hvr a{background-color:#115383;color:#d1d8e5;text-decoration:none;}
#menubar li:hover ul, #menubar li.hvr ul {display: block;}
#menubar li:hover ul a, #menubar li.hvr ul a {color:#d1d8e5;background-color:transparent;text-decoration:none;}
#menubar li ul li.hr {border-bottom:1px solid #296A99; border-top:1px solid #0E4064; display:block; font-size: 1px; height: 0px; line-height: 0px; margin:4px 0; }
#menubar ul a:hover {background-color: #0E3B5D!important;color: #d1d8e5 !important;text-decoration:none;}
#menubar li.home a, #menubar li.home a:visited {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYAUl1J2RyxCHQ-_5sh5t3h0tP9s1Ij_GwfrNUQ_F50T8eqx7b7tp5fwUcn6d5FQPJrxvRW1GcSkvWl5j5MBe3DN_ALLh1EsKydEtOpVvN_2dVTuiRKRjl2hEM1XA9Zvr7WWtLDgz-VAo/s1600/menu_hover.gif) repeat-x top left;border-left:none}
#menubar li.home a:hover {background:#1d335d;}
/* Fixed Position */
#inner{padding-top:41px;}
#fixed {position:fixed;top:0;left:0;width:100%;height:41px;z-index:999;}
#fixedinner{text-align:center;background:transparent;height:41px;position:relative;z-index:999;}
* html, * html body{overflow-y:hidden;height:100%;}
* html #fixedinner{margin-right:-143px;voice-family: "\"}\""; voice-family:inherit; }
* html #fixedinner{margin-right:17px;}
* html #fixed {position:absolute;}
/* -- SET FOR STATUS MESSAGE -- */
#search {
}
#search input[type="text"] {
background: url(search-dark.png) no-repeat 10px 6px #444;
border: 0 none;
font: bold 12px Arial,Helvetica,Sans-serif;
color: #777;
width: 150px;
padding: 6px 15px 6px 35px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
text-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
-moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
-webkit-transition: all 0.7s ease 0s;
-moz-transition: all 0.7s ease 0s;
-o-transition: all 0.7s ease 0s;
transition: all 0.7s ease 0s;
}
#search input[type="text"]:focus {
width: 200px;
}
6. Cari Kode <header> atau sejenisnya <<~biasanya juga header-wrapper
Pastekan kode berikut dibawahnya ^_^
<div id='fixed'>
<div id='fixedinner'>
<div id='menuwrapperpic'>
<div id='menuwrapper'>
<ul id='menubar'>
<li><a href='/'><img alt='Home' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnHbnGM7zTNdJQgpFPV3eA6gPiuWq4M3ZS6vf0l6RcrFOidjj5TlDnUgoHsjOAz7R8_-Y_tG1V6Q3L-6_1NnAlBEEDnhWCLmqNNZ0xPTTOBGdibvfC6o8ghi62vWstKmzDY5mQrq-kO-E/s1600/home.png' style='padding:0px;'/></a></li>
<li><a href='http://tvxqff.blogspot.com'>Kim Jaejoong</a></li>
<li><a href='http://jalz-cassieast.blogspot.com/2012/03/tvxq-for-you-mobile.html'>Kim Junsu</a>
</li>
<li><a href='http://jalz-cassieast.blogspot.com/search/label/Blogger'>Jung Yunho</a>
<ul class='children'>
<li><a href='http://jalz-cassieast.blogspot.com/search/label/Tutorial'>Tutorial</a></li>
<li><a href='http://jalz-cassieast.blogspot.com/search/label/Widget'>Widget</a></li>
<li><a href='http://jalz-cassieast.blogspot.com/search/label/TnT'>Tips And Trick</a></li>
<li><a href='http://jalz-cassieast.blogspot.com/search/label/Template'>Template</a></li>
<li><a href='http://jalz-cassieast.blogspot.com/search/label/Software'>Software</a></li>
<li><a href='http://jalz-cassieast.blogspot.com/search/label/Pc%20Tutor'>Pc Tutorial</a></li>
</ul></li>
<li><a href='#'>Park Yoochun</a>
<ul class='children'>
</ul></li>
<li><a href='http://jalz-cassieast.blogspot.com/2012/02/link-tradingjalz-tvxq.html'>Max Changmin</a></li>
<li>
<form action='/search' id='search' method='get'>
<input name='q' placeholder='Search...' size='40' type='text'/>
</form></li>
<li><a href='http://facebook.com/ka.jihoon'><img alt='Home' border='0' src='http://facebook.com/favicon.ico' style='padding:0px;'/></a></li>
<li><a href='http://twitter.com/kajihoon'><img alt='Home' border='0' src='http://twitter.com/favicon.ico' style='padding:0px;'/></a></li>
<li><a href='http://www.facebook.com/sharer.php' name='fb_share' type='button'>Share</a><script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/></li>
</ul>
<br class='clearit'/>
</div>
<div style='clear:both;'/>
</div>
</div><!-- end fixed jalz menu -->
</div>
Dan jadilah seperti ini:
Note:
Penjelasan ----------------------------------------------------------------------------------------
<li><a href='http://jalz-cassieast.blogspot.com/2012/02/link-tradingjalz-tvxq.html'>Max Changmin</a></li>
Kode berwarna Orange:menunjukan Link yang akan dibuka saat Kode tanda Merah Di klik
Tanda Merah menunjukan kode yang muncul di barisan menu ~>~
langsung check out reviewnya gan ^____^....ini dia..
tentunya saya membagi ini Bukan tanpa sebab...Setelah kemaren saya membahas Open Graph Meta Tag Untuk Facebook ...tentunya jika blog hanya terkenal pun tidak cukup...tampilan juga harus disesuaikan ^_^ ..contohnya saya memasang widget share lengkap seperti di samping ini..
Langsung saja...Gimana Cara Pasangnya ?? Check it out ~~>
1.Login Blogger Kamu
2.Masuk Ke Menu Page Elemen/Elemen Laman<<~Agar Lebih mudah
3.Selanjutnya Klik Kanan EDIT HTML dan centang
4. Cari </b:skin>
5.Pastekan Kode Berikut Diatasnya ...
* Menu Horizontal Dropdown
----------------------------------------------- */
#menuwrapperpic {background:#2a4375 top center;width:100%;margin:0 auto;padding:0 auto;border-bottom:1px solid #165D92;}
#menuwrapper {width:960px;margin:0 auto;height:41px; background:#2a4375;}
.clearit {clear: both;height: 0;line-height: 0.0;font-size: 0;}
#menubar {width:100%;}
#menubar, #menubar ul {padding: 0;margin: 0;list-style: none;font-family:Arial, sans-serif;}
#menubar a {display: block;text-decoration: none;padding: 13px 12px 12px 12px;font-size:12px;font-weight:bold;text-transform:none;color:#d1d8e5;border-left:1px solid #165D92}
#menubar a.trigger {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5DrpTYp-DV-I_oxiEKhTw0HbUPNUn7o_70sm4aIEOtIZHmTbJKBmwyJckM0GS6omq3sXzmt_QXq-AB7-kPpXZSe2PY_HOL21vwAlZFnO4jZFGShFQb9Q5gmTVEOs-s_vyHSxVkBHbOUY/s1600/arrow.gif);background-repeat: no-repeat;padding: 13px 24px 12px 12px;background-position: right center;}
#menubar li {float: left;position: relative;}
/* hide from IE mac \*/
#menubar li {position: static; width: auto;}
/* end hiding from IE5 mac */
#menubar li ul, #menubar ul li {width:165px;}
#menubar ul li a {text-align:left;color:#13598D;padding: 6px 12px;font-size: 12px;font-weight:bold;text-transform:none;font-family:Arial;}
#menubar li ul {z-index:100;position: absolute;display: none;background:#0F4E7D;padding-bottom:5px;}
#menubar li ul {-moz-border-radius-bottomleft:5px; -moz-border-radius-bottomright:5px; -webkit-border-bottom-left-radius:5px; -webkit-border-bottom-right-radius:5px; border-bottom-left-radius:5px; border-bottom-right-radius:5px;}
#menubar li ul {-moz-box-shadow:0 5px 5px rgba(0, 0, 0, 0.6); -webkit-box-shadow:0 5px 5px rgba(0, 0, 0, 0.6);filter:alpha(opacity=95);-moz-opacity:.95;opacity:.95;}
#menubar li:hover a, #menubar a:active, #menubar a:focus, #menubar li.hvr a{background-color:#115383;color:#d1d8e5;text-decoration:none;}
#menubar li:hover ul, #menubar li.hvr ul {display: block;}
#menubar li:hover ul a, #menubar li.hvr ul a {color:#d1d8e5;background-color:transparent;text-decoration:none;}
#menubar li ul li.hr {border-bottom:1px solid #296A99; border-top:1px solid #0E4064; display:block; font-size: 1px; height: 0px; line-height: 0px; margin:4px 0; }
#menubar ul a:hover {background-color: #0E3B5D!important;color: #d1d8e5 !important;text-decoration:none;}
#menubar li.home a, #menubar li.home a:visited {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYAUl1J2RyxCHQ-_5sh5t3h0tP9s1Ij_GwfrNUQ_F50T8eqx7b7tp5fwUcn6d5FQPJrxvRW1GcSkvWl5j5MBe3DN_ALLh1EsKydEtOpVvN_2dVTuiRKRjl2hEM1XA9Zvr7WWtLDgz-VAo/s1600/menu_hover.gif) repeat-x top left;border-left:none}
#menubar li.home a:hover {background:#1d335d;}
/* Fixed Position */
#inner{padding-top:41px;}
#fixed {position:fixed;top:0;left:0;width:100%;height:41px;z-index:999;}
#fixedinner{text-align:center;background:transparent;height:41px;position:relative;z-index:999;}
* html, * html body{overflow-y:hidden;height:100%;}
* html #fixedinner{margin-right:-143px;voice-family: "\"}\""; voice-family:inherit; }
* html #fixedinner{margin-right:17px;}
* html #fixed {position:absolute;}
/* -- SET FOR STATUS MESSAGE -- */
#search {
}
#search input[type="text"] {
background: url(search-dark.png) no-repeat 10px 6px #444;
border: 0 none;
font: bold 12px Arial,Helvetica,Sans-serif;
color: #777;
width: 150px;
padding: 6px 15px 6px 35px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
text-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
-moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
-webkit-transition: all 0.7s ease 0s;
-moz-transition: all 0.7s ease 0s;
-o-transition: all 0.7s ease 0s;
transition: all 0.7s ease 0s;
}
#search input[type="text"]:focus {
width: 200px;
}
6. Cari Kode <header> atau sejenisnya <<~biasanya juga header-wrapper
Pastekan kode berikut dibawahnya ^_^
<div id='fixed'>
<div id='fixedinner'>
<div id='menuwrapperpic'>
<div id='menuwrapper'>
<ul id='menubar'>
<li><a href='/'><img alt='Home' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnHbnGM7zTNdJQgpFPV3eA6gPiuWq4M3ZS6vf0l6RcrFOidjj5TlDnUgoHsjOAz7R8_-Y_tG1V6Q3L-6_1NnAlBEEDnhWCLmqNNZ0xPTTOBGdibvfC6o8ghi62vWstKmzDY5mQrq-kO-E/s1600/home.png' style='padding:0px;'/></a></li>
<li><a href='http://tvxqff.blogspot.com'>Kim Jaejoong</a></li>
<li><a href='http://jalz-cassieast.blogspot.com/2012/03/tvxq-for-you-mobile.html'>Kim Junsu</a>
</li>
<li><a href='http://jalz-cassieast.blogspot.com/search/label/Blogger'>Jung Yunho</a>
<ul class='children'>
<li><a href='http://jalz-cassieast.blogspot.com/search/label/Tutorial'>Tutorial</a></li>
<li><a href='http://jalz-cassieast.blogspot.com/search/label/Widget'>Widget</a></li>
<li><a href='http://jalz-cassieast.blogspot.com/search/label/TnT'>Tips And Trick</a></li>
<li><a href='http://jalz-cassieast.blogspot.com/search/label/Template'>Template</a></li>
<li><a href='http://jalz-cassieast.blogspot.com/search/label/Software'>Software</a></li>
<li><a href='http://jalz-cassieast.blogspot.com/search/label/Pc%20Tutor'>Pc Tutorial</a></li>
</ul></li>
<li><a href='#'>Park Yoochun</a>
<ul class='children'>
</ul></li>
<li><a href='http://jalz-cassieast.blogspot.com/2012/02/link-tradingjalz-tvxq.html'>Max Changmin</a></li>
<li>
<form action='/search' id='search' method='get'>
<input name='q' placeholder='Search...' size='40' type='text'/>
</form></li>
<li><a href='http://facebook.com/ka.jihoon'><img alt='Home' border='0' src='http://facebook.com/favicon.ico' style='padding:0px;'/></a></li>
<li><a href='http://twitter.com/kajihoon'><img alt='Home' border='0' src='http://twitter.com/favicon.ico' style='padding:0px;'/></a></li>
<li><a href='http://www.facebook.com/sharer.php' name='fb_share' type='button'>Share</a><script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/></li>
</ul>
<br class='clearit'/>
</div>
<div style='clear:both;'/>
</div>
</div><!-- end fixed jalz menu -->
</div>
Dan jadilah seperti ini:
Note:
Penjelasan ----------------------------------------------------------------------------------------
<li><a href='http://jalz-cassieast.blogspot.com/2012/02/link-tradingjalz-tvxq.html'>Max Changmin</a></li>
Kode berwarna Orange:menunjukan Link yang akan dibuka saat Kode tanda Merah Di klik
Tanda Merah menunjukan kode yang muncul di barisan menu ~>~
Meta Tag Facebook Open Graph Versi Jalz~
Kali ini meta tag ini dibuat agar blog anda mempunyai deskripsi di facebook dengan benar..berikut reviewnya ^_^
Ini dinamakan Meta Tag Open Graph
Lalu Bagaimana Memasang Meta Tag Open Graph ini..????
Caranya cukup mudah...
1.Login Blogger pastinya
2.Pergi Ke Edit HTML
3.Back Up Template agar AMAN
4.Selanjutnya..CAri Kode <b:skin>
5.Pastekan kode berikut diatasnya ^__^
<meta content='isi dengan judul blog kamu' property='og:title'/>
<meta content='isi dengan url Home page blog kamu' property='og:url'/>
<meta content='Favicon blog kamu' property='og:image'/>
<meta content='Nama Blog Kamu' property='og:site_name'/>
<meta content='Id Facebook kamu' property='fb:admins'/>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<meta content='blog' property='og:type'/>
<meta content='Deskripsi Blog kamu' property='og:description'/>
<meta content='isi dengan url Home page blog kamu' property='og:url'/>
<meta content='Favicon blog kamu' property='og:image'/>
<meta content='Nama Blog Kamu' property='og:site_name'/>
<meta content='Id Facebook kamu' property='fb:admins'/>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<meta content='blog' property='og:type'/>
<meta content='Deskripsi Blog kamu' property='og:description'/>
Cara Membuat Read More Keren Versi Jalz ~
Setelah belajar Modifikasi gambar seperti membuatnya transparan dan memberi komentar dalam gambar saat disorot
sekarang kita akan belajar membuat Read more di postingan Kenapa Read More penting??? karena read more sebagai skrip untuk mempersingkat postingan agar postingan tertata dengan rapi...
nah langsung saja Bagaimana membuat read more di postingann yang keren yang sudah saya modifikasi tentunya...Demo dari read more ini sudah saya terapkan di blog saya sendri..silahkan dilihat
1.Login Blogger..
2.Langsung Menuju Design Lalu Edit HTML(untuk template baru Menuju Ke Menu Template)
3.Centang Expand widget templates
4. Selanjutnya cari kode </b:skin> <<~(Gunakan CTRL+F agar lebih cepat)
5.Letakkan kode Berikut Di atasnya
6.Setelah itu Cari Kode <data:post.body/>
~~>Biasanya Kode ini ada 4 pada 1 template...Pilih yang ke2<<<~~~
7.Hapus kode <data:post.body/> ganti dengan...
8.Selesai ~~Nikmati hasilnya ya ^_^
sekarang kita akan belajar membuat Read more di postingan Kenapa Read More penting??? karena read more sebagai skrip untuk mempersingkat postingan agar postingan tertata dengan rapi...
nah langsung saja Bagaimana membuat read more di postingann yang keren yang sudah saya modifikasi tentunya...Demo dari read more ini sudah saya terapkan di blog saya sendri..silahkan dilihat
1.Login Blogger..
2.Langsung Menuju Design Lalu Edit HTML(untuk template baru Menuju Ke Menu Template)
3.Centang Expand widget templates
Bila Belum Yakin Anda bisa...Backup Template Anda Terlebih dahulu ^_^
5.Letakkan kode Berikut Di atasnya
.rmlink {
display: block;
margin: 6px 0;
}
.rmlink a {
padding: 3px 12px;
background: rgba(200,200,200,0.3);
float: right;
-webkit-border-top-right-radius: 6px;
-moz-border-radius-topright: 6px;
border-top-right-radius: 6px;
}
.rmlink a:hover {
background:rgba(200,200,200,0.4);
text-decoration: none;
color: #000;
}
display: block;
margin: 6px 0;
}
.rmlink a {
padding: 3px 12px;
background: rgba(200,200,200,0.3);
float: right;
-webkit-border-top-right-radius: 6px;
-moz-border-radius-topright: 6px;
border-top-right-radius: 6px;
}
.rmlink a:hover {
background:rgba(200,200,200,0.4);
text-decoration: none;
color: #000;
}
6.Setelah itu Cari Kode <data:post.body/>
~~>Biasanya Kode ini ada 4 pada 1 template...Pilih yang ke2<<<~~~
7.Hapus kode <data:post.body/> ganti dengan...
<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/>
</div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");
</script> <span class='rmlink'><a expr:href='data:post.url'>Read More</a></span>
</b:if>
<div expr:id='"summary" + data:post.id'><data:post.body/>
</div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");
</script> <span class='rmlink'><a expr:href='data:post.url'>Read More</a></span>
</b:if>
8.Selesai ~~Nikmati hasilnya ya ^_^
Cara Membuat Pesan Di Gambar Blog
Setelah Belajar Cara Membuat Gambar Transparan ketika Disorot Atau Sebaliknya...Serta Gambar yang dapat membesar ^_^ kta akan menggabungkan cara membuat pesan selamat datang yang pernah saya bahas...akan kita aplikasikan pada gambar ..sehingga gambar tersebut mengeluarkan pesan ketika disorot...kalau tidak percaya..sorot gambar dibawah
Keluar Sebuah Pesan Bukan ??
Bagaimana Cara Membuatnya...Jika Anda sudah memahami materi modifikasi gambar sebelumnya...ini akan jadi sangaat mudah ^_^ Lihat di (Cara Merubah Link Gambar)
Jika kita mengupload...kkita memperoleh link gambar ....
contoh link dari gambar diatas adalah ~~>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiknsXZHcWak4SKh7F0yU9B9EscEnXB1vpkUwk6Bx_H6rLg-0TYWzDickCerd2ci7AbfjJ90F3Q_9A_wdmgY47lz5otkBD6a5Y7fcY7Ot-1BYXvlDvGUciIM5HebehUfV4j9_kFd2alkt7d/s320/tvxq1.jpg" />
Jika Kita Tambahkan dengan Pesan
<img onmouseover="alert('Bukankah Jaejoong Sangat Narsis ^_^')" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiknsXZHcWak4SKh7F0yU9B9EscEnXB1vpkUwk6Bx_H6rLg-0TYWzDickCerd2ci7AbfjJ90F3Q_9A_wdmgY47lz5otkBD6a5Y7fcY7Ot-1BYXvlDvGUciIM5HebehUfV4j9_kFd2alkt7d/s320/tvxq1.jpg" />
Sisipkan Kode Alert seperti yang berwarna merah diatas...
Kode Bertuliskan "OnMouser" itu menunjukan action yang akan dilakukan script...onmouser berarti = setelah disorot mouse..
Bisa kamu ganti Menjadi OnCLick=jika telah diklik...dan lain lain ^_^ contoh onclick seperti dibawah
Semoga membantu chingudeul yah ^_^
Keluar Sebuah Pesan Bukan ??
Bagaimana Cara Membuatnya...Jika Anda sudah memahami materi modifikasi gambar sebelumnya...ini akan jadi sangaat mudah ^_^ Lihat di (Cara Merubah Link Gambar)
Jika kita mengupload...kkita memperoleh link gambar ....
contoh link dari gambar diatas adalah ~~>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiknsXZHcWak4SKh7F0yU9B9EscEnXB1vpkUwk6Bx_H6rLg-0TYWzDickCerd2ci7AbfjJ90F3Q_9A_wdmgY47lz5otkBD6a5Y7fcY7Ot-1BYXvlDvGUciIM5HebehUfV4j9_kFd2alkt7d/s320/tvxq1.jpg" />
Jika Kita Tambahkan dengan Pesan
<img onmouseover="alert('Bukankah Jaejoong Sangat Narsis ^_^')" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiknsXZHcWak4SKh7F0yU9B9EscEnXB1vpkUwk6Bx_H6rLg-0TYWzDickCerd2ci7AbfjJ90F3Q_9A_wdmgY47lz5otkBD6a5Y7fcY7Ot-1BYXvlDvGUciIM5HebehUfV4j9_kFd2alkt7d/s320/tvxq1.jpg" />
Sisipkan Kode Alert seperti yang berwarna merah diatas...
Kode Bertuliskan "OnMouser" itu menunjukan action yang akan dilakukan script...onmouser berarti = setelah disorot mouse..
Bisa kamu ganti Menjadi OnCLick=jika telah diklik...dan lain lain ^_^ contoh onclick seperti dibawah
Semoga membantu chingudeul yah ^_^
