So I've got an enterprise store and I'm building a stencil template, and I've run into a roadblock with the product filters...
How do I show more than 15 items in the product filters? I've tried removing the {{#if show_more_toggle}} code from components/faceted-search/facets/multi.html, but all that does is make the Show More label appear; it doesn't actually do anything when clicked.
Either I'm missing something significant, or Stencil doesn't yet support showing more than 15 filters. Either way, a pointer in the right direction would be appreciated.
This feature has been extended in blueprint themes, but Stencil is still limited to 15 items. This will be raised with the Stencil Project Manager.
Related
Which ways are possible to edit the live preview of the product page in Shopify with Inputboxes next to it?
Let's say the product is a poster, and i want to add a custom text on it.
When typing into the inputbox the text changes in real time on the product.
Can this be implemented in the shopify code with the basic version of shopify?
Or does this necessarily needs an app?
ADDITIONALLY:
Let me go a bit deeper. I have a code that can generate a QR code.
Now i want that the QR code to be previewed in the product. Now position and color of the QR code is different from any product. Would that need an app?
Yes you can to an extent.
First the ground rules:
You can't modify the product from the front-end and update the content or media in the back-end - this would be a huge security hole
The changes applied to the product will be visible only to the user who changed them
The solution is to use Javascript and update the content of the front-end. If you like to store the changes for that specific user you can save them as cookie or localstorage.
If you like to share this change to other people you will need to add a custom parameter in the URL of the page and generate the content from it and share that url.
Each one of these steps will require some custom Javascript that will affect only the user in question, if you like to modify the product in the back-end directly you will need some kind of an app for this.
On my mind it can be done if the dynamic text is applied over product image.
Detailed code would be too long to write here but here are the steps:
Add an input to your product form to add a custom property (https://community.shopify.com/c/Shopify-Design/Product-pages-Get-customization-information-for-products/td-p/616503)
Write a Javascript function to get input value in real time
Use this value to display it in a div in product image container
Position this div in CSS as absolute and style it as you wish
While image container position should be set as relative in CSS
HTH
I am trying to write a Shopify application and I want to add a section to the product page when the store owner installed my app. I tried this by adding a custom script tag in the shop template and this tag will load and inject my desired HTML into the page. It's work but it needs to force the store owner to change the product page template and its not user-friendly.
I see some apps in the Shopify app store that can change the product page after you install them without needs add any part to the product page template. How they do this work? I can't find the correct way in the Shopify documents.
You can change the Shopify theme of the shop using The API for Assets:
However as drip mentioned this is not a good idea:
If you change the theme auto-magically via code, you are looking for trouble. A lot of things can go wrong - simply you cannot cater for all themes and their changes over time! So you could possibly leave a broken page after the change. The e-shop owner won't be impressed! Actually a lot of the 1* reviews of apps are for that reason!
What would happen if the eshop owner removes your app? He won't know what code to remove.
So, most apps ask the user to add the app code. They provide detailed instructions of course.
Fyi, another problematic approach is the following:
Some apps may attempt to change the DOM "on the fly", by first locating an existing DOM element (a lot of theme-specific if statements to do that with any degree of success) and, then insert the app's DOM elements.
That's very messy and problematic as well, but at least you do not risk ruining the owner's theme files. In the worst case he can uninstall your app and he 'll be ok.
I am developing a custom theme for a client, and the client has asked for a customizable, user-facing product "creation" form, similar in form and function to this pretty nice example from Ollie.
My problem is two-fold:
How to implement this in the BigCommerce dashboard Products section?
How to then go about building this with Stencil?
My initial thoughts are:
How to implement this in the BigCommerce dashboard Products section?
This seems pretty straightforward to me, though I am new to BigCommerce. I am imagining creating a single "Customized Kit" product with an option set containing the different variants that can arise from the customization process.
How to then go about building this with Stencil?
Here is where I'm a bit more muddy due to my lack of experience with BigCommerce and the Stencil structure. My first guess is: I create a custom form component that exposes the "Customized Kit" Product object to the context and then, on "Add Kit to Cart" click, somehow matches the attributes the user just laid out with the closest product variant. From there, however, I am unclear on the specific components that may need to be extended, which event hooks may need to be called, and how to link the whole thing into the "Add to Cart" functionality (I'm guessing I just create a separate add-customized-to-cart.html template).
Thanks, and for reference I am extending the latest Cornerstone theme (2.2.1-rc.2).
I am trying to display recently viewed items in a Stencil theme, but am not able to get the data on the page. I am calling the following Front Matter attribute marked as global (available on all pages) here.
Stencil Docs example
recently_viewed: null Boolean indicating whether to display recently viewed products. No filtering available.
https://stencil.bigcommerce.com/docs/front-matter-variables
recently_viewed: true
When I inspect the JSON on the page by appending '/?debug=context' to my URL, there is no data containing recently viewed items.
Has anyone else successfully displayed recently viewed items on a page in stencil?
Thanks.
This feature is currently only working for logged in customers. If you are seeing this behave abnormally from that, please let us know. It does not have feature parity with Blueprint themes' sideproductrecentlyviewed.
I've recently been working on a new Wordpress site using the WooCommerce and official Woocommerce Variable Product Swatches plugin.
My issue is that the product variation swatches have stopped working on their own. Here's a page for an example: http://butterlane.com/butterlanedev/product/cupcake/
The image swatches lined up along the top should switch the product image when clicked. Everything was working fine before but now the swatches are greyed out and i can see in the CSS that they've been switched to a .disabled class
I've tried creating a brand new product with brand new variations and the page still won't let me click on any of the swatches. I'm truly at a loss as to how this could have stopped working on its own. Hopefully someone with experience using the WooCommerce Variable Product Swatches plugin can help me figure out whats going on.
Thanks in advance for any help.
Try to turn off your swatches plugin and see if there are still "disabled" classes in the select dropdown list for your variations in the single product view page. If the class is still there then the plugin works how it should.
The variations are disabled if there are no more stocks in the inventory or is not available for purchase. Check your variable products for their stock quantity and price in each variation.
i believe there's a conflict in what the new Woocommerce (2.05) and what the last version of the plugin are meant to do with the other variation images once one has been selected. I'm guessing that the variation plugin uses one of the same trigger ID's in it's javascript as something else WooCommerce has chosen to use (there are only so many logical names for these things).
At this time it basically kills the ability to buy any of the products with variations... which is 'less than useful', for the moment I suggest turning off the plugin and using the default select list, which while ugly at least allows selection.
Waiting for this to get sorted out myself... and since WooThemes have decided to host on the slowest servers on the planet, I can't actually view their website to check the latest version of the plugin.
I guess i'll be pinging them on twitter.