Sekarang saya akan berbagi dengan kawan Cara Membuat Slide dengan bermacam-macam mode :q; disamping pembuatannya sangat simpel sekali alias dengan istilah tak pakai ribet, karena penempatannya semua pada gadget yang berarti tidak menyentuh Template kawan :y;
Caranya :
- Masuk Account Blogger dengan ID kawan
- Pada Dasbor pilih Tata Letak - Tambahkan Gadget
- Pilih tanda [+] pada HTML / JavaScript
- Copas Kode berikut kedalamnya
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script>
<script type="text/javascript" src="https://sites.google.com/site/blogbegocreation/file/cycle.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#content-slider').cycle({
fx: 'scrollDown'
});
});
</script>
<style type="text/css">
#content-slider {position: relative; width: 260px; height: 250px; overflow: hidden; margin:0 auto; border:0px solid #333;}
#content-slider img {display: block; width: 260px; height: 250px;}
</style>
<div id="content-slider">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiREH5Vnck2MbbufRlZ85g3wdVayLJdRMIimWe0P-PJQsl0DraYKcfJgEH-aXDOICJD315DD_3GwK6ImqzkoCetBbLifCVVrNE_8yj0ixxUm9KM377w7bp1CcjLXOaYJPae8XOWA6dafMs/s1600/Kreasi+BB2+GPLUS.png" /><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh98FiUTQqQkPOFIES8Vn1hfK7uI5ukdW2YJLKZj7Rwvjubc9FXJdiAaLYEF5qqCZz98iHNd5WEdSfqojfzs02FU1Rt-UjZ6HhKow-zMhoUtf-vKq7BHbMTwPaXY90ZzEvyaxOxotwdIiw/s1600/Kreasi+BB1.png" /><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixq9rECMs-M3fex9lQcZAW_7_j4qF7u1bLv5MqC1i-Zfr-EBnhQKkRJmAw9arfpSoEj4nlW230Q2FKr_M5r5XzfUbjTNtcdi_6zDCiATak2R6IfPphQ3fMNf-slCwvHCCnJJCvhuQR8BI/s1600/Kreasi+BB2.png" /><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhg1cnOvoI-vvd684KVsUyyV071m6WVEWrQWH1Otm0sIfPwvI5muMBT3gbQQkrLD2bkYE8L3akFtWZMXIXxt41putXKcfNwS56MXDQvpie3obW1E1lCZBA01E8-hR4q_jq9eJBqkmgmrF4/s1600/Kreasi+Kolom.png" /></div></div>
Silahkan kawan ganti teks yang saya beri warna merah seperti width dan height sesuai penempatan dan selera kawan
Ganti URL image saya yang berwarna violet dengan image kawan, soal banyak silahkan disesuaikan
Teks yang berwarna Biru adalah Mode Efek Slide silahkan ganti dengan pilihan berikut :
Refrensi : Zhinto
Kawan masih ingat dengan postingan saya Tampilkan Artikel berdasarkan Katagori plus Thumbnail :q; karena berisi image secara otomatis akan sedikit memberatkan Blog, walau Thumbnail / image-nya bisa tidak ditampilkan :y; disebabkan scriptnya sedikit lebih banyak atau postingan saya tentang Tampilkan Judul saja dari Katagori
Sekarang yang akan saya bagikan dengan kawan Tampilkan Artikel Berdasarkan Katagori yang sedikit berbeda karena tanpa image :z;
Caranya :
- Masuk Account Blogger dengan ID kawan
- Pada Dasbor pilih Tata Letak - Tambahkan Gadget
- Pilih tanda [+] pada HTML / JavaScript
- Copas kode berikut kedalamnya
<script src="https://sites.google.com/site/blogbegocreation/javascript/kategori.js"></script>
<script>
var numposts = 15;
var showpostdate = false;
var showpostsummary =false;
var numchars = 125;
</script>
<script src="http://blogbego-creation.blogspot.com/feeds/posts/default/-/tips%20trik?orderby=published&alt=json-in-script&callback=rp">
</script>
Silahkan kawan ganti teks yang saya beri warna merah : - Angka 15 adalah jumlah Katagori dari Artikel yang ingin kawan tampilkan
- blogbego-creation dengan URL Blog kawan
- tips%20trik dengan Katagori dari Artikel yang ingin kawan tampilkan, [%20] adalah spasi yang aslinya [tips trik]
- var showpostdate untuk menampilkan tanggal [false/true = pilih]
- var showpostsummary untuk menampilkan sedikit isi postingan dari Katagori [false/true = pilih]
- Simpan Blog kawan
Script ini bisa digabung pada gadget yang sudah ada atau pada satu gadget bisa diisi beberapa script Katagori asal masing-masing diberi Judulnya
Sebenarnya pada Google [Blogspot] widget ini sudah ada cuma Katagori yang bisa ditampilkan dalam satu widget maksimal [5] dan tidak bisa digabung
Seperti janji saya sebelumnya tentang Cara Menyembunyikan Tampilan di Home Page :q; atau dengan kata lain Cara Membuat Tampilan Home Page Tersendiri :z; yang mana triks ini hanyalah rekayasa saja karena elemen yang ada di Home Page kita sembunyikan :y;
Hal ini pernah saya posting di Blog yang lain, kalau kawan ingin membacanya silahkan disini dan Demonya disini cuma semenjak bergulirnya GPlus dan setelah saya coba menemui Kegagalan pada beberapa Template kalau kawan ingin mencobanya saya persilahkan seandainya gagal jangan berkecil hati alias ngambek, karena disini saya akan berbagi dengan kawan yang caranya lebih simpel sekali setelah saya mengadakan percobaan :r;
Tapi sebelumnya kita buat kesepakatan dulu tentang Struktur Template secara umum dari atas sampai kebawah yaitu - [Header - Menu Navigasi] -[Postingan - Sidebar] - [Footer - Credit] atau apalah namanya, silahkan kawan melihatnya pada Template masing-masing - OK langsung ke :
- Masuk Account Blogger dengan ID kawan
- Pada Dasbor pilih Template - Edit HTML
- Cari ]]></b:skin>
- Copas kode berikut dibawahnya
<style type='text/css'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
#main-wrapper, #sidebar-wrapper, #sidebarkanan-wrapper, #sidebartengah-wrapper, #footer-wrapper, #credit-wrapper {display:none}
</b:if></style>
Kalau melihat kode diatas berarti yang ada pada Home Page hanya Header dan Menu Navigasi
- Sampai disini simpan Template kawan dulu
- Selanjutnya cari <div id='main-wrapper'> untuk gampangnya pilih Lompat ke Widget - Blog1
- Tambahkan script berikut tepat diatasnya
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div class='container' style='text-align:center;width:100%;'>
<b:section class='container' id='container' showaddelement='yes'>
</b:section>
</div></b:if>
- Simpan kembali Template kawan
- Selanjutnya pilih Tata Letak dan lihat perubahan yang ada
 |
