Facebook Pixel Modal Snippets | Western Kentucky University Skip to main content

Modal Snippets


The modal snippet allows you to hide content off-screen in a modal dialog window that is called by pressing an accompanying button. The modal window is brought on top of the entire page and navigation with a dark background effect. After viewing the content the user can close the modal using another button with custom text.

 

Available Settings

LAUNCH-BUTTON-COLOR
Changes the color of the button that launches the modal, WKU Red button or Gray button. (Options: RED or GRAY)

LAUNCH-BUTTON-SIZE
Controls the size of the button that launches the modal. (Options: SMALL, MEDIUM, or LARGE)

FOOTER-BUTTON-COLOR
Changes the color of the button in the footer of the modal that closes the dialog window. Since it is a default button in the modal WKU Red button or Gray button are the only color options for this button. (Options: RED or GRAY)

MODAL-SIZE
Controls the width of the modal window. (Options: SMALL, MEDIUM OR LARGE)

 

Snippet Columns

Launch Button Text
Edits the text of the button that launches the modal.

Modal Title
Edits the red background title at the top of the modal.

Modal Footer Button Text
Edits the text of the button in the footer of the modal that closes it.

Modal Content
Edits the body content of the modal.

 



Example #1 - Short Message

A modal to indicate a short message. This example uses the small size modal and the WKU red button.


Modal Snippet - https://www.wku.edu/funnymonkeys/snippets/modals.php
LAUNCH-BUTTON-COLOR RED
LAUNCH-BUTTON-SIZE MEDIUM
FOOTER-BUTTON-COLOR RED
MODAL-SIZE SMALL
Launch Button Text Modal Title Modal Footer Button Text Modal Content
Monkey Time Funny Monkey Hours Got it!

Monkeys don't wear watches!




Example #2 - Longer Message

A modal with more information. This example uses the medium size modal and the grey button. Modals can contain more text than a simple message. Use these modals when you need to include addition content off the page.


Modal Snippet - https://www.wku.edu/funnymonkeys/snippets/modals.php
LAUNCH-BUTTON-COLOR GRAY
LAUNCH-BUTTON-SIZE MEDIUM
FOOTER-BUTTON-COLOR GRAY
MODAL-SIZE SMALL
Launch Button Text Modal Title Modal Footer Button Text Modal Content
Get the Details Monkey Details Close

Zoo tree. Arboreal monkey howler banana. Primate exotic capuchin arboreal spider. Monkey baby tree baby. Banana tree funny monkeys spider funny monkeys. Spider endangered space monkey zoo baby. Primate monkey rainforest. Banana primate. Funny monkeys zoo funny monkeys howler funny monkeys. Zoo funny monkeys. Monkey zoo tree. Funny monkeys zoo tree. Zoo zoo. Capuchin endangered endangered tree rainforest. Zoo space monkey zoo zoo endangered. Endangered endangered endangered arboreal.

Endangered exotic rainforest endangered rainforest. Banana monkey howler spider. Exotic banana. Zoo howler capuchin baby capuchin. Endangered funny monkeys rainforest banana. Banana endangered primate exotic. Arboreal rainforest exotic. Howler exotic baby. Spider endangered space monkey zoo baby. Primate monkey rainforest. Banana primate. Funny monkeys zoo funny monkeys howler funny monkeys. Zoo funny monkeys. Monkey zoo tree. Funny monkeys zoo tree. Zoo zoo. Capuchin endangered endangered tree rainforest. Zoo space monkey zoo zoo endangered. Endangered endangered endangered arboreal.




Example #3 - Form

Modals can contain many things including other snippets and assets. In this example we use a small button to launch a form asset placed in the Modal Content to create a simple off page contact form.


Modal Snippet - https://www.wku.edu/funnymonkeys/snippets/modals.php
LAUNCH-BUTTON-COLOR RED
LAUNCH-BUTTON-SIZE SMALL
FOOTER-BUTTON-COLOR GRAY
MODAL-SIZE SMALL
Launch Button Text Modal Title Modal Footer Button Text Modal Content
Contact the Monkeys Contact the Monkeys Close {{a:145780}}



Example #4 - Larger Modal

The Large modal size can be used for almost any content you want to place in it. This includes other snippets, images, assets, and more. This example combines the 2 column snippet, images, text, and a form asset.


Modal Snippet - https://www.wku.edu/funnymonkeys/snippets/modals.php
LAUNCH-BUTTON-COLOR RED-OUTLINE
LAUNCH-BUTTON-SIZE LARGE
FOOTER-BUTTON-COLOR GRAY
MODAL-SIZE SMALL
Launch Button Text Modal Title Modal Footer Button Text Modal Content
Contact the Monkeys Contact the Monkeys Close

Two Column Responsive Snippet

ALIGN-CENTER YES

Monkeys!

Baby rainforest capuchin howler. Endangered rainforest tree zoo. Monkey baby. Space monkey primate zoo space monkey exotic. Rainforest monkey banana endangered space monkey. Primate rainforest. Capuchin rainforest baby.

{{a:145780}}



Need Assistance?

The WKU ITS Service Desk is here to help. Give us a call, chat with a representative online, use the Self-Help Knowledge Base and more.

Get Help



Some of the links on this page may require additional software to view.

 Last Modified 9/14/18