Smart Button

Primary Button

• Is used in Hero Banner for these views:
  • Home Page Banner
  • Top Banner
• May be used within the body of a page if it is the only CTA on the page; examples where this may occur: Blog page, Press Release, Success Story
• Should be only one Primary Button per page

Secondary Button - White

• Is used in Hero Banner for these views:
  • Home Page Banner
  • Top Banner
  • Offer/Form Banner
  • Card Images with Background Image Layout
• Is used on a dark background in the page body

Secondary Button - Color (Dark Grey)

• Is used on a light background within the page body
• Is used in Hero Banner for Offer Banner view, if White Button does not provide enough contrast

Ghost Button

• Is used on a light background within the page body, typically for a CTA in a 50/50 split on the side where the Text appears

Ghost Button - Dark

• Is used on a dark background within the page body.

• Next Step is used below Card Carousel or Card 2x2 Section Layout to take users to the View All option for cards
• White does not have any use cases at this point in time, but it would be used on a dark background color
• Mini is used only on product pages in the Hero Banner for the functionality that is tied to Digital Exchange. (Phase 2)
• Body Link is used in all cards, except for Card Images with Background Image Layout, which uses Secondary Button style
• Body Link may be used as a standalone CTA within the body of a page

Regardless of whether the Smart Button is a button or link, select one of the following to define the action to be taken:

• Redirect - Use when linking to an internal AEM web page or an external web page
  • Browse - do not copy/paste - to an AEM web page
  • Use https:// for an external URL
    • A Marketo URL (with engage.aveva.com) is considered to be an external URL even though it is an AVEVA domain
• Download - Use when linking to a .pdf or .exe file type (download behavior determined by user's individual browser preferences)
• Scroll to Section - Use when creating an anchor link; this is used in conjunction with the Section ID field in the Background Container component
• Pop-up Video - Use when a video should pop up in a modal (typically this will be done in Home Page or Top Banner when either Primary or Secondary Button style is used)
  • Enable Top Padding does not work for this style
• Form Overlay - Use when a form should open in a lightbox - only 1 Marketo form per page may open in a pop-up due to a known bug with Marketo that will duplicate the form in the pop-up (confirm if only when opened from a button and not from a link in Smart Button)
  • Recommendation is to reserve the usage of the pop-up form in the lead-generation Offer Banner used at the bottom of the page in Solutions, Industries, and Products site sections