Supermarket Plus

Theme Documentation

Please Rate Us For Supermarket Theme

Thank you very much for choosing our Theme.
If you like this Theme, Please (Rate Us)

Supermarket Demo Setup


Installation

Step 1 WordPress Plugin Installation

To install this plugin, you must have a working version of WordPress already installed on your server. WordPress is well-known for its ease of installation.
https://codex.wordpress.org/Installing.WordPress. Please visit this link for installing WordPress.

Step 2 Installation Plugin Through Dashboard (Easy)

  1. First download a zip file from Account Page .
  2. Login as an admin and go to Site administration > Plugins > Install plugins
  3. Click the button ‘Upload plugins
  4. Select the zip file you have downloaded and install it
  5. Activate it

Step 3 Manual Installation using FTP (Advanced)

  • First download a zip file from Account Page .
  • Unzip shoppingcart-plus.zip file at your PC
  • Access your host web server using your favorite FTP client (such as Cyberduck or FileZilla etc).
  • Upload whole folder inside public_html/wp-content/plugins/shoppingcart-plus(folder) and Do not change directory/folder name.
  • Log into your WP admin paneland click on the Appearance->plugins tab.Now click on the ShoppingCart Plus to activate it.

Header Setup

Step 1 Upload Logo/ Fav Icon/ Web Icon

Go to Dashboard > Appearance > Customize > WordPress Settings > Site Title & Logo Options > Upload Site Icon & Site Logo

Step 2 Setup Menu

  1. Go To Apperance > Menu
  2. Create a new menu by clicking on create a new menu
  3. Add your menu items as pages/ Category/ Custom Url from left side menu
  4. Choose “Main Menu” from below Checkbox

Step 3 Setup Top Menu

  1. Go To Apperance > Menu
  2. Create a new menu by clicking on create a new menu
  3. Add your menu items as Pages (Such as login, Myaccount) from left side menu
  4. Choose “Top Menu” from below Checkbox

Setup Catalog Menu

  1. Go To Apperance > Menu
  2. Create a new menu by clicking on create a new menu
  3. Add your menu items as Products in left side menu
  4. Choose “Catalog Menu” from below Checkbox

To display Hot, New in Catalog Menu, To Apperance > Menu and add Title Attribute and css class `title-highlight`

Catalog Menu

To enable class css attribute, At the top right, there you will see Screen options. Click on it. There you will see css classes options. Select it

Step 4 Setup Social Icons

  1. Go To Apperance > Menu
  2. Create a new menu by clicking on create a new menu
  3. Add your menu items as Custom Url from left side menu
  4. Choose “Add Social Icons Only” from below Checkbox

Social Icons

Step 5 Setup Top Information at Header or Footer Widgets

Go to Dashboard > Appearance > Widgets > Drag Text Widget/ Custom HTML at Top Header Info/ Footer Column 4 Sidebar

Top Header Info

paste Below html Code and change according to your needs

<ul>
<li><a title="Call Us" href="tel:+1234567890"><i class="fa fa-phone-square"></i> (123) 456-7890</a></li>
<li><a title="Mail Us" href="mailto:[email protected]"><i class="fa fa-envelope-o"></i> [email protected]</a></li>
</ul>

Step 6 Setup Header Tel. Info

Go to Dashboard > Appearance > Widgets > Drag Text Widget at Header Tel. Info sidebar

Header Tel. Info

Setup Frontpage/ Blog as in Demo

  1. Go to Dashboard > Pages > Add new
  2. Create Home & Blog Page
  3. choose Supermarket Template from Template drop down like as shown in screenshot.

Supermarket Template

  1. Click Save it
  2. Go to Settings > Reading and select Front page displays > A static page (select “Home”) & Posts page ( “Blog”)

Note : Your Home page should have selected Supermarket Template. If you like to display Blog, then select Blog page in POsts page otherwise leave it blank.

Home Page Setting

Setup Front Page Features (Product Categories / Brand)

  1. Install WooCommerce Plugin and activate it. Create products category and upload Category image.
  2. Create WooCommerce Products with featured image
  3. Repeat this process for other products too.

