Overview
1. Click here to view linked resources.
2. Click here to view all resources;
3. Click here to add a new resource.
4. Enter the resource name that you want to search.
5. Click Go to filter the resource based on the name that you enter in field number 4 above.
6. Select the resource that you want to use.
7. Click this button to link the selected resource.
8. Click here to view where does this resource linked to.
9. Click here to sort the resources order.
10. Click here to save the changes and link this resource.
Add Resource
1. Select the resource type that you want to add.
2. Add Resource File
There are two way to add resource.
A. Upload images or single image via Drag-n-Drop. Drag an image from your desktop on to the drop zone to upload automatically files to server and map to products, categories, brands.. etc. Note on browser support: Microsoft Edge has a bug which stops drag and drop from working. It sounds like they are aware of it and hope to fix it.
B. Upload files via Add Resource button. Sometimes dragging & dropping files is not a comfortable way for selecting files for upload. Especially when you are in front of a small screen size computer. Therefore it would be nice to let users choose the method they prefer.
3. Add Resource HTML
Note: We do not recommend you to use external image that was added via Add Resources HTML for your product image because: 1. The default image zoom does not work with external image, you will need to modify the default template file to disable the image zoom. 2. If you use more than 1 external image, only the first one will be shown. |
Notes on embed: This is for embeding something from some other site into the store, and an embed image is not the same as adding an image resource. The added image is an actual upload to your server location. An embed is an image that exists on some other site and simply has a link to the store data block. If that link changes on the other site – your store will not have a correct display. |
Here are the steps to embed Audio, Video, PDF or archive file:
I. Add the code:
1. Embed Audio. Add the following code to the resource HTML field.
<audio controls>
<source src="path to mp3 file" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
2. Embed Video. e.g. You want to use YouTube video as resource to product. Here are the steps to obtain the embed code:
A. Click the Share button.
C. Click the copy button to copy the embed code and paste it the resource HTML field.
3. Embed PDF or archive file. Add the following code to the resource HTML field:
<a href="path to pdf/archive file" download>download link</a>
II. Create Data Listing Block and enable it in default products layout.
1. Create Data Listing Block.
A. Click Design.
B. Click Blocks.
C. Click the add button.
D. Click the Data Listing.
E. Custom Block Name: block name visible in Admin → Design → Layouts
F. Custom Block Title: name is shown on Storefront
G. Use block wrapper (appearance): recommended value is Automatic
H. Use block’s frame: set ON to display the frame
I. Custom Block description: internal use only – not required
J. Listing Data Source: Select Media
K. Media Type: Select the media type according to what you embed earlier.
L. Limit: Enter how many resource will be shown for this block.
2. Go to Admin → Catalog → Product → Page Layout and enable the created data listing block.