Please enable JS
muse coworking iroda logo
Redefine Shopify themes

Automation support

Sections

Logic

Every section has three parts.

Content set up: Here you can add your products, collections, texts or any other content you need.

Layout: Here you can set up background colours, paddings or any other design settings. Brand settings can be set in Theme settings.

Navigation: Here you can add a custom id for the section. Add '#custom-id' to any button's link to navigate to this section after clicking them.

Blog posts

Blog posts

You need a Blog page to load its posts here

  1. Go to Blog posts > Manage blogs > Add blog

  2. Click on Select a blog and add your blog page

Note: reading time is just an estimated time based on an algorythm

Contact form

Blocks

Newsletter

You can find every subscriptions if you go to Customers page on the main page.

Note: Adding tags will make your searching or targeting easier for your email list.

Email us
Every message will be sent to the merchant's email address. Learn more

Custom liquid

Custom liquid
You don't need to edit the Theme file just add this section and your custom liquid codes here. Learn more

Featured collection / Collection page

Display style
Select the style in the dropdown if you need a horizontal or vertical collection appearance.

Grid style

img

Slider style

img

Blocks

Switch tabs
If you add multiple collections, they are going to be shown as tabs. For adding click on (+) Add Collection
img

Extras

New product tag
This is automatically shown when you release a new product.

  1. Go to Theme settings > Products > Product grid

  2. Make sure New product tag input field is not empty otherwise it's disabled

img
Product label
You can add custom labels on your products.
img

  1. Go to Products and select your product

  2. Scroll to Tags input.

  3. Your tag name should look like this: '#label_tag name', e.g. if your label is Holiday sale use '#label_holiday sale'.

Featured product / Product page

Blocks

Title

You can modify the title of the product in Products editor

img
Description

You can modify the description of the product in Products editor

img
Images

Covers on the image

These covers are going to appear over the first image of the product during scrolling down.
img

  1. Go to Products > Select a product

  2. Add a .png image with the same dimensions as the first image!

  3. Click on the Cover image > Edit alt text > Add '#cover'

    img
    4. Note: If you have multiple variants add '#cover_all' to appear on different every variants first image. If you want to separate cover images based on variant option you can do that by adding the option name. '#cover_option-name', example: #cover_red, #cover_blue.

Remove background

If you have product photos with plain white background you can make the background transparent by enabling 'Remove image background'
Review
You need to install Shopify's Review app from the Shopify app store to use this block. Learn more
Expandable box

Dynamic content

  1. In the Text description clink on Insert dynamic source

  2. At Product - Current section click Show more > then (+) Create Metafield

    img

  3. By clicking on Product > Add definition you can easily create a multi-line textfield

    img

  4. On the main site click on Products and select your product

  5. Scroll to the bottom where you can see Metafields and the Input box you've created

    img

  6. Add your text and hit save! This content will appear in the Expandable box if the product has this metafield filled.

Price

Compare prices

  1. Go to Products and select your product

  2. Select a variant and click Edit

  3. Add your price to Compare at price

    Note: Price comparsion only works if the product has a current price and a compare price.
img
Variant picker

Separate product images by variants

Create your own variants the same way, example: add colour with Pink and Dark pink variants.

  1. Once you have your variants click on the Product image > Add alt text

    img

  2. Your alt name should look like this: '#optionname_variant-name', e.g. if your variant is Pink use '#colour_pink'. If your variant is Dark pink then use '#colour_dark-pink'

    img
    Note: You should use hyphens instead of spaces.
Note: Anything in the alt field before or after this code will be printed to the page as expected, and the rest will be used for our image set feature.

Colour swatches

