{"id":7128,"date":"2019-04-18T07:54:51","date_gmt":"2019-04-18T07:54:51","guid":{"rendered":"https:\/\/ampforwp.com\/tutorials\/?post_type=ht_kb&#038;p=7128"},"modified":"2019-07-13T12:20:26","modified_gmt":"2019-07-13T12:20:26","slug":"how-to-use-hubspot-integration-in-amp-opt-in","status":"publish","type":"ht_kb","link":"https:\/\/ampforwp.com\/tutorials\/article\/how-to-use-hubspot-integration-in-amp-opt-in\/","title":{"rendered":"How to use Hubspot Integration in AMP Opt-in"},"content":{"rendered":"\n<p>If you want to add Hubspot form in AMP then first you need to purchase and install <a href=\"https:\/\/ampforwp.com\/opt-in-forms\/\">Opt-in Forms for AMP<\/a>&nbsp;plugin.<\/p>\n\n\n\n<p>After installing you will find this option in&nbsp;<strong>WordPress Dashboard<\/strong>&nbsp;-&gt;&nbsp;<strong>AMP optin<\/strong>&nbsp;-&gt;&nbsp;<strong>Add New optin<\/strong> -&gt; select \u201c <strong>Hubspot<\/strong>\u201d option -&gt; now you need Form URL.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"434\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/07\/3-7-1024x434.png\" alt=\"\" class=\"wp-image-12440\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/07\/3-7-1024x434.png 1024w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/07\/3-7-300x127.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/07\/3-7-768x325.png 768w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/07\/3-7-50x21.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/07\/3-7-60x25.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/07\/3-7-100x42.png 100w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/07\/3-7.png 1051w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><strong>Follow the simple steps to get all this ID\u2019s from  Hubspot  Account.<\/strong><br><\/p>\n\n\n\n<p><strong><mark style=\"background-color: yellow;\">\nStep 1:&nbsp;<\/mark><\/strong>First of all Signup\/login at <a href=\"https:\/\/app.hubspot.com\/login\">Hubspot<\/a>. <\/p>\n\n\n\n<p><strong><mark style=\"background-color: yellow;\">\nStep 2:<\/mark><\/strong> After Signup\/login Hubspot click on the Marketing -&gt;Lead Capture -&gt;Forms option in the dashboard.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"1338\" height=\"419\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/1-1024x321.png\" alt=\"\" class=\"wp-image-7136\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/1-1024x321.png 1024w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/1-300x94.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/1-768x241.png 768w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/1-50x16.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/1-60x19.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/1-100x31.png 100w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/1.png 1338w\" sizes=\"(max-width: 1338px) 100vw, 1338px\" \/><\/figure>\n\n\n\n<p><strong><mark style=\"background-color: yellow;\">\nStep 3:<\/mark><\/strong> Create a new form otherwise you can select the existing form.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"388\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/2-1024x388.png\" alt=\"\" class=\"wp-image-7139\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/2-1024x388.png 1024w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/2-300x114.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/2-768x291.png 768w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/2-50x19.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/2-60x23.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/2-100x38.png 100w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/2.png 1331w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><strong><mark style=\"background-color: yellow;\">\nStep 4:<\/mark><\/strong> In this below screenshot click on share button.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"437\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/3-1024x437.png\" alt=\"\" class=\"wp-image-7142\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/3-1024x437.png 1024w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/3-300x128.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/3-768x328.png 768w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/3-50x21.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/3-60x26.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/3-100x43.png 100w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/3.png 1361w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><strong><mark style=\"background-color: yellow;\">\nStep 5:<\/mark><\/strong>  In Share you need to copy the URL.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"1099\" height=\"530\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/4-1024x494.png\" alt=\"\" class=\"wp-image-7145\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/4-1024x494.png 1024w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/4-300x145.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/4-768x370.png 768w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/4-50x24.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/4-60x29.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/4-100x48.png 100w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/4.png 1099w\" sizes=\"(max-width: 1099px) 100vw, 1099px\" \/><\/figure>\n\n\n\n<p><strong><mark style=\"background-color: yellow;\">\n Step 6:<\/mark> <\/strong>Paste this URL in AMP Opt-in form.<\/p>\n\n\n\n<p><strong><mark style=\"background-color: yellow;\">\n Step 7:<\/mark><\/strong> Select Hubspot from the Drop down and enters the form URL place where you want to display the Hubspot Form. \n\n<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"431\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/5-1024x431.png\" alt=\"\" class=\"wp-image-7149\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/5-1024x431.png 1024w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/5-300x126.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/5-768x323.png 768w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/5-50x21.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/5-60x25.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/5-100x42.png 100w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/5.png 1346w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h4><strong>The output of Hubspotintegration in AMP<\/strong><\/h4>\n\n\n\n<p>Make sure you need to fill this form and then click on the submit button after that you will get the \u201c<strong>Subscription successful<\/strong>\u201d message.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"564\" height=\"455\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/6.png\" alt=\"\" class=\"wp-image-7152\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/6.png 564w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/6-300x242.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/6-50x40.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/6-60x48.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/04\/6-100x81.png 100w\" sizes=\"(max-width: 564px) 100vw, 564px\" \/><\/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.<br><\/p>\n\n\n\n<p><br><\/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>If you want to add Hubspot form in AMP then first you need to purchase and install Opt-in Forms for AMP&nbsp;plugin. After installing you will find this option in&nbsp;WordPress Dashboard&nbsp;-&gt;&nbsp;AMP optin&nbsp;-&gt;&nbsp;Add New optin -&gt; select \u201c Hubspot\u201d option -&gt; now you need Form URL. Follow the simple steps to get&#8230;<\/p>\n","protected":false},"author":18,"comment_status":"open","ping_status":"closed","template":"","format":"standard","meta":[],"ht-kb-category":[29],"ht-kb-tag":[],"_links":{"self":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb\/7128"}],"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=7128"}],"version-history":[{"count":26,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb\/7128\/revisions"}],"predecessor-version":[{"id":12454,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb\/7128\/revisions\/12454"}],"wp:attachment":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/media?parent=7128"}],"wp:term":[{"taxonomy":"ht_kb_category","embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb-category?post=7128"},{"taxonomy":"ht_kb_tag","embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb-tag?post=7128"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}