Cara membuat gambar slider dipostingan blogger
- ArtikelTOP
- January 19, 2022
- Add Comment
Bahas Tuntas Yuk,,
Diartikel ini saya akan membagikan cara membuat cara membuat widget slider gambar di blogger yang dapat anda gunakan untuk gambar di blog anda.
hai Atlover,di artikel kali ini saya akan
membagikan cara membuat cara membuat widget slider gambar di blogger yang dapat
anda gunakan untuk gambar di blog anda.
widget
slider ini memiliki futur pada umumnya,hanya saja widget ini sangat ringan dan
hanya menggunakan css dan html.jadi widget ini sangat cocok digunakan di blog
anda.
widget
ini bisa ringan karena hanya mengadalkan efek scroll kanan dan kiri saja.
namun
widget ini belum begitu sempurna dikarenakan saya hanya memahami sedikit css
dan html,dan jika ada masalah atau tidak responsif di mode dekstop mohon
dimaklumi karena saya hanya membuatnya menggunakan smartphone karena laptop
saya lagi rusak.
Apa fungsi widget ini
widget ini berfungsi untuk menyembunyikan gambar dan
mengharuskan user untuk menscroll kekanan atau kiri,itu aja sih yang saya tahu.
Bagaimana cara membuatnya?
- langkah pertama login ke akun blogger anda masing
masing.
- langkah kedua pilih Tema kemudian klik titik tiga dan
klik edit html.
- setelah itu salin dan letakkan kode css dibawah ini tepat di atas kode ]]></b:skin>.
/*css slider by Alfatechnesia*/
.AtsliderIMG .slides {
display: flex;
white-space: nowrap;
width: 100%;
flex-direction: row;
overflow: auto;
scroll-behavior: smooth;
padding: 20px 0 0;
}
.AtsliderIMG .AtsliderIMG-content img {
border-radius: 15px;
max-height: 225px;
max-width: 720px;
margin: 0 5px;
scroll-snap-align: start;
}
- jika anda sudah meletakkan kode css diatas jangan lupa
klik simpan Tema
- kemudian silakan anda letakkan kode html dibawah ini di
postingan atau halaman blog andasilakan ganti image link dengan link
gambar anda
- langkah terakhir silakan klik publikasikan atau simpan
postingan
sekian artikel saya kaliini semoga bermamfaat dan jika ada yang
tidak dimengerti dan ada yang ingin ditanyakan silahkan berkomentar di komentar
bawah ini
0 Comment