Sometimes you want to add custom interactivity to your AMP pages to make your pages look more user-friendly and user calling. Although AMP’s pre-built components are limited, so amp-bind is made to overcome this problem. It helps the developer to add custom interactivity to the pages without using AMP’s pre-built components. You can use amp-bind to change the text dynamically on user interaction with the page.
Setup: To use amp-bind in your page you have to import its script in the header of the document.
The amp-bind of Google AMP is comprised of three main concepts:
- State: State variables are responsible for the update on the page on the basis of user actions. It is very important to define a state variable.
- Binding: They are a special attribute that is used to link an element’s property to a state via an expression.
To bind the text we will make use of attribute, it helps to change the text dynamically.
- How to calculate area of circle dynamically using amp-bind-macro in Google AMP ?
- How to change/update image size dynamically using amp-bind in Google AMP ?
- How to change/update CSS class dynamically using amp-bind in Google AMP ?
- How to change/update image dynamically using amp-bind in Google AMP ?
- How to create Nested Accordion using Google AMP amp-accordion?
- How to create Hidden Header using Google AMP amp-accordion?
- How to create Dynamic Header using Google AMP amp-accordion?
- How to create Auto-collapsing accordion using Google AMP amp-accordion ?
- How to create Animated accordion using Google AMP amp-accordion ?
- How to create Comparison accordion using Google AMP amp-accordion ?
- Text Animation with changing the color of the text using HTML & CSS
- Google Amp amp-ad
- Google AMP amp-accordion
- Google AMP amp-facebook-like
- Google AMP amp-carousel
- Google AMP amp-date-countdown
- Google AMP amp-brightcove
- Google AMP amp-bind-recaptcha
- Google AMP amp-autocomplete
- How to disable download option in amp-audio in Google AMP ?
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to email@example.com. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.