Customizing Modules (page content)
Optimizing YouTube videos for mobile view
Sellfy's Store Customizer
The store customizer allows you to design your Sellfy store so that you can create a unique look and feel that best fits your brand and products. We recommend that you add products before customizing your store so that you can see what your store looks like with your products.
Go to your Sellfy dashboard > Store settings > Customize store to access the store customizer.
Note: Check out Sellfy's themes under 'Store style' to preview your store using different templates.
What are modules?
Modules are used to add content to your store pages; they are the building blocks of each of your store pages. The content you add to store pages using modules is what customers will see when visiting your store.
Each module allows you to add different types of content and you can add as many modules as you like for each page. They appear in the order in which you add them though you can drag and drop them to change the order.
You'll use one of eight modules to add content to your store pages:
- Hero block
- Text panel
- Newsletter form
- Products grid
- Social links
- Contact form
- Embed code
- Spacing
Hero block
This module allows you to use an image and text together in one block. You can add a background color if your image does not cover the entire block or use the Cover all or Repeated pattern to fill in the entire space.
Enter a title and subtitle, edit the text color and align the text left, right or center. You can add multiple Hero blocks to one Page.
Text panel
This module is most useful for text and images, to create a unique Home page or highlight information on any particular page. You can also embed a video using this module.
Click Show container to see a different variation of using this module. You can edit the background and container color too. To edit the font, go to Store style > Typography.
Below is an example of how to embed a YouTube video with the 'Source code' function using the Text panel.
To optimize Youtube videos for mobile, see this section.
Newsletter form
Do you have a newsletter and/or want to create an email list?
Add a newsletter form to invite store visitors to sign up to receive news from you. Make sure to use an inviting and action-oriented title so customers feel more excited to opt in.
Products grid
Add the Products grid to any page where you want customers to be able to shop for your products. Use this module to:
- Enable the Product categories menu
- Customize the page layout and card design (use the aspect ratio for uniform product cards)
- Change the button style and price
- Edit the discount tag (if you're offering a discount)
Use the 'Filter by category' function to display products of a single or multiple categories. Make sure to deselect 'All products'.
If you are using product categories and enable the category menu, they will be displayed at the top of the products module. You can rearrange the order of categories by dragging and dropping them inside the module block. See below:
Social links
Use this module to add social icons to your store that direct customers to your YouTube, TikTok, Instagram, X account and more. Most sellers add social links to the bottom of their store pages but you can place them anywhere you like on your page.
Contact form
It's important to give customers a way to connect with you and ask questions.
Your store has a Contact page set up under Custom pages by default. If you prefer to include the Contact form on a different page you create, such as an About page, you can add the module there.
You may also want to customize the title of the Contact form to make it more personal.
Embed code
The Embed code can be used to add any custom code such as Javascript, HTML, and CSS to your Sellfy store. For example, if you'd like to add a video or GIF to one of your pages, you'll use the embed module to copy-paste the embed code. If you're not familiar with code, you can find some basic help here to get you started.
Here is an example of a seller that uses the embed module to display third-party reviews on their home page.
Below, you can see an example of a seller who embedded their Spotify playlist on their store page. They also linked the button titled Listen to their Spotify playlist.
Spacing
Use this module to add space between other page content in your store.
Navigation menu
The menu on your store, where store pages are displayed is called your Navigation. The navigation module is placed at the top of each page, but can be moved, to the bottom or anywhere in between other modules, by using the arrow function.
The placement of the navigation module is the same across all store pages.
You can customize the navigation module by adding a new store page, single product page, store category or external link (URL).
Do delete a menu item from the navigation, select it in the left-side menu > Delete link > Delete.
Read here to learn more about how to create a sub menu.
Adding and removing modules
- Open the Store Customizer
- Select the page for adding content
- Click + Add module
- Select a new module to add
To replicate an existing module:
- Open the Store Customizer
- Choose a Page
- Select + Add module
- Select Copy last module
To edit or delete an existing module:
- Select a module
- Click 'More' > Delete Module
Get creative with your store
It's easy to get creative with the store customizer and give your store a super unique look! A few ways to make your store stand out are:
- create a landing page
- use images for backgrounds (i.e. with a dark overlay)
- embed a video or GIF
- make a banner for announcing specials, free shipping, limited edition product launches, etc.
- set up modules in an order to work together - for example, use the Text panel for making an announcement and the embed module to add a funny GIF below
- embed a third-party chat on your store page using the custom code section
Creating a banner
You might want to create a banner for your store to make an announcement, advertising a store sale, a special discount, or anything else you want to draw your customer's attention to.
The Text module is a great way to create a simple yet effective banner that can be placed on any store page.
See the video below:
There are many ways to customize your banner. For example, instead of a background color, you can upload a background image, use bold or italic text, emojis, embed a GIF or video using the source code function, and much more.
Optimizing YouTube videos for mobile view
- Delete the "height" section of the code
- Add this line
style="max-width: 100%; aspect-ratio: 16 / 9"at the end of the code
See below for an example:
FAQ
Q: Can I delete a product module that I have duplicated on other pages without affecting the duplicated product modules on other pages?
A: Yes! You can safely delete a module even if it has been duplicated on other store pages.
Q: Can I embed a video or audio file on a Page?
A: Yes! You can embed iframes like YouTube, Vimeo or SoundCloud using the embed module or in the text editor of the Text panel.
Q: Can I remove the powered by Sellfy logo?
A: Yes, if you have a Business or Premium subscription, you can enable the white label solution by turning the toggle switch Hide "Powered by Sellfy" off under 'Store features' in General settings.