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/AVvXsEg6jIGohb2fo_uNHZGFmiu-xlTRAh4Ir_WRXe_mnknGbJPfLel62UGt5w16lEK6VgImNjsRGd8B4ittxNV7O31xJqx5h63vcgU4Lkedzfhg5aF4NZGCRpm2qp7u6uyPkmFVxMmApZl8MO8/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/AVvXsEg6jIGohb2fo_uNHZGFmiu-xlTRAh4Ir_WRXe_mnknGbJPfLel62UGt5w16lEK6VgImNjsRGd8B4ittxNV7O31xJqx5h63vcgU4Lkedzfhg5aF4NZGCRpm2qp7u6uyPkmFVxMmApZl8MO8/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/AVvXsEgM2p8EK7CzdR4XwBXHG1U7aAbI75RRd2hNoy1S6dpF33HQY8mxPZxtItg6cVRoSaO8lPRPVR6BtkoT06aE51YZ0RPj9CHWDg4ADpBhcZpn1ySBmVHmxarTdsuEfp_9lLAxP-cL2P6FR1I/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/AVvXsEgM2p8EK7CzdR4XwBXHG1U7aAbI75RRd2hNoy1S6dpF33HQY8mxPZxtItg6cVRoSaO8lPRPVR6BtkoT06aE51YZ0RPj9CHWDg4ADpBhcZpn1ySBmVHmxarTdsuEfp_9lLAxP-cL2P6FR1I/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/AVvXsEhQruTNYNWxUpa4OuoEtZ3-Tv8yAJdokWhTOeyo3V8UCaWBUerPVXi3ZYZ2pEFQ1Ns20k-H2F_4QA56zLVia5e7p7fARgyiDM8fFbAnZPr4dmMuj9R84xOKUsoALUlIeFObUfthObOw0p0/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/AVvXsEhQruTNYNWxUpa4OuoEtZ3-Tv8yAJdokWhTOeyo3V8UCaWBUerPVXi3ZYZ2pEFQ1Ns20k-H2F_4QA56zLVia5e7p7fARgyiDM8fFbAnZPr4dmMuj9R84xOKUsoALUlIeFObUfthObOw0p0/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/AVvXsEgdM5LUx-__hHc6X2_nTkEVORSFElGWXRL7SlBxto1y8IXi4vNm4RiF12B580MBPvMnnzY0P0ApOwjAs1UtzW9ErqbamlEreTX6Fp7pXC2YKVlYn597kIuyFAiIaLODb24dJ73OA0Q-hhQ/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/AVvXsEgdM5LUx-__hHc6X2_nTkEVORSFElGWXRL7SlBxto1y8IXi4vNm4RiF12B580MBPvMnnzY0P0ApOwjAs1UtzW9ErqbamlEreTX6Fp7pXC2YKVlYn597kIuyFAiIaLODb24dJ73OA0Q-hhQ/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/AVvXsEj4iAxsF2hUq8qP6OYPXttH0t0AJYc-ui_URPcfzfsNVbyKYAGG4qnWPTJXV8e5wUeeBB1-L1gFOVjXaEMXV-yE5RjbM-wbAi5c2h7_ks6nhDb41BO2UETcM5KHMWqG-nDllhyphenhyphenJj5R80RM/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/AVvXsEj4iAxsF2hUq8qP6OYPXttH0t0AJYc-ui_URPcfzfsNVbyKYAGG4qnWPTJXV8e5wUeeBB1-L1gFOVjXaEMXV-yE5RjbM-wbAi5c2h7_ks6nhDb41BO2UETcM5KHMWqG-nDllhyphenhyphenJj5R80RM/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/AVvXsEjqhGBKZffNQiz0trH6OJeeRAGPfMxebECcQBJsQXVpZGplzGtkMnQY4Q1lpQzXsp02xt4nrhxOiHOg5gwIKb-WKVyxSdkdyB4RJCgOmhmaBoZACFEFgH3QQjVLxU4ljZxLUVw8LDxff7k/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/AVvXsEjqhGBKZffNQiz0trH6OJeeRAGPfMxebECcQBJsQXVpZGplzGtkMnQY4Q1lpQzXsp02xt4nrhxOiHOg5gwIKb-WKVyxSdkdyB4RJCgOmhmaBoZACFEFgH3QQjVLxU4ljZxLUVw8LDxff7k/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/AVvXsEin3z0D40Mg-HdeEgLNlSKSJJQTQ1rcUIJWOg0V_6-bD3dzJxSnWbBos53vqmwlchsdH2UnWfns_AF0noiI7L32RN7rdfbs4kE_4mRBwq07rTab1oVDSEw3YZ_-TYDStNZbY1dNT5KQqTo/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/AVvXsEin3z0D40Mg-HdeEgLNlSKSJJQTQ1rcUIJWOg0V_6-bD3dzJxSnWbBos53vqmwlchsdH2UnWfns_AF0noiI7L32RN7rdfbs4kE_4mRBwq07rTab1oVDSEw3YZ_-TYDStNZbY1dNT5KQqTo/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/AVvXsEjrheP56LpfZp6SnXXmvFnoJwF-0NFE__vFbKVR1-7vcjA8vCx2qPfHBSw4yzfjc5Y5cq4_mRvxe5TVIG7_deJZNsOj-UPhu6elOvZcH9nfc92CZwV4hiaOr8qLNIo3_x4c5H-G5j3XE2E/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/AVvXsEjrheP56LpfZp6SnXXmvFnoJwF-0NFE__vFbKVR1-7vcjA8vCx2qPfHBSw4yzfjc5Y5cq4_mRvxe5TVIG7_deJZNsOj-UPhu6elOvZcH9nfc92CZwV4hiaOr8qLNIo3_x4c5H-G5j3XE2E/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
0 Komentar