BANNER SLIDER - Magento · later slider. 3.1.2. Edit Slider On the Slider Manager page, to edit a...

15
[email protected] [email protected] Phone: 084.4.8585.4587 BANNER SLIDER USER GUIDE Version 3.0.1

Transcript of BANNER SLIDER - Magento · later slider. 3.1.2. Edit Slider On the Slider Manager page, to edit a...

[email protected]

[email protected]

Phone: 084.4.8585.4587

BANNER SLIDER

USER GUIDE

Version 3.0.1

Copyright (c) 2009-2014 www.magestore.com

Banner Slider v3.0.1 2

Table of Contents

1. INTRODUCTION .......................................................................... 3

2. HOW TO USE ................................................................................ 4

3. HOW TO CONFIGURE ............................................................... 6

3.1. Manage Sliders ....................................................................................... 6

3.2. Manage Banners ................................................................................... 11

3.3. Preview Slider Styles ............................................................................ 12

3.4. Report Banners ..................................................................................... 13

3.5. Settings .................................................................................................. 15

Copyright (c) 2009-2014 www.magestore.com

Banner Slider v3.0.1 3

1. INTRODUCTION

Want to impress your Customers with eye-catching lively images right on your e-store?

With Banner Slider extension, creating and showing a series of banners (sliders) are

never easier. Furthermore, the extension helps you to evaluate the effectiveness of

banners by giving reports on their clicks/ impressions. Then you will know “What kind

of banners works best for your site?” or “What is the position with most clicks?”, etc.

Features Full List:

For Customers:

Can see banners in up to 36 positions on a website

Quickly catch hot news or information of promotional programs

Conveniently go into detail pages by clicking on banners

For administration:

Flexibly select among up to 36 available positions to show sliders.

Preview the position chosen

Create banners with many information such as URL, banner image as well as

assign an order for it to appear on a slider

Create sliders with different effects and showing time

Able to set up some special sliders which are notes and pop-ups to serve certain

purposes

Can select sliders which allow auto-resizing the images to fit the position.

Can view reports on clicks and impressions of banners.

Can create your own slider style by inserting custom codes.

Others:

100% Open source.

Easy to install and configure.

User-friendly interface.

It's one of the top useful free Magento extensions

Copyright (c) 2009-2014 www.magestore.com

Banner Slider v3.0.1 4

2. HOW TO USE

In frontend, Customers can see sliders in many positions such as content top, sidebar

top left/right, sidebar bottom left/right, menu top. They can be shown in many forms

(slider, popup or note) as following:

Banner Slider form:

Copyright (c) 2009-2014 www.magestore.com

Banner Slider v3.0.1 5

Pop-up form:

Note form:

When Customers click on a banner, they will be navigated to the website that the

administrator configures in backend.

Copyright (c) 2009-2014 www.magestore.com

Banner Slider v3.0.1 6

3. HOW TO CONFIGURE

In backend, the administrator can manage sliders and banners, preview available slider

styles and configure the settings.

3.1. Manage Sliders

Go to Banner Slider > Manage Sliders

Then the Slider Manager page will be shown as followed:

On this page, you can see a list of all sliders on your site, including title, position, slider

mode and status. Also, you can search for a desired slider by using filters and export to

CSV/XML files by clicking on the Export button.

3.1.1. Add Slider

In order to add a new slider, you can click on the Add Slider button.

Slide Informationtab:

You should pay attention to the following items:

Title: title of the slider

Show Title: enable you to choose whether to show the title of the slider on front-

end or not.

Select available Slider Styles: if you select “Yes”, you can use one among

available sliders that our extension provides. In contrast, if you select “No”, you

can add code to custom the slider as you want.

Copyright (c) 2009-2014 www.magestore.com

Banner Slider v3.0.1 7

Select Slider Mode: Our extension supports four modes of slider: pop-up, note,

unresponsive and responsive slider.

Pop-up Slider: If you select the slider mode "Pop up on Home page", your

slider will be shown in the pop-up form on the Home page only. If you don’t

want to use the default values of width and height, you can edit them to fit

with your site.

Note Slider: If you select the slider mode "Note displayed on all pages",

your slider will be shown as a note on all pages. You can click on the Preview

link to see how it will be shown in frontend.

After that, you can configure such items as Sort type of banners, Color of

slider, Speed (the display time of a banner), Position of slider and Note’s

Content shown on slider as following:

Copyright (c) 2009-2014 www.magestore.com

Banner Slider v3.0.1 8

