Update amp-carousel Menjadi Versi 0.2

Update amp-carousel Menjadi Versi 0.2 - Tidak mengikuti perkembangan AMP secara detail, ternyata ada komponen AMP yang sudah diupdate. Salah satunya adalah amp-carousel dari versi 0.1 menjadi versi 0.2.

Jika blog Anda menggunakan AMP HTML dan menggunakan amp-carousel, silahkan update js amp-carousel ke versi terbaru.

Sebelumnya ini adalah js amp-carousel versi pertama.

<script async="async" custom-element="amp-carousel" src="https://cdn.ampproject.org/v0/amp-carousel-0.1.js"></script>

Jika js amp-carousel di blog Anda masih menggunakan versi 0.1 seperti di atas, silahkan ganti dengan versi terbaru seperti di bawah ini.

<script async="async" custom-element="amp-carousel" src="https://cdn.ampproject.org/v0/amp-carousel-0.2.js"></script>

amp-carousel ini biasanya digunakan untuk menampilkan slide gambar seperti di bawah ini.

Kode slide di atas yang digunakan adalah berikut ini.

<amp-carousel height="1067" layout="responsive" type="slides" width="1600" autoplay loop delay="2000">



<amp-img alt="Google Earth View Gallery" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsp_ynFF2J5TyGeUCghthYixk0bPclpxx5yOa-k6rO3Fknc7ElxghmTg-JAfKzacy7-ppM66MZTVZvw7kxzV2WhXluM3n6XhzGwvJ7YMk6EjmLm4lrN8l0-5mkvH4dvzi_FMUH4LUE4SU/s1600-rw/google-earth-view-1164.jpg" width="1600" height="1067"><amp-img fallback alt="Google Earth View Gallery" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsp_ynFF2J5TyGeUCghthYixk0bPclpxx5yOa-k6rO3Fknc7ElxghmTg-JAfKzacy7-ppM66MZTVZvw7kxzV2WhXluM3n6XhzGwvJ7YMk6EjmLm4lrN8l0-5mkvH4dvzi_FMUH4LUE4SU/s1600/google-earth-view-1164.jpg" width="1600" height="1067"></amp-img></amp-img>



<amp-img alt="Google Earth View Gallery" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVNGlz7M8AzUiV0lMYCs6VVRr5R6cF6Mk_PMcj4PayMxp_N9QIKH1tYNd6O6d_uJ0P6Wd8fNCPOXOG0Ugf2xtNrk8MoUQNOh1YB9drCidNPZp3HoZtOjIV0KkzWuaZNX55j5J1q9MB59M/s1600-rw/google-earth-view-1644.jpg" width="1600" height="1067"><amp-img fallback alt="Google Earth View Gallery" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVNGlz7M8AzUiV0lMYCs6VVRr5R6cF6Mk_PMcj4PayMxp_N9QIKH1tYNd6O6d_uJ0P6Wd8fNCPOXOG0Ugf2xtNrk8MoUQNOh1YB9drCidNPZp3HoZtOjIV0KkzWuaZNX55j5J1q9MB59M/s1600/google-earth-view-1644.jpg" width="1600" height="1067"></amp-img></amp-img>



<amp-img alt="Google Earth View Gallery" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjG7H_GE77tWnYNbGVSl1RcMmay_tTUR2VjjGovzqFn4vxyQW_fKAbigkNSrrJ3aJre42hfT2kI3NxdVCuj9Z7is-vJQYIQ0iWqeQNOinSZDQHoAkeTQARWLDu3n1hL6AKH_zO7wlR5tGc/s1600-rw/google-earth-view-1829.jpg" width="1600" height="1067"><amp-img fallback alt="Google Earth View Gallery" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjG7H_GE77tWnYNbGVSl1RcMmay_tTUR2VjjGovzqFn4vxyQW_fKAbigkNSrrJ3aJre42hfT2kI3NxdVCuj9Z7is-vJQYIQ0iWqeQNOinSZDQHoAkeTQARWLDu3n1hL6AKH_zO7wlR5tGc/s1600/google-earth-view-1829.jpg" width="1600" height="1067"></amp-img></amp-img>



