contentsbssthemes.com/pub/media/bss/productattachment/... · mega menu 11 5.2. footer 12 5.3....

Contents 1. Getting started 3

1.1. BSS Themes Introduction 3

1.2. About THINNK Theme 3

2. System requirement 4

2.1. Magento version 4

2.2. System requirement 4

3. Installation guide 4

3.1. Magento Installation 4

3.2. Theme Installation 4

3.2.1. Prepare Installation 4

3.2.2. Manual Installation 4

3.2.3. Import Sample Data 4

4. Basic Configuration 5

4.1. Enable theme 5

4.2. Theme basic configuration 6

4.2.1. Logo 6

4.2.2. Design 7

4.2.3. Enable Mega menu 9

5. Theme elements (incl. Design + Configs) 9

5.1. Header 9

5.1.1. Header CMS blocks 9

5.1.2. Mega menu 11

5.2. Footer 12

5.3. Homepage 13

5.3.1. Homepage banner slider 13

5.3.2. Promo block 15

5.3.3. Best seller widget 16

5.3.4. Our Product tabs 18

5.3.5. Hot deal widget 19

5.3.6. Our collections block 21

5.3.7. Brand block 22

5.3.8. Top selling and New Arrival 22

5.3.8. Latest news 24

5.4. Category page 24

5.4.1. Category page layout 24

5.4.2. Category view 25

5.4.2.1. Category grid view 25

5.4.2.2. Category list view 26

5.4.3. Layered navigation 26

5.4.4. Category page CMS blocks 26

5.5. Product page 27

5.5.1. Product labels 27

5.5.2. Product Main Images slider 28

5.6. Blog page 29

5.6.1. Blog collection page: 29

5.6.2. Blog category 30

5.6.3. Blog post page 31

5.7. Other pages 31

5.7.1. About us 31

5.7.2. Contact us 33

6. Help & Support 35

6.1. Reference 35

6.2. Support 35

6.2.1. Policy 35

6.2.2. Contact us 35

BSS Theme User guide 2

1. Getting started

1.1. BSS Themes Introduction

Welcome to BSS Themes!

We are a team of amazing people including Magento experts, qualified developers, creative designers and so on. We work and learn together to bring the best success

solution for our customers.

Our vision is ”Provide the best web design for your Ecommerce store”

Our story

We have been developing with a journey for 6 YEARS and beyond. Our services include:

● Magento Consultant

● Magento Customization

● Magento Optimization

● Magento Extension Development

● Magento Maintenance

We are glad to have:

1500+ Happy Customers with BSS Geek

Magento development agency who will offer you optimal solution for all problems you have.

100+ Ways to optimization your e-commerce website with 100+ Magento extensions in Bss Commerce with the top Magento extensions which are highly rated by

the customers

Our products

High-quality themes focus on:

UX FIRST

We promise to bring the best user experience to our clients! Our themes are 100% responsive. They are also easy to use with easily accessible admin configuration that

the shop owner can learn to use in just a blink of an eye

OPTIMIZED FOR E-COMMERCE

With more than 6 years experience in building e-commerce websites, we know what features are necessary. Not only optimized for website speed, our themes also give

the shop owner the best space to show your incredible products, to attract the customers to click more, buy more.

UPDATE & SUPPORT

We will continuously upgrade our products, include more amazing features to improve their quality. Also, we are happy to give you any advise and customization needed

for your website.

1.2. About THINNK Theme

THINNK is a qualified Magento theme which is extremely customizable, 100% responsive and fully optimized for website speed. It is suitable for every type of stores and

make great impression with users by its flexibility and ability to customize with the nice clean code.


2. System requirement

2.1. Magento version

Our THINNK theme is compatible with Magento version 2.0.x, 2.1.x and 2.2.x

2.2. System requirement

Our theme doesn’t have any requirement rather than Magento’s system requirement (see more at 3.1. Magento Installation)

3. Installation guide

3.1. Magento Installation

- System requirements

Magento 2.0: http://devdocs.magento.com/guides/v2.0/install-gde/system-requirements2.html



- Magento Installation

You can see Magento Installation guide in the link below:

http://devdocs.magento.com/guides/v2.1/install-gde/prereq/zip_install.html

3.2. Theme Installation

3.2.1. Prepare Installation

Please remember to backup your website’s code and database before installing our themes to make sure we have things to revert in case any conflict happens

3.2.2. Manual Installation

