If you need to separate content into more than two columns, you will need to use e-z columns. Navigate to the bottom of the Sandbox and add a new row. The new row should be set to WYSIWYG. At the top of the editing options for the content section you should see a button with two brackets.
Once you’ve clicked this button, you should see a menu showing various options for columns as seen below. For this example, we will select the option for “one third”.
Once you’ve selected “one third”, it will insert two sets of short codes into the WYSIWIG’s content section. We will begin by clicking in between these two sets of short codes and clicking the enter / return key twice. The sets of short codes should now look like the image below.
Let’s add the rest of the short codes to complete the formatting. Set your cursor to the end of the [/one_third] short code and repeat the previous steps. See the image below for reference. Once you’ve completed this step, we will repeat it once again but this time we will select the “One Third Last” option. See the image below for reference. It’s important that the last set of short codes is the “Last” option, otherwise the columns will not format correctly.
Let’s begin adding content to these newly added columns. In between the first set of short codes, we are going to add a phone number. The phone number you’ve added should look like the picture below.
Now that we’ve added a phone number, let’s highlight the phone number and select the hyper link icon from the tool bar above. A field will appear to add a link. To create a link for a phone number, we will add the word “tel:” before adding the country code and the phone number. It’s important that you add the word “tel:” otherwise the link will not function correctly and will send the user to a 404 page. Once you’ve added the link in this format, select the blue button.
In the next column, we’ll add an email. Similar to creating a link for a phone number, emails use a specific word to create a link. Add an email in between the second set of short codes, highlight the email, and then select the link button. If the email is in lower case letters, once you click the link button it will automatically add the words “mailto:” before the email. Without these words, this link will not function correctly and will send the user to a 404 page.
For the last set of short codes, we will add a URL. Once you’ve added a URL between the last set of short codes, highlight the URL and select the link button.
If the link you are adding is an external website (this refers to any website that is not a part of the med.virginia.edu network) select the gear icon next to the check mark. This will allow you to select the option to have the link open in a new tab. It’s web best practice to have any link that is not a part of the sites network open in a new tab. Once you’ve selected the option to “Open link in a new tab” select the “Update” button.
Now that we’ve added the three links in between the three different sets of short codes, let’s select save draft and preview. See the image below for reference.
Now that we’ve covered how to properly add hyperlinks and format content into columns, let’s cover some of the tools WordPress has to offer. UVA SOM WordPress utilizes two common plugins to handle a variety of tasks.