Customizing Your Homepage: A Guide to the Homepage Editor

 

Hey Ficos Merchants! Your online store’s homepage is your digital storefront. To give you complete creative control, we’ve built the powerful new Homepage Editor, a tool that lets you design a dynamic homepage that automatically showcases your best products, categories, and business information.

 

This guide will walk you through how to use the editor to add, remove, and reorder content blocks, and—most importantly—how to tell Ficos what to display in those blocks to create a beautiful, effective homepage that drives sales.

 

About the Author: This article is written by the Ficos Retail team. With years of experience building mobile-first solutions for businesses, we understand the need for powerful yet simple tools. The Homepage Editor was designed to give you the flexibility of a professional website builder without any of the complexity, right from your Ficos app. Learn more about our mission at the official Ficos website.

 

Understanding the Editor: How It Works #

 

The most important thing to understand is that the Homepage Editor works together with your individual product, category, and store settings. It’s a simple two-part process:

 

1. The Homepage Editor builds the “shelves.” You use the editor to add a section (like “Featured Products”) and set its rules (e.g., “Show my Bestsellers”).
2. Your Ficos settings “stock the shelves.” You then go to your individual products, categories, or store profile and turn on switches (like “Mark as Bestseller” or “Enable Testimonials”) to make them appear in that section.

 

This approach is incredibly powerful because it means your homepage is always up-to-date. When you approve a new customer testimonial or mark a new product as a “New Arrival,” it automatically appears in the right section without you having to edit your homepage again.

 

A Closer Look at the Homepage Editor Interface #

 

Once you open the editor, you’ll see a simple but powerful interface designed for easy customization:

• The Section List: This shows all the content blocks on your homepage in the order they appear.
• Drag-and-Drop Reordering: Press and hold the handle icon (☰) on any section to drag it up or down, instantly changing the layout of your live website.
• Visibility (Eye Icon): Tap the eye icon to quickly hide or show a section. This is great for seasonal promotions or temporarily disabling a section without deleting it.
• Edit (Pencil Icon): Tap this to open the configuration panel for that specific section, where you can change its title and rules.
• Delete (Trash Can Icon): Tap this to permanently remove a section from your homepage.

 

Step 1: Navigate to the Homepage Editor #

 

To get started, you’ll need to go to your Online Store Settings.

1. From your main Dashboard, tap on Online Store.
2. On the dashboard, find the “Management Shortcuts” card and tap on Online Store Settings.
3. In the “Store Identity” section, tap on Homepage to open the Homepage Editor.

 

Step 2: Add, Remove, and Reorder Your Homepage Sections #

 

This step is where you build the structure of your page.

1. Add a New Section:
   • Scroll to the bottom and tap the “Add Section” button. Choose from the list of available sections.

 

2. Reorder Your Sections:
   • Decide the best flow for your page. Want your categories at the top? Simply press and hold the handle icon (☰) and drag the section where you want it. Your changes are saved automatically!

 

3. Remove a Section:
   • Don’t need a section? Just tap the trash can icon next to it to remove it.

 

Step 3: Tell Ficos What to Display (The Crucial Step) #

 

After you’ve added your sections in the editor, you need to “activate” the content you want to show in them from other parts of the Ficos app.

 

• For “Featured Products” Sections:
  • Go to your Inventory Manager and tap on a product you want to feature.
  • Tap the Edit button.
  • Scroll down to the “Online Store” section.
  • Turn on the switch for “Mark as Featured,” “Mark as Bestseller,” or “Mark as New Arrival.” The product will now automatically appear in any homepage section that is filtered for that flag.

 

• For the “Shop By Category” Section:
  • Go to your Inventory Manager, tap the three dots icon, and select Manage Categories.
  • Tap on a category you want to feature on your homepage.
  • In the “Homepage Options,” turn on the “Feature on Homepage” switch.
  • Use the “Sort Order” field to control its position (e.g., `1` appears before `2`).
  • Don’t forget to upload a Category Image! This is what customers will see on your homepage.

 

• For the “Testimonials” Section:
  • Go to your Online Store dashboard and tap on Testimonials.
  • Here you will see all the reviews submitted by your customers. Simply tap the “Approve” button on the ones you want to showcase. They will automatically appear in the testimonials slider on your homepage.

 

• For the “Contact & Location” Section:
  • This section automatically pulls information from your Store Profile. To update it, go to Settings, tap on Stores, and edit the store connected to your online site.
  • Ensure your Address, Contact Phone, and Opening Hours are filled out correctly. The map will appear automatically if your store’s location is pinned.

 

Step 4: Configure Each Section’s Settings #

 

Finally, go back to the Homepage Editor and tap the pencil icon next to each section to fine-tune its settings.

 

Section Type	What You Can Configure
Hero Banner	This is the big, welcoming image at the top of your site. Set a powerful Headline, a descriptive Subheading, and compelling Button Text. The Button Link tells Ficos where to send the user (e.g., `/search` to link to all products). Finally, upload a high-quality Background Image URL to capture your customers’ attention.
Featured Products	This is your most versatile selling tool. Set the Title (e.g., “Our Top Picks”), choose what to Filter By (“Featured,” “Bestseller,” or “New Arrival”), and set the Limit (how many products to show). This filter must match the flags you set on your products in Step 3.
Shop By Category	Help customers navigate your store visually. Set the Title (e.g., “Browse Our Collections”) and the Limit (how many categories to show). This section will automatically pull in the categories you flagged and imaged in Step 3.
Testimonials	Build trust with social proof. Set the Title for the section (e.g., “What Our Customers Say”). This section will automatically display all testimonials you have approved from the Testimonials management screen.
Contact & Location	Make it easy for customers to find and contact you. Set the Title (e.g., “Visit Us”) and use the switches to control what to display: Show Contact Details (phone/address), Show Opening Hours, and Show Map. The data is pulled directly from your Store Profile.

 

Pro-Tip: A High-Converting Homepage Layout #

 
For a proven and effective homepage, we highly recommend using three separate “Featured Products” sections. This structure is used by the most successful online stores for a reason:

• New Arrivals: Add a section at the top and filter it by “New Arrival.” This immediately shows returning customers what’s new and creates a sense of freshness.
• Bestsellers: Add a section in the middle and filter it by “Bestseller.” This provides social proof and guides new customers toward your most popular items.
• Featured: Use a final section filtered by “Featured” as your own curated collection. This is perfect for seasonal items, promotions, or products you want to highlight.

This combination of newness, popularity, and curation is a powerful selling strategy.
 

Step 5: Save and Go Live #

 

Once you are happy with your layout, tap the “Save” button in the header. This confirms all your changes and takes you back to the settings screen. You can then visit your store’s URL to see your new, custom homepage live!
 

Conclusion #

 

The Homepage Editor is a powerful tool for creating a dynamic storefront. By combining the editor’s layout tools with the flagging system on your products and categories, you can build a professional homepage that is always up-to-date and drives sales. For more helpful tips, visit the Ficos Documentation. Happy designing!