Widget Library

Custom Homepage Banner

Create and manage rotating "feature" images at the top of your home page.

This widget will display a series of photos with text, rotating in a loop from right to left. The slider comes with controls so a viewer can quickly flip through the available slides.

To begin creating items to be used in the Custom Homepage Banner, click on the green + Slide in the upper right=hand corner and fill out the necessary information.


Please be aware that this widget will only work on certain sites (themes) that have the necessary programming. If you place this widget and it does not work, we recommend switching to the Custom Homepage Banner widget.

Recommendation - We recommend setting and keeping with a set height and width for the photos that are used in the Custom Homepage Banner. This will prevent elements below the widget from shifting up and down as the slides change.

 



How do I add this widget to a page?

  1. Click Edit Page
  2. Click either + Content or the Settings icon (down-facing caret) which will be located to the right of Edit where you will need to select either Insert above or Insert below
  3. Choose the Owl Feature Slider  widget
  4. Click on the green + Slide button in the upper-right-hand corner and enter the Heading and an image that you would like to be displayed. Additional fields that can be filled out include;
    • Alignment - Alignment of text by default the text is aligned left. 
    • Teaser Text - Enter the additional text you would like to display with the slide.
    • Button Label - If you would like a button to be displayed, enter the text in this field.
    • Button URL- Enter the URL that you would like to link the button to
    • Button Target - When enabled, the link for the button will open in a new window.
  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;
    • Transition Type
    • Transition Speed - You can customize how long the transition between slides should be, change 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.
    • Pagination - 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 with the dot.
    • Pagination Numbers
    • Pagination Speed - You can customize the length of time a slide is visible by entering a number (in milliseconds) here.
    • Autoplay - Should the carousel automatically play.
    • Pause on hover - By default, the carousel will loop but it can be turned off here.
  6. When you are finished, click on the green Create button and your Custom Homepage Banner widget will show up on the page.
  7. Make sure to click either the Publish or the Save Draft option just as you would when you're editing pages.




How do I hide/show a slide that is in the list?

Hiding an item from being displayed by a Custom Owl Homepage Banner 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 an 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 slides shown?

To change the order of how the slides are being displayed by the Custom Owl Homepage Banner 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 a slide from being displayed?

To remove an item from being displayed by the Custom Owl Homepage Banner widget. Edit the widget and click on the trash icon to the right of the slide you would like to remove followed by Update.