Callout Banner Widget

The Callout Banner Widget displays a headline and optional detail description overlaying an image of your choice. It can have a button linking to another page or a search box to search for more content that the viewer might be interested in. It can also be used in place of the regular page title if you want to add a striking visual at the top of your page.

1. To add a new widget to your site you must get to the layout area. First, click on the Layout button on the top right side of the page.
Layout Button

2. Select Create New Widget and click on the Callout Banner  option.
callout banner - in widget list

3. Enter a name for the Widget Description.

4. Select Banner Size (Full width or Content width).
callout banner - banner size

5. Upload an image from your computer or from Previously uploaded files tab. (For best results, the image should be 1920 x 1080 pixels. The image should not contain text or busy patterns that will distract from the main text. It is a decorative background image, and the content is not accessible to screen reader users.) If you do not provide an image, then a solid color background will appear behind the widget.

6. Enter a headline in Headline box.

7. Check the "Use as page title" box if you wish to hide the regular page title and use this widget as the title instead.

Callout Banner use as page title checkbox

8. Enter a longer description or tagline in Text box if desired.

9. Select Link button, Search box, or None in Call to Action Style.

  • If you select "Link button," you will be required to enter a link URL and text to use on the button. This will serve as a call to action link, so the text should be succinct.
  • If you select "Search box," the user will see an input field for search keywords. It allows them to search all the OpenScholar sites at your institution. In the future, we plan to add an option to restrict the search to your own site.
  • If you select "None," nothing will appear below the headline and text. This can be useful if you are using the element as a page title on subpages and don't want to direct the user to a different page.

Callout Banner call to action options: link button, search box, or none

10. Click Save button. 

11. Drag the widget from the widget library and place anywhere within the layout.

callout banner - drag to layout

 

12. Save the layout and view the result.

callout banner - sample