Navigate to the page on the WEMBA site that you would like to add floating buttons.

Ensure you are signed in to the back end with PennKey and password. If you are signed in, you will be able to click "Edit Page."

If you're not signed in, you will need to scroll to the very bottom of the page and click the copyright symbol in the bottom left. Click the symbol, and it will prompt you to log in.

Once you're in the back end of the page where you'd like to add the floating buttons, you will need to click "+" to add an element.
Click "Row."

Once you're in the back end of the page where you'd like to add the floating buttons, you will need to click "+" to add an element.

The row will appear below all the other content on the page, so you will need to drag it up to where you want it on the page, which should be right under the header. 

Once you have it in the right place, click the "+" inside the row to add another element. Choose "Floating Buttons."

Click the Button 1 Style dropdown, and choose "White Outlined."

Penn Red
Penn Blue
White Outlined
Grey Outlined

Click "SELECT URL," and choose "2023-2024 Medium Form" from the options.

Edit the Link Text field to say "Stay Updated."

Check "Open link in a new tab"\
When you're done, click "Set Link."

Now it's time to add a background for the buttons. Click the pencil of the floating buttons row. 

Click "SELECT COLOR," and type 990000 to choose the Wharton red.

Add "10" to the padding above and below the center.

Click "Background"\
Click the dropdown for "Background Style," and choose "Single Color."

Click the dropdown for "Background Style," and choose "Single Color."

Default
Single Color
Gradient Color
Image / Parallax
YouTube Video
Hosted Video

Once you've chosen the color, click the "Background Override" dropdown, and select "Full Width." When you're done, click "Save changes"

Once you've chosen the color, click the "Background Override," dropdown, and select "Full Width." When you're done, Save Changes.

Default Width
Apply 1st parent element's width
Apply 2nd parent element's width
Apply 3rd parent element's width
Apply 4th parent element's width
Apply 5th parent element's width
Apply 6th parent element's width
Apply 7th parent element's width
Apply 8th parent element's width
Apply 9th parent element's width
Full Width
Maximum Full Width
Browser Full Dimension

Now you need to close the gap between the header and the floating buttons. To do so, click the pencil at the top right of the header row.

Click the bottom of the margin field, and type "0."
Click "Save changes"

Click the bottom of the margin field, and type "0."

Click "PREVIEW CHANGES" to ensure everything looks as it should. This preview will open in a new tab. 

If the preview looks ok, go ahead and click "Update."

Upenn

executivemba.wharton.upenn.edu

This guide provides step-by-step instructions on how to add floating CTAs (Call-to-Action buttons) to the WEMBA website. By following these instructions, users can easily enhance their website by adding eye-catching floating buttons that direct visitors to specific pages or forms. This guide also includes tips on customizing the design and appearance of the floating buttons to match the website's branding.

How to Add Floating CTAs to WEMBA's Site