Perfume Store Pro

Introduction

↑ Back to top

Thank you for choosing the Perfume Store Pro WordPress Theme to power your WooCommerce website.

This setup guide will walk you step-by-step through installing, configuring, and customizing your theme, helping you launch a beautiful, mobile-friendly, and high-converting online perfume store with confidence. Whether you are setting up your first shop or upgrading an existing one, this documentation ensures a smooth and user-friendly experience.

About Perfume Store Pro Theme

↑ Back to top

Perfume Store Pro is an elegant and modern WooCommerce theme crafted for online stores selling perfumes, fragrances, cosmetics, beauty products, and luxury gift items. Featuring a fully responsive layout, fast performance, and Full-Site Editing (FSE) support, this theme enables you to create a stunning, conversion-focused online shop without writing a single line of code.

Required Plugins

↑ Back to top

WooCommerce is the essential plugin required to run your online store. Perfume Store Pro uses WooCommerce blocks to power product pages, shop layouts, cart and checkout features, and all core ecommerce functionality. Please ensure WooCommerce is installed and activated before setting up your store.

Recommended Plugins

↑ Back to top

Perfume Store Pro integrates smoothly with several third-party plugins to enhance functionality and improve the user experience of your online store.

• WPForms – Easily create contact forms, inquiry forms, or newsletter sign-up forms to improve engagement and communication.

Installation

↑ Back to top

Follow the steps below to install the Perfume Store Pro theme on your WordPress website. If you run into any issues during setup, our support team is always ready to assist.

Free Installation Service

↑ Back to top

Although theme installation normally falls outside standard support, we offer a one-time complimentary installation service for all verified Perfume Store Pro customers.

To request this service:

1. Visit our contact page and contact the support team.
2. Securely share your WordPress admin login details.
3. Our team will install the theme and configure it to look exactly like the demo.

Installation is typically completed within 3 business days after receiving your details.

Installing the Theme

↑ Back to top

The easiest way to install Perfume Store Pro is through your WordPress dashboard.

1. Log in to your WordPress Admin Panel and go to Appearance > Themes.
2. Click the Add New button at the top.
3. Select Upload Theme.
4. Click Choose File and browse your computer to locate the perfume-store-pro.zip file you downloaded.
5. Click Install Now.
6. Once the installation is complete, click Activate to enable the theme on your website.

Your theme is now successfully installed and ready for setup.

Installing Plugins

↑ Back to top

While Perfume Store Pro can work without WooCommerce, it is strongly recommended to install and activate WooCommerce to unlock the full eCommerce experience, including product listings, shop layouts, cart functionality, checkout pages, and customer account features.

How to Install WooCommerce

1. In your WordPress dashboard, go to Plugins → Add Plugin.
2. Use the search bar and type WooCommerce, then press Enter.
3. Locate the WooCommerce plugin in the results and click Install Now.
4. After installation finishes, click Activate to enable it on your site.

Once activated, WooCommerce will guide you through its store setup wizard, allowing you to configure essentials like payments, currency, shipping, and more.

General Setup

↑ Back to top

With the Perfume Store Pro theme and the powerful built-in customization tools of WordPress, you can easily build your website from scratch and tailor every section to match your brand. From layout and colors to typography and WooCommerce settings, the theme gives you full control to create a professional and elegant online perfume store without any coding knowledge.

Homepage & Blog Setup

↑ Back to top

By default, Perfume Store Pro displays a beautifully designed home page featuring sections such as the hero banner, featured products, testimonials, blog previews, and more—similar to the demo layout.

If you prefer to manually create and assign a custom homepage and blog page, follow these steps:

Step 1: Create a Homepage

1. Go to Pages > Add Page.
2. Enter a title for your page, for example Home.
3. Click Publish to save the new page.

If you are new to creating pages in WordPress, refer to the official WordPress guide on creating pages.

Step 2: Create a Blog Page

1. Go to Pages > Add Page.
2. Enter a title for your page, for example Blog.
3. Click Publish to save the new page.

If you are new to creating pages in WordPress, refer to the official WordPress guide on creating pages.

Step 3: Set Static Pages for Homepage and Blog

Now, tell WordPress which pages should serve as your front page and blog page:

1. Go to Settings > Reading in your WordPress dashboard.
2. Under Your homepage displays, select A static page.
3. For Homepage, choose the page you created for your front page.
4. For Posts page, select the page you created for your blog.
5. Click Save Changes.

Your website will now display a fully designed landing page as the homepage, with a separate page dedicated to blog posts. You’re ready to begin adding products, publishing articles, and customizing your Perfume Store Pro website to match your brand!

Site Logo Setup

↑ Back to top

To add your site logo using the WordPress Site Editor:

1. Go to Appearance > Editor.
2. In the Site Editor, use the search bar or navigate to Patterns > Header > Header.
3. Select the Site Logo block.
4. Upload a new logo or choose one from your Media Library.
5. Adjust the size to ensure your logo displays clearly and fits your design.
6. Click Save in the top-right corner to apply the changes.

Your site logo is now added and will appear across your Perfume Store Pro website.

Navigation Menu Setup

↑ Back to top

A clear and well-structured navigation menu is essential for delivering a smooth browsing experience to your customers.

1. Open the Site Editor and locate the Navigation block—usually placed inside the header area.
2. Click Create a new menu to start building your navigation.
3. Use the + icon to add menu links, including pages, product categories, blog posts, or custom URLs.
4. Arrange the menu items as needed.
5. When finished, click Save to apply your changes.

