public:apps:preorder:manual_installation
Differences
This shows you the differences between two versions of the page.
| Both sides previous revision Previous revision Next revision | Previous revision | ||
|
public:apps:preorder:manual_installation [04.02.19 в 17:54] Максим Дубинин |
public:apps:preorder:manual_installation [17.03.22 в 04:29] (current) Дария Тяжлова |
||
|---|---|---|---|
| Line 1: | Line 1: | ||
| + | ====== Manual installation ====== | ||
| + | 1. Add a snippet //"simple-preorder-bootstrap.liquid"// with next code: | ||
| + | |||
| + | <code> | ||
| + | <style id="simple_preorder_style"></style> | ||
| + | <script> | ||
| + | // Bootstrap for Simple Preorder app | ||
| + | var SimplePreorderBootstrap = { | ||
| + | "page": {{ template | json }}, | ||
| + | "product": { | ||
| + | "id": {{ product.id | json }}, | ||
| + | "title": {{ product.title | json }}, | ||
| + | "variants": [ | ||
| + | {% for variant in product.variants %} | ||
| + | { | ||
| + | "id": {{variant.id}}, | ||
| + | "inventory_quantity": '{{variant.inventory_quantity}}', | ||
| + | "inventory_management": '{{variant.inventory_management}}', | ||
| + | "inventory_policy": '{{variant.inventory_policy}}' | ||
| + | }, | ||
| + | {% endfor %} | ||
| + | ] | ||
| + | }, | ||
| + | "cart": { | ||
| + | "items": [ | ||
| + | {% for item in cart.items %} | ||
| + | { | ||
| + | "variant_id": {{item.variant.id}}, | ||
| + | "product_id": {{item.product.id}}, | ||
| + | "quantity": {{item.quantity}}, | ||
| + | "inventory_quantity": '{{item.variant.inventory_quantity}}', | ||
| + | "inventory_management": '{{item.variant.inventory_management}}', | ||
| + | "inventory_policy": '{{item.variant.inventory_policy}}', | ||
| + | "properties": {{ item.properties | json }} | ||
| + | }, | ||
| + | {% endfor %} | ||
| + | ] | ||
| + | }, | ||
| + | // "startupDelay": 100, | ||
| + | // "productFormSelector": '/cart/add', | ||
| + | // "productSelector": 'form[action="/cart/add"] [type="submit"]', | ||
| + | // "variantsSelector": 'form[action="/cart/add"] .variants-selector', | ||
| + | // "nativeVariantsSelector": 'form[action="/cart"] [name^="id"]', | ||
| + | // "checkoutSelector": 'form[action="/cart"] [type="submit"][name="checkout"]', | ||
| + | // "updateSelector": 'form[action="/cart"] [type="submit"][name="update"]', | ||
| + | // "updateInputsSelector": 'form[action="/cart"] [name^="updates["]', | ||
| + | // "preorderBadgeContainerSelector": '.product-item__image-wrapper', | ||
| + | // "updateInputsSelector": 'input[name="quantity"]', | ||
| + | // "debug": true, | ||
| + | }; | ||
| + | </script> | ||
| + | |||
| + | <script id="kad-preorder-config-loader"> | ||
| + | (() => { | ||
| + | try { | ||
| + | function loadPersonalConfig() { | ||
| + | let personalConfig = localStorage.getItem('SimplePreorderBootstrap') | ||
| + | if (typeof personalConfig === 'string') { | ||
| + | return JSON.parse(personalConfig) | ||
| + | } | ||
| + | } | ||
| + | |||
| + | function savePersonalConfig(config) { | ||
| + | localStorage.setItem('SimplePreorderBootstrap', JSON.stringify(config, null, 2)) | ||
| + | } | ||
| + | |||
| + | function isDevParamSpecified() { | ||
| + | return new URLSearchParams(window.location.search).get('kad-dev') !== null | ||
| + | } | ||
| + | |||
| + | let personalConfig = loadPersonalConfig() | ||
| + | |||
| + | if (isDevParamSpecified()) { | ||
| + | personalConfig = personalConfig || {} | ||
| + | personalConfig.dev = true | ||
| + | } | ||
| + | |||
| + | if (personalConfig) { | ||
| + | Object.assign(SimplePreorderBootstrap, personalConfig) | ||
| + | savePersonalConfig(personalConfig) | ||
| + | } | ||
| + | } catch (err) {} | ||
| + | })() | ||
| + | </script> | ||
| + | |||
| + | <script id="kad-preorder-injector"> | ||
| + | (() => { | ||
| + | let lastScript = document.getElementById('kad-preorder-injector') | ||
| + | |||
| + | function injectScript(url, type) { | ||
| + | const script = document.createElement('script') | ||
| + | script.src = url | ||
| + | script.type = type || '' | ||
| + | script.async = false | ||
| + | script.defer = true | ||
| + | lastScript = lastScript.parentNode.insertBefore(script, lastScript.nextSibling) | ||
| + | } | ||
| + | |||
| + | if (SimplePreorderBootstrap.dev && SimplePreorderBootstrap.devScriptUrl) { | ||
| + | injectScript(SimplePreorderBootstrap.devScriptUrl, SimplePreorderBootstrap.devScriptType) | ||
| + | } | ||
| + | |||
| + | if (SimplePreorderBootstrap.dataScriptUrl) { | ||
| + | injectScript(SimplePreorderBootstrap.dataScriptUrl, SimplePreorderBootstrap.dataScriptType) | ||
| + | } | ||
| + | |||
| + | if (SimplePreorderBootstrap.settingsScriptUrl) { | ||
| + | injectScript(SimplePreorderBootstrap.settingsScriptUrl, SimplePreorderBootstrap.settingsScriptType) | ||
| + | } | ||
| + | |||
| + | if (SimplePreorderBootstrap.appScriptUrl) { | ||
| + | injectScript(SimplePreorderBootstrap.appScriptUrl, SimplePreorderBootstrap.appScriptType) | ||
| + | } | ||
| + | })() | ||
| + | </script> | ||
| + | </code> | ||
| + | |||
| + | > **Important:** At the very bottom of the snippet in the last line, replace the text "NAME-OF-YOUR-SHOP" with the address of your store from the address bar of the browser when you are in the admin area of the store (like "//**simple-pre-order-demo-shop**//.myshopify.com", and not, for example, "<del>spo-demo.shop</del>"). | ||
| + | |||
| + | 2. In the theme template //"theme.liquid"// right before the closing tag "</head>" add the code to connect the snippet: | ||
| + | <code> | ||
| + | <!-- Snippet for Simple Preorder app --> | ||
| + | {% include 'simple-preorder-bootstrap' %} | ||
| + | </code> | ||
| + | 3. (Not mandatory) In the snippet adjust the selectors for following buttons: | ||
| + | |||
| + | * productSelector — add to cart button | ||
| + | * variantsSelector — list of variants | ||
| + | * checkoutSelector — checkout button in cart | ||
| + | * updateSelector — update cart button | ||
| + | |||
| + | If this does not work, please write to [[support@kad.systems]] | ||
public/apps/preorder/manual_installation.1549292051.txt.gz · Last modified: 04.02.19 в 17:54 by Максим Дубинин