- Install theme via FTP:

1. Log into your hosting space via a FTP software. ie FileZilla

2. Unzip Package > Theme Files > theme_v2.1.x.zip (or theme_v2.2.x.zip if you use Magento version 2.2.x) and upload all directories(there are 2 directories - app,

pub) to Magento 2 root directory.

- Install theme via Cpanel:

1. Log into your CPanel(Control Panel) by your hosting account or cpanel user information.

2. Upload Package > Theme Files >theme_v2.1.x.zip(or theme_v2.2.x.zip if you use Magento version 2.2.x) to your magento root directory and unzip its content.

3.2.3. Import Sample Data

Thinnk theme provides extremely easy - one click demo installation. In order to do demo installation, you should import static Blocks and CMS pages in BSS Theme -

Settings Theme > Import Data


http://devdocs.magento.com/guides/v2.0/install-gde/system-requirements2.html



Then choose Theme : Bss/Thinnk (1)

- Tick on CMS Pages (2): This will import CMS pages (About Us, Contact, 404...) created as on our demo website

- Tick on CMS Blocks (3): This will import static blocks (promo, collection, footer columns...) created as on our demo website

Then click on “Import” button, all sample data will be imported to your website.

4. Basic Configuration

4.1. Enable theme

Thinnk Theme is equipped with the dedicated administrative module which offers a variety of additional settings. To enable it, go to Content > Design > Configuration >

BSS Thinnk section to configure theme's main settings. Visual experience settings can also be changed in this configuration link as well.


Then, click Edit on the your selected theme language and choose Bss Thinnk

Choose Save Configuration.

4.2. Theme basic configuration

4.2.1. Logo

To change Logo (in Header), go to Content > Configuration > Design > Edit Theme, choose Store view > Edit

Select Edit > Header tab


In Logo Image, choose Upload and select logo image.

Note: Logo image’s width and height should be as default.

4.2.2. Design

Configs can be changed in Stores > Configuration > BSS Theme configs > Design theme

● You will see the template information, you can enter your own style variables

● Once you are done with editing the values, save the configuration. ● After this, a css file will be generated and you can visit the frontend of your Magento store and see the new look.

There are 2 parts in Design configuration: Body and Font

Body - Basic Color and Product Labels

○ Text Color: click Color wheel icon on the right to change color of the text

○ Link Color: click Color wheel icon on the right to change color of the link

○ Link Hover Color: click Color wheel icon on the right to change color of the link when hovering

○ Button Background Color: click Color wheel icon on the right to change color of the button background

○ Button Text Color: click Color wheel icon on the right to change color of the button text

○ Button Hover Background Color: click Color wheel icon on the right to change color of the button background when hovering

○ Button Hover Text Color: click Color wheel icon on the right to change color of the button text when hovering


● Product Labels:

Configurations are:

○ Label “New” Background Color: click Color wheel icon on the right to change color of the label “New” background

○ Label “New” Text Color: click Color wheel icon on the right to change color of the label “New” text

○ Label “Sale” Background Color: click Color wheel icon on the right to change color of the label “Sale” background

○ Label “Sale” Text Color: click Color wheel icon on the right to change color of the label “Sale” text

Note: after saving the configuration, we must run flush cache and deploy command for frontend to update the changes

Font

● Basic Font Size: click at the value in drop down list to choose basic font size. This is the size of regular text. Most of the other elements’ font size will be calculated

relative to this value.

● Heading Font Family: select predefined font stack in drop down list to choose heading font family.

● Font Family from Google font: type in your custom font from google font.

Note: Only add Google font.

● Font Family Custom Name: type in your font family custom.

Note: Do not add trailing semicolon.

● Font Weight: specify the weight of the font. You can only use numeric font weights which are available for the CSS property font-weight.

Note: normal weight is 400, bold is 700. Leave empty to use default weight.


Product Customs > Images

● Keep Image Aspect Ratio: Set Yes, to keep aspect ratio of the product image (height of the image will be calculated automatically based on width). If set to No,

Magento will automatically transform each image into square.

● Image Width: Input the width value (pixel) of product image. If width is not specified, default width will be used as 295 pixels.

4.2.3. Enable Mega menu

Configurations can be changed in BSS Themes > Mega Menu > Configurations

For more configurations with Mega menu, see more at 5.1.2. Mega menu

● Enabled MegaMenu: choose Yes to enable Mega menu, or No to disable it.

