{"_id":"5b688e752f9e8700034a6dfc","project":"55a6e72e8cc73e0d00096635","version":{"_id":"55a6e72f8cc73e0d00096638","project":"55a6e72e8cc73e0d00096635","hasReference":false,"__v":30,"hasDoc":true,"createdAt":"2015-07-15T23:05:19.125Z","releaseDate":"2015-07-15T23:05:19.125Z","categories":["55a6e7308cc73e0d00096639","55b7ed07aea7c8190058badb","5604567c0c78b00d0039b191","5605e6f23a93940d002b3e4a","5605f2bba4574a0d00811365","5605f309a4574a0d00811366","5608e3b98aedf50d0004cf8f","5608e4318aedf50d0004cf90","5608e6b5a7cc2f0d00d9754d","5608e6d331beb60d001b6560","5608f879a7cc2f0d00d97580","560b097887b71d0d000d3bd9","560b13cbafa0990d00979545","560b5cbec341310d00de2a01","560b5cd0c341310d00de2a02","566a35b81e08750d00a0c49b","566a3e8503b4b20d00d02a4a","567889d307bf6a0d0083edc8","569c8b7c15bb390d00db6f9d","56b254dc65ddf50d0076ba8f","57a8ebc4cdeea20e001d2a63","57e48a4000c8680e00fae6e7","5808216773557d0f00a1e428","58105ad54a8aa50f00aa4cba","58105bf298aea40f00afa3ba","58105f548a4aed0f00d67536","581061b898aea40f00afa3be","584b3de7e5f3a42300df6ef7","596839a75965d400155bb750","5b195f920059c20003083ad6"],"is_deprecated":false,"is_hidden":false,"is_beta":false,"is_stable":true,"codename":"","version_clean":"1.0.0","version":"1.0"},"category":{"_id":"560b5cbec341310d00de2a01","pages":["560b5d0b3616ac17004f1c99","560b5d405148ba0d009bd0c9","560b5d62af40a70d003df332","560b5d953bcbd80d0077d0fd","560b5fa83616ac17004f1c9d","569c8c15d326c80d0068f7b7","56d37d35d3f4650b007495ea","56d4ed5f8001e30b0089700c"],"__v":8,"project":"55a6e72e8cc73e0d00096635","version":"55a6e72f8cc73e0d00096638","sync":{"url":"","isSync":false},"reference":false,"createdAt":"2015-09-30T03:53:34.449Z","from_sync":false,"order":14,"slug":"templates-required-directory","title":"Templates Reference"},"user":"5ab9ae5220abcc00499b2be4","githubsync":"","__v":0,"parentDoc":null,"updates":[],"next":{"pages":[],"description":""},"createdAt":"2018-08-06T18:07:49.327Z","link_external":false,"link_url":"","sync_unique":"","hidden":false,"api":{"results":{"codes":[]},"settings":"","auth":"required","params":[],"url":""},"isReference":false,"order":4,"body":"Stencil themes have the ability to integrate with [Disqus](https://disqus.com/), a third party commenting system that allows users to leave blog comments on blog posts made with the [Built-In Blog](https://support.bigcommerce.com/articles/Public/Stencil-Themes#limits). Disqus can also be used with on Stencil product pages to allow comment and review threads on individual products.\n\n## Integrating Disqus with your Stencil blog\n\nTo use Disqus blog comments in Stencil, follow the steps below:\n\n1. Log in to your BigCommerce Control Panel\n2. Navigate to Storefront Design > My Themes\n3. Open [Edit Theme Files](https://support.bigcommerce.com/articles/Public/Stencil-Themes#limits) for your theme\n4. Navigate to Templates > Pages > [blog-post.html](https://github.com/bigcommerce/cornerstone/blob/master/templates/pages/blog-post.html)\n5. Paste your [Disqus Universal Code](https://bcnik.disqus.com/admin/universalcode/) before the closing {{/partial}} tag\n6. Save your files\n7. Apply your theme\n\n## Integrating Disqus with your Stencil Product Pages\n\n1. Log in to your BigCommerce Control Panel\n2. Navigate to Storefront Design > My Themes\n3. Open [Edit Theme Files](https://support.bigcommerce.com/articles/Public/Stencil-Themes#limits) for your theme\n4. Navigate to Templates > Pages > [product.html](https://github.com/bigcommerce/cornerstone/blob/master/templates/pages/product.html)\n5. Paste your [Disqus Universal Code](https://bcnik.disqus.com/admin/universalcode/) before the closing {{/partial}} tag\n6. In the Disqus Universal Code that you have posted, there is a function that reads like below:\n\n```\n var disqus_config = function () {\n        this.page.url = PAGE_URL;  // Replace PAGE_URL with your page's canonical URL variable\n        this.page.identifier = PAGE_IDENTIFIER; // Replace PAGE_IDENTIFIER with your page's unique identifier variable\n    };\n```\n \nChange the value of `this.page.url` to be `'product.url';`, and the value of `this.page.identifier` to be `'product.id';` so that the function now reads like below:\n\n\n```\nvar disqus_config = function () {\n        this.page.url = product.url;\n        this.page.identifier = product.id;\n    };\n```\n\n6. Save your files\n7. Apply your theme\n\n\n## Additional Resources\n[Enabling Disqus for Product Reviews (Blueprint)](https://forum.bigcommerce.com/s/article/How-do-I-enable-Disqus-as-my-Comment-Service#get-code)\n[Using Disqus for Blog Comments](https://forum.bigcommerce.com/s/article/Using-Disqus-Comments)","excerpt":"Allow users to add Comments on your ECommerce Blog and Product Pages","slug":"using-stencil-with-disqus","type":"basic","title":"Integrating Disqus into Your Stencil Theme"}