If you added a Colour variant in your product editor, the theme is going to recognise and use plain colours. You can add your own colour files as well if you want to use custom colours.

  1. On the main page go to Settings > Files

  2. Click the Upload files button and select your .png file

    img

  3. Go to Theme settings > Products > Colour swatches.

  4. Choose the file format you want to use. (In this example we used .png)

    img

  5. Make sure you use the same filename matches with the variant's option name, e.g. Pink variant's file should be named as pink.png. Complex colours like Dark pink should be named as dark-pink.png.

    img

    Note: Make sure after selecting a file format every uploaded color swatch image matches with that!

Size swatches

If you sell the same products internationaly you can highlight the sizing system.

  1. Go to Theme settings > Products > Size swatches

    img

  2. Add what sizing system are you using.

    img

Note: This will be visible only with Size variants!

Custom variant

Important! This is not a real variant picker! It only separates product images that has the same SKU, for example if you sell the same glasses for Men and Women. It can be useful if your warehouse can not handle updating the same SKU-s.

img
img

Separate product images by custom variants

You can separate product images with only one variant that has one SKU.

  1. Once custom variants are set click on the Product image > Edit alt text

    img

  2. Your alt name should look like this: '#optionname_variant-name', e.g. if your variant is Men use '#style_men'.

    Note: You should use hyphens instead of spaces.

    img

Note: Anything in the alt field before or after this code will be printed to the page as expected, and the rest will be used for our image set feature.

Custom variant by block

Option name: Like in the Product editor add Variant name that has multiple options. For example: Style
Variant: Like in the Product editor add the options you want to sell. For example, Men, Women.

img

Custom variant by code

You can have the same effect without adding a custom variant block! You need only need to add a special tag to your product.

  1. Go to Products and select your product

  2. Scroll to Tags input.

  3. Your tag name should look like this: '#option name_variant name', e.g. if your variant is Men use '#style_men'.

    img
    img

    Note: You can use spaces instead of hyphens.

Note: Do not use '#label_' or '#notify_' as an option name!

Quantity selector

This gives the option for customers to put more items to the cart than one.

Note: If you remove this block the default qunantity is 1.

Buy buttons

In the editor dynamic buttons may not appear! In the live view if you have multiple payment options enabled they will appear here, like PayPal, ApplePay, GooglePay, ShopPay, etc.

img

Layout

If you enable Enlarge buttons, they are going to have the same height as the buttons on the checkout page! (58.19px)

img
Payment options

If you have COD payment option on your website, you can show its icon as well! Just check Enable cash on delivery button

img
Pickup options

This block will show those locations where this product is available.

img

Add location

  1. On the main page go to Settings > Locations and click Add location

    img

  2. After saving it these locations will be available in your Product editor!

Edit locations

  1. Go to Products and select your product

  2. Scroll to Quantity and click on Edit locations

    img
Social share

You can modify the list of the social platform in Theme settings.

  1. Go to Theme settings

  2. Select Social media and scroll down to Sharing options

    img
Vendor

You can edit this block in Product editor

  1. Go to Products > Select a product

  2. Scroll to Product organization

    img
Sku

This block shows the product's own unique sku codes.

  1. Go to Products > Select a product

  2. Scroll to Inventory

    img

Note: This is the code how your warehouse can keep sync your sales.

Inventory

This block can alert the customers if your shop has ran out of stock or going to run out or still available!

In stock

This message is visible if the inventory is greater than the Inventory treshold

img

Only a few item left

This message is visible if the inventory is under the Inventory treshold.

img

You have the option to hide the remaining number of the product. In this case uncheck Low stock counter

Sold out

This message is visible if the inventory is 0 or less

img

Inventory on the way

Create Transfer and add Estimated arrival. Learn more

img
Trust badges

Upload the picture of your own badges. You have the option to use svg file as well

img

  1. On the main page go to Settings > Files

  2. Click the Upload files button and select your .svg file

  3. Click on Copy link

    img

  4. Paste the link in Image link input field

    img
Rich text

Rich text can be shown only on the bottom of the product section. This block has a special design and background color option to make the design more elevated.

img
Bundles
You can offer accessories or add on products to buy them in a bundle.
img

  1. Go to Products > Collections

  2. Create a collection for your bundle you want to show as add-ons

