OpenCart Community

florinsith wrote:First you go in admin > system > design > banners , and there you either edit or insert banners.

When you clicked insert (or edit) you will be taken to the banner page. In that page you can insert one or more images
by clicking "Add banner" (if then you want a banner module with more images(with a fade effect) or leave just one image if you want that banner to display only one image).

After you uploaded your images in the banner (is best if the images are the same size) , navigate trough admin to

extension > modules.

There , click edit on the module Banner.

There , you will click add module , and in the first column , its asking you to select a banner. So , there you

select the banner you created in the previous step.

The second column in size. Is best to insert the same size for the banner , as for your images . At layout select the layout you want it on.complete the other fields and save and you have a displaying banner

The ideea: admin > system > design > banners : Here the banner refers to the actual image(s), you can add as many images per banner as you want and as many banners as you want.

admin > extension > modules > Banner: Here the banner is a module to display the images inserted in specific banners in admin > system > design > banners. You can add as many banner modules as you want to display same or different banners on different positions and pages.

The banners created in admin > system > design > banners, can also be displayed using the slideshow module(is best to use it when a banner contain more than one image and you want the user to controll the transition: ex: click next button for next banner) and using the carousel module(use it to display the banner in carousel form: is best that the banner to have more then 5-6 image of smaller sizes. ex: use it to display the manufacturers logos)

skip wrote:how to change queue of images in slideshow
I try with change firs letter - no result
I want put first image in slideshow to 3th position for example .how to do it
Thanx

<script type="text/javascript"><!--
$(document).ready(function() {
	$('#slideshow<?php echo $module; ?>').nivoSlider();
});
--></script>

<script type="text/javascript"><!--
$(document).ready(function() {
	$('#slideshow<?php echo $module; ?>').nivoSlider(
{"effect":"random","slices":20,"animSpeed":500,"pauseTime":3000,"startSlide":3,"captionOpacity":1,"directionNav":true,"directionNavHide":true,"controlNav":false,"controlNavThumbs":false,"keyboardNav":false,"pauseOnHover":true,"manualAdvance":false,"controlNavThumbsFromRel":true}    );
});
--></script>

mcamca wrote:

skip wrote:how to change queue of images in slideshow
I try with change firs letter - no result
I want put first image in slideshow to 3th position for example .how to do it
Thanx

You can control many aspects of the slideshow as follows:
(Always backup original file first)
In 'slideshow.tpl' located at:
catalog/view/theme/default/template/module/slideshow.tpl
If you have your own theme then 'default' becomes 'your theme name'.

Find:

Code: Select all

<script type="text/javascript"><!--
$(document).ready(function() {
	$('#slideshow<?php echo $module; ?>').nivoSlider();
});
--></script>

and change to:

Code: Select all

<script type="text/javascript"><!--
$(document).ready(function() {
	$('#slideshow<?php echo $module; ?>').nivoSlider(
{"effect":"random","slices":20,"animSpeed":500,"pauseTime":3000,"startSlide":3,"captionOpacity":1,"directionNav":true,"directionNavHide":true,"controlNav":false,"controlNavThumbs":false,"keyboardNav":false,"pauseOnHover":true,"manualAdvance":false,"controlNavThumbsFromRel":true}    );
});
--></script>

The available effects are:

sliceDown
sliceDownLeft
sliceUp
sliceUpLeft
sliceUpDown
sliceUpDownLeft
fold
fade
random
slideInRight
slideInLeft
boxRandom
boxRain
boxRainReverse
boxRainGrow
boxRainGrowReverse

A combination of effects can be entered eg in the above instead of "random" enter:
"fold,fade,sliceDownLeft"

The following describes what each item in the code does:
effect: 'random', // Specify sets like: 'fold,fade,sliceDown'
slices: 15, // For slice animations
boxCols: 8, // For box animations
boxRows: 4, // For box animations
animSpeed: 500, // Slide transition speed
pauseTime: 3000, // How long each slide will show
startSlide: 0, // Set starting Slide (0 index)
directionNav: true, // Next & Prev navigation arrows show on hover
directionNavHide":false, // Next & Prev navigation arrows show or not show all the time
controlNav: true, // 1,2,3... navigation
controlNavThumbs: false, // Use thumbnails for Control Nav
pauseOnHover: true, // Stop animation while hovering
manualAdvance: false, // Force manual transitions
prevText: 'Prev', // Prev directionNav text
nextText: 'Next', // Next directionNav text
randomStart: false, // Start on a random slide

Enjoy!

mcamca wrote:

skip wrote:how to change queue of images in slideshow
I try with change firs letter - no result
I want put first image in slideshow to 3th position for example .how to do it
Thanx

You can control many aspects of the slideshow as follows:
(Always backup original file first)
In 'slideshow.tpl' located at:
catalog/view/theme/default/template/module/slideshow.tpl
If you have your own theme then 'default' becomes 'your theme name'.

Find:

Code: Select all

<script type="text/javascript"><!--
$(document).ready(function() {
	$('#slideshow<?php echo $module; ?>').nivoSlider();
});
--></script>

and change to:

Code: Select all

<script type="text/javascript"><!--
$(document).ready(function() {
	$('#slideshow<?php echo $module; ?>').nivoSlider(
{"effect":"random","slices":20,"animSpeed":500,"pauseTime":3000,"startSlide":3,"captionOpacity":1,"directionNav":true,"directionNavHide":true,"controlNav":false,"controlNavThumbs":false,"keyboardNav":false,"pauseOnHover":true,"manualAdvance":false,"controlNavThumbsFromRel":true}    );
});
--></script>

The available effects are:

sliceDown
sliceDownLeft
sliceUp
sliceUpLeft
sliceUpDown
sliceUpDownLeft
fold
fade
random
slideInRight
slideInLeft
boxRandom
boxRain
boxRainReverse
boxRainGrow
boxRainGrowReverse

A combination of effects can be entered eg in the above instead of "random" enter:
"fold,fade,sliceDownLeft"

The following describes what each item in the code does:
effect: 'random', // Specify sets like: 'fold,fade,sliceDown'
slices: 15, // For slice animations
boxCols: 8, // For box animations
boxRows: 4, // For box animations
animSpeed: 500, // Slide transition speed
pauseTime: 3000, // How long each slide will show
startSlide: 0, // Set starting Slide (0 index)
directionNav: true, // Next & Prev navigation arrows show on hover
directionNavHide":false, // Next & Prev navigation arrows show or not show all the time
controlNav: true, // 1,2,3... navigation
controlNavThumbs: false, // Use thumbnails for Control Nav
pauseOnHover: true, // Stop animation while hovering
manualAdvance: false, // Force manual transitions
prevText: 'Prev', // Prev directionNav text
nextText: 'Next', // Next directionNav text
randomStart: false, // Start on a random slide

Enjoy!

tallica22 wrote:Sorry to did up an old thread, just want to say thank you, this worked great for me, only problem was, there used to be little "buttons" the customers could click on to control what images they see, but now they are gone, how can i get them back?

thanks