Integrating Disqus into Your Stencil Theme

Allow users to add Comments on your ECommerce Blog and Product Pages

Stencil themes have the ability to integrate with [Disqus](https://disqus.com/), a third party commenting system that allows users to leave blog comments on blog posts made with the [Built-In Blog](https://support.bigcommerce.com/articles/Public/Stencil-Themes#limits). Disqus can also be used with on Stencil product pages to allow comment and review threads on individual products. ## Integrating Disqus with your Stencil blog To use Disqus blog comments in Stencil, follow the steps below: 1. Log in to your BigCommerce Control Panel 2. Navigate to Storefront Design > My Themes 3. Open [Edit Theme Files](https://support.bigcommerce.com/articles/Public/Stencil-Themes#limits) for your theme 4. Navigate to Templates > Pages > [blog-post.html](https://github.com/bigcommerce/cornerstone/blob/master/templates/pages/blog-post.html) 5. Paste your [Disqus Universal Code](https://bcnik.disqus.com/admin/universalcode/) before the closing {{/partial}} tag 6. Save your files 7. Apply your theme ## Integrating Disqus with your Stencil Product Pages 1. Log in to your BigCommerce Control Panel 2. Navigate to Storefront Design > My Themes 3. Open [Edit Theme Files](https://support.bigcommerce.com/articles/Public/Stencil-Themes#limits) for your theme 4. Navigate to Templates > Pages > [product.html](https://github.com/bigcommerce/cornerstone/blob/master/templates/pages/product.html) 5. Paste your [Disqus Universal Code](https://bcnik.disqus.com/admin/universalcode/) before the closing {{/partial}} tag 6. In the Disqus Universal Code that you have posted, there is a function that reads like below: ``` var disqus_config = function () { this.page.url = PAGE_URL; // Replace PAGE_URL with your page's canonical URL variable this.page.identifier = PAGE_IDENTIFIER; // Replace PAGE_IDENTIFIER with your page's unique identifier variable }; ``` Change the value of `this.page.url` to be `'product.url';`, and the value of `this.page.identifier` to be `'product.id';` so that the function now reads like below: ``` var disqus_config = function () { this.page.url = product.url; this.page.identifier = product.id; }; ``` 6. Save your files 7. Apply your theme ## Additional Resources [Enabling Disqus for Product Reviews (Blueprint)](https://forum.bigcommerce.com/s/article/How-do-I-enable-Disqus-as-my-Comment-Service#get-code) [Using Disqus for Blog Comments](https://forum.bigcommerce.com/s/article/Using-Disqus-Comments)