Your navigation menu is now ready and will help visitors move easily throughout your Perfume Store Pro site.

Customization

↑ Back to top

Perfume Store Pro is built to give you complete creative control over your website without writing a single line of code. Using the intuitive WordPress Site Editor, you can personalize your fonts, colors, spacing, and layout through Global Styles, fine-tune your homepage design, and manage how products appear on the front page. Whether you’re building a fragrance shop or adapting the theme for cosmetics, beauty products, or skincare brands, customization is simple, visual, and flexible.

Global Styles Customization

↑ Back to top

Maintain a consistent and polished look across your entire site using Global Styles:

1. Go to Appearance > Editor.
2. Click the Styles icon (the half-black, half-white circle) in the top-right corner.
3. Choose from the built-in style presets, or customize individual design elements such as colors, fonts, shadows, and layout widths.
4. Preview your changes in real time, and when you’re satisfied, click Save to apply.

Global Styles ensure your Perfume Store Pro website looks cohesive, professional, and perfectly aligned with your brand.

Homepage Customization

↑ Back to top

This guide will show you how to customize the homepage to suit your needs using the Perfume Store Pro theme.

On the default homepage, each major section is clearly labeled, making it easy to identify and customize. For example, you may see groups such as Hero Aroma, Features, WC New Arrivals, Facts, WC Best Sellers, Logos, Testimonials, and more—similar to what appears in the live demo.

You can edit these sections directly in the Site Editor by opening the Front Page Template, allowing you to adjust content, styling, and layout without any coding.

Homepage Products

↑ Back to top

This guide will help you showcase products on your homepage using the Perfume Store Pro theme.

WooCommerce sections on the homepage use built-in WooCommerce product blocks—such as Product Collection, Featured Products, or Best Sellers. These blocks are designed to automatically display items from your store. If no products have been added yet, the sections will appear empty.

Once you have products in your store, you can customize these blocks to control what is displayed, such as product categories, sorting options, and layout, ensuring your homepage highlights the items you want customers to see.

The screenshot below shows the WooCommerce Product Collection block. You can customize this block to suit your needs, including adjusting layout, filters, sorting options, and which products to display.

The screenshot below displays the WooCommerce Best Sellers block. You can customize this block to match your requirements, including selecting which products to feature, adjusting layout options, and modifying display settings.

The screenshot below illustrates the WooCommerce Product Collection block. You can personalize this block to fit your requirements by modifying the layout, filters, sorting options, and the products that appear.

Pages Setup

↑ Back to top

Perfume Store Pro includes several pre-designed page templates, such as:

• About
• Testimonials
• FAQ
• Contact

In this example, we will create and set up the About page. You can follow the same process to create the other pages.

Using Starter Patterns

↑ Back to top

1. Go to Pages > Add New.
2. If Show Starter Patterns is enabled, you will see a selection of built-in layouts.
3. Select the About Page (Perfume Store Pro) pattern.
4. The About Page pattern will load directly inside the editor.
5. Enter a title, such as About, and proceed to customize the content as needed.

Using Block Inserter

↑ Back to top

1. Go to Pages > Add New and enter a title, such as About.
2. Open the Block Inserter ( + icon ).
3. Switch to the Patterns tab.
4. Type About into the search field.
5. Select the About Page (Perfume Store Pro) pattern.
6. The layout will load into the editor, ready for your customization.

Hide Page Title

↑ Back to top

By default, the page title is visible on the frontend. If you prefer not to show the title, you can use the No Title page template:

1. In the editor, click Template > Pages > Change Template.
2. From the template list, choose Page – No Title.
3. Apply and return to the editor.

Publish your page once you’re satisfied.

You can repeat the same steps to create the remaining pages, such as Testimonials, FAQ, and Contact.

Add Products with WooCommerce

↑ Back to top

Adding products in Perfume Store Pro works the same way as any standard WooCommerce store. The theme fully supports all major product types, including:

• Simple Products
• Grouped Products
• External/Affiliate Products
• Variable Products

You can easily add product details such as price, images, variations, stock status, and more.

You can explore the key helpful links below:

Here are some helpful links to better understand WooCommerce product editor features:

Continue adding products to your store, and they will automatically appear on the homepage and shop page. To view your shop, simply click Shop from the header navigation menu.

Additional Custom CSS

↑ Back to top

You can use the following built-in CSS utility classes to hide elements on specific screen sizes:

• hide-on-mobile – hides the element on mobile devices
• hide-on-tablet – hides the element on tablet devices
• hide-on-desktop – hides the element on desktop devices

How to Add Custom CSS Classes to a Block

↑ Back to top

To apply any of these classes to a block:

1. Select the block you want to modify (e.g., Buttons block).
2. Click the Settings icon in the top-right corner of the editor.
3. Scroll down and open the Advanced section.
4. Find the Additional CSS Class(es) field.
5. Enter one of the class names, for example:
   • hide-on-mobile to hide the block on mobile devices
   • hide-on-tablet to hide the block on tablet devices
   • hide-on-desktop to hide the block on desktop devices

Note: Do not add a dot (.) when entering class names. For example, type hide-on-mobile instead of .hide-on-mobile.

Site Editor

↑ Back to top

If you’re new to WordPress or working with a Block Theme for the first time, becoming familiar with features like Site Styles, Patterns, Templates, and Template Parts will make it much easier to customize and design your website exactly the way you want.

Block Editor

↑ Back to top

FAQs

↑ Back to top