Buttons

Buttons should only be used sparingly on University websites as calls to action that need more prominence than a traditional link. Keep the number of buttons on a page limited.

Buttons should only be used as calls to action. Avoid titles like “For Students” or “More Info”. Good titles would be “Download Forms” or “Sign Up for More Information”. If the University web team notices misuse of buttons we will reach out and work with you to correct the content.

Button Shortcode

mu_button Parameters

  • RequiredTitle (title): The text displayed in the button. Should be a call to action. Keep to 3–5 words. Do not include HTML or inline CSS.
  • RequiredLink (link): The URL the button links to.
  • Type (type): Controls the button style. Options:
    • green — Default. Green background with white text.
    • white — White background with green text. Use only on dark backgrounds.
    • brown — Brown background with white text. Used for secondary calls to action.
    • black — Black background with white text.
    • clear — Transparent background with white text. Use only on dark backgrounds.
  • Target (target): Optional. Set to _blank to open the link in a new tab. Defaults to _self.
  • ID (id): Optional. An HTML id attribute on the button.
Dos
  • Keep button text short — no more than 3–5 words
  • Use active voice as button text
  • Use target="_blank" when linking to external sites
Don'ts
  • Use a full sentence as button text
  • Use a button to link to another page in body text
  • Use vague labels like “Click Here” or “More Info”

Button Shortcode Examples

Green Button (Default)

Shortcode
[mu_button link="http://www.marshall.edu" title="Visit Our Website"]

White Button

Shortcode
[mu_button link="http://www.marshall.edu" title="Visit Our Website" type="white"]

Brown Button

Shortcode
[mu_button link="http://www.marshall.edu" title="Visit Our Website" type="brown"]

Black Button

Shortcode
[mu_button link="http://www.marshall.edu" title="Visit Our Website" type="black"]

Opens in New Tab

Shortcode
[mu_button link="http://www.marshall.edu" title="Visit Marshall.edu" target="_blank"]