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
_blankto open the link in a new tab. Defaults to_self. - ID (id): Optional. An HTML
idattribute 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"]