NorrCompetition Carousel

The module displays entries from selected contests with nice carousel effect.

NorrCompetition Carousel - settings
NorrCompetition Carousel - module settings

General Options

  • Type - type of the data - entries or contests;
  • Items - this variable allows you to set the maximum amount of items displayed;

This allows you to preset the number of slides visible with a particular browser width. That if(window<=1199){ show 4 slides per page}

Desktop

  • Desktop Browser width - width in pixels;
  • Items for Desktop - this variable allows you to set the maximum amount of items displayed for Desktop Browser width;

Desktop Small

  • Desktop Small Browser width - width in pixels;
  • Items for Desktop Small - this variable allows you to set the maximum amount of items displayed for Desktop Small Browser width;

Tablet

  • Tablet Browser width - width in pixels;
  • Items for Tablet - this variable allows you to set the maximum amount of items displayed for Tablet Browser width;

Mobile

  • Mobile Browser width - width in pixels;
  • Items for Mobile - this variable allows you to set the maximum amount of items displayed for Mobile Browser width;
  • Display only one item - force one item to show;
  • Items Scale Up - option to not stretch items when it is less than the supplied items;

Basic Speeds

  • Slide speed - slide speed in milliseconds;
  • Pagination speed - pagination speed in milliseconds;
  • Rewind speed - rewind speed in milliseconds;

Auto Play

  • Auto Play - use the automatic scrolling slides;
  • Auto Play Speed - slide speed in milliseconds if Auto Play Enable;
  • Stop autoplay on mouse hover - enable or disable;

Navigation

  • Navigation - display 'next' and 'prev' buttons;
  • Slide to first - slide to first item. Use Rewind Speed to change animation speed;
  • Scroll per page not per item - scroll per page not per item. This affect next/prev buttons and mouse/touch dragging;

Pagination

  • Show pagination - enable or disable paginations;
  • Show numbers inside pagination buttons;

Responsive

  • Resposive - enable or disable responsive capabilities;
  • Responsive refresh rate - check window width changes every 200ms for responsive actions;

CSS Styles

  • Base class - automaticly added class for base CSS styles. Best not to change it if you don't need to;
  • Theme - name theme, it also is a class theme ;
  • Use Theme CSS - enable or desable theme file css;
  • Use Transitions CSS - enable or disable transition css. Has a dependency on the parameter 'Transition animation';

Lazy Load

  • Lazy load - delays loading of images. Images outside of viewport won't be loaded before user scrolls to them. Great for mobile devices to speed up page loadings. IMG need special markup;
  • Lazy follow - when pagination used, it skips loading the images from pages that got skipped. It only loads the images that get displayed in viewport. If set to NO, all images get loaded when pagination used. It is a sub setting of the lazy load function;

Auto height - automatically adapts the items height. Use it only for one item per page setting;

Mouse Events

  • Mouse drag - turn off/on mouse events;
  • Touch drag - turn off/on touch events;

Transition animation - add CSS3 transition style. Works only with one item on screen. Effects: Fade, Back Slide, Go Down, Fade Up;

Add active class - Add 'active' classes on visible items. Works with any numbers of items on screen;


Entries Options

  • Count - specify the entries count to display;
  • Title Length - if set then the title of the entry will be truncated till this value. You may set it when the title breaks the layout;
  • Contests - the contest which the entries should be displayed from;
  • Order - ordering for the list of entries;
  • Order Direction - ascending or descending;

Main Layout Settings

This settings are applied to the item of the entry.

  • Image - show or hide the image of the entry;
  • Image Size - you can choose image size: big, medium, small;
  • Image Link - use link in image at the entry;
  • Lightbox - use lightbox link in image instead the entry;
  • Lightbox Image Size - select size image for lightbox: big, medium, small;
  • Title - show or hide the title of the entry;
  • Title Link - use title link of the entry;
  • Rating - show or hide the rating of the entry;

Overlay Layout Settings

Overlay is applied to the image of the entry

  • Use Overlay - use overlay for image of the entry;
  • Title - use title in overlay;
  • Rating - use rating in overlay;

Contests Options

  • Count - the contests count to display.
  • Title Length - if set then the title of the contest will be truncated till this value. You may set it when the title breaks the layout;
  • Category - the category which the contests should be displayed from.
  • Status - the status of the contests to display: All, Active or Completed.
  • Order - the ordering of the contests: Title Alphabetical, Ordering, Created Date, Start Date or End Date.
  • Order Direction - the direction of the ordering: Ascending or Descending.

Main Layout Settings

This settings are applied to the item of the contest.

  • Image - show or hide the contest image.
  • Image Link - use link in image at the contest.
  • Description - show or hide the description of the contest.
  • Limit characters - limit the number of characters
  • Information - show or hide the information about the contest. If this parameter is set to hide, then all parameters below will not make any effect.
  • Category – show or hide the category of the contest.
  • Link Category - display the category title as a link to a category layout.
  • Status - show or hide the contest status.
  • Created Date - show or hide the created date of the contest.
  • Start Date - show or hide the start date of the contest.
  • End Date - show or hide the end date of the contest.
  • Voting Start Date - show or hide the voting start date.
  • Voting End Date - show or hide the voting end date.

Overlay Layout Settings

Overlay is applied to the image of the contest.

  • Overlay - use Overlay for image of the contest
  • Title - show or hide the title in overaly
  • Description - show or hide the description in overlay
  • Limit characters - limit the number of characters

Alternative Layout

In the advanced tab you should select the alternative layout that matches your theme in the component settings: default, bootstrap2, bootstrap3 or uikit.

Alternative Layout
Alternative Layout