Membuat Chatango Valid Amp
Cara Membuat Chatango Valid AMP - Kali ini ane akan membagikan tutorial yang bekerjasama dengan AMP (Accelerated Mobile Pages) merupakan Halaman web yang dirancang khusus semoga sanggup dimuat perangkat mobile dalam waktu yang sangat cepat dan ekonomis kuota internet, hal ini tentu merupakan sebuah kemajuan bagi sistem mobile web yang berdampak besar.
Sebelum kau memakai AMP (Accelerated Mobile Pages) pastikan HTML atau Link blog kau harus HTTPS bukan lagi HTTP. Tutorial kali ane akan membagikan Cara Membuat Chatango Valid AMP.
Alasan kenapa chatango tidak valid AMP dikarenakan persyaratan atau peraturan khusus yang dibentuk Amp semoga tidak lagi memakai attribute javascript dan beberapa peraturan lainnya Seperti :
- <style> diganti dengan <style amp-custom='amp-custom'>, dan tidak memakai !important
- img diganti memakai amp-img
- Tidak boleh ada CSS inline, misalnya menyerupai ini : <div style='clear:both;'></div>
- Dalam 1 halaman harus memakai satu <style amp-custom='amp-custom'> [Tidak boleh lebih dari 1]
Ok sekian dulu klarifikasi perihal AMP, kita lanjut ketutorialnya pertama-tama kau harus cek di atas </head><!--<head/>--> ada Script amp-Iframe menyerupai dibawah ini
<script async='async' custom-element='amp-iframe' src='https://cdn.ampproject.org/v0/amp-iframe-0.1.js'/>
Cara Membuat Chatango Valid AMP
- Buat File HTML Chatango memakai html dibawah ini
- Contohnya Seperti gambar berikut
- Jika sudah Upload File tersebut ke Github & Staticaly
- Contoh balasannya menyerupai ini https://cdn.staticaly.com/gh/Arleth98/HTML/195d0749/chat-v2.html
- Gunakan html amp-iframe berikut untuk menampilkan chatango diblog agan
- Jangan lupa diedit bab yang sudah ane tandai.
<html> <head> <title>Chat</title> </head> <body> <!-- Script Chatango --> </body> </html>
<amp-iframe sandbox='allow-scripts allow-same-origin allow-modals allow-popups' frameborder='0' width='300' height='370' src='LINK GITHUB' scrolling='no'><amp-img width='300' height='370' layout='fill' placeholder='' src='LINK GAMBAR'></amp-img></amp-iframe>
Tag | Keterangan |
---|---|
width='300' | Silahkan Sesuaikan lebarnya |
height='370' | Silahkan Sesuaikan tingginya |
src='LINK GITHUB' | Ganti LINK GITHUB, cek nomor 4 |
src='LINK GAMBAR' | Ganti LINK GAMBAR sesuai Yang diinginkan [Contoh] |
Pengaturan Chatango Atur default 100% baik Lebar, tinggi & jangan dibentuk responsive, Contoh Seperti gambar berikut
CEK DISINI