Two types of links are often used on Campbell web pages -- text links and button links to a web pages or email addresses. In this tutorial you will learn how to create new buttons and how to edit existing buttons.

Choose learning method:




Video Tutorial: How to create a button link 

Time: 2:52    Closed Captioning Available: Yes 





Text Tutorial: How to create or edit a button link

Linking to a PDF you have uploaded to the media gallery?
Watch video tutorial OR view text tutorial starting at STEP 1: Find a Document's URL.

Linking to a web page or web form?
Watch video OR view text tutorial starting at STEP 2: Create  or Edit a Button Link.


1. Click the Add Media button of your page to upload a new document (PDF), or to find an existing document. If it has already been uploaded, go to the following step.

2. While in the Media Gallery, select the file and copy the document's  URL.




3.  Find the page where the button will be or is located, and click Edit.




Create a new button


1. While in edit mode, hover over the shortcode icon. Click "Button".



2. Make your selections in the "Insert Button Shortcode" options and click OK:


Button Shortcode Field
Description
Label
Add text to display in the button. We suggest call-to-action phrases with no more than 5 words.
Example: "Download the Student Handbook"
URL
Add the URL for the web page or document. You must include the http:// or https:// protocol.
Example: https://www.campbell.edu
Choose a Style
Select Filled (default) and Ghost. We suggest you select Filled for content pages. If adding two buttons side-by-side, it's fine to use different styles to emphasize which button is most important such as the Filled (left) and Ghost (right) buttons below:

Choose a Theme
Select a color for your button. The options are Orange, Black or White. Orange is the default option.
Action Method
Leave as Link URL (default).
Open link in new tab
Check this books for any external or PDF links.
Examples: PDF forms, Wufoo form links, registration links, links to non-campbell.edu websites.

3. The button shortcode is added to your page content. 



4. Click Preview (Preview Changes) to test how the button appears and works on your page.

Image Placeholder



5. Click Update when you are ready to save and publish the page updates.




Update an Existing Button

When you need to update a button on a page, it's highly suggested that you simply delete the existing button, then create a new one. 

However, if you want to simply swap out the links in an existing shortcode to update the "url=" you MUST follow the exact steps below to get the update button to work as expected.

1.   Delete the old URL from the shortcode.

EXAMPLE
[button label="View the Academic Calendar" url="http://www.campbell.edu/old.pdf" 
style="" theme="" action="" new_tab="true" ] 


2.   The URL space should be empty.

EXAMPLE
[button label="View the Academic Calendar" url="" style="" theme="" action="" 
new_tab="true"] 


3.   Paste the new file URL into the shortcode.

EXAMPLE
[button label="View the Academic Calendar" url="http://www.campbell.edu/new.pdf" 
style="" theme="" action="" new_tab="true" ] 

4.  Click the Update button to save the changes.
Image Placeholder