Creating Callouts

A callouts is a visual element that can be added to your Stacks site to call attention to important information, features, or direct users to other areas in Stacks or websites outside of Stacks.

A single callout can contain up to 4 blocks, each block can contain its own title and image (both of which can by hyperlinked), description, and additional related links. Multiple callouts can be created and added to your homepage or any other landing pages you have created. This article will discuss both creating callouts and how to add them to a landing page. 

How to Create a Callout

1. From the Dashboard, click the Callouts tile
2. Click Add Callout, in the window that opens:
   1. Title, enter a title for the callout
      1. Tip! This title is used for both administrative purposes and will be the default heading that can be displayed when the callout is added to a landing page
   2. Language - select the appropriate language value from the list
   3. Click the Add Callout button, this will open a set of fields allowing to add the content for the first block within the callout
      1. Title, enter a title for the block (optional)
         1. Tip! If a Link is added (discussed in step 3) clicking this title will direct the user/patron to the location added in the link field
      2. Image - click the button to browse for and select existing image or upload a new image that will be displayed within the callout block
         1. Tip! For an optimal user experience see the Recommended Image Sizes article for guidance when uploading/selecting images. Also, if a Link is added (discussed in step 3) clicking this image will direct the user/patron to the location added in the link field
      3. Link - add a URL to this field, users will be directed to this url when the title or image is clicked
         1. Tip! Links to external websites should always use the full URL (eg: https://website.com); whereas, links to internal Stacks pages should always use the URL alias (eg: /events)
      4. Description - enter the details you wish to display as a description under the image (if adding an image)
         1. See the WYSIWYG editor article for more information on formatting options and field functionality  
      5. Additional Links - click the Add Link button if additional links are required, add the appropriate URL and Link Text as needed
         1. Patrons/users will see these links will below the description, if one has been added
3. Click Add Callouts button below the Additional Links fields to add more callout blocks and repeat the steps above as needed, adding up to 4 blocks within the callout
4. Tip! The Save As: field can be used to change the state of the content, whether this is to save it if not complete, for review purposes prior to publishing, or for un-publishing previously published content, click the drop-down to select from
   1. Draft, this will save the work in it's current state but does not publish the content
      1. Note: This is the default state when users with the Editor role are creating callouts. Draft content cannot be added to landing pages
   2. Needs Review, saves the work in its current state and indicates it is ready to be reviewed prior to publishing or making further edits. Content cannot be added to a landing page when in this state
   3. Reviewed, saves the work in it's current state and indicates it can be set to published to be added to a landing page. Content in this state cannot be added to a landing page
   4. Published, saves the work in it's current state and publishes the content, making it available to be added to a landing page
      1. Note: this is the default state when users with the Moderator or Administrator role are creating callouts
   5. Unpublished, saves the work in it's current state and un-publishes/removes the content from any active landing pages. Content in this state cannot be re-added to a landing page until it is changed back to the published state
5. Review and configure the Publishing workflow as needed
6. Click Save

For more information on how to add a callout to your homepage or any other landing page, see the article Adding Callouts to a Landing Page. For more information on editing callouts, removing callouts from a landing page without deleting the callout, or how to delete a callout, please see the article Editing and Deleting Callouts.