- XXS
- XS
- M
- L
- XL
- XXL
Note
These colors can be changed from Theme settings -> Colors.
Build, launch, and scale your online store with Effortless, a premium Shopify theme for Online Store 2.0. Effortless is a quick launch theme, easy to configure, allowing merchants to launch an online store fast and start selling immediately with minimal effort. Increase your site traffic and sales with powerful features and functionality such as an integrated referral and rewards program, mobile responsive design, user-friendly layout, promos, upsells, quick buy options and more. Download the Effortless theme today and start selling more online with Shopify.
Welcome to Effortless, a premium Shopify theme for OS 2.0. Use our Documentation as guidance to help setup and build your Shopify store using the Effortless theme.
Custom code tutorials in our documentation such as demo setup instructions, theme customizations and theme updates are supported.
If you require further assistance such as customizations, app-integrations or theme updates, hire a Shopify Expert for help. (Services are not included in the cost of your theme.)
Still need help? Browse FAQ's or Contact
Setting |
Description |
|
Background color |
Select the background color from the dropdown list. |
|
Show social media links |
Select this checkbox to show/hide the social media icons. |
|
Icons color |
Select social media Icons color. |
|
Announcement block settings |
Text |
Enter text to display an announcement message. 8 words max recommended. |
Link text |
Add text for the link url. |
|
Link |
Add a link to the text CTA. |
|
Text color |
Select announcement text color |
|
Link color |
Select the color of the announcement CTA/link. |
Seven primary navigation types are provided:
Setting |
Values |
|
Logo |
Image |
Use the logo selector option to set up an image to use as a logo. The recommended image dimensions are 247px x 47px (pixels). The recommended image type is png.
|
Custom logo size |
Adjust the slider Custom logo size to set a size for the logo image between 50px and 250px (pixels). |
|
Main menu |
This feature will help you import menus from Shopify's default navigation list that is available in the backend. It will be displayed as the menu in the Header. |
|
Enable sticky header |
The Header remains on the screen as customers scroll up |
|
Menu promo |
Menu promo will only be displayed when the logo position is set to "Logo left, navigation drawer" or "Logo center, navigation drawer". |
|
Products heading |
Change the heading of the menu promo. |
|
Product |
Select the products to be displayed in the menu promo. |
Setting |
Description |
Display mode |
Check the box to display the newsletter popup. |
Delay |
Set the delay between 10 - 60 seconds for when the popup will appear on the website. |
Frequency |
Set the cookie expiration period (days); once expired, the popup will reappear on the storefront for the user. |
Image |
Select the popup image.The recommended image dimensions are 600px x 684px (pixels). The recommended image type is jpg. |
Heading |
Enter text to display as a title on the popup. |
Text |
Enter text to display the description on the popup.16 words max recommended. |
Button text |
Enter text to display over the button. For example - Learn More. |
Button link |
Enter a URL to redirect the button; this link will open when a store visitor clicks on the button. |
Newsletter |
Enable the Newsletter form to show in the popup. |
This section is used to add a slideshow to your home page. Users can add up to 5 slides. Each slide has its own settings for better visualization and engagement.
Setting |
Description |
|
Slide navigation style |
You can select arrows/dots from the dropdown |
|
Auto-change slides |
Enable this checkbox for the slides to automatically transition. |
|
Slider height |
Configure the slider height for desktop and mobile. |
|
Add slide |
Slide image |
Add desktop/mobile images for the slide.The recommended image dimensions for desktop are 1920 x 1080px (pixels).The recommended image dimensions for mobile are 420 x 680px (pixels). The recommended image type is jpg. |
Heading |
Enter text to display as the slide title. |
|
Text |
Enter text to display as the slide description. 18 words max recommended. |
|
Button text |
Enter text to display over the button. For example - Learn More. |
|
Button link |
Enter a URL to redirect the button; this link will open when a store visitor clicks on the button. |
Setting |
Description |
||
Heading |
Enter text to display as a section title. |
||
Background color |
Select a background color from the dropdown for the entire section. |
||
Text color |
Select a color for heading and description text. |
||
Add column |
Image |
Select an image to show. The recommended image dimensions are 64px x 64px (pixels). The recommended image type is png. |
|
Heading |
Enter text to display as the column title. |
||
Text |
Enter text to display as column description. 26 words max recommended. |
||
Button text |
Enter text to display over the button. For example - Learn More. |
||
Button link |
Enter a URL to redirect the button; this link will open when a store visitor clicks on the button. |
The Effortless theme offers a collection list, to display different collections.
Setting |
Description |
||
Heading |
Enter text to display as a section title. |
||
Background color |
Select a background color from the dropdown for the entire section. |
||
Overlay color |
Select overlay background color for the collection tiles. |
||
Overlay color (Hover) |
Select overlay hover background color for the collection tiles. |
||
Text color |
Select any color for the text. |
||
Enable view all |
Enable/Disable the displaying of the View all buttons. |
||
Add collection |
Custom image |
Add an image to display a custom image for the collection tile. The recommended image dimensions are 660px x 406px (pixels). The recommended image type is jpeg. |
|
Collection |
Select a collection to be displayed. |
The Effortless theme offers a collection list, to display different collections.
Setting |
Description |
|||
Heading |
Enter text to display as a section title. |
|||
Color scheme |
Select a background color from the dropdown for the entire section. |
|||
Add product |
Select product |
Select any product to display in the slider. |
||
Type |
Select the display type for menu options, either as a dropdown or pills. |
This section displays products from the selected collection. Customize this section by adjusting the content and number of products to display together in this slider.
Setting |
Description |
|||
Background color |
Select a background color from the dropdown for the entire section. |
|||
Text color |
Select any color for the heading text. |
|||
Background alternative |
Enable the checkbox to allow an alternative background color. |
|||
Heading |
Enter text to display as the section title. |
|||
Collection |
Select a Collection to display the products. |
|||
Enable view all |
Enable/Disable the displaying of the View all buttons. |
|||
Button text |
Enter text to display over the button. For example - View All. |
Customize the look and feel of your image tiles using the following settings:
Setting |
Description |
||||
Background color |
Select the background color of the text box. |
||||
Text color |
Select color for the text. |
||||
Section full width |
Enable section to full width. |
||||
Add image tile |
Layout |
|
|||
Image |
Select an image to show in the image tile. The recommended image dimensions are 770px x 700px (pixels). The recommended image type is jpg. |
||||
Heading |
Enter text to display as a title of the Image tile. |
||||
Subheading |
Enter text to display as a subheading of the Image tile. |
||||
Text |
Enter text to display as a description of the Image tile. 26 words max recommended. |
||||
Button text |
Enter text to display over the button. For example - Learn More. |
||||
Button link |
Enter a URL to redirect the button; this link will open when a store visitor clicks on the button. |
||||
Text center |
Enable this checkbox to center align the text. |
This section will display the top brands or logo list.
Setting |
Description |
||||
Slide navigation style |
You can select arrows/dots from the dropdown. |
||||
Auto-change slides |
Enable this checkbox for the slides to automatically transition. |
||||
Dots color |
Select a color for the slider dots navigation. |
||||
Delay |
Set the autoplay slider delay between 5 - 10 seconds. |
||||
Heading |
Enter text to display as the section title. |
||||
Background color |
Select the background color of the entire section. |
||||
Text color |
Select color for the text. |
||||
Add image |
Image |
Select an image to show the logo. The recommended image dimensions are 200px x 70px (pixels). The recommended image type is png. |
|||
Image link |
Add a link to the logo's image. |
This section is used in the form of a slider to add reviews and feedback from happy customers. You can add up to 5 quotes under this section. There are two styles of testimonials:
Setting |
Description |
||||
Slide navigation style |
You can select arrows/dots from the dropdown. |
||||
Auto-change slides |
Enable this checkbox for the slides to automatically transition. |
||||
Dots color |
Select a color for the slider dots navigation. |
||||
Delay |
Set the autoplay slider delay between 5 - 10 seconds. |
||||
Heading |
Enter text to display as the section title. |
||||
Background color |
Select the background color of the entire section. |
||||
Text color |
Select color for the heading text. |
||||
Star color |
Select color for the stars review. |
||||
Empty star color |
Select color for the empty stars review. |
||||
Background color |
Select the background color of the section. |
||||
Enable view all |
Enable/Disable the displaying of the View all buttons. |
||||
Button link |
Enter a URL to redirect the button; this link will open when a store visitor clicks on the button. |
||||
Add review |
Star rating |
Select a review rating from the dropdown. |
|||
Text |
Enter text to display as a review. 12 words max recommended. |
||||
Author |
Enter author name for the review. |
Setting |
Description |
|||||
Slide navigation style |
You can select arrows/dots from the dropdown. |
|||||
Auto-change slides |
Enable this checkbox for the slides automatically transition. |
|||||
Delay |
Set the autoplay slider delay between 5 - 10 seconds. |
|||||
Heading |
Enter text to display as the section title. |
|||||
Blog |
Select a blog to show the blog posts. |
|||||
Blog posts |
Select the number of blog posts to be displayed. |
|||||
Enable view all |
Enable/Disable the displaying of the View all buttons. |
|||||
Add blocks |
Add heading |
Add this block for the blog post title. |
||||
Add excerpt |
Add this block for the blog post excerpt. 18 words max recommended. |
|||||
Add link |
Add this block for the Read more link. |
Setting |
Description |
||||||
Background color |
Select the background color of the entire section. |
||||||
Text color |
Select the text color for the heading text. |
||||||
Enable full height |
Enable/Disable full height of the section. |
||||||
Desktop image placement |
Select text/image to determine which wil be displayed first from the dropdown. |
||||||
Enable text center |
Enable this checkbox to center align the text. |
||||||
Add blocks |
Heading |
Add the heading block for the section title. |
|||||
Text |
Add description text. 26 words max recommended. |
||||||
Button |
Enter text and url of the button |
||||||
Image block |
Add multiple image blocks to make it a slider. |
||||||
Slide image |
Select image for the slider. The recommended image dimensions are 800px x 700px (pixels). The recommended image type is jpeg. |
||||||
Select product |
Select a product for image hotspots and change their vertical and horizontal positions. |
This section is used to display a featured review/feedback from a happy customer.
Setting |
Description |
|||||
Slide navigation style |
You can select arrows/dots from the dropdown. |
|||||
Auto-change slides |
Enable this checkbox for the slides to automatically transition. |
|||||
Dots color |
Select a color for the slider dots navigation. |
|||||
Delay |
Set the autoplay slider delay between 5 - 10 seconds. |
|||||
Background color |
Select a background color for the entire section. |
|||||
Add blocks |
Image |
Add a profile image for the testimonial author. |
||||
Heading |
Enter the author's name for the testimonial. |
|||||
Text |
Enter the text to be displayed as a featured testimonial. 26 words max recommended. |
Setting |
Description |
||||||
Background color |
Select a background color for the entire section. |
||||||
Text color |
Select a text color. |
||||||
Border color |
Select a border color for the newsletter form. |
||||||
Button color |
Select a color for the email newsletter button. |
||||||
Add blocks |
Heading |
Add the heading block for the section title. |
|||||
Subheading |
Add description text. |
Setting |
Description |
|||||||
Background color |
Select background color for the entire section |
|||||||
Text color |
Select a text color. |
|||||||
Add blocks |
Heading |
Add the heading block for the section title. |
||||||
Description |
Enter text to display as a description of the section. 26 words max recommended. |
|||||||
Button |
Add button label and url. |
This section is used to add the custom liquid code for any advanced customizations such as app snippets. Refer to Shopify developers: Custom liquid reference (opens new window).
Setting |
Description |
|
Liquid |
Enter the liquid template language code. For more understanding, refer to Shopify developers: Liquid reference. |
|
Style |
Set the alignment of the section to the left, center, or right. |
|
Color |
Background |
Select color from the options:
|
Section spacing |
Top spacing (desktop) |
Adjust the slider to add spacing at the top of the section on the desktop. |
Bottom spacing (desktop) |
Adjust the slider to add spacing at the bottom of the section on the desktop. |
|
Top spacing (mobile) |
Adjust the slider to add spacing at the top of the section on the mobile. |
|
Bottom spacing (mobile) |
Adjust the slider to add spacing at the bottom of the section on the mobile. |
This section represents the map that can be used to show the store location.
How to obtain a Google iframe code?
Setting |
Description |
|
Enable full width |
Select this checkbox to show/hide the map in the full width display. |
|
Address |
Type the address you want to display in the maps. |
|
Style |
Choose map style from given options such as default, satellite, hybrid, and terrain. To display the map, you have to add a 'Google maps API key' to the Theme settings -> Google Maps section. |
|
Color |
Background |
Select color from the options:
|
Google Maps API Key Guide
The Google Maps platform protects its products from unauthorized use by limiting API calls to authenticated users with proper credentials (i.e., an API key, this is a unique alphanumeric string that associates a Google billing account with the project and the specific API/SDK).
The API key is a UID (unique identifier), which authenticates all requests associated with the project for usage and billing purposes.
Pre-Requisites
A project with a billing account and the Maps JavaScript API are required before you can start. See Set up in Cloud Console for further information.
Fill in the required details:
Project name |
Use the default name or enter a customized name. You can change the project name at any time. For further information, see Identifying projects. |
Project ID |
Use the default or click "EDIT" to add a "Customized ID" that "Google APIs" use as a unique identifier for the project. |
Billing account |
Select a billing account for the project. This option is only displayed if you have more than one billing account. |
Permissions |
Users must be a "Billing account administrator" or "Project billing manager" to associate a project with the billing account. For further information, see the billing access control documentation. |
Location |
If users have an organization to link the project to, click Browse and select it; otherwise, choose "No organization." For further details, see Creating and Managing Folders and Relationships between organizations, projects, and billing accounts. |
To create a Google Maps API Key:
Add Gift Wrapping block
Add Gift Wrapping for specific products only
Enable the Gift Wrapping option for specific products
Add Gift Wrapping for a specific product
Exclude Gift Wrapping for specific products
Exclude the Gift wrapping option for specific products
Exclude Gift wrapping for a specific product
Setting |
Description |
|||||||
Text |
Add text for the faq to show as a description. 26 words max recommended. |
|||||||
Background color |
Select a background color from the dropdown for the entire section. |
|||||||
Text color |
Select the text color. |
|||||||
Icon color |
Select faq icons color. |
|||||||
Add faq |
Add a faq box for the question and answer. |
Color: From here, you can select the colors you want to use throughout the theme. Through this main setting, you perform the following settings:
Primary color:
Secondary color:
Header:
Footer:
Typography: From here, you can make font-related customizations using different options.
Cart: Customize the look and feel of the cart drawer using the following settings:
Country/Language selector: Select the checkbox to enable the country/region and language selector.
Badges: Select the color for the product badges.
Social: Use this setting to link your Shopify store to your social media handles.
Search: Customize search results using the following settings:
Favicon: These are tiny icons that appear in browser tabs, address bars, and bookmarks menus near your site's url or title. Users can upload favicon icons by clicking on the Change button under the favicon setting.
Please note that an image size of 32 x 32px (pixels) is recommended.
Checkout: With these settings, you can change the look and feel of the checkout page.
This page will automatically list all the current collections in your store. All collections are listed alphabetically by default.
Setting |
Description |
|
Heading |
Enter text to display as a title on the collection page. |
|
Overlay color |
Select the background overlay color for the collection card. |
|
Overlay color hover |
Select the hover background overlay color for the collection card. |
|
Text color |
Select the text color for the collection card. |
|
Sort collections by |
Choose an option from the list to sort your collection list. The list includes the following options:
|
This page will list all the products in your collection list. Users can choose to sort or filter the product listings on this page using various options.
Setting |
Description |
|
Show collection description |
Select this checkbox to show/hide the collection description on the page. |
|
Show collection image |
Select this checkbox to show/hide the collection image on the page. |
|
Show sorting |
Select this checkbox to enable sorting on the page. |
|
Pagination |
Select either paged navigation or infinite scrolling. |
|
Collection navigation |
Select this menu to display the entire collections list. |
|
Show vendor |
Enable this checkbox to show/hide the vendor name on the product card. |
The Default product page allows you to customize the appearance of products.
It has the following types of blocks:
Setting |
Description |
|
Title/Heading |
Displays the product’s title; there are no customizable block settings available for this. |
|
Description |
Displays the product description on the page. |
|
Product rating |
Displays customer reviews and ratings. These reviews can be included by adding the Shopify reviews app. |
|
Price |
Add this block to display the product’s price like Sale and Compare at price. There are no customizable block settings available. |
|
Quantity box |
Add this block to display a quantity selector, for selecting the number of products to purchase. It has no customizable block settings available. |
|
Variant picker |
Displays a variant picker for selecting variants of a product. There are no customizable block settings available. Please refer to Theme settings -> Product for the different variants styles (Dropdown and Pills/Color swatches). |
|
Availability |
Displays the product availability. There are no customizable block settings available. |
|
Size chart |
Enable this checkbox to show/hide the Size chart option. |
|
Buy button |
Displays the “Add to cart” and “Buy now” buttons in the Featured product section. |
Recommended products:
If a customer redirects to a product page from your store, related products will be displayed in the product recommendation section.
Setting |
Description |
|||||||
Heading |
Add title text to be displayed for the product recommendations. |
Recently Viewed:
Setting |
Description |
|||||||
Heading |
Add title text to be displayed on the Recently Viewed section. |
Upload a Color Swatch
Create a Variant
Setting |
Description |
|
Color |
Add a Color name for the variant in the Options panel. |
|
Image |
Click Add image or Choose existing to populate the image for the variant. |
|
Pricing |
Price |
Select a currency and enter a price (by default the price of the original product is listed). |
Compare at price |
Select a currency and enter a compare at price (by default the compare at price of the original product is listed). |
|
Charge tax on this product |
Check the box if the product is subject to sales tax. |
|
Cost per item |
Enter a cost per item (customers won’t see this). |
|
Inventory |
SKU |
Enter a SKU for the variant. |
Barcode |
Enter a Barcode for the variant. |
|
Track quantity |
Optional: Check the track quantity box. |
|
Quantity |
Available |
Enter the quantity of the variant at each location listed. |
Shipping |
Phyical Product? |
Configure the Shipping - Check the box if the product is a physical product. |
Weight |
Enter a weight if it is a physical product |
|
Customs Information |
Country/Region of origin |
Enter customs information for the product - Country of manufacture. |
HS (Harmonized System code) |
Enter customs information for the product - HS (Harmonized System) code. |
Add a Video to a Variant
Locate the variant id in the url as shown in the screenshot below:
Add the variant id to the video alt text using the following format:
variant=[variant id from your url]
The example in the screenshot above would be:
variant=42147236118703Published blogs can be viewed and read from this page.
To understand more about blogs, please refer to Shopify blog posts.
Setting |
Description |
|||||||
Show featured image |
Select this checkbox to show/hide the featured image. The recommended image dimensions are 420px x 375px (pixels). The recommended image type is jpg. |
|||||||
Enable sidebar |
Select this checkbox to show/hide the sidebar. |
It has the following types of blocks:
Block |
Description |
Heading |
Add this block to display the article title. You can show/hide the date and author name from this block. |
Excerpt |
Add this block to display the article excerpt. 18 words max recommended. |
Link |
Add this block to display the Read more link. |
Show category in sidebar |
Add this block to display categories in the sidebar. This block only works if the sidebar is enabled. |
Show recent articles in sidebar |
Add this block to display recent articles in the sidebar. This block only works if the sidebar is enabled. |
This is the page where published blogs can be viewed and read.
To understand more about blogs, please refer to Shopify blog posts.
Setting |
Description |
Featured image |
Add this block to display the article image on the page. |
Heading |
Add this block to display the article title. You can show/hide the article publish date and author name from this block. |
Content |
Add this block to display article content. |
Social share buttons |
Add this block to display the social share icons. |
Show related articles |
Add this block to show/hide the filtered list of similar articles. |
This page shows all the products that the customers have selected to purchase.
Use the settings to customize the password page.
Settings |
Description |
Logo |
Use the logo selector option to set up an image to use as a logo.
|
Custom logo width |
Adjust the slider Custom logo width to set a size for the logo image inside the section between 50px and 250px (pixels). |
Merchant Support
Still need help? Browse FAQ's or Contact
Support Hours:
Monday - Friday
9:00am - 5:00pm EST (Excluding public holidays)
We answer all questions regarding our theme within two business days.
We will never sell or share your information. Read more in our Privacy Policy.
Configure the Social media icons
Customize the look and feel of your social media icons using the following settings:
Setting
Description
Background color
Select the background color of the entire section.
Text color
Select the text color.
Icons in accent color
Enable the checkbox to change the social media icons color to the accent color.
Add heading
Enter text to display as the section title.