Membuat SPOILER / Show Hide di Postingan Blog

Membuat SPOILER / Show Hide di Postingan Blog

Sebagian orang pastinya sudah tahu apa itu spoiler, apalagi kalau sering bermain di forum. Spoiler sudah pasti sering digunakan. Lalu bagaimana kalau mau menerapkan atau membuat spoiler di blog? Sebelumnya kalau ada yang belum tahu apa itu spoiler. saya jelasin singkat saja.

Spoiler adalah tombol yang diguanakan untuk menyingkat tempat atau menyembunyikan konten (teks, foto atau video) dengan buka tutup. Contohnya bisa dilihat di bawah halaman ini.

Spoiler bisa juga dibuat di blog, lebih khusus dipostingan. Biasanya digunakan untuk membuat penasaran si pembaca dengan menyembunyikan terlebih dahulu. Untuk melihatnya dengan mengklik tombol spoiler itu. Selain itu juga untuk menghemat tempat, ya karena buka tutup itu (spoiler). Lalu bagaimana cara membuat spoiler di blog? Langsung simak yang berikut ini.

Cara Membuat Spoiler di Blog
1. Login ke Blogger
2. Pilih New Post atau Entri Baru seperti membuat postingan biasa
3. Pilihlah pada mode Edit HTML saat membuat postingan
4. Gunakan kode script berikut ini untuk membuat spoiler:

<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;"><b>Judul Spoiler</b>: <input value="Buka" style="margin: 0px; padding: 0px; width: 55px; font-size: 12px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" type="button">
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">

Letakkan teks atau kode script (gambar atau video) di sini

 <br>
</div>
</div>
</div>

5. Kita dapat mengganti Judul Spoiler sesuai kehendak kita, begitu juga Buka dan Tutup.
6. Klik Publish atau Terbitkan Entri jika sudah selesai.


Nih Contohnya :

Judul Spoiler:

( Label: Tips dan Trik, Tutorial Blog ) Read more

Mengganti Tulisan Diposkan Oleh

Mengganti Tulisan Diposkan Oleh

Cara merubah atau mengganti tulisan Diposkan atau Ditulis oleh, atau barang kali Sobat ingin menyisipkan icon Diposkan pada tulisan tersebut. ini bukan  hal yang mustahil untuk Sobat lakukan. Sobat hanya menambahkan sedikit kode, untuk membuat icon tersebut muncul di halaman blog Sobat. nah mungkin Sobat penasaran bagaimana cara menambahnya. lihat langkah berikut ini.
Berikut ini TIP DAN TRIK cara mengganti tulisan Di tulis oleh dengan tulisan lain seperti Post by atau tulisan lainnya.

• Login ke blogger
• Klik Rancangan

( Label: Tutorial Blog ) Read more

Membuat Scroll pada kotak komentar

Membuat Scroll pada kotak komentar

Jika kamu ingin membuat scroll pada blok komentar, kamu dapat mengikuti langkah-langkah berikut:

• Login ke akun Blogger kamu, lalu pilih Tata Letak - Edit HTML.
• Carilah kode CSS untuk comments-block menggunakan Control F.
• Tambahkan perintah berikut kedalamnya:

( Label: Tutorial Blog ) Read more

Menghilangkan Tulisan Tampilkan Entri Lawas

Menghilangkan Tulisan Tampilkan Entri Lawas

Bila sebuah blog sudah di pasang widget label atau kategori, maka begitu diklik salah satu labelnya maka akan muncul tampilan seperti ini:

Itulah pengaturan standar dari blogspot. Tetapi sebagian blogger merasa terganggu dengan tampilan lawas ini. Alasannya membuat halaman posting kurang rapi, terlalu ribet dan mempengaruhi loading

( Label: Tutorial Blog ) Read more

Membuat Ucapan Terima Kasih di Atas Komentar Pengunjung

Membuat Ucapan Terima Kasih di Atas Komentar Pengunjung

Bagi para sahabat blogger yang punya blog yang sering dikomentari sama pengunjung dan ngak sempat ngebalas smua  komentar Nih ada cara agar para komentator tidak kecewa karena tidak di balas sama admin .
Perhatikan Gambar disamping << , yang dilingkari itu adalah pesan komentar di blog saya ini . Bagaimna pengen ?

Klo pengen langsung aja ke T.K.P :

Login >> Rancangan >> Edit HTML >> Expand Template Widged >> Download Template lengkap >> Kalau sudah cari kode dibawah ini :

( Label: Tutorial Blog ) Read more

Membuat widget hanya tampil di home

Membuat widget hanya tampil di home

Pengen membuat widget hilang ketika di klik Home Page dan muncul ketika kita klik Postingan . . ngak usah susah-susah dan mudah sekali kok ..

Gini caranya >>

Untuk membuat widget hanya tampil di Home Page saja , kita hanya perlu menyisipkan kode seperti ini :

<b:if cond='data:blog.url == data:blog.homepageUrl'>

