AMP
TR
English Français العربية Español Italiano Indonesia 日本語 한국어 Português Русский 中文

Important: this component does not support your currently selected format ads!

amp-action-macro

Creates reusable actions.

Required Script <script async custom-element="amp-action-macro" src="https://cdn.ampproject.org/v0/amp-action-macro-0.1.js"></script>
Examples amp-action-macro.html

Overview

The amp-action-macro component allows for the creation of reusable actions.

Example 

<amp-action-macro
  id="closeNavigations"
  execute="AMP.setState({nav1: 'close', nav2: 'close})"
></amp-action-macro>

<button on="tap:closeNavigations.execute()">Close all</button>
<div on="tap:closeNavigations.execute()">Close all</div>

<!--
  You can provide arguments in the macro.
-->
<amp-carousel id="carousel" ...>...</amp-carousel>

<amp-action-macro
  id="carousel-macro"
  execute="carousel.goToSlide(index=foo), carousel.goToSlide(index=bar)"
  arguments="foo, bar"
></amp-action-macro>

<button on="tap:carousel-macro.execute(foo=1, bar=2)">
  Go to slide 1 then 2
</button>

Attributes

id

Used to uniquely identify the action. This is referenced in an action invocation.

execute

The action to invoke. Any valid amp action is allowed here. See actions and events in AMP.

e.g.

<amp-action-macro
  id="navigate-action"
  action="AMP.navigateTo('http://www.ampproject.org')"
></amp-action-macro>

<amp-action-macro
  id="refresh-amp-list"
  execute="ampList.refresh()"
></amp-action-macro>
<amp-list id="ampList" src="...">...</amp-list>

<button on="tap:navigate-action"></button>

<button on="tap:refresh-amp-list"></button>
arguments

Used to define arguments that can be used in the called invocation and substituted in the amp action macro call.

Need more help?

You've read this document a dozen times but it doesn't really cover all of your questions? Maybe other people felt the same: reach out to them on Stack Overflow.

Go to Stack Overflow
Found a bug or missing a feature?

The AMP project strongly encourages your participation and contributions! We hope you'll become an ongoing participant in our open source community but we also welcome one-off contributions for the issues you're particularly passionate about.

Go to GitHub