Note: Create an Automatic discount to offer a lower price for purchasing items in a bundle. Dont forget to enable combinations!

Shop the look

Product tags can direct you to another product page

img

Extras

Back in stock alert
Customer can subscribe to your email list to get notified if a specific product is back in stock.
img

  1. Go to Products and select your product

  2. Scroll to Product organization

  3. In Tags inputfield add the following tag name: '#notify'.
    img

    Note: If you want to separate subscriptions you can do with the tag like this: '#notify_product-name'

  4. Go to Customers and click Add filter

    img

  5. Select Customers tags then Contains this exact tag and select or type your tag!

    img

  6. Click Save segment!

    Note: From now on you can use this group to send newsletters

Sticky cart
This bar will appear only when you scroll down and the Buy buttons on the product page is not visible anymore!
img
Preorder button
If you ran out of inventory but still want to sell before restock you can modify Add to cart button to Preorder button
img

  1. Enable Pre-order in Product page editor

    img

  2. Go to Products and select your product

  3. Scroll to Inventory

  4. Check Continue selling when out of stock button

    img

Grid

Blocks

Image

You can add an image or video with the same grid system as the other types.

img
Text

You can add text content with the same grid system as the other types. Here you also have the option to modify the background color of the grid.

img
Collection

You can add a collection with the same grid system as the other types. The button will redirect you to the selected collection page!

img

Extras

Add divider

After having your grid layout you can put dividers on the right side of each grid box.

img

  1. Scroll to Layout

  2. Click on Enable divider

Note: Dividers are going to appear on the bottom in Mobile view.

Image with text

Display style

You have the option to split the section to a image and text block or have a textbox over the full width image.

Text on the right

img

Text over an image

img

Blocks

Image with text

You can create one section with multiple images and its texts!

img
img

  1. Click on (+) Add block

    img

  2. Select Image with text

Note: If you don't add image for the next blocks the text still can be paged!

Expandable box

You have two options for expandable box.

Custom text

img

Page file

img

Note: If the page file is not empty then its going to be loaded and Title and Text fields are going to be ignored!

Shop the look

Product tags can direct you to the product page or scroll to the product itself inside this section.

img

  1. Click on (+) Add block

  2. Select Shop the look

  3. Click on Select product

Scroll to the product

Set Display style to Show Product with Tag

Redirect to the product page

Set Display style to Show Tag

Minimized product page

Set Display style to Show Product

Note: Product is not tagged on the photo!

Map

Location

On the Map section you can load the Google map itself. If you don't have a Google API key just load the map image.

Google Maps API key

With this key you can load an interactive google map Learn more

Media

If you don't have the API key or don't want to register make a screenshot from your map and upload it as an image

img

Map location

You need to add your location for Google Maps with the following format to find your business: Number Street name, City, Zip number

Promotion

Blocks

Banner

You can add a photo and redirect customers to a custom url

img
Sale collection

You can create a special collection as a sale collection.

img

  1. Go to Products > Collections

  2. Click Create collection

    img

    Note: Create any collection you want to put on sale.

  3. Go to Discounts

  4. Click Create discount and select Amount off products

    img
Product

You can create a special section for a product sale.

img
Price list

You can create package offers with feature list.

img
Timer

This secton is doing a count down for a promotion release.

img

  1. Make sure you are using the right format Month/Day/Year Hour:Minute

    Note: This timer uses 24h format!

  2. When the timer ends it can redirect users to a custom url.

    img

Rich text

Blocks

Rich text

You can create a rich text section also append your own Page content

img

  1. Go to Online Store > Pages

  2. Click Add page

    Note: You can load this file in the editor

  3. Click on Select page and it will load its content

    img
Expandable box

You can create the same expandable box style as on Product page.

Note: If you load Page content it will overwrite the custom text content!

img
Column

You can create multiple columns with images and text.