| screenshot setelah ditambah gadget |
Perhatikan yang saya kurung dengan warna merah
- Tambahkan Gadget - pilih tanda [+] pada HTML / JavaScript
- Simpan Script berikut kedalamnya
Hasilnya seperti berikut<center><a href="http://blogbego-creation.blogspot.com/search?max-results=10"><img border="0" height="270" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkcuMy1bhCfcHxWaxze261TKphcBsEXcuEbSsc_L0PlbRZVywIiSiUNxqHfAhVX_RcRVcDM3DWNUCKkcItTM_vtDxxh90Jht0xv1jw39T3N8sjN1JkTT-_lnhnSqKVwT9ysdB4PpyIuR4/s1600/BOMO-.gif" width="500"/></a></center>
Silahkan kawan ganti :
- Teks yang berwarna merah adalah URL Blog saya silahkan ganti dengan URL Blog kawan
- Angka 10 adalah jumlah postingan terakhir yang akan ditampilan [sesuaikan]
- Teks yang berwarna biru silahkan diganti dengan image kesukaan kawan atau dengan kata
Contohnya seperti berikut
<center><a href="http://NAMA BLOG KAWAN.blogspot.com/search?max-results=10"><button> Masuk </button></a></center>
- Terakhir simpan Blog kawan dan lihat hasilnya
Seandainya kawan mempunyai masukkan atau cara yang lain bisa disampaikan lewat Komentar, semoga ada manfaatnya dan sukses selalu
Sambil menambahkan kode javascripts dalam template editor Blogger, kita sering menghadapi beberapa Kesalahan XML aneh seperti Kesalahan parsing XML, baris 768, Kolom 20: Isi elemen harus terdiri dari data karakter well-formed atau markup. Ini macam kesalahan terjadi ketika kode JavaScript tidak terbentuk dengan baik, atau kode tersebut tidak ditulis dengan benar oleh pengembang. Baru-baru ini, salah satu pengguna kami meminta kami Cara Yang Benar Tambahkan kode JavaScript di Blogger? Tutorial ini akan berubah menjadi berguna bagi mereka yang baru mulai belajar template Blogger dan pengembangan plugin. Pada artikel ini, kami akan menunjukkan Cara Yang Benar Tambahkan kode JavaScript di Blogger?
Cara Benar Tambahkan kode JavaScript di Blogger?
Menambahkan Script di Blogger sangat mudah. Yang perlu Anda lakukan adalah pergi ke Blogger.com >> situs Anda >> Template >> Edit HTML. Sekarang tergantung pada Anda di mana Anda ingin menyisipkan coding JavaScript Anda. Namun, kami lebih suka Anda untuk menambahkannya di atas
Kami harap tutorial ini telah membantu Anda untuk belajar Cara Yang Benar Tambahkan kode JavaScript di Blogger. Marilah kita tahu tentang pengalaman Anda? Dalam kasus Anda menghadapi kesalahan seperti ini juga. Jangan ragu untuk meninggalkan kesalahan di bawah ini yang anda hadapi sambil menambahkan kode baru untuk template Anda.
READ MORE
Kecerobohan:
Sebelum menginstal kode baru dalam template nya seseorang harus memastikan bahwa tag script atau gaya ditutup dengan benar. Sebagian besar waktu Anda lupa untuk menyalin tag script berakhir, dan pada akhirnya pada akhirnya itu menunjukkan kesalahan. Bagi mereka yang tidak tahu banyak, mereka menggunakan kode seperti ini:<script>Di sini, jelas dapat dilihat bahwa tag
jQuery(document).ready(function($) {
---------------------------
---------------------------
---------------------------
});
<script> tidak dilanjutkan dengan penutup yang tepat </script> tag yang salah. Teknik yang benar adalah dengan menutup tag dengan benar, seperti yang kita lakukan dalam HTML sederhana. Mari kita pergi ke depan dan melihat cara yang tepat untuk melakukannya.Cara Benar Tambahkan kode JavaScript di Blogger?
Menambahkan Script di Blogger sangat mudah. Yang perlu Anda lakukan adalah pergi ke Blogger.com >> situs Anda >> Template >> Edit HTML. Sekarang tergantung pada Anda di mana Anda ingin menyisipkan coding JavaScript Anda. Namun, kami lebih suka Anda untuk menambahkannya di atas
</head> tag karena ini adalah tempat di mana semua hal-hal teknis yang hadir. Berikut adalah cara kode akan terlihat seperti:<script type="text/javascript">Setelah script yang benar ditambahkan dalam template Anda tekan tombol "Simpan Template", dan Anda tidak akan menghadapi kesalahan. Yang berarti bahwa JavaScript secara benar ditambahkan dalam template blogger Anda.
//<![CDATA[
Your JavaScript coding here
//]]>
</script>
Kami harap tutorial ini telah membantu Anda untuk belajar Cara Yang Benar Tambahkan kode JavaScript di Blogger. Marilah kita tahu tentang pengalaman Anda? Dalam kasus Anda menghadapi kesalahan seperti ini juga. Jangan ragu untuk meninggalkan kesalahan di bawah ini yang anda hadapi sambil menambahkan kode baru untuk template Anda.
Fitur-fitur template :
- Simple
- Auto Read More
- Menarik
- Enak Dipandang
- Footer 3 kolom
- Contact di header
- Search keren di Header
- Loading Cepat
- Pokonya Sipp deh
 |