After creating Products with featured image Go to Dashboard > Appearance > Customize > Frontpage Template > Product Featured Brand/ Product Categories > Select Product Category just now you have created

Front Page Features Section

front page features

Display Advertisement Banner Top (Plus)

Go to Dashboard > Appearance > Customize > Frontpage Template > Display Advertisement Banner Top (Plus)

Display Advertisement Banner Top (Plus)

Setup Widgets

Go to Dashboard > Appearance > Widgets

TF: Banner with Text Widget

Now you need to setup Page #1 and Page #2.

  1. Create pages from Dashboard > Pages > Add new
  2. Add title, Content and Featured Image
  3. Click on publish/ Update

Now, go to Dashboard > Appearance > Widgets > Drag Banner with Text Widget at Supermarket Template sidebar

  1. Setup for Page #1 and Page #2
  2. Add Title, Button Text and Button Url
  3. Select Options for Fullwidth (on/off), Single Column Banner (on/off), Widget Title Design (on/off) and Text Color light (on/off)

Banner With Text

TF: Index Info

Setup Page #1, Page #2, Page #3 and Page #4.

  1. Create pages from Dashboard > Pages > Add new
  2. Add title, Content and Featured Image
  3. Click on publish/ Update

Now, go to Dashboard > Appearance > Widgets > Drag TF: Index Info Widget at Supermarket Template sidebar

  1. Setup Title for Page #1, Page #2, Page #3 and Page #4

TF: Index Info

TF: Product Category Image

  1. Install WooCommerce Plugin and activate it. Create products category and upload Category image.
  2. Create WooCommerce Products with featured image
  3. Repeat this process for other products too.

Now, go to Dashboard > Appearance > Widgets > Drag TF: Product Category Image Widget at Supermarket Template sidebar

  1. Setup Title and product category just now created.
  2. Select Options for Category Text Background Color (on/off)

TF: Product Category Image

TF: Product Category Tab Box

  1. Install WooCommerce Plugin and activate it. Create products category and upload Category image.
  2. Create WooCommerce Products with featured image
  3. Repeat this process for other products too.

Now, go to Dashboard > Appearance > Widgets > Drag TF: Product Category Tab Box Widget at Supermarket Template sidebar

  1. Setup Title and product category just now created.
  2. Select Options for Number of Product Category, Number of Product, Widget Title Design (on/off) and Remove Border (on/off)

TF: Product Category Tab Box

TF: Product Grid Column Widget

  1. Install WooCommerce Plugin and activate it. Create products category and upload Category image.
  2. Create WooCommerce Products with featured image
  3. Repeat this process for other products too.

Now, go to Dashboard > Appearance > Widgets > Drag TF: Product Grid Column Widget at Supermarket Template sidebar

  1. Setup Title and product category just now created.
  2. Select Options for Animation (on/off), Widget Deal of the Day(on/off), Widget Title Design (on/off), Border(on/off), No of post, Count down (Ex:- 2021/06/08 )

TF: Product Grid Column Widget

Setup Default WooCommerce Widgets Supermarket Template to Footer

Go to Dashboard > Appearance > Widgets > Drag Product widgets at Supermarket Template FooterColumn 1/2/3/4 sidebar

Supermarket Template FooterColumn 1/2/3/4 sidebar

Setup Default WooCommerce Widgets Supermarket Template to Footer

Go to Dashboard > Appearance > Widgets > Drag Product widgets at Supermarket Template FooterColumn 1/2/3/4 sidebar

Supermarket Template FooterColumn 1/2/3/4 sidebar

Custom CSS

You can add your custom CSS that will overwrite the theme CSS. Go to dashboard >appearance > Customize > Additional CSS

Setup Slider

  1. Create Category/ WooCommerce Category > Make your Post/ WooCommerce Product and select category just you created.
  2. Add featured Image, Title and Content
  3. To display Slider Go to Dashboard > Appearance > Customize > Supermarket Slider Options > Select Category Slider/ Product Category

Setup Product Promotion

  1. To display Product Promotion right to Slider, Go to Dashboard > Appearance > Customize > Slider Options > Product Promotion
  2. Upload Image and add link where you want to like your product.