● Enabled Link Home: choose Yes to enable Home item in Mega menu, or No to disable it.

5. Theme elements (incl. Design + Configs)

5.1. Header

5.1.1. Header CMS blocks

Top Header

The following block identifiers can be used to display blocks in the top header section of the store:


● bss_block_top_header: shipping info at the top of the header, floating left.

Block name: Bss Block Top Header

Content:

<div class="col-xs-4 col-md-4 top-header-block row"><span class="shipping-icon"></span>

<p>Free Shipping</p>

</div>

● bss_block_call_us: help/contact info at the top of the header, floating right.

Block name: Bss Block Call Us

Content:

<div class="col-xs-6 col-md-6 call_us text-right row"><span class="glyphicon glyphicon-earphone"></span> <span

class="text">Call us toll free: (+84) 123 456 88</span></div>

To change the content of these blocks, go to their Content input field in Content > Blocks, Choose block name > Select > Edit.

Main header

The main header section of the store includes these blocks:

1. Logo

2. Language

3. Currency

4. Shopping cart

5. Menu (Mega menu)

Sticky header configuration:

Configuration can be changed in Stores > Configuration > BSS Theme Configs > General Settings > Header

● Sticky Header: choose Enable to enable Sticky header, or Disable to disable it.


5.1.2. Mega menu

Configuration

To choose Mega menu items, go to BSS Themes > Mega Menu > Manage Menu Items

With each of the category and sub-category on the left, there are config for Mega menu as follows:

● Enable: choose Yes to display that category/sub-category in Mega menu, or No to hide it.

● Menu Content Type: choose the content type of the menu among Classic, Category Listing and Content

● Block Content: choose CMS block to display on the Mega menu (these blocks are also listed in Magento CMS blocks)

● Menu Url Type: choose between Category Link and Custom Link

○ Custom Link: If Custom Link is chosen in Menu Url Type field, then fill in the link in the text box.

○ Category Link: If Category Link is chosen in Menu Url Type field, then select the Category

● Menu Width Type: choose between Full Width and Classic

● Label Type: choose which Label type to display on Mega menu among New, Hot, Sale

● Static Block Top: choose which Static block to display on the top of the Mega menu

● Static Block Right: choose which Static block to display on the right of the Mega menu

● Static Block Bottom: choose which Static block to display at the bottom of the Mega menu

● Static Block Left: choose which Static block to display on the left of the Mega menu


5.2. Footer

The following block identifiers can be used to display blocks in the top header section of the store:

● bss_logo_footer_block: company logo

Block name: Bss Logo Footer Block

Content:

<div class="col-xs-12 col-sm-4 col-md-12 footer-logo"><a href="{{store url='/'}}"><img src="{{media

url="wysiwyg/footer/logo_1.png"}}" alt="" /></a></div>

● bss_footer_store_info: info about company, phone number, address etc.

Block name: Bss Footer Store Info

Content:

<div>

<ul class="list-unstyled address-list margin-bottom-20 icons">

<li class="col-xs-12 col-sm-4 col-md-12"><i class="glyphicon glyphicon-map-marker"></i><address><strong>Address:

</strong>109 Sky Tower, Street name, AZ District, New York City, USA</address></li>

<li class="col-xs-12 col-sm-4 col-md-12"><i class="glyphicon glyphicon-envelope"></i><address><strong>Email:

</strong>[email protected]</address></li>

<li class="col-xs-12 col-sm-4 col-md-12"><i class="glyphicon glyphicon-phone-alt"></i><address><strong>Phone:

</strong>800 123 3456</address></li>

</ul>

</div>

● bss_footer_links_our_company: info about your company

Block name: Bss Footer Links Our Company

Content:

<h3 class="thumb-headline">Our Company</h3>

<ul class="list-unstyled simple-list links">

<li><a href="{{store url='about-us'}}">About Us</a></li>

<li><a href="{{store url='blog'}}">Blog</a></li>

</ul>

● bss_footer_terms_privacy: info about terms and privacy

Block name: Bss Footer Terms and Privacy

Content:

<h3 class="thumb-headline">Terms and Privacy</h3>


<li><a href="privacy-policy-cookie-restriction-mode/">Privacy and Cookie Policy</a></li>

<li><a href="search/term/popular/">Search Terms</a></li>


<li><a href="sales/guest/form/">Orders and Returns</a></li>

</ul>