| Tampilan pada Tata Letak |
 |
| Tampilan saat berpindah ke Template |
Untuk mengatasi masalah tersebut saya bereksprimen menggabungkan dan menemukan hasil yang caranya sangat simpel sekali, [perhatikan gambar pertama saya] kalau kawan ingin mencoba saya persilahkan dan ikuti caranya
- Seperti biasa masuk Account Blogger dengan ID kawan
- Pada Dasbor pilih Setelah - Pos dan Komentar
- Lihat paling atas Pos - Tampilkan sebanyak mungkin ? rubah menjadi 0 posting terus simpan setelan
- Selanjutkan pilih Template - Edit HTML
- Cari kode yang kurang lebih seperti berikut
<b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog'/>
</b:section>
Tepat diatasnya tambahkan kode berikut :
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:section class='container' id='container' showaddelement='yes'>
</b:section>
</b:if>
Hasil jadinya sebagai berikut :
- Simpan Template kawan
- Selanjutnya pilih Tata Letak, seandainya tidak ada kesalahan Hasilnya sebagai berikut
- Silahkan Tambahkan Gadget - HTML / JavaScript, soal isi [Gambar, atau Ucapan Selamat Datang] terserah kawan
Kalau ada kawan bertanya - bagaimana cara membuat Tampilan di Home Page Full Hidden, tunggu postingan saya berikut :q;
Membuat Kolom Komentar Offline - Setelah lama saya tidak update karna saya lagi sibuk di dalam bualan puasa ini, kali ini saya akan update Membuat Kolom Komentar Offline Tutorial ini saya dapat dari Blog Kesukaan saya yaitu Kang Ismet yang baru saja kemarin update tutorial ini, dan langsung saya Post ulang.
Fiture ini berfungsi untuk mematikan Form Komentar agar pengunjung Blog Anda tidak bisa berkomentar disaat kesibukan anda memaksa anda untuk mematikan komentar dalam Blogger Anda.
Ok, mari kita bahas cara Pemasangan Fiture Kolom Komentar Offline ini.
Langkah 1 : Simpan Kode CSS
Simpan kode CSS ini di atas
Langkah 2 : Simpan Kode HTML
Untuk menyimpan kode HTML, sobat cari kode
Apabila ingin mengaktifkan kembali kolom komentar, pindahkan tanda
Itulah Membuat Kolom Komentar Offline semoga bermanfaat.
READ MORE
Fiture ini berfungsi untuk mematikan Form Komentar agar pengunjung Blog Anda tidak bisa berkomentar disaat kesibukan anda memaksa anda untuk mematikan komentar dalam Blogger Anda.
Ok, mari kita bahas cara Pemasangan Fiture Kolom Komentar Offline ini.
Langkah 1 : Simpan Kode CSS
Simpan kode CSS ini di atas
</b:skin>/* Offline ModeSilakan Edit Sendiri Jika ingin memodifikasi
----------------------------------------------- */
#offline-mode{
background:#dfdede url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi11XSbDff4g58UYFh8-wyGsgRq7OHAT_IPlmhAewTgga5pvh9UhLcVoiQ7b3dB1zg5VBRIwMmUBSRepXOqfXU7gpUdrnGFCUQbgDeEoNhFQkqohas-eITzGWzEP69cmhKWST0Vc3EVaYc/s1600/offline-mode.png)no-repeat 3% 50%;padding:20px 20px 20px 175px;border:1px solid #c9c9c9;margin-bottom:10px}
#offline-mode h2{
font-size:220%;
text-transform:uppercase;
color:#fff;
text-shadow: -1px -1px 3px rgba(0,0,0,0.3);
}
#offline-mode p{
font-size: 12px;
color:#888;
line-height:1.8em;
margin-top:-15px;
Langkah 2 : Simpan Kode HTML
Untuk menyimpan kode HTML, sobat cari kode
<b:includable id='threaded-comment-form' var='post'> kemudian expand (klik panah sebelahnya) maka akan muncul kode seperti ini :<div class='comment-form'>tambahkan kode ini sesudahnya atau sebelum
...kode panjang....
</div>
</b:includable><div id='offline-mode'>setelah itu, nonaktifkan sementara kolom komentar dengan menambahkan kode
<h2>
Offline mode</h2>
<p>Mohon maaf, form komentar sementara dinon-aktifkan karena ada sesuatu dan lain hal yang menyebabkan saya tidak bisa membalas komentar sobat. Silahkan kunjungi beberapa saat lagi apabila sobat ingin berkomentar .</p>
</div>
<!-- dan --> pada kode sebelumnya. Maka hasil keseluruhan menjadi seperti ini :<!-- <div class='comment-form'>Simpan Template.
..............
</div>-->
<div id='offline-mode'>
<h2>
Offline mode</h2>
<p>Mohon maaf, form komentar sementara dinon-aktifkan karena ada sesuatu dan lain hal yang menyebabkan saya tidak bisa membalas komentar sobat. Silahkan kunjungi beberapa saat lagi apabila sobat ingin berkomentar .</p>
</div>
Apabila ingin mengaktifkan kembali kolom komentar, pindahkan tanda
<!-- dan --> pada HTML Offline-Mode, menjadi seperti ini :<!--<div id='offline-mode'>Simpan kembali Template....
<h2>
Offline mode</h2>
<p>Mohon maaf, form komentar sementara dinon-aktifkan karena ada sesuatu dan lain hal yang menyebabkan saya tidak bisa membalas komentar sobat. Silahkan kunjungi beberapa saat lagi apabila sobat ingin berkomentar .</p>
</div>-->
Itulah Membuat Kolom Komentar Offline semoga bermanfaat.
Source http://blog.kangismet.net/2013/08/membuat-kolom-komentar-offline.html
