I am attempting to modify a specific route/template in my Shopify theme, however nothing from examples I have seen or the documentation seems to take.
Currently I have created a page in the Shopify Admin team which is auto assigned to the route /pages/team-page.
In my templates directory I have tried creating different variations as to assign it a custom section such as
team.json
team_page.json
page.team.json
page.team_page.json
And within those json files referenced to my sections directory liquid file custom.liquid with the following:
{
"sections": {
"custom": {
"type": "custom",
"settings": {}
},
"order": [ "custom" ]
}
But to no avail it always references back to the template index.json which renders main.liquid from sections.
Attempting to print out the page.handle returns team-page, while page.template_suffx seems to return nothing.
Related
This link here mentions how to access translations for your app blocks but the example doesn't seem to work and seems to be for regular sections instead of app blocks:
https://shopify.dev/themes/architecture/sections/section-schema#locales
My locales section looks like the following:
"locales": {
"en": {
"title": "Slideshow"
},
"fr": {
"title": "Diaporama"
}
}
I've tried a bunch of different permutations using the name of my section and the name of the file but nothing works. According to the documentation the below should work:
sections.[section-name].[translation-description]
I've also tried the two below which both don't work:
blocks.[section-name].[translation-description]
block.[section-name].[translation-description]
Something tells me I'm doing something wrong or Shopify's documentation is lacking.
Any help on this would be much appreciated!
You can check Shopify's example theme extension app https://github.com/Shopify/product-reviews-sample-app/tree/main/theme-app-extension/locales
basically, you need this format
{ "blocks": { "average-rating": { "name": "Average Review Score",
"settings": { "stars_fill_color": {
"label": "Stars color" }
} } }}
for accesing a label you should do "t:blocks.average-rating.settings.stars_fill_color.label"
In Page Builder I've added a page called About Us which has the url '/about-us/'
I've been following the instructions found here
https://developer.bigcommerce.com/stencil-docs/storefront-customization/custom-templates
in order to make a custom template for that page.
I made a file called about-us.html in templates/pages/custom/page with the contents:
<h1>About Us Page Test</h1>
My .stencil file looks like the following
{
"normalStoreUrl": "my url",
"accessToken": "my access token",
"port": "3003",
"customLayouts": {
"brand": {},
"category": {},
"page": {
"about-us.html": "/about-us/"
},
"product": {}
}
}
I've stopped and reran 'stencil start' but every time I visit localhost:3003/about-us/ it just shows the normal page instead of the custom template I build.
Is there something I'm missing? Is this an issue with using the page builder in combination with stencil?
I assume you haven't set the custom template for your page yet.
Go to Web Pages and edit your About Us page then look for the Template Layout File dropdown. Your custom template should appear there if it is setup correctly.
The issue was resolved when a full system reboot was performed. I'm not sure why stopping and restarting stencil did not resolve this.
We have a bunch of disassociated product images in our Shopify store that support could not re-associate. I set up a Postman collection runner to update all these missing images, and it seems to be working in our test environment....
Except, the API call is replacing the default product image with a new image rather than adding the image. I'm using a standard PUT request to the API using the example in their API docs:
PUT /admin/api/2019-04/products/#{product_id}.json
{
"product": {
"id": 632910392,
"images": [
{
"src": "http://example.com/rails_logo.gif"
}
]
}
}
I get that it's an array I'm sending in, so I'm thinking it's overwriting the array each time rather than adding a new element. I tried using a single element variable of "image" in the JSON but that didn't work.
Any ideas?
If you want to add the image use ProductImage resource instead of Product resource.
Product Image Documentation
POST /admin/api/2019-04/products/#{product_id}/images.json
{
"image": {
"src": "http://example.com/rails_logo.gif"
}
}
I have an ecommerce site, and I'm trying to create a "Lookbook" template. I want my client to be able to create a new lookbook (just as a simple page with a template of "page.lookbook" or similar), then be able to go into the page admin and select and upload images, links, descriptions etc.
So far I have:
page.lookbook.liquid -> calls in the section, lookbook-template.liquid
lookbook-template.liquid has an HTML template
It also has this schema:
{% schema %}
{
"name": "Lookbook",
"blocks": [
{
"type": "Image",
"name": "Lookbook image",
"settings":[
{
"type": "image_picker",
"id": "img",
"label": "Image"
},
{
"type": "text",
"id": "description",
"label": "Description",
"default": "<p>You can write <em>html</em> in here!</p>"
}
]
}
]
}
{% endschema %}
This way, my client can use the simple admin tools to add a new image block. Very nice!
However, this method means that every single lookbook gets the SAME image data as whatever I apply to the lookbook-template.liquid, and this isn't ideal at all.
What am I doing wrong here, and what's the right solution? I want one template that the client choose to attach to a page, and then for each template to have a unique set of images, links and descriptions that the client creates.
Unfortunately, section won't work to get some different content for each page with lookbook.page template.
A solution would be to install (or create) an app to manage metafields attached to pages. Then you can use metafields in your template.
Metafields is a way to add some extra fields in database:
https://help.shopify.com/themes/liquid/objects/metafield
I have implemented Universal links in iOS app. It works perfectly when I put the url in external app such as "Notes" and then tap it. It opens the app.
What I want to achieve is that when someone visits a specific url of my webpage, the ios app should be launched by itself. So in order to accomplish this, I have put:
applinks:www.mydomain.com
in my entitlements.
And the following in my "apple-app-site-association" file
{
"applinks":
{
"apps": [ ],
"details":
[
{
"appID": "team_id.com.teamname.app_name",
"paths": ["/path-CompA/path-CompB/"]
}
]
}
}
But When I navigate through my website, and I reach the path mentioned in json file, it only shows the bar at top of web page saying "Open in App_name" with "Open" button on right side.
I want to know if its the default behaviour of Universal links to not open the app if user is coming from the same domain? If its not the case then how does it open the app form "Notes".
Please note that my json file is not signed but I have put it on my website which is on https.
Thanks,
A couple of things. Can you try changing your apple-app-site-association file code as such?
{
"applinks": {
"apps": [],
"details": [
{
"appID": "team_id.com.teamname.app_name",
"paths": [
"*",
"/"
]
}
]
}
}
You can check your format with this validation tool: https://search.developer.apple.com/appsearch-validation-tool/
The answer is that basically, this behavior is expected as of iOS9.2, with Universal links. Universal links only work from a different domain.
With Branch (https://branch.io/), you can use one domain for links (bnc.lt), so that when you (as a developer using branch) host universal links on your site, they still operate as expected.
Also, for universal links from other domains (not to the same domain), you can 'unbreak' the safari redirect behavior by long-pressing on the link from an application and choosing 'Open in «App»'. I hope this helps!