● bss_footer_support_links: info about customer support

Block name: Bss Footer Support Links

Content:

<h3 class="thumb-headline">Support</h3>


<li><a href="contact/">Contact Us</a></li>

<li><a href="catalogsearch/advanced/" data-action="advanced-search">Advanced Search</a></li>

</ul>

● bss_social_icons_block: social services links.

Block name: Bss Social Icons Block

Content:

<div class="social-icons-block">

<ul class="list-inline shop-social">

<li><a href="#"><i class="bt-icon-social-facebook"></i>facebook</a></li>

<li><a href="#"><i class="bt-icon-social-linkin"></i>linkin</a></li>

<li><a href="#"><i class="bt-icon-social-pinterest"></i>pinterest</a></li>

<li><a href="#"><i class="bt-icon-social-youtube"></i>youtube</a></li>

<li><a href="#"><i class="bt-icon-social-twiter"></i>twitter</a></li>

</ul>

</div>

● bss_block_bottom_footer: info about payments method

Block Name: Bss Block Bottom Footer

Content:

<div class="icon-payment-method"><img src="{{media url="wysiwyg/footer/payment-icons.png"}}" alt="" /></div>

To change the content of these blocks, go to their Content input fields in Content > Blocks, Choose block name > Select > Edit.

5.3. Homepage

5.3.1. Homepage banner slider

This element display on homepage with the position as below:


Configurations can be changed in

1. Stores > Configuration > BSS Theme Configs > Banner Slider > General Options

● Enabled Banner Slider: choose Yes to enable Banner slider, or No to disable it.

● Auto Slide: choose Yes to enable auto slide, or No to disable it.

● Enabled LazyLoad: choose Yes to enable Lazy load, or No to disable it.

● Speed: If choosing Yes in Enabled LazyLoad, input speed of slide (shown in mili-second), eg. type: 300, 500 or 1000… If left bank, default speed 500 is used.

● Hide on mobile: choose Yes to show Banner slider on mobile, or No to hide it.

2. BSS THEMES > Banner Slider > Manager Slider Item > Add New Slider Item

Choose the banner slider in the list > Select > Edit

● Title: Name of the banner

● Show Title: choose Yes to show title, or No to hide it.


● URL: Input URL link to be redirected to when clicking the banner

● Description: Description of the banner, display on the banner.

● Position: optional (input number), this configuration allows you to set the display position of the banner (in ascending order)

● Status: choose Enable to enable the banner, or Disable to disable it.

● Banner image: Click Choose File to select banner image, tick Delete Image to delete the current image, untick to remain it.

● Animation Effect: choose effect for the banner, among FadeIn, Fadeout, bounceIn, bounceInDown, bounceInUp

● Width: optional, choose the banner’s width

● Height: optional, choose the banner’s height

5.3.2. Promo block

This is a CMS block that shows promotion information on your website. It will be added to your store if you choose to import our sample data (see more at 3.2.4. Import

Sample Data)

Identifier: bss_promo_block

Block name: Bss Promo Block

Content:

<div class="col-md-3 col-sm-3 promo-item clearfix">

<div class="thinnk-icon-promo">

<div class="icon"><span class="bt bt-icon-shipping">Free shipping</span></div>

</div>

<div class="info-promo">

<h3>Free shipping</h3>

<p>Usu ad vero accusata mediocritatem. Molestie consulatu sententiae ad vim.</p>

</div>

</div>



<div class="icon"><span class="bt bt-icon-message">Free support</span></div>

</div>


<h3>Free support</h3>


</div>

</div>



<div class="icon"><span class="bt bt-icon-open">Always open</span></div>

</div>


<h3>Always open</h3>



</div>

</div>



<div class="icon"><span class="bt bt-icon-payment">Easy payment</span></div>

</div>


<h3>Easy payment</h3>


</div>

</div>

5.3.3. Best seller widget

This section will show your products based on the conditions that are configured in admin panel. Configurations can be changed in:

i. Content > Widgets > Create new widget named Bestseller Block


● Widget Title: input the title of the widget.

● Assign to Store Views: choose which store views to display.

● Sort Order: Sort Order of widget instances in the same container.

● Layout Updates:

○ Display on: choose the page to display in the drop down list

○ The 5th part in the pic above depends on which page is selected in Display on field. There are 2 templates to choose: “Products Template (Bss

CatalogWidget)” (show products without a slider) and “Products Template with Slider (Bss CatalogWidget)” (show products using slider)

