Home
Cara Membuat Kotak Catatan dan Peringatan di Blogspot

Cara Membuat Kotak Catatan dan Peringatan di Blogspot

Blogger

Update Terbaru, 15 April 2017

Membuat Kotak Catatan Info, Tips dan Peringatan – Sering kita melihat pada artikel blog atau website terdapat sebuah catatan penting yang harus diperhatikan oleh pembaca, ini bertujuan memberikan penjelasan dan catatan atau warning untuk diketahui oleh pengunjung blog.

Catatan penting dalam blog biasanya artikel tentang tutorial, tips dan trik juga beberapa informasi menarik lainnya. Untuk membuat blok catatan pada blog ternyata bukan hal sulit untuk pengguna platform blogger, karena dengan sentuhan sedikit dengan menambahkan html anda sudah bisa membuat kolom catatan pada artikel blog.

Cara Membuat Kotak Catatan dan Peringatan di Blogspot

Contoh Catatan Tips, Info dan Peringatan

Baca Juga:

Cara Membuat Catatan Info, Tips dan Peringatan

Ada 3 macam catatan dalam blog yang biasa digunakan yaitu tentag informasi, trik yang menarik, dan peringatan untuk menjalankan atau meninggalkan. anda bisa menggunakan sesuai dengan kebutuhan. ikuti tutorial berikut ini sampai selesai.

Pertama, Silahkan Login akun blogger anda dan pilih menu “Template” lalu klik “Edit HTML”,

Kedua, Letakkan kode berikut tepat DIATAS ]]></b:skin> atau </style>


.info,.tips,.warning{
line-height:22px;
min-height:38px;
padding:10px12px12px68px;
margin:5px0;}
.info{
background:#EDE3F2url('http://4.bp.blogspot.com/-BP9TREDmvOo/UQGNoVPG6DI/AAAAAAAADr4/8Heq0U9nPzY/s1600/TTB+notice.png')no-repeat12px8px;
color:#222}
.tips{
background:#7CADDEurl('http://2.bp.blogspot.com/-_Y9kuQODeBs/UlA4LwDUkhI/AAAAAAAAFtk/Rm0QwoddGLw/s1600/tips.png')no-repeat12px8px;
color:#fff;}
.warning{
background:#db6161url('http://2.bp.blogspot.com/-rgsBmdJYFkM/UlA4LyWCrqI/AAAAAAAAFtc/suIf3IwnpgE/s1600/warning.png')no-repeat12px8px;
color:#fff;}

 

jika sudah selesai klik simpan. kemudian ikuti tutorial berikutnya dibawah ini:

Cara Memasang Catatan Info, Tips dan Peringatan di Postingan

Apabila ingin memasang pada artikel blog, silahkan pilih mode HTML bukan Compose. masukkan kode berikut ini:

Catatan Info:

<div class='info'>
Kata-kata Informasi anda silahkan letakkan disini.
</div>

 

Catatan Tips:

<div class='tips'>
Catatan tips silahkan letakkan disini
</div>

 

Catatan Peringatan (Warning):

<div class='warning'>
Catatan peringatan pada artikel letakkan disini
</div>

 

Demikian Cara Membuat Kotak Catatan dan Peringatan di Blogspot, anda bisa edit warna dan tampilan sesuai selera.

Semoga bermanfaat dan selamat mencoba.

Related Posts

11 Comments

  1. suara mania post Balas

    udah dicoba gak bisa bro

    • Mas Zain Balas

      Coba diperhatikan lagi penempatannya, sudah saya uji coba dan lancar.

  2. Hfiz Balas

    Kalau mau buat kayak gini di wordpress self hosting, pemanggilannya gimana ya gan?

    • Mas Zain Balas

      Kalau di wp self host caranya cukup mudah, karena tinggal instal plugin WP Notification Bar. Dengan bantuan plugin tersebut untuk membuat kotak catatan dan peringatan sangat mudah.

  3. hana Balas

    kalau mau coba nya tanpa harus edit tema gmn ya ?

    • Mas Zain Balas

      Harus edit tema dulu gan, kalau salah kan bisa dikembalikan dengan cara tekan CTRL+Z. Kode HTML tersebut yang nanti bisa dipanggil melalui halaman postingan.

      • Hana Balas

        cara nya gmn ya kalau boleh tau edit temanya ?
        apa skrip url yang harus atau di tambah ??

  4. Rey Balas

    terima kasih… mantap

  5. Ditya Feng Balas

    Kalau di WordPress Bisa gak min?

    • Mas Zain Balas

      Kalau wordpress sudah ada plugin notification penggunaannya juga sangat mudah.

  6. mas yayak Balas

    ini yang saya cari. keren mas.

Leave a Reply