Getting Started

Managing and Using Assets in Shopranos Themes

When working with themes on the Shopranos platform, you have the flexibility to manage your assets either through the VS Code plugin or directly within the Shopranos eCommerce platform. Here's how to handle your assets and use them effectively in your theme components and layout.

Uploading Assets

Via VS Code Plugin:

Navigate to the Assets menu in the Shopranos section of VS Code.

Upload your images, JavaScript files, CSS files, and other media directly to the assets folder.

Via Shopranos eCommerce Platform:

Go to the Assets menu within the Shopranos admin panel.

Upload your assets through the platform interface.

Using Assets in Your Theme

Once your assets are uploaded, you can reference them in your layout or components by using specific placeholders in your URLs. This ensures that your assets are correctly linked, regardless of whether you're working in a staging or production environment.

Example of how to use an asset in your theme:

{{Assets}} Placeholder:

This placeholder is automatically replaced by Shopranos with the correct URL for your assets, ensuring the links work correctly in both staging and production environments.

{{Version}} Placeholder:

This is used to help bypass caching, especially in production environments where assets are stored on a Content Delivery Network (CDN). By appending the ?version={{Version}} parameter, you can force browsers to load the latest version of your assets whenever you update them.

Key Points

Managing Assets: You can manage assets easily through both the VS Code plugin and the Shopranos platform.

Dynamic URLs: Use {{Assets}} and {{Version}} in your URLs to ensure proper asset handling across different environments.

Cache Management: The {{Version}} parameter is essential for ensuring that your updates to assets are reflected without being stuck in cache, particularly in production settings.

By following these guidelines, you can ensure that your assets are correctly integrated into your Shopranos theme, providing a consistent and efficient experience across all environments.

Getting Started

Managing and Using Assets in Shopranos Themes#

Uploading Assets#

Using Assets in Your Theme#

Key Points#

Managing and Using Assets in Shopranos Themes

Uploading Assets

Using Assets in Your Theme

Key Points