Widget Options

● Title: input the widget name


● Product logic type: Select type of product in the drop down list, among Show product by SKUs, Show product by category ID, Show Bestseller Products.

● List SKUs: depends on "Product logic type" (input a comma separated list of product SKUs)

● Category ID: depends on "Product logic type". (input a Category ID, Ex: 3)

● Number of Products to Display: input the number of products to display on this widget.

● CSS Class: input custom CSS, optional for advanced users.

5.3.4. Our Product tabs

This section will show featured products or products in your chosen categories

Configurations can be changed in Stores > Configuration > BSS Theme Configs > Product Tabs > General Options

● Enabled Product Tabs: choose Yes to enable Product tabs, or No to disable it.

● List Options: choose options to display for tabs among Disable Tab options, Bestseller, Newest and Featured. If choose Disable Tab options, there is no sub-tab

in Our Products tab.

● Category in tabs: choose categories to display in tabs among all Categories in your website (eg. Women, Men, Clothing…).


5.3.5. Hot deal widget

This section will show 1 product that has special price.

Configurations can be changed in:

i. Products > Catalog, choose product name > Action > Edit

Choose Special price: In product admin page, Price > Advanced Pricing, type Special Price and choose Special Price From [date] to [date]

Choose Hot deal product: In product admin page

Is Hot deal product?: choose Yes to show this product in Hot deal, or No to hide it.

ii. Content > Widgets > Create Hot Deal widget

Storefront Properties


● Widget Title: input the title of the widget.

● Assign to Store Views: choose which store views to display.

● Sort Order: Sort Order of widget instances in the same container.

● Layout Updates:

○ Display on: choose the page to display in the drop down list

○ The 5th part in the pic above depends on which page is selected in Display on field.

Widget Options

● Hot deal Title: input the widget name

● CSS Class: input custom CSS, optional for advanced users.

● Product: select products to display in widget


5.3.6. Our collections block

This is CMS block that shows promotion for your new collection. It will be added to your store if you choose to import our sample data (see more at 3.2.4. Import Sample

Data)

Identifier: bss_our_collections_block

Block name: Bss Our Collections Block

Content:

<div class="block-title bss-block-title">

<h3><span>Our Collections</span></h3>

</div>

<div class="cd-gallery">

<div class="items clearfix">

<div class="col-md-4 cd-item-wrapper">

<div class="cd-item-info"><span class="title-background">Spring<label>Collections</label></span>

<p class="desc">Vitae populo nam eu, at dicta habemus tacimates eos. Eam ut nisl alia laboramus. Eum et facete

delenit, eos an alii munere, sumo altera nonumes</p>

</div>

</div>

<div class="col-md-8 slider-image">

<ul class="cd-item-wrapper img-wrapper">

<li class="move-left" data-title=" Lorem ipsum dolor sit amet, no oratio rationibus "><img src="{{media url="wysiwyg/bsscollection/img1.jpg"}}" alt="" /></li>

<li class="selected" data-title=" Lorem ipsum dolor sit amet, no oratio rationibus 2 "><img src="{{media url="wysiwyg/bsscollection/img1.jpg"}}" alt="" /></li>

<li class="move-right" data-title=" Lorem ipsum dolor sit amet, no oratio rationibus 3 "><img src="{{media url="wysiwyg/bsscollection/img3.jpg"}}" alt="" /></li>

</ul>

</div>

</div>

</div>

Note: text in red are the titles on frontend


5.3.7. Brand block

This section is a CMS block that shows the brands that you work with. It will be added to your store if you choose to import our sample data (see more at 3.2.4. Import

Sample Data)

Identifier: bss_brands

Block name: Bss Brands

Content:

<div class="item brand-item"><a href="#"><img class="img-responsive" src="{{media

url="wysiwyg/bssbrands/brand1.png"}}" alt="" /></a></div>











5.3.8. Top selling and New Arrival

This section will show your best selling (in latest month) and newly added products

This block configurations can be changed in Stores > Settings > Configuration > BSS Theme Configs > Feature Block > General

● Enable TopSelling: choose Enable to enable Top Selling block, or Disable to disable it.


● Enable NewArrival: choose Enable to enable New Arrival block, or Disable to disable it.

New arrival section only shows product which is set the date in Products > Catalog > choose product > Set product as new from…

5.3.8. Latest news

