Call to Action

A Call to Action (CTA) is a component that includes and image and a link. A call to action can exist on any page, however it should only appear on the right-hand side of the page. 

On this page:

 

Content

This section describes the steps to manage call to action content.

 

Creating a Call to Action

  1. Go to Manage > Structure > Custom Block Library
  2. Click Add Custom Block
  3. Choose Call to Action
  4. Provide a Title
  5. Provide an Image
    • Tip: It is recommend that images be at least 550px wide. See image specs below for more detail.
  6. Provide a URL
    • Tip: If you are linking to an internal page, use relative paths. Simply start typing the title of the page and it will show up in the results.
  7. Provide a Link Title
  8. Options: Provide a blurb
  9. Save

 

Editing a Call to Action

  1. Go to Manage > Structure > Custom Block Library
  2. Find the Call to Action you want to edit 
    • Tip: Use the filter to refine the list and make your search easier by setting the Block type to Call to Action and/or adding a keyword from the title.
  3. Once you find the block you wish to edit, click Edit 
  4. You will be taken to the block edit screen where you can make your desired changes
    • Changes made to the contents of the block will be reflected in all instances of the block except where they are overridden.
  5. Save

 

Deleting a Call to Action

Please note that deleting content is permanent and irreversible.

  1. Go to Manage > Structure > Custom Block Library
  2. Find the Call to Action you want to edit 
    • Tip: Use the filter to refine the list and make your search easier by setting the Block type to Call to Action and/or adding a keyword from the title.
  3. Once you find the block you wish to edit, click the arrow down button next to edit and click Delete
  4. You will be taken to a confirmation page. Click Delete to confirm.
    • Warning: As with all deletions in Drupal, deleting pages is permanent and cannot be undone.
  5. Save

Deleting a block does not automatically unplace / remove it from the page it was placed in. The block will not be visible to public view. Editors will see a warning for a missing block when they edit the layout and should remove it to clean up.

 

Placement

This section describes the steps to place and configure an instance of a call to action. Placing and unplacing a Call to Action in basic pages is the same process as any block.

 

Placing a Call to Action

  1. Visit the page you wish to place the Call to Action in
  2. If you are logged in and able to edit, you should see the local task tabs and be able to click Layout
  3. In the area you want the block to appear, click Add Block
  4. The list of available blocks will then appear at the right hand side of the page. Search for the Call to Action you want to place
  5. Optional: Configure the block
    • With your block placed, click the contextual edit button (Pencil Icon) for the block and select configure.
    • Make your desired configurations
      • See Configurations below to see available configurations for basic blocks.
      • These configurations are for the specific instance of the block. Overrides created here will remain even if the original content has been changed in the library.
    • Click Update
  6. Click Save Layout

 

Configuring a placed Call to Action

  1. Visit the page you the Call to Action you wish to configure is in
  2. If you are logged in and able to edit, you should see the local task tabs and be able to click Layout
  3. Hover over the block you wish to configure and click the contextual edit button (Pencil Icon) and click Configure
  4. Make your desired configurations
    • See Configurations below to see available configurations for basic blocks.
    • These configurations are for the specific instance of the block. Overrides created here will remain even if the original content has been changed in the library.
  5. Click Update
  6. Click Save Layout

 

Unplacing / Removing a placed Call to Action

  1. Visit the page you the Call to Action you wish to remove is in
  2. If you are logged in and able to edit, you should see the local task tabs and be able to click Layout
  3. Hover over the block you wish to remove and click the contextual edit button (Pencil Icon) and click Remove Block
    • It will simply remove the block from the page
  4. You will be prompted to confirm. Click Remove to confirm
  5. Click Save Layout

 

Inline Call to Action

Please refer to Blocks > Custom Block (Global vs Inline) for information on the differences. The steps in this section essentially describes the content creation and placement of a block in tandem.

Warning: Inline Call to Actions cannot be referenced from a Call to Action Grid

 

Creating & Placing an Inline Call to Action

  1. Visit the page you wish to place the Inline Call to Action in
  2. If you are logged in and able to edit, you should see the local task tabs and be able to click Layout
  3. In the area you want the block to appear, click Add Block
  4. Click Create custom block
  5. Choose Call to Action
  6. Fill in the fields and configure as desired
  7. Click Add Block
  8. Click Save Layout

 

Editing & Configuring an Inline Call to Action

  1. Visit the page you the Inline Call to Action you wish to edit and configure is in
  2. If you are logged in and able to edit, you should see the local task tabs and be able to click Layout
  3. Hover over the block you wish to configure and click the contextual edit button (Pencil Icon) and click Configure
  4. Make your desired content edit configurations
  5. Click Update
  6. Click Save Layout

 

Deleting an Inline Call to Action

Please note that deleting content is permanent and irreversible.

  1. Visit the page you the Inline Call to Action you wish to delete is in
  2. If you are logged in and able to edit, you should see the local task tabs and be able to click Layout
  3. Hover over the block you wish to remove and click the contextual edit button (Pencil Icon) and click Remove Block
    • Warning: This will remove the block from the page and delete its contents. As with all deletions in Drupal, this is permanent and can't be undone.
  4. You will be prompted to confirm. Click Remove to confirm
  5. Click Save Layout

 

Specifications

 

Fields

  • Block Description
    • Plain Text
    • This field dictates the block's default title 
  • Image
    • Media Image
    • This field dictates the cta's image
    • Uses the Square image style
      • Images will be scaled and cropped to a 1:1 ratio
      • Recommended size is at least 550px wide or larger.
  • Link
    • URL
      • If linking to an internal page, simply type the title of the page you would like to link to and it should appear in the list for you to choose
      • If linking to an internal page with a special path (such as categorized listings), refer to the categorized listing section of the site details page or the respective feature's documentation for details on how to get its relative path
      • If linking to an external page (including UTM webpages outside of your subsite), use an absolute link
    • Link Text
      • This dictates the title of the link
  • Optional: Blurb
    • Plain text
    • This dictates the text that appears under the image

 

Configuration

Configurations and overrides for a specific block instance. Overrides set here will remain even if the actual block's content has been changed in the library. 

  • Title
    • The block's default description can be overridden here to serve as a title. If overridden, it will remain even if the block's description is changed in the library.
  • Display Title
    • Toggles the display of the title on / off
  • View Mode
    • Default / Full
      • Standard display of CTA content
      • Blurb will only appear if it is not empty
    • Minimal
      • Minimal display of CTA content.
      • It will only show the image and link even if other fields are not empty.

 

Best Practices

  • Avoid images of text where possible. 
  • Keep the blurb short.
  • Your link title should represent an action (e.g. "Act now", "Register here", "Learn more", etc.).
  • If linking to a page within your site, try using a relative URL in the URL field
  • It is recommended that CTAs be placed in the Right Sidebar region for your pages only for consistent placement throughout the site.
  • When placing the Call to Action block, try to limit the placement to pages that are relevant to the URL it is linking to. For example, if your Call to Action is targeted at new students it might not make sense to have it appear on pages targeted to returning students.