Theme settings
Colors
Blum theme supports 2 color schemes for Text and Background:
- Main Accent Text
- Main Accent Background
- Extra Accent Text
- Extra Accent Background
Typography
To change Typography, we can go to Theme settings > Typography, where you can universally change the font family of headings and body texts, as well as font scale level.
Appearance
In this section, you can enable or disable to show background grid lines
Overlay opacity apply for every section which contains content inside the image: For example: Slideshow, Content collage, Featured product list, Image card, ….
There are 2 styles of subheading styles:
- Badge
- Normal
Subheading Accent Scheme can be switched between 2 values:
- Main accent
- Extra accent
For Image cards, you can enable the option to use text color as set in Typography for image card’s content. If the option is unselected, the text in card’s content will be in inverted color.
You can also freely enable or disable parallax scroll at Animation option. When enabled, the prominent badge will scroll with the page content. When disabled, the prominent badge will stop scrolling along, but will keep rotating as usual.
Cart
Cart is classified into 2 types:
- Drawer
- Page
By default, cart type is set at Drawer.
You can select details to be displayed with the cart, including:
- Show product vendor
- Enable order notes
- Enable dynamic checkout button
- Show tax and shipping information
- Show free shipping notification: Encourage customers add more to cart to earn free shipping
You can also set up Minimum Order Price For Free Shipping by entering the minimum number based on the order price that matches your free shipping rate. If both options “Show free shipping notification” and “Minimum order price for free shipping” are set, the Free shipping bar will be shown as bellow:
- On notification message
- On Cart Drawer
- On Cart page
By default, Free shipping amount will display currency based on your settings inside Shopify dashboard > Settings > Store details > Store currency.
In case the currency is changed, the value of Free shipping amount will also be automatically exchanged based on Shopify mechanism. The live exchange rates will be applied.
Search
You can click on the dropdown menu to select the result displaying:
- Products only
- Products and pages
- Products and blog posts
- Products, pages and blog posts
By default, the search result will display Products, pages and blog posts.
Product Information
It can be displayed from 0 to 10 low stock threshold and the default is 5. Blum supports variant options that display as swatches.
You can choose to Enable variant swatches to display.
Variant swatches mechanism
By default, Blum theme supports color swatches for you with basic color. Data of color will be collected from option ‘Color’ or ‘Colour’. If it can not collect data because option name is not Color or Colour, it will display as a label. If data contains color which theme doesn’t support it will display as a label.
Variant swatches rules
You can be able to custom color or other options for your store. You can enter variant name with HEX code into field Variant swatches rules. If it matches with an existing variant from your store, this variant will be set custom value.
If you want to use image for variant swatches, you will need to upload the image png file onto the Shopify Files. Blum theme supports for PNG and JPG file.
Then enter the Name of the variant with the Image-name.png or Image-name.jpg. For example, I have uploaded the image file name ” prd-img ” and want to add it for the “Black” color so I need to add in the Variant swatches rules: ” Black: prd-img.png ”
Check the video tutorial below to learn more about the way to set up Color Swatches in Electro theme:
Product Card
Blum theme comes with three different product image ratio for you:
- Square
- Portrait (2:3)
- Landscape (3:2)
- Adapt to image
By default, product image will be set as Portrait (2:3)
Along with that, you can enable or disable the options to display including:
- Resize image to fit its container
- Show second image on hover: Hover on product image to show second image. If that product does not have image, it will automatically display placeholder.
- Show vendor
- Show product rating: Note that to display a rating, you must add a product rating app first. You can check more details here
- Show color swatches: Note that it only shows if variant swatches is enabled
- Show Sale badge
- Enable quick shop: quick shop content will appear.
Collection Card
Blum theme brings 4 collection image ratios are:
- Square
- Portrait (2:3)
- Landscape (3:2)
- Adapt to image
Along with Image ratio, you can select the Overlay Opacity for the Collection card. Overlay opacity can be adjusted with min: 0%, max: 90%.
The Show product count option is turned off by default but you can simply put a tick on this option to turn it on.
Article Card
At this point, you can enable to show featured image. Then simply select featured image ratio in the dropdown menu:
- Square
- Portrait (2:3)
- Landscape (3:2)
- Adapt to image
By default, Feature image ratio will be in Landscape type (3:2)
You can also be able to select these information:
- Show blog’s tag: show only 1 first blog post’s tag, click on the tag to show other blogs have the same tag.
- Show excerpt: change excerpts by editing your blog posts. You can see more details here
- Show published date
- Show author
- Show “Read more”
Quick Shop
In this section, you can select these information:
- Show Sale badge
- Show product quantity
- Show stock number (Basic stock information still shows without stock number)
- Show dynamic checkout buttons: Using the payment methods available on your store, customers see their preferred option, like PayPal or Apple Pay. More details here
- Show tax and shipping policy
Once you have configured all the settings in this section, you will see a popup similar to this when clicking on Quick shop.
Currency
Note that cart and checkout prices always show currency codes, Example: $1.00 USD. This part lets you enable to show currency code on product card, product details, etc. And if you disable this currency codes, it will just show on cart and checkout prices.
Email address and Phone number
This is where you will need to enter email address and phone number on the field to set up your personal store
Social Media
Blum theme allows you to connect with most of social media, including:
- YouTube
- Vimeo
- TikTok
- Tumblr
- Snapchat
You can freely add or remove any social media by connecting with its URL account
Favicon
To add your favicon image, click the Select image button. The media manager will open up. There, drag and drop your logo, or select it if it is already uploaded. (Note that 64 x 64px .png is recommended).
