UPayments introduces a new theme for its Online Store Solution. The new Pro Theme represents a significant visual and experiential upgrade for the merchant’s customers. The Pro Theme allows merchants to truly represent their business brand, products and services in a compelling way.
To acquire the Pro Theme, contact our team to add its subscription to your Online Store.
Learn more about the Pro Theme Image Guide for Banners and Layouts
TABLE OF CONTENTS
- About Pro Theme
- Pro Theme Sections and Features
- Enabling the Pro Theme
- Basic Settings
- Header Categories Settings
- Main Carousel Banner Settings
- Sale Section Settings
- Small Carousel Banner Settings
- Shop by Category Settings
- Special Sale Banner Settings
- New Arrivals Section Settings
- Shop by Brands Settings
- Services Settings
- Newsletter Settings
- Footer Categories Settings
- Sale Banners Settings
- Special Products Sections
- Pro Theme Additional Features
About Pro Theme
Compared to the Simple theme, the Pro Theme is a complete overhaul with its enhancements and new additions:
Brands
The new Pro Theme introduces Brands as another layer of organization that works side by side with the product categories. Brands are collections of products that can belong to different categories, but can be organized and displayed in one page. This can be utilized for actual product brands or to creatively combine various products to form collections of products that complement each other or are part of a recommended purchaseHeader and Footer
The Pro theme offers a complete ecommerce experience with a Header and Footer, each containing their respective crucial information and playing a role in the overall shopping experience. Compared to the simple theme, which only had a simple header, the Pro Theme’s Header Displays:
- Top Categories
- All Products Button that allows customers to access all products
- Delivery Button where customers choose their location
- Currency Switcher Button
- Language Switcher Button
- Search Button for a swift access to searching the store
- Sign in button to allow customers to sign up and login
- The Cart Button
As for the Pro Theme’s Footer, it Displays: - Social: All the store’s social media channels
- Contact: Includes a button to the Contact us page, store’s email, whatsapp
- and phone number
- Our Information: Includes Privacy Policy, Terms & Conditions and Refund
- Policy Links
- Top Categories
- Payment Methods
Product Tags
Enhances the store’s search capabilities by associating products with tags or search terms that customers might be searching for
Store Sections
The store’s simple theme offered four layouts that slightly altered the general look, feel and user experience of the store’s front page. This shifted between a full page list of products segregated by categories with a top banner or a side list accompanied by a side banner.
With the new Pro Theme, it offers three layouts, each with varying sections that overlap with some offering unique sections. These sections include:
Basic Settings: Allows setting the store logo, logo shape (Square or Circle), action color (Affects product title, price and add to cart button colors), product sale label background color, out of stock background color, discount label (Displaying the word Sale or the actual discount percentage)
Header Top Categories: Choosing the categories to display on the header
Carousel: Adding moving carousel banners, each with a URL destination when clicked
Flash Sale: A section with a banner and a collection of products that are currently on sale
Small Carousel: A section with small moving carousel banners, each with a URL destination when clicked
Shop by Category: A section that displays chosen categories with their images
Special Sale Banner: A page wide banner with a URL destination when clicked
New Arrivals: A section where newly added products are displayed
Shop by Brand: A section that displays chosen brands with their images
Services: An informative section that displays small images, titles and descriptions for services
Newsletter: A section where customers can sign up for the newsletter
Footer Top Categories: Choosing the categories to display on the footer
Featured Products: A section to display featured products
Triple Banners: Two triple banner sections distributed across the website
Sale Carousel: A massive banner that covers the entire view of the website so that it grabs attention
Image Handling
Each of the sections’ banners and images require four images, two for each language. This will ensure having a desktop view specific image and a mobile view specific image to ensure that the best quality image is displayed on each view
3. 6. Three Category Levels
The simple theme only supported two category levels, Main and Sub. But, the Pro Theme supports an extra sub-sub category layer to further allow merchants to customize and organize their products hierarchy
- Natively Mobile Responsive
Given that over 98% of ecommerce customers visit stores on mobile devices, the Pro Theme is truly responsive on mobile devices. This ensures the best user experience and interface on mobile devices with native-like navigation and easy swift navigation across all sections
Pro Theme Sections and Features
The following steps detail how to customize your Pro Theme and utilize its features
Enabling the Pro Theme
Click Store
Click Design
After successfully purchasing your Pro Theme Subscription, the Design section will feature the three Pro Theme Layouts unlocked. Click on one of these layouts to activate the Pro Theme
Most design sections and elements are common across all three layouts, some are common between two of them and some are unique to specific layouts. The following is an overview of these sections and their options.
Basic Settings
Click to Upload Logo
Image Guideline: Minimum 400x400 Pixels - Square Image - JPG,JPEG,PNG
Choose the Logo Shape between Square and Round
Choose the colors:
- Title - Price - Button Color: Affects Title - Price - Button Color
- Product Sale Background Coolor: Affects the products with discounts background color
- Out of Stock Stock Background Color: Affects the out of stock products background color
Use the color picker to choose the colors or enter the color values (Hex or RGB)
Choose the Discount Label:
- The Word 'Sale': Shows the word "Sale"
- Percentage(%): Shows the discount amount
Header Categories Settings
Available in: Essential - Extended - Modern Pro Theme Layouts
Your chosen categories will appear in the header section
Choose the Header Categories
You will be able to add up to 7 Categories
For the Header Categories section and all following sections, always click on Save to save your settings
Main Carousel Banner Settings
Available in: Essential - Extended - Modern Pro Theme Layouts
The Main Carousel Banner allows you to add moving carousel banners, each with a URL destination when clicked
For the Main Carousel Banner Settings and all the following sections, you can toggle Display to show or hide the section on your website
To add new Carousel Banners, click the +Add More button
Enter the Carousel Timeout, this will determine the shifting and transition time between each slide and the next one
You can Delete a banner by clicking the red X button on the top right corner of the Carousel tab
For Each Carousel Banner, upload the Banner Images:
- Desktop View: One for English and one for Arabic
- Image size: 1800x800 Pixels - JPG, JPEG and PNG
- Mobile View: One for English and one for Arabic
- Image size: 480x275 Pixels - JPG, JPEG and PNG
Enter the Call Action URL, this will be the link destination when the banner is clicked
You can toggle Show On Homepage to show or hide the banner
Sale Section Settings
Available in: Essential Pro Theme Layouts
Sale Section: A section with a banner and a collection of products that are currently on sale
Upload the Banner Images:
- Desktop View: One for English and one for Arabic
- Image size: 1190x450 Pixels - JPG, JPEG and PNG
- Mobile View: One for English and one for Arabic
- Image size: 450x150 Pixels - JPG, JPEG and PNG
Enter the Call Action URL, this will be the link destination when the banner is clicked
Click Save
Small Carousel Banner Settings
Available in: Essential Pro Theme Layouts
Small Carousel Banners: A section with small moving carousel banners, each with a URL destination when clicked
To add new Carousel Banners, click the +Add More button
Upload the Banner Images:
- Desktop View: One for English and one for Arabic
- Image size: 580x360 Pixels - JPG, JPEG and PNG
- Mobile View: One for English and one for Arabic
- Image size: 450x150 Pixels - JPG, JPEG and PNG
Enter the Call Action URL, this will be the link destination when the banner is clicked
Click Save
Shop by Category Settings
Available in: Essential - Extended - Modern Pro Theme Layouts
Shop by Category: A section that displays chosen categories with their images
Click the toggle to Display Shop by Category
Tip: To choose which categories are shown in the Shop by Category section, follow the steps below
Click Catalog then Categories
Click Actions then Edit
Toggle the Show on Homepage option to show that category on the Shop by Category section
Special Sale Banner Settings
Available in: Essential Pro Theme Layouts
Special Sale Banner: A page wide banner with a URL destination when clicked
Upload the Banner Images:
- Desktop View: One for English and one for Arabic
- Image size: 1800x570 Pixels - JPG, JPEG and PNG
- Mobile View: One for English and one for Arabic
- Image size: 450x180 Pixels - JPG, JPEG and PNG
Enter the Call Action URL, this will be the link destination when the banner is clicked
New Arrivals Section Settings
Available in: Essential Pro Theme Layouts
New Arrivals: A section where newly added products are displayed
Click the toggle to Display New Arrivals
Shop by Brands Settings
Available in: Essential - Extended - Modern Pro Theme Layouts
Shop by Brand: A section that displays chosen brands with their images
Click the toggle to Display Top Brands
Tip: To choose which brands are shown in the Shop by Brand section, follow the steps below
Click Catalog then Brands
Click Actions then Edit
Toggle the Show on Homepage option to show that Brand on the Shop by Category section
Services Settings
Available in: Essential Pro Theme Layouts
Services: An informative section that displays small images, titles and descriptions for services
Choose the Services Background Color
Click +Add More to add new Service Cards
You can add up to 4 Service Cards
For each Service Card:
- Upload Service Image: 100x100 Pixels - JPG, JPEG or PNG
- English Title
- Arabic Title
- English Service Description
- Arabic Service Description
Newsletter Settings
Available in: Essential - Extended - Modern Pro Theme Layouts
Newsletter: A section where customers can sign up for the newsletter
For the Newsletter Section:
- Choose the Newsletter Background
- Type the Subscribe Title EN
- Type the Subscribe Title AR
Footer Categories Settings
Available in: Essential - Extended - Modern Pro Theme Layouts
Your chosen categories will appear in the footer section
Choose the Top Categories (Footer)
You will be able to add up to 4 Categories
Click Save
Sale Banners Settings
Available in: Modern Pro Theme Layouts
Sale Banner: Allows displaying two banners side by side
For each banner, Upload the Banner Images:
- Desktop View: One for English and one for Arabic
- Image size: 885x430 Pixels - JPG, JPEG and PNG
- Mobile View: One for English and one for Arabic
- Image size: 690x360 Pixels - JPG, JPEG and PNG
and Enter the Call Action URL, this will be the link destination when the banner is clicked
Special Products Sections
Tip: The Pro Theme provides Special Products Sections that allow you to display your products in each section by assigning products to that section
For the Sale Section Settings, you can toggle Display to show or hide the section on your website
For the Featured Products Section, you can toggle Display to show or hide the section on your website
Tip: To assign products to the special sections, follow the steps below
Click Catalog then Products
Click Actions then Edit
Under the Advanced section, click the Label dropdown
Choose the special section where you want to assign the product
Pro Theme Additional Features
Tip: When you enable the Pro Theme, you will gain access to additional features including:
- Product Tags
- Three Category Levels
- Brands
Product Tags
Enhances the store’s search capabilities by associating products with tags or search terms that customers might be searching for
Under the Product's Advanced Section, type the tags you want to add
When searching for those tags assigned to products, your customers will find your products easily
Three Category Levels
The simple theme only supported two category levels, Main and Sub. But, the Pro Theme supports an extra sub-sub category layer to further allow merchants to customize and organize their products hierarchy
Under each category, you can assign a Parent Category and a Sub-Category with your current category being at the third level
Brands
The new Pro Theme introduces Brands as another layer of organization that works side by side with the product categories. Brands are collections of products that can belong to different categories, but can be organized and displayed in one page. This can be utilized for actual product brands or to creatively combine various products to form collections of products that complement each other or are part of a recommended purchase
Was this article helpful?
That’s Great!
Thank you for your feedback
Sorry! We couldn't be helpful
Thank you for your feedback
Feedback sent
We appreciate your effort and will try to fix the article