<amp-img alt="Google Earth View Gallery" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMBCcSSmki89mrM7oUQL08STqFgbJZHJQxeU64TMBXMh94P6CZnIpUDTrxJnp3eaxPy0AeComdd5JfxUrcnel_KBrqN6x3abXPEErtu4AVt5uDXKLdc-2pcFFhCC5UlHEsysYfuhJCh78/s1600-rw/google-earth-view-2125.jpg" width="1600" height="1067"><amp-img fallback alt="Google Earth View Gallery" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMBCcSSmki89mrM7oUQL08STqFgbJZHJQxeU64TMBXMh94P6CZnIpUDTrxJnp3eaxPy0AeComdd5JfxUrcnel_KBrqN6x3abXPEErtu4AVt5uDXKLdc-2pcFFhCC5UlHEsysYfuhJCh78/s1600/google-earth-view-2125.jpg" width="1600" height="1067"></amp-img></amp-img>



<amp-img alt="Google Earth View Gallery" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwXzrUSjwoLsX8IvocOVES3I2CbUCl99JX527O3CZY3NXjmxC4Ln6ADN4mwKe1UNVIgL-ixYGkMzMRv1h9-Z5GYhi7n9OHaddqF-l6b5YlJGN2ELDrXHuRLnS3LpPF1VS6hd7asE0gB50/s1600-rw/google-earth-view-5484.jpg" width="1600" height="1067"><amp-img fallback alt="Google Earth View Gallery" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwXzrUSjwoLsX8IvocOVES3I2CbUCl99JX527O3CZY3NXjmxC4Ln6ADN4mwKe1UNVIgL-ixYGkMzMRv1h9-Z5GYhi7n9OHaddqF-l6b5YlJGN2ELDrXHuRLnS3LpPF1VS6hd7asE0gB50/s1600/google-earth-view-5484.jpg" width="1600" height="1067"></amp-img></amp-img>



<amp-img alt="Google Earth View Gallery" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtJ7SajUekQpmQet5VcSgB6YB0_4ZEOf9uPq6LRy33egX_g9DZVsBFeSSFTtlzvXaA8lsNKGfZyBggcOtFe4zXDahNED8Usr-jIXCkLu-2H3t-Uoh8S3wImYMq4BU5Up-koejvlUy2CTk/s1600-rw/google-earth-view-13119.jpg" width="1600" height="1067"><amp-img fallback alt="Google Earth View Gallery" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtJ7SajUekQpmQet5VcSgB6YB0_4ZEOf9uPq6LRy33egX_g9DZVsBFeSSFTtlzvXaA8lsNKGfZyBggcOtFe4zXDahNED8Usr-jIXCkLu-2H3t-Uoh8S3wImYMq4BU5Up-koejvlUy2CTk/s1600/google-earth-view-13119.jpg" width="1600" height="1067"></amp-img></amp-img>



<amp-img alt="Google Earth View Gallery" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic324aVysAu1zqVYGH6p20D3dNg0Yp8KvDaYY2NXofvhk_w3JuJ_HQQKaNt3hMn734FCarsHf1ppi5F_4pHaQxGSYcSv0_L2pYMh_0_h4NMiJ_iMj_Tjauaj4Tb2lYwSBs-vfMiCH4a-w/s1600-rw/google-earth-view-13765.jpg" width="1600" height="1067"><amp-img fallback alt="Google Earth View Gallery" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic324aVysAu1zqVYGH6p20D3dNg0Yp8KvDaYY2NXofvhk_w3JuJ_HQQKaNt3hMn734FCarsHf1ppi5F_4pHaQxGSYcSv0_L2pYMh_0_h4NMiJ_iMj_Tjauaj4Tb2lYwSBs-vfMiCH4a-w/s1600/google-earth-view-13765.jpg" width="1600" height="1067"></amp-img></amp-img>



<amp-img alt="Google Earth View Gallery" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdtWprszq9z0RgEVWy1YOxi4_xARS8cDF5YwYRyStCnb9qzY8RAjcNH1zksW95VtGpBBMkrPx39PHu0_i3yUKKdp92-riV01f1PRP-ED6qO3VHNA-DrMLS62hHvNtmlBdcL1sBygkG-kg/s1600-rw/google-earth-view-14730.jpg" width="1600" height="1067"><amp-img fallback alt="Google Earth View Gallery" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdtWprszq9z0RgEVWy1YOxi4_xARS8cDF5YwYRyStCnb9qzY8RAjcNH1zksW95VtGpBBMkrPx39PHu0_i3yUKKdp92-riV01f1PRP-ED6qO3VHNA-DrMLS62hHvNtmlBdcL1sBygkG-kg/s1600/google-earth-view-14730.jpg" width="1600" height="1067"></amp-img></amp-img>



</amp-carousel>

Nah, pada versi 0.2 ini ada penambahan atribut untuk type="carousel" yaitu autoplay dan loop.

Selengkapnya tentang amp-carousel ini bisa disimak di amp.dev