{"id":13,"date":"2019-04-16T09:48:41","date_gmt":"2019-04-16T09:48:41","guid":{"rendered":"http:\/\/pwa-for-wp.com\/docs\/?post_type=ht_kb&#038;p=13"},"modified":"2019-10-14T07:19:39","modified_gmt":"2019-10-14T07:19:39","slug":"how-to-install-setup-pwa-in-amp","status":"publish","type":"ht_kb","link":"https:\/\/pwa-for-wp.com\/docs\/article\/how-to-install-setup-pwa-in-amp\/","title":{"rendered":"How To Install &#038; Setup PWA in AMP"},"content":{"rendered":"<p><strong>You can give the APP-like experience to your audience which will get your website to their home screen and works instantly like an APP with offline support.\u00a0<\/strong><\/p>\n<p>It\u2019s pretty easy for you to setup because it works out of the box.<strong>\u00a0<\/strong><strong>Here are the steps:<\/strong><\/p>\n<ul>\n<li>After Installing the plugin in the dashboard, we go to the left-hand side in Menu bar go to the <strong>PWA<\/strong> option panel.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-451 aligncenter\" src=\"https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/3.png\" alt=\"\" width=\"174\" height=\"176\" srcset=\"https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/3.png 174w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/3-50x50.png 50w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/3-60x60.png 60w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/3-100x100.png 100w\" sizes=\"auto, (max-width: 174px) 100vw, 174px\" \/><\/p>\n<ul>\n<li>After clicking the PWA option you will be able to see the Dashboard option in which it will automatically be detected the Installation status of\u00a0<strong>Manifest<\/strong>,\u00a0<strong>Service Worker<\/strong>, and\u00a0<strong>HTTPS.<\/strong><\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-461\" src=\"https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/7.png\" alt=\"\" width=\"1012\" height=\"480\" srcset=\"https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/7.png 1012w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/7-300x142.png 300w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/7-768x364.png 768w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/7-50x24.png 50w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/7-60x28.png 60w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/7-100x47.png 100w\" sizes=\"auto, (max-width: 1012px) 100vw, 1012px\" \/><\/p>\n<ul>\n<li>After the click on the <strong>WordPress Dashboard<\/strong> -&gt; Navigate to <strong>PWA<\/strong>\u00a0option -&gt;\u00a0<strong>Settings\u00a0<\/strong> -&gt; <strong>Setup<\/strong> -&gt; <strong>General<\/strong> in which you can set the <strong>App Name<\/strong>, <strong>App Short Name, App description, App Icon<\/strong>,\u00a0<strong>App Splash Screen Icon<\/strong> and etc.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-533\" src=\"https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/15.png\" alt=\"\" width=\"1056\" height=\"1050\" srcset=\"https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/15.png 1056w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/15-150x150.png 150w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/15-300x298.png 300w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/15-768x764.png 768w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/15-1024x1018.png 1024w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/15-50x50.png 50w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/15-60x60.png 60w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/15-100x100.png 100w\" sizes=\"auto, (max-width: 1056px) 100vw, 1056px\" \/><\/p>\n<ul>\n<li>Similarly,\u00a0you can click on the <strong>Design<\/strong> option in which you can set the background color and Theme color.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-528\" src=\"https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/14.png\" alt=\"\" width=\"1038\" height=\"493\" srcset=\"https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/14.png 1038w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/14-300x142.png 300w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/14-768x365.png 768w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/14-1024x486.png 1024w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/14-50x24.png 50w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/14-60x28.png 60w, https:\/\/pwa-for-wp.com\/docs\/wp-content\/uploads\/2019\/04\/14-100x47.png 100w\" sizes=\"auto, (max-width: 1038px) 100vw, 1038px\" \/><\/p>\n<ul>\n<li>To check how to set up <strong>Push Notification<\/strong> section please visit this <strong><a href=\"https:\/\/pwa-for-wp.com\/docs\/article\/how-to-use-push-notifications-in-pwa\/\">documentation<\/a> <\/strong>in which we\u2019ve explained in detail.<\/li>\n<\/ul>\n<p><strong>That\u2019s it for this tutorial!<\/strong><\/p>\n<p>We hope it helped you. If you have any feedback or questions\u00a0Just contact us <strong><a href=\"http:\/\/pwa-for-wp.com\/contact-us\/\">here<\/a> <\/strong>and we are always available for you.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>You can give the APP-like experience to your audience which will get your website to their home screen and works instantly like an APP with offline support.\u00a0 It\u2019s pretty easy for you to setup because it works out of the box.\u00a0Here are the steps: After Installing the plugin in the&#8230;<\/p>\n","protected":false},"author":3,"comment_status":"open","ping_status":"closed","template":"","format":"standard","meta":{"footnotes":""},"ht-kb-category":[4],"ht-kb-tag":[],"class_list":["post-13","ht_kb","type-ht_kb","status-publish","format-standard","hentry","ht_kb_category-getting-started"],"_links":{"self":[{"href":"https:\/\/pwa-for-wp.com\/docs\/wp-json\/wp\/v2\/ht-kb\/13","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pwa-for-wp.com\/docs\/wp-json\/wp\/v2\/ht-kb"}],"about":[{"href":"https:\/\/pwa-for-wp.com\/docs\/wp-json\/wp\/v2\/types\/ht_kb"}],"author":[{"embeddable":true,"href":"https:\/\/pwa-for-wp.com\/docs\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/pwa-for-wp.com\/docs\/wp-json\/wp\/v2\/comments?post=13"}],"version-history":[{"count":17,"href":"https:\/\/pwa-for-wp.com\/docs\/wp-json\/wp\/v2\/ht-kb\/13\/revisions"}],"predecessor-version":[{"id":534,"href":"https:\/\/pwa-for-wp.com\/docs\/wp-json\/wp\/v2\/ht-kb\/13\/revisions\/534"}],"wp:attachment":[{"href":"https:\/\/pwa-for-wp.com\/docs\/wp-json\/wp\/v2\/media?parent=13"}],"wp:term":[{"taxonomy":"ht_kb_category","embeddable":true,"href":"https:\/\/pwa-for-wp.com\/docs\/wp-json\/wp\/v2\/ht-kb-category?post=13"},{"taxonomy":"ht_kb_tag","embeddable":true,"href":"https:\/\/pwa-for-wp.com\/docs\/wp-json\/wp\/v2\/ht-kb-tag?post=13"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}