{"_id":"543ebd4dcc182e08005d0ce4","category":{"_id":"543d5da831ca981a00a6fead","project":"543c845ee443e3080085b32d","version":"543c845ee443e3080085b330","__v":7,"pages":["543d61e7a10ab32000b3ab39","543d7c3331ca981a00a6ff42","545002cd3c6f700800a9b3b4","543ebd4dcc182e08005d0ce4","543ec2d2cc182e08005d0d05","543eca52d924f608003528c4","55cd13fca15ad619004af398"],"sync":{"url":"","isSync":false},"reference":false,"createdAt":"2014-10-14T17:30:16.009Z","from_sync":false,"order":3,"slug":"platform-integrations","title":"Platform Integrations"},"user":"543c844ae443e3080085b32b","version":{"_id":"543c845ee443e3080085b330","project":"543c845ee443e3080085b32d","__v":6,"createdAt":"2014-10-14T02:03:10.835Z","releaseDate":"2014-10-14T02:03:10.835Z","categories":["543c845ee443e3080085b331","543c8794ea519d0800c91164","543d2918a22ffb0800a7af90","543d5da831ca981a00a6fead","543ecfc115d0560800502706","546165ea92398320003c7c79"],"is_deprecated":false,"is_hidden":false,"is_beta":false,"is_stable":true,"codename":"","version_clean":"1.0.0","version":"1.0"},"__v":6,"is_link":false,"project":"543c845ee443e3080085b32d","updates":[],"next":{"pages":[],"description":""},"createdAt":"2014-10-15T18:30:37.045Z","link_external":false,"link_url":"","githubsync":"","sync_unique":"","hidden":false,"api":{"basic_auth":false,"results":{"codes":[]},"settings":"","try":true,"auth":"never","params":[],"url":""},"isReference":false,"order":3,"body":"[block:callout]\n{\n  \"type\": \"danger\",\n  \"body\": \"Please visit [http://vs.elevio.help/](http://vs.elevio.help/) for our updated documentation.\",\n  \"title\": \"This documentation has been depreciated.\"\n}\n[/block]\n\n[block:html]\n{\n  \"html\": \"Skip to a section:\\n<br>\\n<a href=\\\"#full\\\">Full Page</a>\\n/\\n<a href=\\\"#widget\\\">Widget</a>\\n/\\n<a href=\\\"#popup\\\">Popup</a>\\n/\\n<a href=\\\"#lightbox\\\">Lightbox</a>\"\n}\n[/block]\n\n[block:html]\n{\n  \"html\": \"<a name=\\\"full\\\"></a>\"\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Integrate the full page style\"\n}\n[/block]\nThese steps will show you how to integrate the full page giveaway style into your Shopify store.\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"1) Add a new page\"\n}\n[/block]\nNavigate to your Shopify dashboard, and click the 'Pages' tab from the menu.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/sZ3jZdKSQCiOlQAOVBcm_shopify-dashboard.jpg\",\n        \"shopify-dashboard.jpg\",\n        \"750\",\n        \"515\",\n        \"#f40406\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\nClick the Add Page button. Under ‘Title’ put in a page name. For us, we’re going to name it ‘Sweepstakes’. Once you name it, click the ‘Save’ button. Check out the clip below which shows you the process:\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/Gsw1UvJBSpmL5MKjqXc2_shopify-addpage.gif\",\n        \"shopify-addpage.gif\",\n        \"751\",\n        \"450\",\n        \"#53a3d3\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"2) Add a Template\"\n}\n[/block]\nNavigate to your Shopify dashboard, and click the 'Themes' tab from the menu.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/KOTwu6VfQ56vSdd147td_shopify-themes.jpg\",\n        \"shopify-themes.jpg\",\n        \"750\",\n        \"515\",\n        \"#f00506\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\nNow click on ' Template Editor' and under Templates click 'Add a new template'.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/NnCS8NRXTh6hw8dmtL7W_shopify-templateeditor.jpg\",\n        \"shopify-templateeditor.jpg\",\n        \"750\",\n        \"249\",\n        \"#557182\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\n\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/4h4nEcLSnOT5sbc2etMw_shopify-addtemplate.jpg\",\n        \"shopify-addtemplate.jpg\",\n        \"750\",\n        \"400\",\n        \"#556a82\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\nNext, you'll want to select 'Page' from the drop down menu, and then type in your template name. Click 'Create Template'. Then you'll want to delete everything that shows up in the template box, and replace it with:\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"{%layout none%}\",\n      \"language\": \"html\"\n    }\n  ]\n}\n[/block]\nOnce you do that, go to ViralSweep, copy the code for your full page giveaway and paste it below {%layout none%}. Then click 'Save'. Check out the clip below which shows you the process:\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/jxP8qQWvQTWhTuflJEM9_shopify-addtemplate.gif\",\n        \"shopify-addtemplate.gif\",\n        \"751\",\n        \"450\",\n        \"#51a2d1\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"3) Apply the template\"\n}\n[/block]\nGo back to 'Pages' and click on the page we made earlier (we named ours 'Sweepstakes').\n\nScroll to the bottom of the page and under Template, select the template we just made and click 'Save'.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/XANtuKF2SWCWCsjF0syE_shopify-choosetemplate%20(1).jpg\",\n        \"shopify-choosetemplate (1).jpg\",\n        \"750\",\n        \"400\",\n        \"#ec1510\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"4) You're done!\"\n}\n[/block]\nYou can now click the preview button or you can navigate to the page URL to see your sweepstakes.\n[block:html]\n{\n  \"html\": \"<a name=\\\"widget\\\"></a>\"\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Integrate the widget style\"\n}\n[/block]\nThese steps will show you how to integrate the widget giveaway style into your Shopify store.\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"1) Go to your pages\"\n}\n[/block]\nNavigate to your Shopify dashboard, and click the 'Pages' tab from the menu.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/ECzgjA4JSZ6DjH5oEXTp_shopify-dashboard%20(1).jpg\",\n        \"shopify-dashboard (1).jpg\",\n        \"750\",\n        \"515\",\n        \"#f40406\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\nFrom here you can either edit an existing page, or create an entirely new page. For the purpose of this demo, we're going to create a new page. Click the Add Page button. Under ‘Title’ put in a page name. For us, we’re going to name it ‘Sweepstakes’.\n\nClick the HTML button on the right side of the content editor and paste in the widget code for your giveaway. Click 'Save'.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/DEeCTrhjTKih6CoxC4ak_shopify-addpagewidget.gif\",\n        \"shopify-addpagewidget.gif\",\n        \"751\",\n        \"450\",\n        \"#51a2d2\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"2) You're done!\"\n}\n[/block]\nYou can now click the preview button or you can navigate to the page URL to see your sweepstakes.\n[block:html]\n{\n  \"html\": \"<a name=\\\"popup\\\"></a>\"\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Integrate the popup style\"\n}\n[/block]\nThese steps will show you how to integrate the popup giveaway style into your Shopify store.\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"1) Access your template files\"\n}\n[/block]\nNavigate to your Shopify dashboard, and click the 'Themes' tab from the menu.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/zhANKPEhRDuqtkKjgOmZ_shopify-themes%20(1).jpg\",\n        \"shopify-themes (1).jpg\",\n        \"750\",\n        \"515\",\n        \"#f00506\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\nNow click on ' Template Editor'.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/V3lxWvpHTDWqFyhCOdJa_shopify-templateeditor%20(1).jpg\",\n        \"shopify-templateeditor (1).jpg\",\n        \"750\",\n        \"249\",\n        \"#557182\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\nChoose the template file that you want to edit. For example, if you want to add the popup to just your homepage, you'll want to edit index.liquid. If you want to add the popup to your entire site, you'll want to edit theme.liquid.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/pwXJErWmTmucDo7laoyK_shopify-addpopup.jpg\",\n        \"shopify-addpopup.jpg\",\n        \"750\",\n        \"400\",\n        \"#d8393d\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\nScroll to the bottom of the template file and paste in the code for the popup giveaway. Click 'Save'.\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"2) You're done!\"\n}\n[/block]\nNavigate to your homepage and you should see the sweepstakes in the lower right corner.\n[block:html]\n{\n  \"html\": \"<a name=\\\"lightbox\\\"></a>\"\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Integrate the lightbox style\"\n}\n[/block]\nThese steps will show you how to integrate the lightbox giveaway style into your Shopify store.\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"1) Access your template files\"\n}\n[/block]\nNavigate to your Shopify dashboard, and click the 'Themes' tab from the menu.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/FaM4JQZERLmsdoPgf8sf_shopify-themes%20(1).jpg\",\n        \"shopify-themes (1).jpg\",\n        \"750\",\n        \"515\",\n        \"#f00506\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\nNow click on ' Template Editor'.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/6Glngd9JQLSCjr9yT8cl_shopify-templateeditor%20(1).jpg\",\n        \"shopify-templateeditor (1).jpg\",\n        \"750\",\n        \"249\",\n        \"#557182\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\nChoose the template file that you want to edit. For example, if you want to add the lightbox to just your homepage, you'll want to edit index.liquid. If you want to add the lightbox to your entire site, you'll want to edit theme.liquid.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/yY0bT6vOTr6bUUtIkJsf_shopify-addpopup.jpg\",\n        \"shopify-addpopup.jpg\",\n        \"750\",\n        \"400\",\n        \"#d8393d\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\nScroll to the bottom of the template file and paste in the code for the lightbox giveaway. Click 'Save'.\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"2) You're done!\"\n}\n[/block]\nNavigate to your homepage and you should see the sweepstakes load over your content. Keep in mind, the lightbox functions on cookies, so if you view it once, then close it, it will not display again.\n[block:callout]\n{\n  \"type\": \"info\",\n  \"title\": \"Any questions? We're here to help\",\n  \"body\": \"You can reach us at help:::at:::viralsweep.com or talk to us on live chat if we are available.\"\n}\n[/block]","excerpt":"This documentation will show you how to take any ViralSweep giveaway style and integrate it into your Shopify store.","slug":"shopify","type":"basic","title":"Shopify"}