img

If you want a feature list, you have multiple Layout options to create custom sizes!

img
Media

You can add images or videos to your text section

img

Note: If you add a mobile image on mobile devices only that image will be visible!

Custom liquid
You don't need to edit the Theme file just add this section and your custom liquid codes here. Learn more

Extras

Switch tabs

Adding multiple Rich text blocks will create a switch tab.

img

Slideshow

Blocks

Media

You can add Hero images or videos.

img

Multiple pages

You have the option to add multiple Media blocks and have a slider.

img

Note: You can disable auto slide changing and its timing

Navigation

You can highlight your own menu on the Slideshow

img

  1. Go to Online Store > Navigation and click Add menu

    img

  2. Build your own menu-system then hit Save

    img

  3. Add this menu to your Navigation block in the Theme editor.

    img

Extras

Header over the slideshow

There is an option to overlay the header over the Slideshow section.

img

  1. Go to Header section and open the editor

  2. Scroll to Overlay and select Over home page

    img

    Note: You can select the other options as well if you want the same effect on Collection page as well.

  3. If you have a darker image for the slideshow background check Inverse text color on overlay button

Testimonials

Blocks

Testimonial

Add your customers review here with their photo.

img

Highlight block

In the editor check Highlight animation button.

img

Note: You need more than 3 testimonials to highlight sliding animation.

Fast website that improves your SEO ratings and provides most of the features that only paid apps offer like Back in stock notification, Sticky cart, Dark mode, Bundles and colour swatches (separating images by variants), etc.

We provide many automations that saves you time and effort with setup, making your life much easier so you can focus on things that matter in your business.

Check Theme

Support for Online Store 2.0
Our theme being updated to fully support the new features of Online Store 2.0 that Shopify announced on June 29th, a set of features and feature improvements that make themes and theme apps easier to build, more flexible and more maintainable.
Remove "Powered by Shopify"
You can remove the "Powered by Shopify" link from your footer by adding your own. Go to Footer and edit Additional copyright text!

Announcement bar

Announcement

You can add multiple announcement bars and make it swipable or show both of them together.

Slider enabled

img

Slider disabled

img
Dynamic announcement

This bar detects if the customer add an item to the cart. If the value lower than the treshold it will show the Promotion message. If it's greater than the treshold it will show the Completion message

Main message

img

Promotion message

img

Completion message

img

Header

Logo

Header logo also supports svg files

img

  1. On the main page go to Settings > Files

  2. Click the Upload files button and select your .svg file

    img

  3. Click on Copy link

  4. Paste the URL in Image link input in the section editor

Note: If your logo is dark make sure you load it to Logo block. If it's bright load it to White logo. When you use inverse text it will change your logo based on this setup.

Upsell

This add a custom collection to your megamenu!

img

  1. Go to Products > Collections

  2. Click Create collection

    img

    Note: Create any collection you want to put on sale.

Extras

Mega-menu

Our theme will automatically create a multi-column called "mega-menu" dropdown for your navigation wherever your navigation includes at least two levels of links.

img

  1. Go to Online Store > Navigation and click Add menu

    img

  2. Drag and drop your menu item into another one to create a sublevel!

    img

Footer

Blocks

Logo and social

You can add show logo on the Footer. If you have it in svg file just paste the URL in the Image link input

img

  1. On the main page go to Settings > Files

  2. Click the Upload files button and select your .svg file

    img

  3. Click on Copy link

  4. Paste the URL in Image link input in the section editor

Menu

You can add your own menu in footer as well!

img

  1. Go to Online Store > Navigation and click Add menu

    img

  2. Build your own menu-system then hit Save

    img

  3. Add this menu to your Menu block in the Theme editor.

Newsletter

You can find every subscriptions if you go to Customers page on the main page.

img

Note: Adding tags will make your searching or targeting easier for your email list.

Language and currency

You can use Country flags instead of dropdown menu.

