Cara Membuat Unordered List Custom di Blogger: Panduan Praktis

Cara Membuat Unordered List Custom di Blogger: Panduan Praktis

Unordered list, atau daftar tak berurutan, adalah alat yang berguna untuk menyajikan informasi dalam bentuk yang terstruktur di blog Anda. Di Blogger, Anda dapat membuat daftar tak berurutan yang menarik dan kreatif dengan sedikit sentuhan kustomisasi. Dalam artikel ini, kita akan membahas cara membuat unordered list custom di platform Blogger agar konten Anda lebih menarik dan terorganisir.

Apa Itu Unordered List?

Unordered list adalah daftar item yang disusun tanpa urutan tertentu. Biasanya, daftar ini ditandai dengan bullet points atau simbol lainnya untuk menunjukkan setiap item. Unordered list sering digunakan untuk menyajikan informasi yang tidak memerlukan urutan khusus, seperti daftar fitur, langkah-langkah, atau poin-poin penting.

Langkah-langkah untuk Membuat Unordered List Custom di Blogger:

1. Masuk ke dasboard blogger kamu, jika belum login, login terlebih dahulu

2. Selanjutkan pergi ke menu garis tiga di pojok kiri atas lalu klik tema atau theme kemudian pilih Edit HTML

3. Kemudian salin kode css di bawah ini, dan letakan di atas  ]]></b:skin>

/* Unordered list style by reatrixweb.com */ 
ul.rtx{list-style:none!important;list-style-type: none!important; padding: 0;} 
ul.rtx > li{margin-bottom: 3px; position: relative; margin-left:35px}
ul.rtx > li::before { content:'';background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23DE3535' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-check-circle'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14'%3E%3C/path%3E%3Cpolyline points='22 4 12 14.01 9 11.01'%3E%3C/polyline%3E%3C/svg%3E");background-repeat: no-repeat;height:18px;width:18px; left:-30px;text-align:center;position:absolute; top: 3px}
.drK ul.rtx > li::before{content:''; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23DE3535' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-check-circle'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14'%3E%3C/path%3E%3Cpolyline points='22 4 12 14.01 9 11.01'%3E%3C/polyline%3E%3C/svg%3E");background-repeat:no-repeat;height:18px;width:18px;left:-30px;text-align:center;position:absolute;top:3px}

4. Dan jika sudah meletakan kode css diatas selanjutnya untuk menampilkan undered list nya buat postingan baru atau postingan blos yang sudah ada, lalu gunakan html dibawah 

<ul class='rtx'><li>kontenmu</li><li>kontenmu</li><li>kontenmu</li><li>kontenmu</li><li>kontenmu</li></ul>

5. Untuk menampilakan undered list ini di setiap postingan cukup salin kode html di cara no.4,

Membuat unordered list custom di Blogger bisa menjadi cara yang efektif untuk mempresentasikan informasi dengan lebih menarik dan terstruktur. Dengan sedikit kreativitas dan pemahaman tentang kustomisasi dasar, Anda dapat membuat daftar tak berurutan yang sesuai dengan gaya dan kebutuhan blog Anda. Mulailah eksperimen dengan desain dan tata letak untuk meningkatkan kualitas konten Anda dan memberikan pengalaman terbaik kepada pembaca Anda.

Posting Komentar