Cara Membuat Button Media Sosial dengan Bootstrap di Blogger

cara-membuat-button-media-sosial-dengan-bootstrap-di-blogger

Cara Membuat Button Media Sosial dengan Bootstrap di Blogger | Mrjulianto

Blogger adalah salah satu layanan website yang berisi publikasi blog dari masing-masing pengguna. Blogger ini bisa digunakan secara gratis dengan mematuhi peraturan yang ada. Blog ini biasanya berisi pengalaman hidup, urusan bisnis, cerpen, karya tulis, dan sebagainya.

Bootstrap adalah suatu pustaka CSS Framework yang didesain untuk mempercantik tampilan dalam produktifitas website. Bootstrap ini memiliki kumpulan kode script yang telah siap dipakai untuk merancang tampilan website sehingga si web programmer tidak perlu membuat kode perintah CSS dari nol. Bootstrap merupakan salah satu CSS Framework yang populer bagi web programmer frontend pada saat ini.

Penulis akan memberikan tutorial cara membuat button link media sosial dengan Bootstrap di Blogger. Pastikan di dalam Blogger kamu telah terpasang kode script pemasangan Bootstrap.

Panduan Membuat Button Media Sosial dengan Bootstrap di Blogger

1. Buka web browser di komputer atau laptop kamu.

2. Buka situs Blogger. Lakukan login ke dashboard Blogger.

3. Klik Layout.

4. Klik Add a Gadget untuk membuat widget baru.

5. Klik HTML/JavaScript.

6. Masukkan kode script di bawah ini.

<div align=”center”>

<p>Link Media Sosial :</p>

<a href=”https://facebook.com/namauser” class=”btn btn-primary” style=”width:100%; margin-top:8px;”> <i class=”fa fa-facebook”></i> Facebook </a><br />

<a href=”https://twitter.com/namauser” class=”btn btn-primary”  style=”width:100%; margin-top:8px;”> <i class=”fa fa-twitter”></i> Twitter </a><br />

<a href=”https://www.youtube.com/channel/namachannel” class=”btn btn-primary”  style=”width:100%; margin-top:8px;”> <i class=”fa fa-youtube”></i> Youtube </a>

<br />

<a href=”https://instagram.com/namauser” class=”btn btn-primary” style=”width:100%; margin-top:8px;”> <i class=”fa fa-instagram”></i> Instagram </a>

</div>

Kode script yang di atas, kamu bisa mengganti nama pengguna yang bertulisan “namauser” menjadi nama pengguna kamu. Bagi yang memiliki channel Youtube, kamu bisa mengganti nama channel yang bertulisan “namachannel” menjadi nama channel kamu.

7. Klik Save.

Cara Membuat Button Media Sosial dengan Bootstrap di Blogger

8. Klik Save Arrangement.

Cara Membuat Button Media Sosial dengan Bootstrap di Blogger

9. Berikut hasilnya. Kamu bisa melihat tampilan situs Blogger milik kamu.

Cara Membuat Button Media Sosial dengan Bootstrap di Blogger

Selesai.

Kamu bisa membuat button link media sosial yang dimana memiliki peran yang sangat pengaruh bagi dunia maya. Kamu bisa membuat beberapa Media Sosial button media sosial yang kamu inginkan dengan menggunakan Bootstrap. Nanti, link button tersebut ditampilkan di situs Blogger kamu. Ingat, kamu harus hafal kode simbol media sosial Font Awesome untuk bisa membuat media siosial button yang secara kutomisasi.

Demikian, Membuat Button Media Sosial dengan Bootstrap di Blogger. Selamat mencoba.

Artikel Lainnya

Check Featured Posts
Menu