{"id":11627,"date":"2019-06-26T07:26:02","date_gmt":"2019-06-26T07:26:02","guid":{"rendered":"https:\/\/ampforwp.com\/tutorials\/?post_type=ht_kb&#038;p=11627"},"modified":"2019-11-23T07:51:41","modified_gmt":"2019-11-23T07:51:41","slug":"how-to-install-setup-amp-teaser","status":"publish","type":"ht_kb","link":"https:\/\/ampforwp.com\/tutorials\/article\/how-to-install-setup-amp-teaser\/","title":{"rendered":"How to Install &#038; Setup AMP Teaser"},"content":{"rendered":"\n<p>AMP Teaser automatically clips the content based on your selection and then adds a button at the end which will lead the visitor to the non-AMP version. <\/p>\n\n\n\n<p><strong>Here are the steps:<\/strong><\/p>\n\n\n\n<ol><li>Download and Install <a href=\"https:\/\/ampforwp.com\/amp-teaser\/\">AMP Teaser<\/a>.<\/li><li>Upload and Activate<\/li><li>Done! The AMP Teaser will be visible on the AMP version of your site.<\/li><\/ol>\n\n\n\n<p>You will find this option in <strong>WordPress Dashboard<\/strong> -&gt; <strong>AMP option panel<\/strong> -&gt; Navigate to <strong>AMP Teaser option<\/strong> -&gt; <strong>Settings<\/strong> <\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"458\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/06\/teaser-111-1024x458.png\" alt=\"\" class=\"wp-image-11631\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/06\/teaser-111-1024x458.png 1024w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/06\/teaser-111-300x134.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/06\/teaser-111-768x344.png 768w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/06\/teaser-111-50x22.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/06\/teaser-111-60x27.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/06\/teaser-111-100x45.png 100w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/06\/teaser-111.png 1320w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<ul><li><strong>Teaser: <\/strong>First enable &#8220;Teaser&#8221; option <\/li><li><strong>Display on Post Types: <\/strong>Select the Post types here where you want to display teaser in AMP.<\/li><li><strong>Position:<\/strong> In this option, you can change the Teaser position.<\/li><li><strong>Teaser Button Name:<\/strong>  In this field, you can change the name of the  Teaser button.<\/li><li><strong>Button Font Size:<\/strong> In this field, you can change the font size of the  Teaser button.<\/li><li><strong>Button Text Color: <\/strong>In this field, you can change the text color of the  Teaser button.<\/li><li><strong>Button Color:<\/strong>  In this field, you can change the color of the Teaser button. <\/li><\/ul>\n\n\n\n<h4>The output of the AMP Teaser<\/h4>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"498\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/06\/teaser-222-1024x498.png\" alt=\"\" class=\"wp-image-11634\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/06\/teaser-222-1024x498.png 1024w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/06\/teaser-222-300x146.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/06\/teaser-222-768x373.png 768w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/06\/teaser-222-50x24.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/06\/teaser-222-60x29.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/06\/teaser-222-100x49.png 100w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/06\/teaser-222.png 1350w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><strong>That\u2019s it for this tutorial!<\/strong><\/p>\n\n\n\n<p>We hope it helped you. If you have any feedback or questions, then please share them in the comments section below.<\/p>\n<div id=\"div-1\" class=\"hkb-feedback\">\n\t\t\t<strong class=\"ht-mobile-exit__title\">Ask your Questions Directly!<\/strong><br>\n\t\t\t<div class=\"hkb_widget_exit__content\" style=\"font-size: 14px;\">If you can't find the solutions in this article, then just ask us in the comments and we will answer it for you!<\/div>\n\t\t\t<a href=\"https:\/\/ampforwp.com\/support\/#contact\" id=\"button\" target=\"_blank\" rel=\"noopener noreferrer\"><button>Yes, I have a Question<\/button><\/a>\n\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>AMP Teaser automatically clips the content based on your selection and then adds a button at the end which will lead the visitor to the non-AMP version. Here are the steps: Download and Install AMP Teaser. Upload and Activate Done! The AMP Teaser will be visible on the AMP version&#8230;<\/p>\n","protected":false},"author":18,"comment_status":"open","ping_status":"closed","template":"","format":"standard","meta":[],"ht-kb-category":[174],"ht-kb-tag":[],"_links":{"self":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb\/11627"}],"collection":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb"}],"about":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/types\/ht_kb"}],"author":[{"embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/users\/18"}],"replies":[{"embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/comments?post=11627"}],"version-history":[{"count":25,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb\/11627\/revisions"}],"predecessor-version":[{"id":14072,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb\/11627\/revisions\/14072"}],"wp:attachment":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/media?parent=11627"}],"wp:term":[{"taxonomy":"ht_kb_category","embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb-category?post=11627"},{"taxonomy":"ht_kb_tag","embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb-tag?post=11627"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}