Slider Settings

  1. To display Slider Go to Dashboard > Appearance > Customize > Slider Options > Slider Settings > Enable Slider/ Promotions (FrontPage from dropdown)
  2. To display Slider Go to Dashboard > Appearance > Customize > Slider Options > Slider Settings
  3. To display Category Slider (by default) Choose Category/ Product Category Slider Choose Default Category from DropDown
  4. To display Product Category Slider Choose Category/ Product Category Slider Choose Product Category from DropDown
  5. To enable slider, select Frontpage or Entire Site option under Enable Slider
  6. Click on Save & Publish

slider settings

Setup Footer Payment Card Information

Go to Dashboard > Appearance > Widgets > Drag Text Widget/ Custom HTML at Footer Column 1/2/3/4 Sidebar

paste Below html Code and change according to your needs


<ul class="payment-card">
<li><a title="American Express" href="#"><i class="fab fa-cc-amex"></i></a></li>
<li><a title="Mastercard" href="#"><i class="fab fa-cc-mastercard"></i></a></li>

 <li><a title="Visa" href="#"><i class="fab fa-cc-visa"></i></a></li>
<li><a title="Paypal " href="#"><i class="fab fa-cc-paypal"></i></a></li>
<li><a title="Diners Club" href="#"><i class="fab fa-cc-diners-club"></i></a></li>
<li><a title="Discover Card" href="#"><i class="fab fa-cc-discover"></i></a></li>
<li><a title="Stripe" href="#"><i class="fab fa-cc-stripe"></i></a></li>
<li><a title="JCB" href="#"><i class="fab fa-cc-jcb"></i></a></li>

<li><a title="Apple Pay" href="#"><i class="fab fa-cc-apple-pay"></i></a></li>
<li><a title="Pay Amazon" href="#"><i class="fab fa-cc-amazon-pay"></i></a></li>

<li><a title="Creditcards" href="#"><i class="far fa-credit-card"></i></a></li>
<li><a title="Alipay" href="#"><i class="fab fa-alipay"></i></a></li>
</ul>

Theme Options

Options

  1. Go to Dashboard > Appearance > Customize > Supermarket Theme Options > Options
  2. Disable Top Bar
  3. Disable Search Form
  4. Disable Stick Menu
  5. Disable Goto Top
  6. Disable Top Social Icons
  7. Disable Bottom Social Icons
  8. Disable Page/Single Featured Image
  9. Disable Main Menu
  10. Reset all default settings. (Refresh it to view the effect)
  11. Click on Save & Publish

Layout Options

  1. Go to Dashboard > Appearance > Customize > Supermarket Theme Options > Layout Options
  2. widget contact Right and Top Menu Left (Plus) > Default/Right
  3. Sidebar Layout Options (Plus) > Right/Left/No Sidebar/ Fullwidth
  4. Responsive Layout ON/OFF
  5. Disable Category
  6. Disable Author
  7. Disable Date
  8. Disable Comments
  9. Disable Main Menu
  10. Featured Image Display in Blog (Plus) > Show/ Hide
  11. Disable Entry Meta from Single Page
  12. Disable Entry Meta from Blog Page
  13. Blog Content Display > Full Content/ Excerpt
  14. Design Layout > Fullwidth/ Boxed/ Small Boxed
  15. Click on Save & Publish

Set Contact page

  1. Go to Dashboard > pages > Add New
  2. Add shortcode in page editor
  3. Select Contact Template from rightside of the page
  4. Click on Update/Publish

To add Google Iframe Code to display as in demo
Go to Dashboard > Appearance > Widgets > Drag Text/ Custom HTML Widget to > Iframe Code For Google Maps sidebar & Add iframe code

Iframe Code For Google Maps
To add Contact Information at sidebar
Go to Dashboard > Appearance > Widgets > Drag Text Widget > Contact page sidebar & fill the contact information

Recommended Plugins

  1. Contact Form 7 for Contact Us page
  2. WooCommerce
  3. YITH WooCommerce Wishlist
  4. Max Mega Menu
  5. YITH WooCommerce Quick View