Pada kali ini saya akan membagikan bagaimana caranya membut tombol Button download atau demo responsive serta keren di blog sobat, apalagi jika blog kalian merupakan blog yang niche berbagi link seperti link film, link download template pastinya tombol-tombol button ini sangat dibutuhkan bukan.
Namun sebelum lanjut tutorial ini sekedar pemberitahuan untuk kalian semua kalau tombol button ini terdapat icon Font Awesome yang tentunya membuat tampilannya akan lebih elegant dan keren pada blog sobat.
Nah tanpa berlama-lama lagi silahkan simak cara penerapannya di bawah berikut ini :
Cara Membuat Tombol Button Download Atau Demo Di Blog
Note cara ini berkerja apabila blog sobat sudah memasang Font Awesome pada template kalian, untuk cara melihat apakah template sobat sudah menerpakannya silahkan cari kode di bawah ini pada tempalate sobat.
<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css' rel='stylesheet'/>
Jika kode tersebut tidak ada pada blog sobat, silahkan copy kode tersebut dan tempelkan di atas kode </head> atau </head> namun jika sudah ada abaikan saja.
1. Masuk Blogger
2. Tema > Edit HTML
3. Cari Kode Berikut ini ]]></b:skin> Atau </style> dan salin kode dibawah ini dan pastekan di atas kode tersebut.
/* CSS Button Style www.lewatinaja.com */
.button{float:left;list-style:none;text-align:center;width:95%;margin:10px;padding:2px;font-size:14px;clear:both}
.button ul{margin:0;padding:0}
.button li{display:inline;margin:5px;padding:0;list-style:none}
.button li a.demo,.button li a.download{position:relative;padding:9px 48px 9px 16px;background:#f39c12;color:#fff!important;font-weight:700;font-size:14px;text-align:center;text-transform:uppercase;letter-spacing:0.5px;border-radius:3px;box-shadow:0 1px rgba(0,0,0,0.1);line-height:normal;transition:all .3s}
.button li a.download{background:#3498db}
.button li a.demo:hover,.button li a.download:hover{background:#666}
.button li a.demo:active,.button li a.download:active{cursor:pointer}
.button li a.demo:after,.button li a.download:after{content:'f135';background:rgba(0,0,0,0.1);position:absolute;right:0;top:0;font-weight:normal;display:inline-block;margin:0 0 0 10px;color:#fff;padding:11px;font-family:fontawesome}
.button li a.download:after{content:'f019'}
4. Klik Simpan Pada Template
Cara penggunaan :
Silahkan buat sebuah artikel pada mode HTML bukan Compose dan salin kan kode di bawah ini :
<div style="text-align: center;">
<ul class="button">
<li><a class="demo" href="https://lewatinaja.com" target="_blank">Demo</a></li>
<li><a class="download" href="https://lewatinaja.com" target="_blank">Download</a></li>
</ul>
</div>
<div class="clear"></div>
Namun jika kalian ingin menampilkan tombol salah satu button saja contohnya saja kalian ingin menampilakan tombol download saja maka hapus kode ini :
<li><a class="demo" href="https://lewatinaja.com" target="_blank">Demo</a></li>
Begitupun sebaliknya jika kalian hanya ingin menggunakan tombol demo saja maka kode di bawah ini tinggal di hapus saja :
<li><a class="download" href="https://lewatinaja.com" target="_blank">Download</a></li>
Maka lihat sekarang tombol yang kalian gunakan sudah keren bukan dan tentunya membuat tampilan blog semakin menarik bukan, oke sampai disini tutorial cara membuat tombol button yang menarik dan keren dan jangan lupa untuk membagikan artikel ini ke media sosial kamu jika anda menyukainnya. terima kasih telah berkunjung
Related Posts:
- Cara Menggunakan Aplikasi Lok Lok Cara Menggunakan Aplikasi Lok Lok – Dewasa ini, semakin beragam jenis aplikasi yang tersebar di internet. Dan masing masing aplikasi punya ciri khas dan kegunaan yang berbeda beda. Salah satunya…
- Template Blog Untuk Streaming Film Dan Download Video Gratis Pada postingan kali ini saya akan membagikan sebuah template blog streaming premium dengan tampilan yang super ringan dan tentunya SEO Friendly serta gratis untuk sobat kalian semua yang ingin membuat…
- Rekomendasi Aplikasi Broadcast Terbaik Rekomendasi Aplikasi Broadcast Terbaik – Beberapa tahun terakhir, kegiatan live streaming menjadi salah satu trend yang ada di dunia internet ya. Ntah itu sekedar melakukan streaming dengan berbagi kisah, menyapa…
- √ Cara Membuat Iklan Anchor Sticky Untuk Desktop Dan Mobile Cara Membuat Iklan Anchor Sticky Untuk Tampilan Desktop Dan Mobile – Pada kesempatan kali ini saya akan membagikan sebuah tutorial dalam menampilkan iklan anchor sticky secara manual pada blog kalian,…
- √ Cara Jitu Melewati Internet Positif Di PC Atau Android Berbincang mengenai Internet Positif merupakan suatu kebijakan pemerintah indonesia dalam menangani situs-situs yang dianggap dalam kategori, pornografi, spam, phising maupun hal lainnya yang dianggap berbahaya oleh kominfo, secara otomatis situs-situs…
- Cara Cepat Mendapatkan 1000 Subscriber Dan 4000 Jam Tayang Mendapatkan 1000 Subscriber dan 4000 Jam Tayang, Jika anda merupakan seorang youtuber akan tetapi channel yang anda buat hanya memiliki sedikit pengikut dan membuat jam tayang anda terasa lama untuk…
- √ Cara Meningkatkan Pendapatan Adsense Terbaru Cara meningkatkan pendapatan google adsense terbaru, Banyak blogger berusaha sekeras dan semaksimal mungkin untuk berbondong-bondong mendaftarkan situsnya pada layanan periklanan yang diselenggarakan oleh google.Program terbesar dalam bidang advertising ini memang di…
- 6 Tips Meningkatkan Traffic Pengunjung Blog Di Tahun 2021 6 Tips Meningkatkan Traffic Pengunjung Blog Di Tahun 2021, Tak bisa dipungkiri lagi oleh kebanyakan blogger atau pemilik website mereka semua pastinya memilki tujuan utama yaitu agar situs mereka memiliki…
- Rekomendasi Software Antivirus Terbaik Untuk Windows 10 Dalam berselancar di internet tentu kita sering mengunjungi situs lalu mendownload beberapa file yang disajikan pada situs tersebut yang ternyata terdapat virus seperti trojan, ransomware, malware dan beberapa virus lainnya…
- Rekomendasi Aplikasi Nonton Film Gratis Rekomendasi Aplikasi Nonton Film Gratis – Bagi para pecinta film, mengetahui aplikasi nonton film gratis adalah hal yang sangat penting dan sayang dilewatkan. Iya kan? Ya iyalah, kapan lagi kan,…
- Cara Memasang Script Anti Copy-Paste Pada Template Blogger Memasang Script Anti Copy Paste pada template untuk mencegah plagiarisme, Sebelumnya saya sudah pernah membahas mengenai cara melindungi konten dengan sumber link otomatis menggunakan javascript, namun rasanya itu belum cukup…
- Cara Memblokir dan Membuka Blokir Orang di Facebook Cara memblokir dan membuka blokir orang di Facebook – Sampai saat ini Facebook merupakan salah satu media sosial yang sangat banyak digunakan oleh masyarakat Indonesia. Meskipun kalau diperhatikan jumlah penggunanya…
- Cara Memasang Script Adblock Killer Pada Blog Seperti yang kita ketahui bahwasannya para pengguna gadget baik itu laptop maupun handphone pintar sudah banyak sekali yang menggunakan ekstensi maupun browser untuk memblokir iklan yang ada pada blog kita.hal…
- Panduan Login Aplikasi SIPlah Kemdikbud SIPlah merupakan singkatan dari Sistem Informasi Pengadaan Sekolah adalah sistem elektronik yang dapat digunakan oleh sekolah dalam pemenuhan barang dan jasa secara Daring (dalam jaringan) ketika menggunakan dana yang bersumber…
- Cara Mengatasi WhatsApp Lemot Supaya Lancar Kembali Cara mengatasi WhatsApp lemot supaya lancar kembali – Aplikasi WhatsApp bisa kita katakan sebagai salah satu aplikasi yang sangat penting dalam kehidupan seseorang. Terlebih lagi bagi mereka yang bekerja di…
- Cara Ampuh Menghilangkan Icon Obeng Dan Tang Di Blog Cara Menghilangkan Icon Obeng Dan Tang di Blog – Pada kesempatan kali ini saya akan membagikan tips dan trik untuk menghilangkan icon obeng yang sangat mengganggu pada tampilan blog anda.Sebagai…
- Cara Menggunakan Direct Message Cara menggunakan direct message – Sebagai media sosial yang populer, aplikasi Twitter menawarkan berbagai macam fitur menarik dan unggul yang bisa dimanfaatkan oleh para penggunanya. Dah salah satu fitur yang…
- Rekomendasi Aplikasi Nonton Film India Rekomendasi Aplikasi Nonton Film India – Salah satu film yang cukup menarik perhatian, dan punya banyak penonton adalah film india. Iya kan? Dan mungkin, tidak sedikit di antara anda yang…
- Rekomendasi Aplikasi Download Game di Laptop Aplikasi Download Game di Laptop – Sebagai pecinta game, anda pasti pernah bertanya tanya, gimana sih cara download game di laptop? Apa aplikasi yang bisa digunakan? Ia kan? Nah menariknya,…
- Pasang Twibbon Hari Lahir Pancasila Orang Indonesia merayakan hari lahir Pancasila pada tanggal 1 Juni setiap tahunnya.Hari lahir Pancasila adalah 1 Juni 1945, ditandai dengan pidato Soekarno, presiden pertama Indonesia, di persidangan Dokuritsu Junbi Cosakai…
- Download WeTV Mod APK Premium Terbaru (Unlocked VIP) Disini siapa yang suka nonton film , drama dan Variety Show melalui aplikasi Wetv ? Nah aplikasi film streaming terbaik ini cukup baik dalam pengalaman pengguna untuk menonton ribuan film…
- √ Cara Membuat Safelink Klik 2x Pada Blog Utama Pada kesempatan kali ini saya akan membagikan sebuah tutorial cara membuat safelink klik 2x pada blog utama tanpa harus membuat blog baru, pastinya safelink ini sangat berguna bagi anda dengan…
- Template Blog Terbaik Untuk Meningkatkan Pendapatan Adsense Template Blog Terbaik Untuk Meningkatkan Pendapatan Adsense – Pada kesempatan kali ini saya akan membagikan cara meningkatkan pendapatan adsense pada blog anda dengan sebuah template yang mempunyai High CTR pada…
- Cara Memasang Lazy Load Iklan Otomatis Adsense Di Blogger Memasang Lazy Load Adsense – Pada kesempatan kali ini saya akan membagikan sebuah script untuk mempercepat loading blog kalian menggunakan lazy load adsense khususnya untuk iklan otomatis, menggunakan script ini…
- Rekomendasi Aplikasi Perekam Suara Terbaik Rekomendasi Aplikasi Perekam Suara Terbaik – Selama ini masih banyak banget yang belum tahu, bahwa ternyata kita bisa loh melakukan rekaman lewat laptop atau komputer. Jadi, nggak cuma bisa ngerekam…
- Download Source Code Android FireApp Chat Realtime With… Download Source Code Android – Pada kesempatan kali ini saya akan membagikan sebuah source code aplikasi android seperti whatsapp dilengkapi dengan iklan admob sebagai profit yang baik dalam memonitize aplikasi,…
- Cara Mempercepat Index Artikel Pada Google Webmaster Banyak yang bertanya bagaimana caranya mempercepat pengindexan artikel atau blog agar muncul dalam kolom pencarian baik itu di google, yahoo, bing maupun yandex dan mesin telusur lainnya, pastinya anda pernah…
Lewatinaja.com Kumpulan Informasi Menarik Terbaru