img

  1. In the dropdown menu select the format you are planing to use. In this example we chose Show .png format

  2. On the main page go to Settings > Files

  3. Click the Upload files button and select your .png file

    img

Add language

You can use Shopify's Translate & Adapt app for your store translation!

  1. On the main page go to Settings > Languages and click Add language

  2. Click on Install Translate & Adapt button

    img

  3. On the Primary market click on Manage button

    img

  4. In Market settings click on Manage Domain and languages

    img

  5. Make sure Primary domain only is enabled!

  6. Scroll down and check every language button you want to use!

    img

Add currencies

You need Shopify Payments to accept multiple currencies on your store!

img
Rich text

You can add custom text content in the footer section.

img

Popup

Display

Test mode

If you are editing your popups make sure only one block is active and Display mode is set to Test mode

img

Enabled

  1. On your live page set Display mode to Enabled

    img

  2. In your block set up the Delay that sets when the popup shows up after the page is open.

  3. Frequency means how often this popup will be shown for revisitors.

    img

Note: Multiple popups not going to appear in the same time. Once the popup is dismissed the next popups delay timer will start

Blocks

Newsletter

You can find every subscriptions if you go to Customers page on the main page.
You have 2 options to display, popup or Bottom

img

Note: Adding tags will make your searching or targeting easier for your email list.

Age verifier

If you have a website where you need age verification you can use this popup! If they click I'm over 21 the popup simply dismissed and the site will be available. If they click Exit it will redirect the user to that url.

img

Note: Make sure you add a custom url to BUtton link

Language and currency

You can use Country flags instead of dropdown menu.

img

  1. In the dropdown menu select the format you are planing to use. In this example we chose Show .png format

  2. On the main page go to Settings > Files

  3. Click the Upload files button and select your .png file

    img

Highlight

You can highlight the most viewed languages

img

Add language

You can use Shopify's Translate & Adapt app for your store translation!

  1. On the main page go to Settings > Languages and click Add language

  2. Click on Install Translate & Adapt button

    img

  3. On the Primary market click on Manage button

    img

  4. In Market settings click on Manage Domain and languages

    img

  5. Make sure Primary domain only is enabled!

  6. Scroll down and check every language button you want to use!

    img

Add currencies

You need Shopify Payments to accept multiple currencies on your store!

img
Cookies

You can add Cookies popup if it's necessary. You have 2 options to display, popup or Bottom.

img

If you have a non European website you can enable Show only in the EU button. This will show this popup only in countries that is part of the EU and showing GDPR policies is a must.

Extras

Redirect website

If you don't have Shopify Payment options and you run multiple store accounts for different currencies and languages you have the option to redirect your site to these URLs!

img

  1. In Theme settings scroll to Locator.

  2. Fill the URLs. Make sure you added them the same order as in your dropdown list. For example if the First list element is English, your Locator URL have to be the English site!

    img

Theme settings

Colors

You can create 3 brand colors, 4 secondary colors and 4 system colors. The reason behind the limitation is make the building easier and more coherent.

Most of the sections has a background color option in Layout settings.

  1. In section's settings scroll to Layout.

  2. If the Background color set to none then Color scheme is active!

    img
Typography

You can set up the Fonts, their sizes, line widths and edges, favicon, etc.

Navigation

You can set breadcrumbs, searchbar, etc.

Cart

You have two options for open the cart.

Drawer: Clicking on Bag icon it opens a drawer on the right side

Page: Clicking on Bag icon it redirects the customer to the cart page.

Theme settings

This add a custom collection to your megamenu!

img

  1. Go to Products > Collections

  2. Click Create collection

    img

    Note: Create any collection you want to put on sale.

Products

You can set up grid sizes, color and size swatches here.

Social media

Added social media icons will appear in the footer social block.

Locator

Check Language and currency blocks.

Dark mode

If the customer clicks on the dark mode button it changes the color system to this setup!

img

Still have questions?

Contact us