Responsive Slider: As it is named, with this slider mode, the values of slider’

width and height can be auto-adjusted to fit with the position you choose to

show it. Our extension provides four styles of responsive slider. You can see

how it will be shown in frontend by clicking on the Preview link. Then you

can configure other items such as Sort type of banners on slider, Animation

Effect, Speed and Position of slider:

Also, you can hover on the Preview Position text below the Position Listing

box to see the position on frontend more clearly.

Copyright (c) 2009-2014 www.magestore.com

Banner Slider v3.0.1 9

Unresponsive Slider:

Unlike responsive sliders, this slider mode does not auto-adjust the width and

height of the slider, which means you will be able to configure those values as

you want. There are also 4 unresponsive sliders for you to choose.

Banner(s) of Slidertab:

In this tab, you can see a list of banners with information including ID, name, current

slider and effective date. You can also search for a desired banner by using filter

boxes.

Besides, right on this tab, you can edit banners by clicking on the Edit link or add a

new banner to the slider by clicking on the Add Banner button. Our module will then

show another window like this:

Copyright (c) 2009-2014 www.magestore.com

Banner Slider v3.0.1 10

After editing or adding a banner, remember to click on the Save and then Close button

to save the banner for the slider.

One thing to note is that one banner can only be shown on one slider. So if you create

two sliders and select the same banner for both, that banner will be shown only on the

later slider.

3.1.2. Edit Slider

On the Slider Manager page, to edit a slider, you can click on the Edit link at the end

of that slider’s row.

After editing, remember to click on the Save Slider or Save and Continue Edit button

to save your work.

Copyright (c) 2009-2014 www.magestore.com

Banner Slider v3.0.1 11

3.2. Manage Banners

Go to Banner Slider > Manage Banners

Then the Banner Manager page will be shown as below:

On this page, you can see a list of all banners on your site with many information

including name, url link, current slider, effective date, status and image.

You can search for a desired slider by using filters or export to CSV/XML file by

clicking on the Export button.

3.2.1. Add Banner

In order to add a new slider, you can click on the Add Banner button.

You should pay attention to the following items:

- Slider: you can select a slider on which banner will be shown.

- Alt Text: should use this field to add texts for SEO purpose.

Copyright (c) 2009-2014 www.magestore.com

Banner Slider v3.0.1 12

- URL: the link of website to which Customers will be redirected when clicking

on a banner.

- Start date/ End date: the effective date of banner.

After filling up all data, remember to click on the Save Banner or the Save and

Continue Edit button to save your work.

3.2.2. Edit Banner

In order to edit a banner, you can click on the Edit link at the end of that banner’s row

on the Banner Manager page:

After editing, remember to click on the Save Banner or the Save and Continue Edit

button to save your work.

3.3. View Slider Styles

Go to Banner Slider > Preview Slider Styles

Then the Preview Slider Styles page will be shown as below:

Copyright (c) 2009-2014 www.magestore.com

Banner Slider v3.0.1 13

On this page, you can preview all available slider styles that our module provides by

clicking on the Preview link at the end of each row. Our module will show a new

window for you to view style of that slider just as when it is shown on frontend. For

example, if you select the "Slider Evolution Default", you can view it as below:

3.4. Report Banners

The extension allows you to view the numbers of clicks and impressions of banners in

2 ways: clicks/impressions of a banner on a slider only (Per Slider) and of a banner on

all sliders (All Sliders). Now, let’s go into detail about each.

3.4.1. Per Slider

Go to Banner Slider>Report Banners>Per Slider

Then the Report Banners page will be shown as following:

Copyright (c) 2009-2014 www.magestore.com

Banner Slider v3.0.1 14

On this page, clicks and impressions of banners are calculated based only on the sliders

on which they are shown. This will help you to know on which slider a banner can

bring most clicks / impressions to your site.

Besides, you can view the number of clicks and impressions in a specific period by

choosing date to report at the top-right of the page:

3.4.2. All Sliders

Go to Banner Slider > Report Banners > All Sliders

Then the Report Banners page will be shown:

On this page, clicks and impressions of banners are calculated based on all sliders on

which they are shown. You can view name, url link, total number of clicks/impressions

and image of each banner.

You can also view number of clicks and impressions in a specific period by choosing

date at the top-right of page:

Copyright (c) 2009-2014 www.magestore.com

Banner Slider v3.0.1 15

3.5. Settings

In the Settings tab, our extension allows you to enable or disable the module on your

site and provide you with the implement code section to customize your sliders.

--------------------------------------------The End--------------------------------------------