Dan di beri kode penutup seperti ini

</b:if>

Kalau membuat widget hanya tampil di posting saja , kodenya seperti ini

<b:if cond='data:blog.pageType == &quot;item&quot;'>

Dan di beri kode penutup seperti ini

</b:if>

Nah ... udah tahu kode untuk menghilangkan widgetnya kan ... yuk kita lanjutkan ...
Sebelumnya kamu harus tahu widget yang akan di hilangkan dan pahami struktur widgetnya ..
Pertama masuk ke Edit HTML < jangan lupa beri centang Expand Template Widget >
Cari kode <b:widget id=
Contoh lengkapnya seperti di bawah ini >>

<b:widget id='HTML14' locked='false' title='Artikel Terkait' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:includable>
</b:widget>

Sisipkan kode <b:if cond='data:blog.url == data:blog.homepageUrl'> di bawah kode <b:includable id='main'>
Dan kode penutup </b:if> di bawah kode <b:include name='quickedit'/>

Hingga menjadi seperti ini :


<b:widget id='HTML14' locked='false' title='Artikel Terkait' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

""Contoh Widget Hanya Tampil di Home Page dan Hilang di Postingan""

Jika sudah Simpan .. lihat hasilnya ..

Nah simpel kan ..
Pasti semua dah pada bisa ...

( Label: Tutorial Blog, Widget Blog ) Read more

Membuat Video Ke Blog

Membuat Video Ke Blog

Kadang kala kita pengen menampilkan sebuah video rekaman kita ke postingan blog atau dijadikan sebagai widget.. tapi kebanyakan orang ga' tahu bagaimana cara menampilaknnya pada postingan atau pada blog kita, misalkan menampilakan video Youtube.com kedalam postingan..

Nah gini cara Meletakkannya kedalam postingan:
Langkah 1:

• Masuk ke situs Youtube.com Jika mau mengambil video dari situs tersebut.
• Pilih Video yang ingin anda tampilkan.
• Lihat pada gambar ada tulisan embed.. Copy dan pastekan kode tersebut kedalam Blog anda
  
  
  
  

( Label: Tutorial Blog ) Read more

Membuat Menu Horizontal Keren

Membuat Menu Horizontal Keren

Ada yang pingin buat menu horizontal tapi nggak tahu caranya?
Gini nih caranya, eh tapi tunggu dulu, apasih menu horizontal itu? Menu horizontal adalah menu-menu yang disusun secara horizontal (menyamping). Kayak dusamping  lho:

( Label: Tutorial Blog ) Read more

Membuat Menu Keren DTREE

Membuat Menu Keren DTREE

Apa itu menu Dtree (D-Tree) ? itu lho menu yang memiliki struktur seperti pohon, yang punya cabang-cabang itu lho, Seperti kalo kita membuka Windows Explorer. Menu yang seperti gambar dibawah ini atau seperti contoh ini.


Menu Dtree ini sangat berguna jika kamu memiliki postingan yang buanyak, karena dengan menggunakan menu Dtree maka akan bisa menghemat space/ruang yang ada di blogmu. Nah kamu pingin tahu

( Label: Tutorial Blog ) Read more

Menempatkan si anu di sudut

Menempatkan si anu di sudut

Pasti pada bingung nih, apa maksudnya dan kenapa judulnya begitu, sebenarnya aku sendiri juga bingung mau ngasih judul apa untuk trik yang berikut ini. Setelah aku pikir-pikir :t eee.. nggak nemu-nemu juga judul yang cocok, ya udah deh aku asal aja kasih judul gitu. Trus apa maksudnya dari judul tersebut dan trik apa yang akan dibahas?

Gini, untunya itu gini :D trik nyoba ngebahas gimana cara membuat

( Label: Tutorial Blog ) Read more

Apa yang Search Engine Lihat dari Blog Kita

Apa yang Search Engine Lihat dari Blog Kita

Tak diragukan lagi bahwa mesin pencari (search engine/SE) merupakan sumber trafik bagi sebagian besar blog.
Oleh karena itu, webmaster berlomba-lomba untuk membuat blognya "ramah SE", sehingga bisa menempati posisi teratar dalam halaman utama pencarian (SERP/Search Engine Result Page). Sebenarnya, apa yang diinginkan oleh Search Engine?

( Label: Tutorial Blog ) Read more

5 Tips SEO Dasar

5 Tips SEO Dasar

Dengan pengoptimalan SEO yang baik, rangking situs atau blog Anda di google dan search engine lain bisa terus meningkat. Banyak tips SEO yang bisa Anda pakai untuk website Anda. Tetapi bagi para pemula sebaiknya terlebih dahulu menerapkan beberapa tips dasar SEO (dengan pengoptimalan keyword) dengan 5 Tips SEO Dasar Berikut :

 

( Label: Tutorial Blog ) Read more

Melihat Statistik Blog dengan Google Analytics

Melihat Statistik Blog dengan Google Analytics

