Virto Image Slider web part Settings on Virtosoftware Guides & Docs

Hover Slide Effect Engine

Tue, 29 Oct 2024 08:38:58 +0000

The case below describes how to adjust and use Hover Slide Effect Engine and organize Slideshow as follows:

First of all you need to create a picture library (Image Slider 4 Demoin our case). Then add number column (ZoneID).

Add pictures of the size you need to this picture library (the exact sizes will be mentioned below). Then fill out ZoneID field with values (you need to define a zone where every picture will be added to).

Carousel Engine

Tue, 29 Oct 2024 08:38:52 +0000

To apply Carousel engine, select if from the list. Then define type of navigation arrows, check the boxes “Enable mouse wheel” and “Enable auto scroll”. Define animation speed, check the boxes “Display vertically” and “Circular behavior” if you need. Then click “OK” or “Apply” to save the settings.

Depending on the settings image slider will look as follows.

Yahoo Style

Tue, 29 Oct 2024 08:38:44 +0000

Open web part settings block with “Edit Web Part” button and select “Yahoo style” engine type. Define the interval for slides and click “OK” to save the settings.

Yahoo style provides Virto Image Slider with a simple preview.

Just use navigation buttons or put cursor on a required picture in preview to show it.

If you define picture URL for slideshow images (see the sections above), you will see full size picture when you click on it.

Engine types

Tue, 29 Oct 2024 08:37:37 +0000

Virto Image Slider web part allows using four engines – default, Yahoostyle, Carouselstyle and Hover Slide Effectstyle. Default engine is custom one. You can define any settings described above for default engines. Yahoostyle engine has predefined settings, you can only set interval for picture slideshow. Carouselengine allows you to customize navigation arrows, enable mouse will and auto scroll, define animation speed, select vertical or horizontal style of appearance, define circular behavior and number of visible items and scrolling settings.

Transitions Options

Tue, 29 Oct 2024 08:37:29 +0000

Transitions options define the way which the pictures will be shown.

Select transition type from the dropdown.

Then define interval in milliseconds with which the pictures will be changing.

Note*: if an interval is too small, animation effects may not work properly.*

Define animation speed (the time in milliseconds spent on one animation effect) and amount of animation slices.

You may switch to the next slide manually by clicking “left” and “right” buttons. In case you do not need to use this option uncheck the box “Show navigation buttons”.

Image Options

Tue, 29 Oct 2024 08:37:21 +0000

“Image Options” settings block enables to define preferences for shown pictures.

You can define width and height of shown pictures. However the picture will be displayed according to the set Stretch mode:

Fit– pictures will be scaled according to original proportions; Original size is 400x300, we set 600x300 px

Fill– pictures will be stretched to set size. If a picture is smaller than defined size, it will be stretched to reach defines size. If a picture is larger, only its part will be stretched.

Original size is 400x300, we set 600x300 px

Data Source Settings

Tue, 29 Oct 2024 08:37:14 +0000

Select SharePoint sitewhere you want to take pictures from.

Then select a Document Librarywhere the pictures for future slideshow are stored.

You can define not the whole picture library but just a folder within it as a data source. Just type the exact name of a folder in “Library folder” field.

It is possible to select view for slideshow.

If you check the box “Search in subfolders”, the pictures will be taken from all subfolders of document library. If the box is unchecked, pictures will be taken only from root folder.