Aviso - Embora efetivamente o load da página seja menor é importante referir que as Push Notifications não funcionam em AMP da mesma forma que funcionam em páginas "normais", então não espere uma taxa de inscrições muito elevada (ressaltamos que o convite nativo não funciona em páginas AMP, usufruindo apenas do convite em dois passos).
Nesse guia vamos te ensinar a colocar um botão de inscrição Push na sua página AMP.
Adicione o web-push plugin
No bloco HEAD você deve incluir o script web-push:
<script async custom-element="amp-web-push" src="https://cdn.ampproject.org/v0/amp-web-push-0.1.js"></script>
De seguida, coloque o seguinte código no BODY, substituindo SEU_DOMINIO_AQUI pelo domínio real do seu website e SEU_APPID_AQUI pelo App Id do seu Site dentro do Pushnews (não sabe como? aprenda aqui):
<amp-web-push
id="amp-web-push"
layout="nodisplay"
helper-iframe-url="https://SEU_DOMINIO_AQUI/amp-web-push-helper-frame.html?appId=SEU_APPID_AQUI"
permission-dialog-url="https://SEU_DOMINIO_AQUI/amp-web-push-permission-dialog.html?appId=SEU_APPID_AQUI"
service-worker-url="https://SEU_DOMINIO_AQUI/pushnews-sw.js?appId=SEU_APPID_AQUI"
service-worker-scope="https://SEU_DOMINIO_AQUI/">
</amp-web-push>
Adicione os arquivos necessários
Baixe os arquivos abaixo (clique do lado direito e faça "Salvar como..."), e coloque eles no seu website.
Eles têm que ficar acessíveis na internet acessando as respectivas URLs, exemplo: https://SEU_DOMINIO_AQUI/pushnews-sw.js
Adicione o botão de inscrição
Dentro do BODY escolha onde você quer exibir o botão de inscrição nas Push:
<amp-web-push-widget
visibility="unsubscribed"
layout="fixed"
width="500"
height="70">
<button on="tap:amp-web-push.subscribe">
Receber Notificações Push
</button>
</amp-web-push-widget>
(opcional) Adicione o botão para cancelamento de push
Opcionalmente você pode incluir um botão no BODY para cancelar a inscrição nas Push. Este botão só será exibido para usuários que estão efetivamente inscritos:
<amp-web-push-widget
visibility="subscribed"
layout="fixed"
width="500"
height="180">
<button on="tap:amp-web-push.unsubscribe">
Cancelar Notifications Push
</button>
</amp-web-push-widget>