Kita pasti ingin tahu sudah sampai dimana perkembangan statistik blog yang kita buat, sudah berapakah yang mengunjungi ? dan dari manakah pengunjung yang paling banyak datang. Adakah tools-tools yang bisa digunakan untuk mengetahui hal ini, tentu saja banyak. Baik yang gratisan ataupun yang berbayar.  Salah satunya yang paling terkenal adalah Google Analytics

( Label: Tutorial Blog ) Read more

Pasang Iklan Adsense Gratis

Pasang Iklan Adsense Gratis

Jika kita sudah mendaftar di Google Adsense dan sudah disetujui oleh pihak Google , maka kita bisa mulai memasang iklan Google Adsense di Blog. Ini untuk menambah pendapatan kita dari Blog, mungkin saja bisa buat nutupin ongkos ngeblog.

( Label: Tutorial Blog ) Read more

Pilihan Topik Yang Tepat Kunci Mendatangkan Traffik

Pilihan Topik Yang Tepat Kunci Mendatangkan Traffik

OK..aku sudah membuat blog… selanjutnya apalagi ?? itu yang mungkin terlintas dalam benak kita. Ya .. sesudah mendaftar dan memilih platform blog, langkah selanjutnya tentu saja mengisinya, dengan apa ? tentu saja dengan tulisan. Masalah pernak-pernik, ican-icon, iklan-iklon itu masalah gampang..nanti saja kalo blog sudah mulai laris. pada belajar ngeblog kali ini saya akan memberikan tips ngeblog tentang  Cara Memilih Topik Yang Tepat untuk Blog

( Label: Tutorial Blog ) Read more

Cara Cepat Menghilangkan Navbar Blogspot

Cara Cepat Menghilangkan Navbar Blogspot

Mengapa tutorial blogspot tentang Cara Cepat Menghilangkan Navbar pada Blogspot ini saya buat? Navbar atau Navigation Bar header pada blog berbasis blogspot buat sebagian orang mungkin dianggap mengganggu penampilan sebuah blog. Jika anda termasuk kategori tersebut, anda dapat menghilangkan navbar ini. Tapi sebelum menghilangkan navbar tersebut ada baiknya anda berfikir-fikir dahulu dan silahkan baca dan belajar TOS blogspot secara seksama, karena resikonya sangat berat yaitu di tutupnya account blogger anda. Anda tidak akan bisa ngeblog lagi menggunakan akun tersebut !

( Label: Tutorial Blog ) Read more

Memasang Related Post atau Artikel Terbaru di Blog

Memasang Related Post atau Artikel Terbaru di Blog

Pada belajar blogspot kali ini saya akan membuat tutorial tentang cara membuat related post widget . Membuat related post bukan hanya monopoli pengguna blog berplatform wordpress saja. Sekarang ini, pengguna blog berplatform Blogspot pun bisa membuat related post tampil di sidebar blog mereka.  Tidak Seperti WordPress yang mempunyai Tag dan Category yang bisa digunakan sebagai acuan untuk related post, pada blogspot prinsip ini menggunakan pemanfaatan dari Label saat kita posting. Related Post akan menunjukkan posting mana saja yang mempunyai label sama.

( Label: Tutorial Blog, Widget Blog ) Read more

Membuat Posting Terjadwal

Membuat Posting Terjadwal

FITUR BARU BLOGGER IN DRAFT


Kali ini muncul satu inovasi terbaru dari Blogger.com tentang posting terjadwal. Jadi untuk kita yang menginginkan posting tepat pada suatu waktu di masa depan. Kita tak perlu menunggu waktu itu tiba,

( Label: Tutorial Blog ) Read more

Menambah Kolom di Blog

Menambah Kolom di Blog

Jika anda baru mulai membuat  sebuah blog, anda bisa dengan leluasa memilih templates untuk blog anda. bisa memilih dua kolom atau templates 3 kolom. Tapi bagi yang sudah terlanjur memilih templates 2 kolom dan ingin membuatnya menjadi templates tiga kolom, hal itu bukan hal mustahil diwujudkan. Anda bisa merubah templates dua kolom anda menjadi 3 kolom dengan membuat kolom tambahan pada templates dua kolom anda.

Pada artikel ini saya menggunakan templates standar blogspot yaitu

( Label: Tutorial Blog ) Read more

Membuat Readmore di Blog

Membuat Readmore di Blog

Cara Membuat Read More merupakan  artikel tutorial yg paling diminati oleh blogger pemula yang baru membuat blog di blogspot, karena  Sebuah artikel yang panjang akan banyak memakan tempat di halaman utama sebuah blog, sehingga artikel lain yg ditulis sebelumnya akan jarang dibaca pengunjung karena mereka harus menscroll halaman kebawah terlebih dahulu. Nah, pada belajar ngeblog kali ini saya akan ikut2an membuat tutorial bagaimana cara memotong artikel panjang tersebut dengan membuat read more .. atau baca selanjutnya ..

( Label: Tutorial Blog ) Read more