This section will show your 4 latest blog posts (see more about blog features in 6.6. Blog page)

Block name: Lastest News Block

Identifier: latest_news

Then go to CONTENT > Pages > Select "Home page" to add this block to homepage

Content:

<referenceBlock name="breadcrumbs" remove="true" />

<referenceContainer name="main.content">

<container name="bss.lastest.news.container" as="bss_lastest_news_container" label="Bss Lastest Block"

htmlTag="section" htmlClass="lastest-news-block clearfix" after="-" >

<block class="Bss\Blog\Block\Post\Latest" name="latest_news" template="post/latest_news.phtml"

/>

</container>

</referenceContainer>


5.4. Category page

5.4.1. Category page layout

In Magento you can select category page layout - the number of columns: one, two, or three columns. To do this, go to Products > Categories, select the category >

choose Design field, select layout type in the drop down list in Layout (1 column, 2 columns with left bar, 2 columns with right bar and 3 columns) and click Save Page

button

5.4.2. Category view

In this tab, you can set options related to the category view. Category view presents the list of products from the selected category.

Configurations can be changed in Stores > Configuration > BSS Theme Configs > General Settings

Category View > Product configs

● Product Hover Effect: allows product information (name, price…) to show only when customers hover on product image, choose Enable to enable the effect, or

Disable to disable it.

● Disable Hover Effect in mobile: choose Enable to enable the effect in mobile, or Disable to disable it.

Note: Product Hover Effect will be disabled if width of the browser viewport is below 768px.

● Align Center: Align center elements of the grid item: product name, price, button etc., choose Yes to enable alignment, or No to disable it.

● Display Name in Single Line: choose Yes to display in single line, or No to disable it.

Note: When setting Yes: if product name is too long to be displayed in a single line, it will be clipped and an ellipsis ('…')

● Price: choose among Hide, Show and Show On Hover


● Ratings: choose among Hide, Show and Show On Hover

5.4.2.1. Category grid view

In this tab, you can set options related to the grid mode of the category view.

On Frontend, to display category in grid view, click Grid view icon on the right of the screen.

Configs can be changed in Stores > Configuration > BSS Theme Configs > General Settings > Category View (Grid mode) > Number of Columns

● Number of Columns: number of products displayed in a single row

● Number of Columns Below 992px: number of products displayed in a single row with 992px screen width (tablet view)

● Number of Columns Below 768px: number of products displayed in a single row with 768px screen width (mobile view)

5.4.2.2. Category list view

On Frontend, to display category in grid view, click List view icon on the right of the screen.

5.4.3. Layered navigation

Layered navigation is a feature function in Thinnk theme. It helps customers to find products based on category, price range, or any other available attributes and plays a

role as a filter. Layered navigation usually appears in the left column of search results and category pages and sometimes on the home page.

Configs can be changed in Stores > Configuration > BSS Commerce > Layered Navigation Lite > Layered Navigation Configuration

● Enable: choose Yes to enable Layered Navigation, or No to disable it.

● Use Ajax: choose Yes to enable Ajax, or No to disable it.

● Expand/Collapse: If choosing Expand, all attribute blocks in the Layered Navigation will be expanded, or collapsed if setting to Collapse.

● Show More/Less: Please fill in a number (X) in the field. If the number of attribute options is bigger than X, the Show More/Show Less buttons will be displayed.

Enter 0 if you want to disable the Show More/Show Less buttons

● Enable Price Slider: choose Yes to enable Price slider, or No to disable it.

5.4.4. Category page CMS blocks

This block will be added to your store if you choose to import our sample data (see more at 3.2.4. Import Sample Data)


Block ID: bss_banner_sidebar

Block name: Bss Banner Sidebar

Configurations can be configured in Content > Blocks > Choose bss_banner_sidebar > Select > Edit

Content:

<div class="banner-sidebar"><img src="{{media url="wysiwyg/banners/static-block-min.jpg"}}" alt="" /></div>

5.5. Product page

5.5.1. Product labels

Product label in product page will display as below:


Configs can be configured in Stores > Configuration > BSS Theme Configs > General Settings > Product Labels

● Show "New" Label: choose Yes to enable New label, or No to disable it.

● Show "Sale" Label: choose Yes to enable Sale label, or No to disable it.

Note:

● Products must have special price and have attribute “Sale” = Yes to have “Sale” label enabled

