Similar to the Owl Carousel this widget allows you to create a rotating carousel of items of your choosing ranging from text to buttons. Good for showing a mix of different items ranging from events to news and everything in between.

 

How do I add this widget to a page?

  1. Click Edit Page
  2. Click the Edit Content icon (pencil) and select either Insert before or Insert after
  3. Choose the Owl Carousel Editable widget
  4. Click on the green + Slide button in the upper-right hand corner, repeating until you have created all of the necessary slides.
  5. Additional fields can be found in the Settings tab, changing these is optional and not necessary for the function of the widget. But they will allow you to customize the widget to your liking. The fields and their descriptions are listed below;
    • List Heading - Enter the title of the list. If nothing is entered a heading will not be displayed.
    • Heading Size - You can choose the size of the heading, if one is entered. The available options for sizes range from H1 through H3.
    • Description - Enter a short description of the list. If nothing is entered no description will displayed.
    • Title Sizes - Choose the size of titles, sizes range from H1 through H6.
    • Auto Width - If the items displayed in the widget need to have a  consistent width on all devices. Flip the switch to on by default it is off.
      • Items Displayed (Mobile) - Control the amount of items to be displayed on screen for small devices (i.e. mobile phone). This value has no effect when "Auto Width" is enabled.
      • Items Displayed (Tablet) - Control the amount of items to be displayed on screen for medium devices (i.e. tablet). This value has no effect when "Auto Width" is enabled.
      • Items Displayed (Desktop) - Control the amount of items to be displayed on screen for large devices (i.e. desktop, standard monitor). This value has no effect when "Auto Width" is enabled.
      • Items Displayed (Large Desktop) - Control the amount of items to be displayed on screen for large devices (i.e. desktop, standard monitor). This value has no effect when "Auto Width" is enabled.

    • Spacing - This field lets you control the margin (pixels) between each item.
    • Autoplay - Should the carousel automatically play. The default is on but will not be active while in edit mode.
    • Loop - By default the carousel will loop but it can be turned off here.
    • Speed- You can customize the speed of the carousel by entering a number (in milliseconds) here.
    • Navigation - By switching this to on, arrows will be displayed on either side of the widget allowing a visitor to manually navigate through the slides.
    • Dots - Similar to the navigation arrow, dots are displayed at the bottom of the widget. They allow a visitor to navigate through the carousel by shifting to the items associated the dot.
  6. When you are finished, click on the green Create button and your Owl Carousel Editable widget will show up on the page.
  7. Now click on the container that you want to add items to followed by the green + icon where you can add the necessary widgets. You can use the Row widget to show multiple photos in a container (shown one on top of each other) and the HTML WYSIWYG widget to display an image with text in a container.
  8. Make sure to click the Save --> Publish options just as you would when you're editing pages.


Note - The height of the Owl Carousel Editable widget is dependent on the items in the containers. If you have one that is using a HTML WYSIWYG that has a lot of text in it the Owl Carousel Editable widget will be taller for all of the slides. Please note some widgets that are placed in the containers will automatically resize to fit while others do not, for example the Button widget  will overlay containers to the right of it. Finally we do not recommend placing an Owl Carousel inside another due to any unforeseen problems that may occur.




How do I hide/show content in the widget?

Hiding a item from being displayed by a Owl Carousel Editable widget can be done quickly. Edit the widget and click on the switch to the right of the slide that you would like to hide, switching it to gray (hidden) and finally Update. To show a Item that has been hidden, click on the switch to the right of the slide that you would like to show switching it to green (visible) and finally Update.


How do I change the order of the content shown?

To change the order of how the slides are being displayed by the Owl Carousel Editable widget. Edit the widget and click on the vertical directional arrow icon to the right of the slide you would like to move, choose either Move Up or Move Down and finally, Update when you are done.


How do I remove content from being displayed?

To remove a item from being displayed by the Owl Carousel Editable widget. Edit the widget and click on the trash icon to the right of the slide you would like to remove followed by Update.


How do I edit a content that doesn't show in the widget?

To edit the content that isn't currently showing in the  Owl Carousel Editable widget, click on the circles located below the the widget or arrows to either side depending on the settings for the widget to scroll through the content containers.