Shopify

This documentation will show you how to take any ViralSweep giveaway style and integrate it into your Shopify store.

[block:callout] { "type": "danger", "body": "Please visit [http://vs.elevio.help/](http://vs.elevio.help/) for our updated documentation.", "title": "This documentation has been depreciated." } [/block] [block:html] { "html": "Skip to a section:\n<br>\n<a href=\"#full\">Full Page</a>\n/\n<a href=\"#widget\">Widget</a>\n/\n<a href=\"#popup\">Popup</a>\n/\n<a href=\"#lightbox\">Lightbox</a>" } [/block] [block:html] { "html": "<a name=\"full\"></a>" } [/block] [block:api-header] { "type": "basic", "title": "Integrate the full page style" } [/block] These steps will show you how to integrate the full page giveaway style into your Shopify store. [block:api-header] { "type": "basic", "title": "1) Add a new page" } [/block] Navigate to your Shopify dashboard, and click the 'Pages' tab from the menu. [block:image] { "images": [ { "image": [ "https://files.readme.io/sZ3jZdKSQCiOlQAOVBcm_shopify-dashboard.jpg", "shopify-dashboard.jpg", "750", "515", "#f40406", "" ] } ] } [/block] Click the Add Page button. Under ‘Title’ put in a page name. For us, we’re going to name it ‘Sweepstakes’. Once you name it, click the ‘Save’ button. Check out the clip below which shows you the process: [block:image] { "images": [ { "image": [ "https://files.readme.io/Gsw1UvJBSpmL5MKjqXc2_shopify-addpage.gif", "shopify-addpage.gif", "751", "450", "#53a3d3", "" ] } ] } [/block] [block:api-header] { "type": "basic", "title": "2) Add a Template" } [/block] Navigate to your Shopify dashboard, and click the 'Themes' tab from the menu. [block:image] { "images": [ { "image": [ "https://files.readme.io/KOTwu6VfQ56vSdd147td_shopify-themes.jpg", "shopify-themes.jpg", "750", "515", "#f00506", "" ] } ] } [/block] Now click on ' Template Editor' and under Templates click 'Add a new template'. [block:image] { "images": [ { "image": [ "https://files.readme.io/NnCS8NRXTh6hw8dmtL7W_shopify-templateeditor.jpg", "shopify-templateeditor.jpg", "750", "249", "#557182", "" ] } ] } [/block] [block:image] { "images": [ { "image": [ "https://files.readme.io/4h4nEcLSnOT5sbc2etMw_shopify-addtemplate.jpg", "shopify-addtemplate.jpg", "750", "400", "#556a82", "" ] } ] } [/block] Next, you'll want to select 'Page' from the drop down menu, and then type in your template name. Click 'Create Template'. Then you'll want to delete everything that shows up in the template box, and replace it with: [block:code] { "codes": [ { "code": "{%layout none%}", "language": "html" } ] } [/block] Once you do that, go to ViralSweep, copy the code for your full page giveaway and paste it below {%layout none%}. Then click 'Save'. Check out the clip below which shows you the process: [block:image] { "images": [ { "image": [ "https://files.readme.io/jxP8qQWvQTWhTuflJEM9_shopify-addtemplate.gif", "shopify-addtemplate.gif", "751", "450", "#51a2d1", "" ] } ] } [/block] [block:api-header] { "type": "basic", "title": "3) Apply the template" } [/block] Go back to 'Pages' and click on the page we made earlier (we named ours 'Sweepstakes'). Scroll to the bottom of the page and under Template, select the template we just made and click 'Save'. [block:image] { "images": [ { "image": [ "https://files.readme.io/XANtuKF2SWCWCsjF0syE_shopify-choosetemplate%20(1).jpg", "shopify-choosetemplate (1).jpg", "750", "400", "#ec1510", "" ] } ] } [/block] [block:api-header] { "type": "basic", "title": "4) You're done!" } [/block] You can now click the preview button or you can navigate to the page URL to see your sweepstakes. [block:html] { "html": "<a name=\"widget\"></a>" } [/block] [block:api-header] { "type": "basic", "title": "Integrate the widget style" } [/block] These steps will show you how to integrate the widget giveaway style into your Shopify store. [block:api-header] { "type": "basic", "title": "1) Go to your pages" } [/block] Navigate to your Shopify dashboard, and click the 'Pages' tab from the menu. [block:image] { "images": [ { "image": [ "https://files.readme.io/ECzgjA4JSZ6DjH5oEXTp_shopify-dashboard%20(1).jpg", "shopify-dashboard (1).jpg", "750", "515", "#f40406", "" ] } ] } [/block] From here you can either edit an existing page, or create an entirely new page. For the purpose of this demo, we're going to create a new page. Click the Add Page button. Under ‘Title’ put in a page name. For us, we’re going to name it ‘Sweepstakes’. Click the HTML button on the right side of the content editor and paste in the widget code for your giveaway. Click 'Save'. [block:image] { "images": [ { "image": [ "https://files.readme.io/DEeCTrhjTKih6CoxC4ak_shopify-addpagewidget.gif", "shopify-addpagewidget.gif", "751", "450", "#51a2d2", "" ] } ] } [/block] [block:api-header] { "type": "basic", "title": "2) You're done!" } [/block] You can now click the preview button or you can navigate to the page URL to see your sweepstakes. [block:html] { "html": "<a name=\"popup\"></a>" } [/block] [block:api-header] { "type": "basic", "title": "Integrate the popup style" } [/block] These steps will show you how to integrate the popup giveaway style into your Shopify store. [block:api-header] { "type": "basic", "title": "1) Access your template files" } [/block] Navigate to your Shopify dashboard, and click the 'Themes' tab from the menu. [block:image] { "images": [ { "image": [ "https://files.readme.io/zhANKPEhRDuqtkKjgOmZ_shopify-themes%20(1).jpg", "shopify-themes (1).jpg", "750", "515", "#f00506", "" ] } ] } [/block] Now click on ' Template Editor'. [block:image] { "images": [ { "image": [ "https://files.readme.io/V3lxWvpHTDWqFyhCOdJa_shopify-templateeditor%20(1).jpg", "shopify-templateeditor (1).jpg", "750", "249", "#557182", "" ] } ] } [/block] Choose the template file that you want to edit. For example, if you want to add the popup to just your homepage, you'll want to edit index.liquid. If you want to add the popup to your entire site, you'll want to edit theme.liquid. [block:image] { "images": [ { "image": [ "https://files.readme.io/pwXJErWmTmucDo7laoyK_shopify-addpopup.jpg", "shopify-addpopup.jpg", "750", "400", "#d8393d", "" ] } ] } [/block] Scroll to the bottom of the template file and paste in the code for the popup giveaway. Click 'Save'. [block:api-header] { "type": "basic", "title": "2) You're done!" } [/block] Navigate to your homepage and you should see the sweepstakes in the lower right corner. [block:html] { "html": "<a name=\"lightbox\"></a>" } [/block] [block:api-header] { "type": "basic", "title": "Integrate the lightbox style" } [/block] These steps will show you how to integrate the lightbox giveaway style into your Shopify store. [block:api-header] { "type": "basic", "title": "1) Access your template files" } [/block] Navigate to your Shopify dashboard, and click the 'Themes' tab from the menu. [block:image] { "images": [ { "image": [ "https://files.readme.io/FaM4JQZERLmsdoPgf8sf_shopify-themes%20(1).jpg", "shopify-themes (1).jpg", "750", "515", "#f00506", "" ] } ] } [/block] Now click on ' Template Editor'. [block:image] { "images": [ { "image": [ "https://files.readme.io/6Glngd9JQLSCjr9yT8cl_shopify-templateeditor%20(1).jpg", "shopify-templateeditor (1).jpg", "750", "249", "#557182", "" ] } ] } [/block] Choose the template file that you want to edit. For example, if you want to add the lightbox to just your homepage, you'll want to edit index.liquid. If you want to add the lightbox to your entire site, you'll want to edit theme.liquid. [block:image] { "images": [ { "image": [ "https://files.readme.io/yY0bT6vOTr6bUUtIkJsf_shopify-addpopup.jpg", "shopify-addpopup.jpg", "750", "400", "#d8393d", "" ] } ] } [/block] Scroll to the bottom of the template file and paste in the code for the lightbox giveaway. Click 'Save'. [block:api-header] { "type": "basic", "title": "2) You're done!" } [/block] Navigate to your homepage and you should see the sweepstakes load over your content. Keep in mind, the lightbox functions on cookies, so if you view it once, then close it, it will not display again. [block:callout] { "type": "info", "title": "Any questions? We're here to help", "body": "You can reach us at help@viralsweep.com or talk to us on live chat if we are available." } [/block]