● Products must have attribute “New” = Yes with the date being set to have “New” label enabled (see more about this configuration in 5.3.8. Top selling and New

Arrival)

5.5.2. Product slider

Product Sliders in product page will display as below:

Configs can be changed in Stores > Configuration > BSS Theme Configs > General Settings > Product Sliders


● Speed: Input duration (in milliseconds) of scrolling animation (minimum = 500).

● Pause on Hover: If Enable, when the slider is mouseovered then the automatic scrolling will pause. Choose Disable to disable this function.

● Loop: If Enable, scrolling will loop, or choose Disable to disable it.

● Lazy Loading: Delays loading of images and optimal for website speed. If Enable, images outside of viewport will not be loaded before user scrolls to them.

Choose Disable to disable it.

5.6. Blog page

5.6.1. Blog collection page:

URL: [your_website_url]/blog/

Configurations for this page include:

i. Stores > Settings > Configuration > BSS Theme Configs > Bss Blog


General

● Base URL: input base url of blog collection page

● Blog Name: input name of your blog collection

● URL Suffix for Posts: input suffix in url for posts (the end of permalink for posts)

● URL Suffix for Categories: input suffix in url for categories (the end of permalink for categories)

5.6.2. Blog category

You can create and manage blog categories in BSS Themes > Bss Blog > Category

To edit a category, please choose Category > Action > Edit > General


5.6.3. Blog post page

You can create and manage blog posts in BSS Themes > Bss Blog > Posts

To manage content in Post: Post > Post Manager, choose Post title > Action > Edit > General

About managing Comment: Comment > Comment Manager > choose Category > Action > Edit > General


5.7. Other pages

Other pages supported by our theme includes About us page and Contact us page. These pages will be added to your store if you choose to import our sample data (see

more at 3.2.4. Import Sample Data)

5.7.1. About us

URL: [your_website_URL]/about-us

This page can be redirected to by the About us link at on Footer.


To change the content of About us page, go to Content > Pages, choose About us > Select > Edit > Content

5.7.2. Contact us

URL: [your_website_URL]/contact/

This page can be redirected to by the Contact us link at Support block on Footer.


To change the content of Contact us page, go to Content > Blocks, choose Bss Content Contact (content_contact) > Select > Edit

For advanced edit, select Show/Hide editor.

Choose Save Block.

6. Help & Support

6.1. Reference

You may find these sites useful while installing and configuring your Magento store:

Magento installation

● Magento FAQ:

http://www.magentocommerce.com/product/faq

● System Requirements:

http://www.magentocommerce.com/system-requirements/

● Installation Guide:

http://www.magentocommerce.com/knowledge-base/entry/magento-installationguide


http://www.magentocommerce.com/product/faq

http://devdocs.magento.com/guides/v2.2/install-gde/system-requirements-tech.html

http://devdocs.magento.com/guides/v2.2/install-gde/bk-install-guide.html

Online Magento guide:

● Magento user guide:

http://docs.magento.com/m2/ee/user_guide/getting-started.html

● Magento Wiki:

http://www.magentocommerce.com/wiki/

● Magento Forum:

http://www.magentocommerce.com/boards/

● stackoverflow.com

http://stackoverflow.com/questions/tagged/magento

● Magento Answers Stack Exchange

http://magento.stackexchange.com/

6.2. Support

6.2.1. Policy

We only provide support for issues related strictly to the theme. We do not provide support for Magento configuration, installation, maintenance etc. If you have

questions about Magento (for example: about managing categories and products, creating attributes, installing extensions etc.), please refer to Magento Forum. Almost

every detail of Magento configuration is described there so you will find answers for all your questions. You will also find many helpful tutorials.

The best place to start searching is the online Magento guide. You can find there all the basic configuration information.

If you find any bugs (so far there were only a few, all fixed immediately), please contact us through the contact form on our profile page on http://bssthemes.com/.

6.2.2. Contact us

Any questions or concern about us, feel free to contact:

● Website: http://bssthemes.com/

● Support: [email protected]

BSS Theme Support team is always ready to aid you with any issue referring to our products. Additionally, we also give you Website development and Administration

Support


http://www.magentocommerce.com/wiki/

http://www.magentocommerce.com/boards/

http://stackoverflow.com/questions/tagged/magento

http://magento.stackexchange.com/

http://bssthemes.com/

contentsbssthemes.com/pub/media/bss/productattachment/... · mega menu 11 5.2. footer 12 5.3....

Documents