Maximize - Sections & Blocks
Maximize - Sections & Blocks
Maximize - Sections & Blocks
1. What is the Highlighted product set? The Highlighted Product Set section combines the interactivity of a Shop the Look experience with the layout flexibility of a Collage. It allows you to showcase multiple images with interactive hotspots, where customers can discover featured products directly within a visually engaging gallery. 2. Section Components Section Display a visually appealing gallery of images with product hotspots. Available block Adds an image with customizable hotspots to feature products. 3. Location & Setup Go to “Online Store” > “Themes” > ”Customize”. Select where you want to place it Click "Add Section" Search for Highlighted product set Click on it to add. 4. Highlight features Integrated Info Display: Show essential details like contact information or working hours. Actionable Button: Allow users to click and get directions or access other features. Mobile-Friendly Design: Ensure your map is responsive and accessible on any device. Customizable Labels: Adjust the text for your button and information fields. 5. Common Use Cases 🤔 How to upload an image (Highlight blocks) and adjust its height and width? You need to add several Highlight blocks (image blocks) and set them up after arranging the overall layout. Here’s how: STEP 1: Add the section & Highlight blocks to the section. Add the Highlighted product set section. By default, you will have 4 Highlight blocks. You can delete, hide, or add more blocks as needed. STEP 2: Assign an image to a block Click on a Highlight block, under Image, click “Select”. STEP 3: Set up the overall layout of the section Click on the Highlight Product Set section to open the setting panel, and: 🖥️ For desktop: Find the Desktop layout, adjust the Number of columns (up to 4 columns) & the Row height 📱 For mobile: Find the Desktop layout, adjust the Number of columns (1 or 2 columns) & the Row height STEP 4: Adjust the height & width of an image 🖥️ For desktop: Go to Desktop layout > Column width & Row Height (from 1-4). 📱 For mobile: Go to Mobile layout > Column width & Row Height (1 or 2). ⚠️ Note: The Column width must be equal to or less than the Number of columns. STEP 5: Click “Save” when done. 🤔 How to add the image hotspots for each Highlight block? The default Highlight block has no image hotspots until you assign products to the block. You can add up to 3 image hotspots for an image. Here’s how to do it: STEP 1: Navigate to the setting group: Click on a Highlight block to open its settings panel, then scroll down to the Product 1 setting group. STEP 2: Assign a product: In Product, click Select and choose the product from the list. Once you’re done, you will see the white circle (a.k.a hotspots) appearing on the image. To adjust its position, continue step 2. STEP 3: Adjust the hotspot’s position: Under the Product setting group, you will see 4 sliders to change the hotspot’s position: Hotspot desktop horizontal position Hotspot desktop vertical position Hotspot mobile horizontal position Hotspot mobile vertical position Just change these 4 settings until your hotspot is at your desired placement. ⚠️ Note: These first 3 steps above guide you to set up the 1st hotspot for an image only. To bring up the 2nd and 3rd hotspots, repeat the steps for Product 2 and Product 3 setting groups. STEP 4: (Optional) Change the hotspots’s colors: The default color of the image hotspots is white. To change it, you need to: Click on the Highlight product set section to open its setting panel. Scroll down to the Colors setting group. Adjust the Hotspot (light) and Hotspot (dark). STEP 5: Click “Save” when done. 🤔 How to adjust the information shown on each Product item? When hovering on an image hotspot, you will see a small card that has the Product information, it is called a Product item. You can choose to show the product’s vendor and product rating STEP 1: Navigate to the setting group: Click on the Highlighted product set section to open its settings panel, then scroll down to the Product items setting group. STEP 2: Choose what to show: You can turn on/off the corresponding toggle to show or hide the information: Show vendor Show product rating STEP 3: Click “Save” when done. 🤔 What customization options can you give your Map? For the whole Highlighted Product Set section ✨ Change color scheme: Click on the Highlighted product set section, and choose the overall scheme you want to use in both light and dark mode in the Color scheme. ✨ Change the heading size: Click on the Highlighted product set section, and choose the Heading size to be Small, Medium, or Large. ✨ Change the Heading tag (for SEO purposes) Click on the Highlighted product set section, find and choose the Heading tag from the list. ✨ Change the heading alignment Click on the Highlighted product set section, find and choose the Heading alignment to be Left, Right, or Center. ✨ Change the section width, add padding, or add a divider Click on the Highlighted product set section, and scroll down to the Section layout group, and you will be able to change those settings. Need help? Contact our support team at Omni Themes Support.
Maximize - Sections & Blocks
1. What is Map? The Map allows you to display a location map on your Shopify store. It is ideal for showcasing a physical store's location, offering directions to customers, or highlighting multiple business addresses. 2. Section Components Section Showing the location of the store with a map for the online store. Available blocks Displays the name of the store for easy identification on the map. Showcases the store's address and operating hours. Adds a button linking to the Google Map address. 3. Location & Setup Go to “Online Store” > “Themes” > ”Customize”. Select where you want to place it Click "Add Section" Search for Map Click on it to add. 4. Highlight features Integrated Info Display: Show essential details like contact information or working hours. Actionable Button: Allow users to click and get directions or access other features. Mobile-Friendly Design: Ensure your map is responsive and accessible on any device. Customizable Labels: Adjust the text for your button and information fields. 5. Common Use Cases 🤔 How to set up the Map section? Don’t know where to start with your Map section? Start with this: STEP 1: Add & set up the Map section: Add a Map section to the store, then: Enter a valid address in the Store address field for Google Maps to recognize. Adjust the Desktop height and the Mobile height of the section. STEP 2: Add & set up the blocks: By default, you will have 3 Store name, Address and hour, and Button blocks when you add the Map section. You cannot add more, but can delete some blocks that you don’t need. Click on each block to change its specific setting. STEP 3: Click “Save” when done. 🤔 How to show a custom image instead of the map? If you wish to show another image of the location instead of the plain and simple map from Google, just do this: STEP 1: Add the Map section: Add a Map section to the store. STEP 2: Set up the location: Click on the Map section to open its setting panel, then: Enter a valid address in the Store address field for Google Maps to recognize. Adjust the Desktop height and the Mobile height of the section. STEP 3: Add a custom image as the background: In the Map section setting panel, find the Image setting and click “Select” to assign an image. STEP 4: Click “Save” when done. 🤔 What customization options can you give your Map? For the whole Map section ✨ Change color scheme: Click on the Map section, and choose the overall scheme you want to use in both light and dark mode in the Color scheme. ✨ Change the content position: Click on the Map section, find and choose the Content position to be Left, Right, or Center. ✨ Change the content alignment: Click on the Map section, find and choose the Content alignment to be Left, Right, or Layered. ✨ Change the section width, add padding, or add a divider Click on the Map section, and scroll down to the Section layout group, and you will be able to change those settings. Need help? Contact our support team at Omni Themes Support.
Maximize - Sections & Blocks
1. What is the Blog Posts Section? The Blog Posts Section is a dedicated area on your website where multiple blog posts are displayed together. This section typically showcases the most recent or most relevant blog posts, allowing visitors to easily browse and access the content. 2. Section Components Section A display area for a selection of blog posts. 3. Location & Setup Go to “Online Store” > “Themes” > “Customize”. Select where you want to place it Click "Add Section". Search for Blog posts. Click on it to add. 4. Core Features Carousel Support: Enable a swipeable carousel for desktop and mobile devices. Customizable Display: Show or hide details like author, date, tags, and featured images. Table of Contents: Add a table for better navigation within blog posts. SEO Enhancements: Customize headings to improve visibility in search engines. 5. Common Use Cases 🤔 How to change the blog posts shown? By default, the Blog posts section is connected with a Blog in your Shopify admin. If you want to change it, you can: STEP 1: Click on the Blog posts section to open its settings panel. STEP 2: Scroll down to the Blog setting, then tap to change. STEP 3: Click “Save” when done. 🤔 How to customize the information shown for Each Blog Post? Need to tailor the details shown for each blog post? Here’s how: STEP 1: Click on the Blog posts section to open its settings panel. STEP 2: Depending on what you want to show/hide, make changes to the corresponding setting under the Blog items group: Show featured image: Turn on to show the cover image of the blog posts. Image ratio: Choose the featured image’s aspect ratio. Enable or disable options like author, blog, date, excerpt, tags and lines, and comment count. Show button read now: Turn on to show a button for the customer to read more, change its content in the Button read now label. STEP 3: Click “Save” when done. 🤔 How to set up a Carousel for Blog Posts? Want to showcase blog posts in a dynamic carousel? Follow these steps: STEP 1: Click on the Blog posts section to open its settings panel. STEP 2: Scroll down to the Carousel setting group, and: 🖥️ For desktop: Turn on the Enable carousel on desktop setting. 📱 For mobile: Turn on the Enable swipe on mobile to allow users to swipe through posts. STEP 3: (Optional) If you want the carousel to slide automatically, then: Turn on Enable auto-play. Adjust the speed in Change slides every setting. STEP 4: Click “Save” when done. 🤔 What customization options can you give your Blog Posts? For the whole Blog Posts section: ✨ Change the heading size: Click on the Blog Posts section, and choose the Heading size to be Small, Medium, or Large. ✨ Change the Heading tag (for SEO purposes) Click on the Blog Posts section, and choose the Heading tag from the list. ✨ Change the heading alignment Click on the Blog Posts section, and choose the Heading alignment to be Left, Right, or Center. ✨ Adjust the number of blog posts shown Click on the Blog Posts section, and adjust the number of Blog posts shown (from 2-8). ✨ Adjust the number of columns shown on desktop Click on the Blog Posts section, and adjust the Number of columns on desktop (from 1-4). ✨ Add a “Show more” button Click on the Blog Posts section, and turn on the Show “Show more” button toggle. This doesn’t work when Carousel is enabled. ✨ Add a “View all” button Click on the Blog Posts section, and turn on the Show "View all" button toggle. Change its position in the "View all" button position setting. ✨ Change the section width, add padding, or add a divider Click on the Blog Posts section, and scroll down to the Section layout group, and you will be able to change those settings. Need help? Contact our support team at Omni Themes Support.
Maximize - Sections & Blocks
1. What is Product specifications? The Product Specifications section allows you to showcase detailed technical information about your products in an organized table format. It's ideal for providing clarity on product materials, dimensions, features, and more. 2. Section Components Section Present a section featuring one or more tables that detail the product's information and specifications. Available block Used to add a table to the section. 3. Location & Setup Go to “Online Store” > “Themes” > ”Customize”. Click on the Homepage dropdown menu > Product > Default template. Click "Add Section" Search for Product specifications Click on it to add. 4. Highlight features Customizable specification tables: Add and edit multiple technical and feature groups. Flexible layout: Adjust heading size, alignment, and include custom images. Structured presentation: Present detailed product features in a professional, easy-to-read table format. 5. Common Use Cases 🤔 How to add & set up the content for a table of specifications? Want to add information and adjust the layout of a specification table? Here's how: STEP 1: Add a Product specifications section: This section can only be used on the Product page. So, follow the steps in 3. Location & Setup to add this section. STEP 2: Set up the product metafields: To add values to the table, you must work on the product metafield first, do these: Create your Product metafields by following the steps in How to create Product metafields. Make sure when you Select type, choose one of these types: Option 1: Single line text (one value or list of values) Option 2: Multi-line text. Option 3: Rich text. In Shopify admin, click on Products > choose a product > go to Product metafields > enter the value > “Save”. (Repeat this step for other products). STEP 3: Enter the details for a table in Theme Editor. Go back to your Theme Editor (Online stores > Themes > Customization) By default, your Product specifications section includes 2 Specification blocks. You can delete, hide, or add more blocks as needed. Click on a Specification block to open its settings panel, then: Scroll down to the Specification detail group. Enter to the List of specifications in this format: Label:metafield_key Label is your custom text. Metafield_key is the Namespace and key of your product metafield. Add a new line to add a row to the table. STEP 4: Enter the heading and description for a table: After filling in the table’s details, enter other content into these fields: Heading: Give your table a title, such as “Ingredients”. Text: Add some extra description, leave blank if you don’t need it. STEP 5: Click “Save” when done. 🤔 How to make the table collapsible? Want to let customers easily expand or collapse the table in the Product Specifications section? Here's how: STEP 1: Under the Product Specifications section, tap on the Specification block to open its settings panel. STEP 2: Turn on the Show in tab toggle. STEP 3: (Optional) If you want to make the tab expand by default, turn on Open this tab by default. STEP 4: Click “Save” when done. 🤔 How to add an image to the specification table? Want to make your table of specifications more engaging with an image? Here's how to add & edit the image layout: STEP 1: Add an image Under the Product Specifications section, tap on the Specification block to open its settings panel, then find the Image setting, and click “Select” to add an image. STEP 2: Adjust the image height & position Click on the Product Specifications section to open its settings panel, then: Go to Desktop layout 🖥️: Change the Desktop image height and Desktop image position. Go to Mobile layout 📱: Change the Mobile image height and Mobile image position. STEP 3: Click “Save” when done. 🤔 What customization options can you give your Product specifications? For the whole Product specifications section ✨ Change color scheme: Click on the Product specifications section, and choose the overall scheme you want to use in both light and dark mode in the Color scheme. ✨ Change the heading size: Click on the Product specifications section, and choose the Heading size to be Small, Medium, or Large. ✨ Change the Heading tag (for SEO purposes): Click on the Product specifications section, find and choose the Heading tag from the list. ✨ Change the number of columns on desktop: Click on the Product specifications section, find Desktop layout and choose the Number of columns on desktop (1 or 2). ✨Add a border to the logo Click on the Product specifications section, find and turn on the toggle Show logo border. ✨ Change the section width, add padding, or add a divider Click on the Product specifications section, and scroll down to the Section layout group, and you will be able to change those settings. For a single Specification block: ✨ Change the text to appear when there is no value By default, a “-” will be shown when there is no value in your product metafield. If you want to change it, click on Specification block, then change the Text to use for empty fields. Need help? Contact our support team at Omni Themes Support.
Maximize - Sections & Blocks
1. What is Collection list? The Collection list section allows you to showcase multiple collections in an organized layout. This is perfect for guiding customers to different product categories right from your homepage or landing page. 2. Section Components Section Displays a customizable grid of collections and promotional banners. Available blocks Showcases an individual collection with its featured image and name. Highlights a special promotion or announcement with an image and text. 3. Location & Setup Go to “Online Store” > “Themes” > ”Customize”. Select where you want to place it Click "Add Section" Search for the Collection list. Click on it to add. 4. Highlight features Flexible looks: Display collections in a flexible grid layout. Promotional banners: Add promotional blocks to highlight sales or special offers. 5. Common Use Cases 🤔 How to show the list of collections? Want to have an area to show your specific store collections? The Collection list section is your go-to! Here's how to set it up: STEP 1: Add the Collection list section: Add the Collection list section to your page. ⚠️ Note: By default, the section displays all collections. To feature specific collections, add blocks as guided in Step 2. STEP 2: Use Collection blocks to choose what collections to show: Click “Add block” > Collection Click “Select” the desired collection STEP 3: Customize the look of the whole section: Tap on the Collection list section to open its setting panel, and you can adjust how many collections to show in a row: For desktop 🖥️: Find Desktop layout > adjust the Number of columns (from 1-12). For mobile 📱: Find Mobile layout > adjust the Number of columns (from 1-4). STEP 4: Click “Save” when done. 🤔 How to Add a Promotional Image in the Collection List? Want to highlight sales, featured collections, or seasonal campaigns? Here's how: STEP 1: Add the Collection list section: Add the Collection list section to your page. STEP 2: Add & set up a Promotion Block. Click “Add block” > Promotion block. Add a Heading and Content. Upload a background image or video and adjust the Image overlay opacity. Choose an icon from the list to show it (optional). Add a button label and link (optional). STEP 3: Click “Save” when done. 🤔 How to show customized collection images with metafield? Want to display unique, high-resolution images for collections without altering their featured images? Here’s how: STEP 1: Create a Collection Metafield. Go to Settings > Custom Data > Collection > Add Definition. Name your metafield, select File as the type, choose One file, and click Save. STEP 2: Assign a Value to the Metafield. Go to Products > Collection, select a collection, and scroll to Metafields. Upload an image for the metafield and click Save. STEP 3: Set it Up in the Theme Editor. In Theme Editor, open the Collection list section. Scroll to Auto-fill collection images with metafield. Copy the metafield's key after “custom.” and paste it into the field. STEP 4: Click “Save” when done. 🤔 How to Enable Carousel for the Collection List? Want to create a scrolling collection display for better navigation? Here's how: STEP 1: Open the Collection list section setting: In Theme Editor, click on the Collection List section. STEP 2: Enable carousel: Find the Carousel setting group, then: For desktop 🖥️: Turn on Enable carousel on desktop. For mobile 📱: Turn on Enable swipe on mobile. STEP 3: Click “Save” when done. 🤔 What other customization options can you give your Collection list? For the whole Collection list section ✨ Change color scheme: Click on the Collection list section, and choose the overall scheme you want to use in both light and dark mode in the Color scheme. ✨Change the image ratio of the Collection cards: Click on the Collection list section, and find the Collection card setting group. You can choose the ratio using the Image style setting. ✨ Change the title size of the section: Click on the Collection list section, and find the Collection card setting group. You can choose the Title size to be Small, Medium, or Large. ✨ Make the text appear on top of the collection image: Click on the Collection list section, and find the Collection card setting group. You can: Turn on the Enable text overlay setting. (this will activate overlay on both Collection cards and Promotion images). Adjust the Overlay opacity. ✨ Change the content alignment: Click on the Collection list section, and find the Collection card setting group. You can change the Content alignment of the whole card. ✨ Change the section width, add padding, or add a divider Click on the Collection list section, and scroll down to the Section layout group, and you will be able to change those settings. Need help? Contact our support team at Omni Themes Support.
Maximize - Sections & Blocks
1. What is Page? The Page section allows you to easily insert the entire content of one existing page directly into another page's template. This is particularly convenient when you have content that needs to be reused across multiple pages. ⚠️ Note: The existing page is the page set up in Shopify admin > Online stores > Pages. For example: You want to show the content of the policy page on the product page. 2. Section Components Section Display the content of one existing page directly into another page. 3. Location & Setup Go to “Online Store” > “Themes” > ”Customize”. Select where you want to place it Click "Add Section" Search for Page Click on it to add. 4. Highlight features Time-saving: Instead of manually copying and pasting content, you can simply insert the desired page. Consistency: Ensures that the same content appears identically on all pages where it's used. Real-time Updates: You only need to make changes to the original page for it to update on all pages where it’s inserted automatically. 5. Common Use Cases 🤔 How to set up the Page section? Want to add the content of an existing page (e.g., a "Shipping Policy" page) to another page template in a few simple steps? Here's how: STEP 1: Set up the Pages in the Shopify admin Go to Online Store > Pages in Shopify and ensure the page you want to display is created by: Click on “Add page”. Add Title and Content. Change the Visibility to “Visible”. Choose your page Template. STEP 2: Add the Page section In Theme Editor ( “Online Store” > “Themes” > “Customize”), choose the page template where you want to include the content. Then, add the Page section at your preferred position. STEP 3: Assign the page to the Page section Click on the Page section to open its settings panels, then tap on “Select page”, and choose the page you’ve created before. STEP 4: Click “Save” when done. 🤔 What customization options can you give your Page? For the whole Page section ✨ Change the heading size: Click on the Page section, and choose the Heading size to be Small, Medium, or Large. ✨ Change the Heading tag (for SEO purposes) Click on the Page section, find and choose the Heading tag from the list. ⚠️ Note: Avoid using the H1 tag for page headings as it may affect SEO ranking. ✨ Change the section width, add padding, or add a divider Click on the Page section, and scroll down to the Section layout group, and you will be able to change those settings. Need help? Contact our support team at Omni Themes Support.
Maximize - Sections & Blocks
1. What is Tabs? The Tabs section allows you to organize and display information in a structured, tabbed format. Each tab can showcase a unique type of content, such as highlights, descriptions, tables, or media with text, providing a clean and user-friendly way to present product details. 2. Section Components Section Display content in multiple tabs for better navigation Available blocks Used to show content in Text columns with icons format. Used to show the product description (if placed on the product page) or manually inputted text. Used to show content in table format. Used to show content in a media combining with text format. Use to show content in formatted text, allowing custom styles and layouts. 3. Location & Setup Go to “Online Store” > “Themes” > ”Customize”. Select where you want to place it Click "Add Section" Search for Tabs. Click on it to add. 4. Highlight features Flexible Content: Add unlimited tabs to display diverse types of information. Customizable Blocks: Mix and match content types like highlights, tables, and media. Interactive Layout: Engage customers with clickable tabs for quick navigation. Mobile-Friendly: Optimized for seamless viewing on any device. 5. Common Use Cases 🤔 How to add a tab that shows content in Text columns with icons format? The Tabs section has a Highlight tab block that can help you show your content in a tab that has multiple columns, highlighting key points using icons and short text. Here are more detailed guidance: STEP 1: Add a Highlight tab block to the section: After adding a Tabs section, click on “Add block”, and choose the Highlight tab block. STEP 2: Set up each Icon setting group: Click on the Highlight tab to open its settings panel. Navigate to the Icon 1 setting group. Choose the Icon from the list, or choose None if you don’t want any. Upload a Custom icon image if needed, this will disable your picked Icon above. Enter the Heading and Text. ⚠️ Note: The Highlight Tab block lets you display up to 4 columns, each with an icon and text. To show all 4 columns, fill in the settings for Icon 2, Icon 3, and Icon 4. If you need less than 4, just leave the Heading and Text of an Icon setting group blank. STEP 3: Customize the whole block look: After setting up each Icon group, you can: Enter the Tab title. Adjust the Heading size, Heading tag, and Content alignment. Adjust the Icon size. Adjust the Colors of the icon. STEP 4: Click “Save” when done. 🤔 How to add a tab that automatically shows the Product description? The Tabs section has a Description tab block that can help you show the Product description automatically based on that specific product if you are on the Product page. To set it up, do these: STEP 1: Add a Description tab block to the section: After adding a Tabs section, click on “Add block”, and choose the Description tab block. STEP 2: Turn on the Show product description toggle: In the Description tab block’s setting panel, turn on the Show product description toggle. This text will change dynamically based on the product. STEP 3: Add custom text In the Description tab block’s setting panel, enter more information if needed into the Text field. This text will remain unchanged across different products. STEP 4: Change how much content will be shown In the Description tab block’s setting panel, find the Default content height setting. By default, it will show full content. Choosing a different option will make the “Read more” or “See less” button appear. STEP 5: Set the tab title: In the Description tab block’s setting panel, fill in the Tab title field (e.g., "General Details" or "Specifications"). STEP 6: Click “Save” when done. 🤔 How to add a tab that shows content in table format? The Tabs section has a Table tab block that can help you show your content in a tabular format. Here are more detailed guidance: STEP 1: Add a Table tab block to the section: After adding a Tabs section, click on “Add block”, and choose the Table tab block. STEP 2: Add the table content: In the Table tab block’s setting panel, add content to the Table detail field in this format: Use a colon (:) to separate columns. For example: Table detail Result Material: High-quality for durability…. Dimensions: Standard sizes vary by product Use a hyphen (-) to indent rows under a category. For example: Table detail Result Performance: Designed for extreme conditions.- Capacity: Adjustable capacity.- Warranty: Backed by a 1-year …. To start a new row, press Shift + Enter to add a line break. STEP 3: Set the tab title: In the Table tab block’s setting panel, fill in the Tab title field (e.g., "General Details" or "Specifications"). STEP 4: (Optional) Right-Align Values: Toggle Right-align values if you prefer the text in the second column to align to the right for a cleaner look. STEP 5: Click “Save” when done. 🤔 How to add a tab that shows content in media & text format? The Tabs section has a Media with text tab block that can help you show your content in a format that has both media (image or video) and text. Here are more detailed guidance: STEP 1: Add a Media with text tab block to the section: After adding a Tabs section, click on “Add block”, and choose the Media with text tab block. STEP 2: Add the content: In the Media with text tab block’s setting panel, navigate to the Tab content group, and you can choose 1 option below: Option 1: Use content from an existing page by using Content from page. Option 2: Otherwise, enter your content into Subheading, Heading, Text, and Button label fields. STEP 3: Add the media: In the Media with text tab block’s setting panel, navigate to the Tab media group, and you can: Option 1: Add an Image. If you have a specific image for mobile 📱, upload it to Mobile image. Option 2: Add a Video or Embed video from url (Youtube or Vimeo). If you do both option, the Video will have your Image as the cover. STEP 4: Set the tab title In the Media with text tab block’s setting panel, fill in the Tab title field (e.g., "General Details" or "Specifications"). STEP 5: Click “Save” when done. 🤔 How to add a tab that shows content in rich text format? The Tabs section has a Rich text tab block that can help you show your content in a format that has both media (image or video) and text. Here are more detailed guidance: STEP 1: Add a Rich text tab block to the section: After adding a Tabs section, click on “Add block”, and choose the Rich text tab block. STEP 2: Add the content: In the Rich text tab block’s setting panel, enter your information into these fields: Heading, Text, and Button label (optional). STEP 3: Change how much content will be shown In the Rich text tab block’s setting panel, find the Default content height setting. By default, it will show full content. Choosing a different option will make the “Read more” or “See less” button appear. STEP 4: Set the tab title: In the Rich text tab block’s setting panel, fill in the Tab title field (e.g., "General Details" or "Specifications"). STEP 5: Click “Save” when done. 🤔 What customization options can you give your Tabs? For the whole Tabs section ✨ Change color scheme: Click on the Tabs section, and choose the overall scheme you want to use in both light and dark mode in the Color scheme. ✨ Change the Tab style: Click on the Tabs section, and choose the Tab style to be Collapsible or Horizontal ✨ Change the section width, add padding, or add a divider Click on the Tabs section, and scroll down to the Section layout group, and you will be able to change those settings. For a single Description tab block: ✨ Show all or a part of the content To adjust the height of the block's content, click on it, go to the Content section, and choose the desired height. Selecting a height other than Show full content will display a "Read more" button. ✨ Change the content alignment Click on the Description tab block, then choose the Content alignment to be Left, Center, or Right. For a single Media with text tab block: ✨ Adjust the height & position of the media: Click on the Media with text tab block, scroll all the way to the bottom, and you can: For desktop 🖥️: Choose the Desktop image height and Desktop media position. For mobile 📱: Choose the Mobile image height and Mobile media position. ✨ Make the video autoplay: If you use a video for your media, you can click on the Media with text tab block, and toggle on the Enable video autoplay setting. For a single Rich text tab block: ✨ Change the button style Click on the Rich text tab block, then in the Button style setting, select to make it follow Primary or Secondary style. ✨ Change the content alignment Click on the Rich text tab block, find and choose the Content alignment to be Left, Right, or Center. Need help? Contact our support team at Omni Themes Support.
Maximize - Sections & Blocks
1. What is the Contact Form? The Contact Form section is a simple way for visitors to get in touch with your store. It collects messages or inquiries, reducing spam and providing a structured way to communicate. 2. Section Components Section A form for customers to fill out and send inquiries. Available blocks Input for visitor’s name. Required input for visitor’s email address. Optional input for a contact number. A text area for the visitor’s message. Custom input fields (Text, Dropdown, Radio Button, Checkbox). 3. Location & Setup Go to "Online Store" > "Themes" > "Customize" Select where you want to place it Click "Add Section" Search for Contact Form Click on it to add. 4. Core Features Custom fields: Add or modify fields like name, email, phone, and more. Email notification: Form submissions go directly to your store’s sender email. Content options: Show additional content like images or contact details. Custom success messages: Display a personalized message after form submission. 5. Common Use Cases 🤔 How to set up the contact form? Want to create a user-friendly contact form for your customers? Here's how: STEP 1: Add the section & blocks. Add a Contact form section. By default, you have a Name, Email, Phone number, and Message block. Click "Add block" to add the Form item block or delete the unused ones. STEP 2: Configure the form details Enter section Heading and adjust size Select heading tag for SEO Add descriptive subheading (optional) Choose form submit button label STEP 3: Customize form fields Click on each block to edit its look. For more information, you can check out the part talking about What customization options can you give your Contact form? STEP 4: Display additional content (Optional) Besides the contact form, you can: Show an image for visual interest (Option name: Image) Include store contact information (Option name: Contact information) Or both! (Option name: Both) Just go to the Contact form section, scroll down to Show additional content and choose the option you want. STEP 5: Click “Save” when done. 🤔 How to display store contact information? Want to make it easy for customers to reach you? Here's how: STEP 1: Click on the Contact form section to open its setting, and find Show additional content. STEP 2: Choose Contact Information from the dropdown list. STEP 3: Scroll down to the Contact information setting group, and fill out your store’s details like address, phone number, and business hours. STEP 4: Click “Save” when done. 🤔 How to show an image beside the contact form: Want to draw customers’ attention with an engaging visual for your contact form? Here's how: STEP 1: Click on the Contact form section to open its setting, and find Show additional content. STEP 2: Choose Image from the dropdown list. STEP 3: Scroll down to the Image setting group, add your image, and change its height on both desktop and mobile as you want. STEP 4: Click “Save” when done. 🤔 How to show an image & contact information beside the contact form: If you want to show both image and contact information instead just a simple contact form, follow this: STEP 1: Click on the Contact form section to open its setting, and find Show additional content. STEP 2: Choose Both from the dropdown list. STEP 3: In the Image setting group, add your image and change its height on both desktop and mobile as you want. In the Contact information setting group, fill out your store’s details like address, phone number, and business hours. STEP 4: Click “Save” when done. 🤔 How to Add Custom Fields to the Form? Need to collect specific information different from the default boxes? Here’s how to add the custom block: STEP 1: Click on “Add block” and choose the Form Item block. STEP 2: Enter the field label, select the input type (Text, Dropdown, Radio, Checkbox), and add options if needed. STEP 3: Mark the field as Required if needed. STEP 4: Click “Save” when done. 🤔 What customization options can you give your Contact Form? For the whole Contact Form section ✨ Change color scheme: Click on the Contact Form section, and choose the overall scheme you want to use in both light and dark mode in the Color schema. ✨ Change the heading size: Click on the Contact Form section, and choose the Heading size to be Small, Medium, or Large. ✨ Change the Heading tag (for SEO purposes) Click on the Contact Form section, and choose the Heading tag from the list. ✨ Change the heading alignment Click on the Contact Form section, and choose the Heading alignment to be Left, Right, or Center. ✨ Change the Success message content Click on the Contact Form section, and type into Success message box the message you want to show when customers successfully submit the form. ✨ Change the form alignment Click on the Contact Form section, and choose the Form alignment to be Left or Right. ✨ Change the section width, add padding, or add a divider Click on the Contact Form section, and scroll down to the Section layout group, and you will be able to change those settings. Need help? Contact our support team at Omni Themes Support.
Maximize - Sections & Blocks
1. What is FAQ? The FAQ (Frequently Asked Questions) section is a customizable area where you can answer common customer questions in an organized, easy-to-navigate format. It helps reduce customer support inquiries by providing clear answers to frequent questions about your products or services. 2. Section Components Section Displays a list of common questions and their answers in an organized, collapsible format. Available block Each block contains one question and its corresponding answer. 3. Location & Setup Go to "Online Store" > "Themes" > "Customize" Select where you want to place it Click "Add Section" Search for FAQ Click on it to add 4. Highlight features Collapsible Q&A: Answers can be hidden until the user clicks on the question. Customizable Headings: Adjust the heading style and highlight effects. SEO-Friendly: Enable microdata schema to improve search engine visibility. 5. Common Use Cases 🤔 How to add and style Q&A blocks? Want to create clear, well-organized FAQ entries? Here's how: STEP 1: Add the section & blocks. Add a FAQ section. Click "Add block" for new Frequently Asked Question blocks. STEP 2: Add questions’ content: Add Icon (2 options): Choose from dropdown list Enter custom SVG code Enter your Question Add detailed Answer STEP 3: Style Your FAQ Section Click on the FAQ section to adjust its overall look. For more information, you can check out the part talking about What customization options can you give your FAQ? STEP 4: Click “Save” when done. 🤔 What customization options can you give your FAQ? For the whole FAQ section ✨ Change color scheme: Click on the FAQ section, scroll down to Colors, and choose the overall scheme you want to use in both light and dark mode in the Color scheme. ✨ Change the heading size: Click on the FAQ section, and choose the Heading size to be Small, Medium, or Large. ✨ Change the Heading tag (for SEO purposes) Click on the FAQ section, find and choose the Heading tag from the list. ✨ Change the heading alignment Click on the FAQ section, and choose the Heading alignment to be Left, Right, or Center. ✨ Add a border around each block Click on the FAQ section, and turn on the Show border toggle. ✨Give each FAQ block a background color: Click on the FAQ section, find and turn on the Rows alternative background setting. (To change the color, you need to edit the color scheme) ✨ Make the answers always shown By default, the answers will be hidden in the collapsible blocks. To make it appear without clicking, go to the FAQ section, and turn off the Collapsible toggle. ✨ Set up the “View all” button Click on the FAQ section, and: Turn on the Show "View all" button to enable the button. Choose the "View all" button position to be on Top or at the Bottom. Enter a link in the "View all" button link. (should be linked to a FAQ page) ✨ Make the questions shown in 2 columns Click on the FAQ section, find the Desktop layout setting, and choose 2 columns. ✨ Add an image to the FAQ section Click on the FAQ section, find the Image setting, and add an image. To change its position, you need to: For desktop 🖥️: Scroll down to the Desktop layout section, and choose the Image alignment to be Left or Right. For mobile 📱: Scroll down to the Mobile layout section, and choose the Image alignment to be Image first or Image second. To adjust its height, you need to: For desktop 🖥️: Scroll down to the Desktop layout section, and choose the suitable Desktop image height. For mobile 📱: Scroll down to the Mobile layout section, and choose the suitable Mobile image height. ✨ Change the section width, add padding, or add a divider Click on the FAQ section, and scroll down to the Section layout group, and you will be able to change those settings. ✨ Enable microdata schema Click on the FAQ section, find the SEO setting group, and turn on the Enable microdata schema toggle. Need help? Contact our support team at Omni Themes Support.
Maximize - Sections & Blocks
1. What is Scrolling promotion? The Scrolling Promotion section enables you to show an automatically horizontal scrolling for your store visitors. With customizable scrolling speed, direction, and interactive elements, this section is perfect for showcasing promotions or key highlights. [GIF] 2. Section Components Section Displays a scrolling banner with customizable content blocks for promotions. Available blocks Adds scrolling text with customizable font styles, alignment, and color. Displays icons with optional labels to visually enhance your message. Creates a call-to-action button, allowing visitors to take immediate action. Showcases images in the scrolling banner for visual emphasis. 3. Location & Setup Go to “Online Store” > “Themes” > ”Customize”. Select where you want to place it Click "Add Section" Search for Scrolling promotion. Click on it to add. 4. Highlight features Customizable scrolling speed and direction for dynamic visuals. Flexible content with Text, Icon, Image, and Button blocks. Background, alignment, and spacing adjustments for tailored designs. 5. Common Use Cases 🤔 How to set up the Scrolling promotion section? Follow this quick guide to bring a Scrolling promotion to your online store: STEP 1: Add the section: Add the Scrolling Promotion section. STEP 2: Set up the blocks: By default, your Scrolling Promotion section includes 5 default blocks: 2 Text Block, 2 Icon Block, and 1 Button Block. You can delete, hide, or add more blocks as needed. Depending on the block you use, the setting might be slightly different: Which block? How to set up? Text block Enter the text you want into the Text field. Put some words into a bracket to add a highlight effect. Choose the style of the highlight effect under Marker setting. Choose the Text size to be Small , Medium, or Large. Choose the Text color. Icon block Choose the Icon from the drop-down list. Or - enter an SVG code if you want to use a different icon from the list. Adjust the Icon height from 20px to 150px. Button block Enter a Button label. Add a link to the Button link. Choose the Button style to be Secondary , Primary, or Text link . Image block Click “Select” in the Image setting to add an image. Adjust the Image height. STEP 3: Set up the scrolling rule: Click on the Scrolling Promotion section to open its setting panel, and under the Scrolling group, you can: Time per scroll: The larger the number, the faster the scrolling speed. Direction: Choose to make it from Right to left or Left to right. Pause on hover: Enable to stop scrolling when hovered over. Show section borders: Enable to add a border on the top and bottom of the section. STEP 4: Click “Save” when done. Need help? Contact our support team at Omni Themes Support.
Maximize - Sections & Blocks
1. What is Logo List? The Logo List section allows you to showcase a series of logos, often used to highlight partners, sponsors, or brand affiliations. 2. Section Components Section Displays multiple logos in a visually appealing, grid/carousel style layout. Available block Used to add a single logo image. 3. Location & Setup Go to “Online Store” > “Themes” > “Customize”. Select where you want to place it Click "Add Section". Search for Logo List. Click on it to add. 4. Highlight Features Grid Layout: Easily organize logos in a customizable grid format. Link Options: Each logo can be linked to external pages or resources. Adjustable Logo Size: Control the size of each logo to ensure a consistent appearance. 5. Common Use Cases 🤔 How to set up the logo list section? STEP 1: Add the Logo list section, take a look at some basic settings, and adjust them as you want: Heading Corner radius Image ratio STEP 2: By default, the Logo list section has 6 Logo blocks, edit it if you need more or less. STEP 3: For each Logo block, upload your image and add a link if needed. STEP 4: Click “Save” when done. 🤔 How to display Each Logo in its Original Size? As you have different images, you might not want them to have the same ratio but keep their original sizes, then just do this: STEP 1: Click on the Logo List section to open the settings panel. STEP 2: Scroll down to the Desktop layout group, and adjust the Number of columns to 0. STEP 3: Click “Save” when done. 🤔 What customization options can you give your Logo List? ✨ Change color scheme: Click on the Logo List section, and choose the overall scheme you want to use in both light and dark mode in the Color schema. ✨ Change the heading size: Click on the Logo List section, and choose the Heading size to be Small, Medium, or Large. ✨ Change the Heading tag (for SEO purposes) Click on the Logo List section, find and choose the Heading tag from the list. ✨ Change the heading alignment Click on the Logo List section, find and choose the Heading alignment to be Left, Right , or Center. ✨Add a border to the logo Click on the Logo List section, find and turn on the toggle Show logo border. For the Carousel look: ✨ Make your logo list carousel Click on the Logo List section: On desktop 🖥️: Find the Carousel group, and turn on the toggle Enable carousel on desktop. On mobile 📱: Find the Mobile layout group, and choose the Mobile layout to be Carousel. ✨ Make your logo list automatically slide: Click on the Logo List section, find the Carousel group, and: Turn on the toggle Enable carousel on desktop. Turn on the toggle Auto-switch logo. Adjust the amount of time between each slide in Change bar every. ✨ Add navigation buttons to your logo list carousel Click on the Logo List section, find the Carousel group, and: Turn on the toggle Enable carousel on desktop. Turn on the toggle Show navigation. For the Grid/ Stacked look: ✨Change how users interact with the Logo List section Click on the Logo List section, and find the Card section style setting. You can choose how users interact with the Flow card section: "On hover" will automatically expand tabs when moused over, while "On click" requires a click to expand. ✨ Change the position of the images Click on the Logo List section, and scroll down to Section layout: On desktop 🖥️: choose the Desktop image position to be Left or Right. On mobile 📱: choose the Mobile image position to be Top or Bottom. ✨ Change the height of images Click on the Logo List section, scroll down to Section layout, and choose your preferred image height in Desktop height (for desktop 🖥️) and Mobile height (for mobile 📱). ✨ Change the section width, add padding, or add a divider Click on the Logo List section, and scroll down to the Section layout group, and you will be able to change those settings. Need help? Contact our support team at Omni Themes Support.
Maximize - Sections & Blocks
1. What is Testimonials ? The Testimonials section showcases statements or endorsements from customers, highlighting their positive experiences with your product or service. These serve as social proof, boosting trust and credibility. Testimonials can include written text, images, and star ratings. 2. Section Components Section Displays customer reviews with customizable layout and design options. Available block Adds a customer review with options for title, text, image, and rating (e.g., stars or quotes). 3. Location & Setup Go to “Online Store” > “Themes” > ”Customize”. Select where you want to place it Click "Add Section" Search for Testimonials Click on it to add. 4. Highlight features Auto-play transitions for dynamic scrolling. Full customization of text alignment, colors, and background for seamless branding. Product linking within testimonials for added trust and conversion. 5. Common Use Cases 🤔 How to Set Up a Customer Testimonial Section? Showcase your customer reviews in a visually appealing layout, just by doing a few steps: STEP 1: Add a section: Add the Testimonials section. STEP 2: Customize the section: Click on the Testimonials section to open its settings panel: Add a Heading (e.g., “What Our Customers Say”) and choose its style, size, and alignment. Toggle off the Show image setting if you don’t need an image. Choose your desired Testimonial layout from the drop-down list. (Only works if you turn on the Show image setting). To make your Testimonials work, just focus on the above elements. For more customization, continue reading the 🤔 What customization options can you give your Testimonials? below. STEP 3: (Optional) Set up the auto-play rule: The Testimonials section's auto-play function is disabled by default. To turn it on, adjust the Auto-play setting to a number larger than 0. STEP 4: Click “Save” when done. 🤔 How to add and set up individual testimonials blocks? Want to include detailed reviews with icons, images, and product links? Follow these steps: STEP 1: Add a block: After adding the Testimonials section, click “Add block” to add a new Testimonial block. STEP 2: Set up the content for each block: Click on the Testimonial block to open its settings panel: Icon: You can choose to show a Quote icon or a 1-5 stars icon. Custom icon (SVG code): Enter an SVG code if you want to use another icon different from the list above. Title: Enter a title for the testimonial block. Text: Fill in the customer review in this box. Image: Click “Select” to add a customer image. If you need more text in different styles, fill your text in Caption or Additional text fields. STEP 3: (Optional) Add a product to the testimonial block: 🔍 Information: Adding the link to a product can make customers easily navigate to the featured product when they read a positive review, improving their shopping experience and boosting conversions. Click on the Testimonial block to open its settings panel. Scroll all the way to the bottom, and in the Product setting, tap on “Select” to choose a product. STEP 4: Click “Save” when done. 🤔 What customization options can you give your Testimonials? For the whole Testimonials section ✨ Change color scheme: Click on the Testimonials section, and choose the overall scheme you want to use in both light and dark mode in Styles > Color schema. ✨ Change the heading size: Click on the Testimonials section, and choose the Heading size to be Small, Medium, or Large. ✨ Change the Heading tag (for SEO purposes) Click on the Testimonials section, find and choose the Heading tag from the list. ✨ Change the whole section’s text alignment Click on the Testimonials section, find and choose the Heading alignment to be Left, Right , or Center. ✨Show/ hide the next-previous arrows Click on the Testimonials section, find and turn on/off the toggle Next/Previous arrows. ✨Show/ hide the pagination Click on the Testimonials section, find and turn on/off the toggle Show pagination. ✨Change the duration between each slide changes Click on the Testimonials section, and adjust the Auto-play every bar from 0 to 10. ✨ Change the Image style Click on the Testimonials section, and choose the Image style to be Square or Rounded . (Only works if the Show image toggle is on) ✨ Change the height of images Click on the Testimonials section, and choose your preferred image height in Desktop height. ✨ Change the image position Click on the Testimonials section, and scroll down to the Section layout group, and choose the Image position to be First or Second. ✨ Change the section width, add padding, or add a divider Click on the Testimonials section, and scroll down to the Section layout group, and you will be able to change those settings. Need help? Contact our support team at Omni Themes Support.
Maximize - Sections & Blocks
1. What is Flow Cards? The Flow Cards section presents a sequence of visual cards, ideal for guiding customers through product features, service steps, or storytelling. Each card can showcase a mix of text, images, and buttons to communicate clear and engaging content in a step-by-step or process-oriented layout. 2. Section Components Section Display a sequence of content or guide customers through a series of steps using visually appealing cards. Available blocks Used to link straight to a product page. Used to link straight to a collection page. Used when you just want to show an image or video. 3. Location & Setup Go to “Online Store” > “Themes” > “Customize”. Select where you want to place it Click "Add Section". Search for Flow Cards. Click on it to add. 4. Highlight features Step-by-Step PresentationArrange content in a step-based flow to guide customers through a series of actions or product features. Visually Layered CardsCreate a visually stacked card effect to add depth and highlight each step. Interactive Hover EffectsAdd hover animations to each card, making them visually engaging when interacted with. Progressive NavigationShow progress through a series using indicators, making multi-step processes intuitive. 5. Common Use Cases 🤔 How to set up the Flow Cards? The Flow Cards might be used in different cases, depending on your needs. Follow this common guide to set up the basic things: STEP 1: Set up the general section: Add the Flow Cards section, and enter the Heading (and Subheading). STEP 2: Set up the blocks: By default, your Flow Cards section includes 3 default blocks: Block Product, Block Collection, and Block Media. You can delete, hide, or add more blocks as needed. Depending on the block you use, the setting might be slightly different: Which block? How to set up? Product block (Default name: Step 1: Enter the 1st step name or a brief description of it.) Click "Select" under Product to choose a product. Edit the Heading and Description. If needed, add a button by entering the Button Label and linking it. Collection block (Default name: Step 2: Enter the 2nd step name or a brief description of it.) Click "Select" under Collection to choose a collection. Edit the Heading and Description. If needed, add a button by entering the Button Label and linking it. Media block (Default name: Step 3: Enter the 3rd step name or a brief description of it.) Click "Select" under Media to add an image or video. If both are added, only the video will display. If you don't have a local file, embed a video using a URL. Edit the Heading and Description. If needed, add a button by entering the Button Label and linking it. STEP 3: Click “Save” when done. If you want to explore more customization options for your Event calendar, continue reading the next part. 🤔 What customization options can you give your Flow Cards? For the whole Flow Cards section: ✨ Change color scheme: Click on the Flow Cards section, and choose the overall scheme you want to use in both light and dark mode in the Color schema. ✨ Change the heading size: Click on the Flow Cards section, and choose the Heading size to be Small, Medium, or Large. ✨ Change the Heading tag (for SEO purposes) Click on the Flow Cards section, and choose the Heading tag from the list. ✨ Change the heading alignment Click on the Flow Cards section and choose the Heading alignment to be Left, Right, or Center. ✨Make the first tab open by default Click on the Flow Cards section and turn on the Open the first tab by default to make the first tab always open when you first visit a page. ✨Change how users interact with the Flow card section Click on the Flow Cards section, and find the Card section style setting. You can choose how users interact with the Flow card section: "On hover" will automatically expand tabs when moused over, while "On click" requires a click to expand. ✨ Change the position of the images Click on the Flow Cards section, scroll down to Section layout: On desktop 🖥️: choose the Desktop image position to be Left or Right. On mobile 📱: choose the Mobile image position to be Top or Bottom. ✨ Change the height of images Click on the Flow Cards section, scroll down to Section layout, and choose your preferred image height in Desktop height (for desktop 🖥️) and Mobile height (for mobile 📱). ✨ Change the section width, add padding, or add a divider Click on the Flow Cards section, and scroll down to the Section layout group, and you will be able to change those settings. For a single Product/ Collection/ Media block: ✨ Show all or a part of the content To adjust the height of the block's content, click on it, go to the Content section, and choose the desired height. Selecting a height other than Full will display a "Read more" button. ✨ Change the button style Click on a block, then in the Button style setting, select to make it follow Primary or Secondary, or Link style. Need help? Contact our support team at Omni Themes Support.
Maximize - Sections & Blocks
1. What is Email Signup? The Email Signup section allows you to collect customer email addresses for newsletters, promotions, or updates. It's a powerful tool to grow your mailing list and stay connected with your customers. 2. Section Components Section Display a section where customers can enter their emails. Available blocks Adds a customizable heading to the section. Provides a space for supporting information or a call to action. Add a field to collect customer email addresses 3. Location & Setup Go to “Online Store” > “Themes” > ”Customize” . Select where you want to place it Click "Add Section" Search for Email Signup . Click on it to add. 4. Highlight features Customizable Heading: Tailor the title to align with your branding or campaign. Text Description: Add a compelling message to encourage sign-ups. Automatic Notifications : Sends an email to the store owner's email address when a customer submits their email. Flexible Styling: Adjust colors, fonts, and spacing to match your theme. 5. Common Use Cases 🤔 How to set up the Email signup section? Want to grow your newsletter subscribers, promote special offers, or announce events? You can collect your customers’ email by using this Email sign up section: STEP 1: Add the section Add the Email signup section. STEP 2: Customize the blocks: By default, your Email signup section has all 3 blocks: Heading , Text , and Email form . You can delete some blocks you don’t need, but you cannot add more. Click on each block to adjust its settings. STEP 3: Customize the section: Click on the Email signup section to open its settings panel, and you can: Add an Image as the background for the Email signup section. Add a Mobile image if you need a different background for the mobile version. Adjust the Image height, Section width, Padding under the Section layout. STEP 4: Click “Save” when done. Need help? Contact our support team at Omni Themes Support .
Maximize - Sections & Blocks
1. What is Promotion Grid? The Promotion Grid section is a versatile layout that allows you to feature promotional content in a grid format, ideal for highlighting special deals, offers, or featured collections. 2. Section Components Section A customizable grid layout for displaying promotional content with flexible sizing and styling options Available block Used to add a single image or video with customizable content, labels & buttons. 3. Location & Setup Go to "Online Store" > "Themes" > "Customize" Select where you want to place it Click "Add Section" Search for Promotion Grid Click on it to add. 4. Highlight features Flexible Grid Layout : Customize the number of rows and columns for various display options, supports both images and videos (YouTube and Vimeo) Clickable promotions: Add links to images or buttons to guide customers to promotions or featured products. Custom sale labels with multiple style options 5. Common Use Cases 🤔 How to Create a Promotional Block? To quickly bring up a promotional block to your site, take a look at these basic settings: STEP 1: Set up the general section: Add the Promotion grid section, and: Enter the Heading. (For desktop 🖥️) Scroll down to the Desktop layout section, and adjust the Number of columns you want to have. (For mobile 📱) Scroll down to the Mobile layout section, and choose the Number of columns to be 1 or 2. STEP 2: Set up a block: Add a Promotion title block, and: “Select” an Image or Video for your promotion (or you can embed the video from URL ) Adjust the media block size using Number of columns wide and Number of rows tall settings under the Layout group (read the next part for more detailed guidance). Add a compelling Title and Text, and change the Button label or leave it blank if you don’t need a button. Add a Sale label with custom styling(read the next part for more detailed guidance). STEP 3: Click “Save ” when done. 🤔 How to modify the height and width of each media block? Want to create promotion blocks with custom sizes and engaging content? Here's how: STEP 1: Set up the general section: Go to the Promotion Grid section settings (For desktop 🖥️) Scroll down to the Desktop layout section, and adjust the Number of columns you want to have. (For mobile 📱) Scroll down to the Mobile layout section, and choose the Number of columns to be 1 or 2. Set the spacing between blocks in Block spacing. Define Row heights for your media. STEP 2: Set up a block dimensions Click on a Promotion title block Scroll down to Layout. Adjust the block width in the Number of columns wide (1-6 columns) ⚠️ Note: The block width cannot exceed the section's column setting. Adjust the block height in the Number of columns tall (1-3 rows) STEP 4: Click “Save” when done. 🤔 How to Add a Sale Label to a Promotion block? Want to make your promotions stand out with a sale label? Here’s how: STEP 1: Access Sale Label settings Click on your promotion block Locate the Sale Label settings group STEP 2: Enter content for the sale label: Use the fields for Line 1 , Line 2 , and Line 3 to add promotional text like "SALE," "50% OFF," or other messages. Tip : Keep messages short and impactful. STEP 3: Adjust the appearance of the sale label: Pick a Sale Label Style : Square , Circle , Flag (ribbon-like), or Angle (corner placement). Set the Font Size for each line by choosing a percentage value between 50% and 200%. Choose the Sale label position on an image: Top left , Top right , Bottom left , or Bottom right. STEP 4: Customize the label's color: Under Color, select the Background Color from the available color options. Choose the Text Color to ensure the message is clear and eye-catching. STEP 5: Click “Save” when done. 🤔 What customization options can you give your Promotion Grid? For the whole Promotion Grid section: ✨ Change color scheme: Click on the Promotion Grid section, and choose the overall scheme you want to use in both light and dark mode in the Color schema. ✨ Change the heading size: Click on the Promotion Grid section, and choose the Heading size to be Small , Medium , or Large . ✨ Change the Heading tag (for SEO purposes) Click on the Promotion Grid section, find and choose the Heading tag from the list. ✨ Change the heading alignment Click on the Promotion Grid section, find and choose the Heading alignment to be Left , Right , or Center. ✨ Change the section width, add padding, or add a divider Click on the Promotion Grid section, and scroll down to the Section layout group, and you will be able to change those settings. For a single Promotion title block: ✨Change the overlay content position Click on a Promotion title block, and scroll down to the Overlay content group, choose the Overlay content position to be Top , Right , or Bottom. ✨Adjust the opacity of the overlay layer Click on a Promotion title block, and scroll down to the Overlay content group, adjust the Overlay opacity from 0 to 100%. ✨ Place text outside the media By default, the text is above (overlay) the media, if you want to put the text outside, then: Click on a Promotion title block Scroll down to the Overlay content setting group. Turn off the Overlay content toggle. Scroll up to the Media position setting, decide your text position to be on top of the image ( Image second ) or at the bottom of the image ( Image first ). ✨ Add an icon on top of the text Click on a Promotion title block, and scroll down to the Layout group, choose the Icon you want from the list. Need help? Contact our support team at Omni Themes Support .
Maximize - Sections & Blocks
1. What is Rich Text? The Rich Text section is a flexible content block that allows you to add formatted text to your page, perfect for sharing detailed information, announcements, or storytelling. 2. Section Components Section Displays a customizable text area for content like paragraphs, announcements, or other important details. Available blocks Adds a formatted title or heading to highlight key content. Additional text area for taglines or supplementary information. A text block for detailed information or storytelling with adjustable display height. Adds a call-to-action button within the text content. Add images or embedded videos. 3. Location & Setup Go to "Online Store" > "Themes" > "Customize" Select where you want to place it Click "Add Section" Search for Rich Text Click on it to add. 4. Highlight features Formatted Text Options: Customize the look with headings, paragraphs, and styled text. Link Integration: Easily add links to relevant pages, products, or collections. Versatile Button Placement: Include call-to-action buttons for conversions. 5. Common Use Cases 🤔 How to set up the Rich Text section: Want to build a compelling content section that combines different elements? Here's how: STEP 1: Set up the general section: Add the Rich Text section, and Adjust the Content alignment for the 🖥️ Desktop layout and 📱 Mobile layout. Adjust section padding in Section layout > Top padding and Bottom padding. Select the background color scheme in Colors. STEP 2: Set up the blocks (Add content elements): By default, a Heading, Text, Buttons, and Caption block will be added along with the Rich Text section. You can: Add more blocks or delete some redundant ones. Enter the content by clicking on each block. Drag and drop the block to change its order. Add up to 2 buttons within a Button block. STEP 3: Click “Save” when done. 🤔 What customization options can you give your Rich Text? For the whole Rich Text section: ✨ Change color scheme: Click on the Rich Text section, scroll down to Colors, and choose the overall scheme you want to use in both light and dark mode in the Color schema. ✨ Make your section appear in RTL (Right to left) layout: Click on the Rich Text section, scroll down to Theme Settings, and enter the right language code in RTL languages following the ISO Language Code Table. ✨Change the section width Click on the Rich Text section, find the Section layout group, and choose the Section width to be Page width, Full width, Full width padded. ✨ Change the button animation: Click on the Rich Text section, scroll down to Theme Settings, and choose the Primary button hover animation you want. ✨ Change the section width, add padding, or add a divider Click on the Rich Text section, and scroll down to the Section layout group, and you will be able to change those settings. For the Heading block: ✨ Change the Heading tag (for SEO purposes): Click on the Heading block, find and choose the Heading tag from the list. ✨ Change the heading size: Click on the Heading block, and choose the Heading size to be Small, Medium, or Large. For the Text block: ✨Change the amount of content shown: Click on the Text block, and choose the height in the Default content height setting. If you choose a different option rather than Show full content, a “Read more” button will appear. ✨Change the “Read more” button label: Click on the Text block, and enter your text to the "Read more" label. For the Button block: ✨ Change the button style: Click on the Button block, and choose your Button style to be Primary or Secondary. For the Caption block: ✨ Change the caption text style: Click on a Caption block, and choose the Text style to be Subtitle or Uppercase. ✨ Change the caption text size: Click on a Caption block, and choose the Text size to be Small, Medium or Large. For the Media block: ✨ Adjust the size of the media Click on a Caption block, and adjust the Media size from 1 - 100%. Need help? Contact our support team at Omni Themes Support.
Maximize - Sections & Blocks
1. What is the Event Calendar? The Event Calendar showcases events, promotions, and announcements on your storefront. It helps customers stay informed, enhances engagement, and supports features like ticket sales and calendar integration for seamless event participation. 2. Section Components Section Showcase events, promotions, and announcements with interactive features. Available block Add more event cards to the section Set up the event information 3. Location & Setup Go to “Online Store” > “Themes” > “Customize”. Select where you want to place it Click "Add Section". Search for Event Calendar. Click on it to add. 4. Highlight features Showcase Events: Made for event display, showing event name, date, time, and location, with options for start and end times. Pop-Up Descriptions: Provide detailed event information when customers click on event titles. Direct Calendar Integration: Enable users to add events to platforms like Google Calendar, Apple Calendar, Outlook, etc. with one click. Event Tickets: Link events to products, selling them as tickets with customizable variants. SEO-Friendly Descriptions: Use heading tags to optimize event content for search engines. 5. Common Use Cases 🤔 How to add and show events? To simply set up and showcase upcoming events on your storefront, you need to take some steps: STEP 1: Add the Event Calendar section, and: Change the Heading as you want. Choose the right Time zone. Choose the Time format (12-hour or 24-hour). STEP 2: Click on an Event block, and fill in several important fields:: Event Name Summary Location "Add to calendar" button label Start date End date (optional) STEP 3: Fill in the Detailed description field to add more information in a pop-up for customers to see when they click on an event title. STEP 4: Click “Save” when done. If you want to explore more customization options for your Event calendar, continue reading the next part. 🤔 How to Sell Tickets for an Event? Need to link an event to a ticket product? Follow these steps: STEP 1: Click on one Event block to open the setting panel, under the Event tickets group, enable Offer Tickets for This Event. STEP 2: Link the event to a ticket product by pasting the product URL or searching for it in the Ticket page link field. ⚠️ Note: You must create a digital product first to have the link. STEP 3: Customize the Ticket button label (e.g., “Buy Tickets”) and select the Button style (Primary or Secondary). STEP 4: Click “Save” when done. 🤔 What customization options can you give your Event Calendar? For the whole Event Calendar section ✨ Change color scheme: Click on the Event calendar section, and choose the overall scheme you want to use in both light and dark mode in the Color schema. ✨ Change the heading size: Click on the Event calendar section, and choose the Heading size to be Small, Medium, or Large. ✨ Change the Heading tag (for SEO purposes) Click on the Event calendar section, and choose the Heading tag from the list. ✨ Change the heading alignment Click on the Event calendar section, and choose the Heading alignment to be Left, Right , or Center. ✨ Change the image ratio for all the events Click on the Event calendar section, and choose the ratio you want by clicking on Image style setting. ✨ Add a border to all the event cards Click on the Event calendar section, and choose the Line and border option from the list. ✨ Change the desktop layout for this section Click on the Event calendar section, and scroll down to Desktop layout , you will have the option to make it 1 or 2 columns. ✨ Change the section width, add padding, or add a divider Click on the Event calendar section, and scroll down to the Section layout group, and you will be able to change those settings. For a single Event card block: ✨ Add an image for an event Click on an Event block, then in the Background image setting, select an image you want. ✨ Change the button style Click on an Event block, then in the Button style setting, select to make it follow Primary or Secondary style. Need help? Contact our support team at Omni Themes Support.
