https://github.com/obrien-k/react-stencil-mod

https://github.com/obrien-k/react-stencil-mod

Last synced: 12 days ago
JSON representation

• Host: GitHub
• URL: https://github.com/obrien-k/react-stencil-mod
• Owner: obrien-k
• License: mit
• Created: 2020-06-19T04:57:21.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2022-01-22T12:46:07.000Z (almost 3 years ago)
• Last Synced: 2024-10-12T07:22:17.485Z (27 days ago)
• Language: HTML
• Size: 35.6 MB
• Stars: 1
• Watchers: 1
• Forks: 2
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • Contributing: CONTRIBUTING.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        
# Cornerstone

This modification of [BigCommerce's](https://github.com/bigcommerce/) [Cornerstone](https://github.com/bigcommerce/cornerstone) theme includes a custom product page called "multi-layout" which uses a minified version of [product-view.html](https://github.com/bigcommerce/cornerstone/blob/master/templates/components/products/product-view.html). It displays a "Combo to Cart" button for placeholder product IDs to all be added to the cart. It utilizes BigCommerce's Storefront Cart and GraphQL APIs, as well as additional custom JS and CSS.

Modified theme files:

```

- /assets

  - /js

   - app.js*

   - /theme

    - custom.js*

  - /scss

   - multi-layout.scss*

   - theme.scss*

- /templates

 - /components

  - /custom*

   - multi-button.html*

   - multi-view.html*

 - /pages

  - /custom*

   - multi-layout.html*

```

To apply this to a product on your store you'll need to include the custom field "is_bundled" with a value of true, as well as "foo" with the value for any Product ID you want added to cart and displayed on the page. Apply the "multi-layout.html" custom template to that product, and the changes should be seen on your storefront.

This repository was created for the article, ["Using Storefront APIs to Create Custom Product Display Page Experiences"](https://medium.com/bigcommerce-developer-blog/using-bigcommerce-storefront-apis-to-create-custom-product-display-page-experiences-72ed3fbf7b23).