How to Embed Chatango on the Blog AMP HTML
How to Embed Chatango on the Blog AMP HTML - It turns out that until now Chatango is still a chat box that is popular among bloggers. It can be seen from the many blogs that use Chatango as chat rooms for blog visitors.
So what about the AMP blog? Does the AMP blog allow you to embed Chatango?
As we know that in AMP HTML it is not allowed to store scripts like the Chatango embed code. Luckily Chatango doesn't need domain verification, so we can save or host Chatango's embed code elsewhere and embed Chatango in AMP with amp-iframe.
If you want to try embed Chatango on your AMP blog, please follow the steps below.
Embed Chatango on the AMP Blog
The first thing to do is please create a Chatango chat group on your Chatango account. For Embed as, please select the Box and remove the Full width ticker on mobile. For Size, please choose Responsive.
For colors and more, please adjust it to your taste. Then please copy the embed code and save it in notepad.
Next, please create a * .html file (for example chatbox.html) and use the following code.
Then please host the html file you created, you can use Github to host html files.
Then please embed the html file for the chatbox created earlier on your AMP blog using the following code, you can save it in the sidebar.
""Please replace the HTML URL HOSTING HERE with the URL of the html chatbox file that you are hosting on Github. For height='450' please adjust it to your taste.""
and make sure on your blog you have used amp-iframes like the following.
Finish, and you can see the results on your blog.
Thus the tips that I can share this time about How to Embed Chatango on the AMP Blog. Hopefully with these fairly short tips, it can be useful for you. Good luck.
So what about the AMP blog? Does the AMP blog allow you to embed Chatango?
As we know that in AMP HTML it is not allowed to store scripts like the Chatango embed code. Luckily Chatango doesn't need domain verification, so we can save or host Chatango's embed code elsewhere and embed Chatango in AMP with amp-iframe.
If you want to try embed Chatango on your AMP blog, please follow the steps below.
Embed Chatango on the AMP Blog
The first thing to do is please create a Chatango chat group on your Chatango account. For Embed as, please select the Box and remove the Full width ticker on mobile. For Size, please choose Responsive.
For colors and more, please adjust it to your taste. Then please copy the embed code and save it in notepad.
Next, please create a * .html file (for example chatbox.html) and use the following code.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Chat Box</title>
<style>
body{
margin:0;
padding:0;
}
.box{
width:100%;
height:100vh;
overflow:hidden;
}
</style>
</head>
<body>
<div class="box">
<!-- EMBED CHATANGO CODE SAVE BELOW -->
</div>
</body>
</html>
Then please host the html file you created, you can use Github to host html files.
Then please embed the html file for the chatbox created earlier on your AMP blog using the following code, you can save it in the sidebar.
<amp-iframe frameborder='0' height='450' layout='fixed-height' noloading='' sandbox='allow-forms allow-scripts allow-same-origin allow-modals allow-popups' src='HTML URL HOSTING HERE'>
<amp-img height='450' layout='fixed-height' noloading='' placeholder='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWZthqpoBjYPOL0JIb-1_Lc85b_DYwsAABvRkGWIA0Bd7NteqcLWsDjSgDLmzM52sCv-ddJNkepm3KFzaZnlOhH5aCc1tYy2W9dk_cK5oMjaMsoPjwV9W_D9feNcNrsynjWMEOROr5uSM/s1600/back-iframe.png"' width='auto'/></amp-img></amp-iframe>
""Please replace the HTML URL HOSTING HERE with the URL of the html chatbox file that you are hosting on Github. For height='450' please adjust it to your taste.""
and make sure on your blog you have used amp-iframes like the following.
<script async='async' custom-element='amp-iframe' src='https://cdn.ampproject.org/v0/amp-iframe-0.1.js'></script>
Finish, and you can see the results on your blog.
Thus the tips that I can share this time about How to Embed Chatango on the AMP Blog. Hopefully with these fairly short tips, it can be useful for you. Good luck.
Post a Comment for "How to Embed Chatango on the Blog AMP HTML"
Provide comments relevant to the posted articles and provide critiques and suggestions for the progress of the blog