Webtools How-to Guide
Event: Inline media
How to...
Note: Since adding inline media to an article or event on Webtools are very similar, for the above items, we are using similar how-to videos to those recorded for the article module. However, transcriptions below the videos are customized to pertain to the add/edit event page.
How to create and manage hyperlinks in the body of an event
In order to create a hyperlink in the body of an event, you should select the text you want to highlight, then click the Hyperlink Manager button in the text editor toolbar on the Add/Edit Event page: 
In the pop-up window, Hyperlink Manager, you will find a number of fields under three tabs: Hyperlink, Anchor, E-mail.
Under the Hyperlink tab is the URL field, which you will use the most. You can either directly type in the address, or if you want to copy/paste the URL, simply remember to delete the protocol characters http://
By using the Target dropdown, you can choose to display the page you are linking to in the same window, in a new window, or in a new browser tab. You have a number of other options as well.
You can also assign an email address to this link by typing in the address under the E-mail tab.
When you are done with your settings, click OK and you are good to go. Finally, do not forget to Save the event for the changes to be reflected on the actual event page.
Back to top
How to insert images or files in the body of an event using the text editor
You can insert images or files in the body of an event on the Webtools application. To do so, simply place your cursor where you want to place the image or file, then click Insert Image or File button in the text editor toolbar: 
Here you have the option to either insert an image or a file. To insert an image, click Select and select the image file and click Upload.
Accepted file types:
- Images: .jpeg, .jpg, .png, .gif, .bmp
- Files: .pdf, .txt, .doc, .docx, .ppt, .pptx
Now you can right click on the image and click Properties. You can change the size and alignments of the image as you like. You can add a buffer around the image (5px all around is recommended). You can add a Class called Caption to allow for an image caption (the caption text goes in the Alt Text field). Click OK when you are done.
Using this technique, you can add multiple images.
In order to insert a file, again, you click where you want to place it, then click on the same icon; this time select File as a link. Locate your file in the file picker and in the Link Text field right below that, type in, let’s say, Click here to download the file. When you are done, click Upload.
When you right click on this link and select Properties, you see the Hyperlink Manager pop-up window with a number of editing options.
Here you can choose to open it in a new window, a parent window, or in the other ways provided. Click OK when you are done editing. Finally, do not forget to Save the event for the changes to be reflected on the actual event page.
Back to top
How to add extra media (audio, image, video) to the body of an event
If you want to embed audio, image, or video files to the body of an event, you can do this through the extra media options of the Advanced Media Files section. (Please note that you can embed images in the event body by using the Insert Image or File button of the text editor as well.)
You will see three file types in the dropdown of Advanced Media Files section: ExtraImage, ExtraAudio, ExtraVideo. Let’s try extra video now although all three file types work quite similarly.
First Choose the file, then fill in the Title, Caption and Description fields as you wish. You have the option here to make the video downloadable (if so, check the checkbox). Click Save when you are done. Here we have the video saved in our event.
Accepted file types:
- Images: .jpeg, .jpg, .png, .gif
- Videos: .mp4, .mov
For the next step, you should select the embed code, copy it, go up to the text editor, and locate the cursor to wherever you want to embed the video, then press Ctrl + V in Windows to place the embed code. In the pop-up window, paste the code and place it within double square brackets: [ [ ] ] (no space between adjacent brackets or between the brackets and the embed code).
To finish this action click Paste.
Here you can see the embed code inside double square brackets in the event body. Do not forget to Save the event to reflect the changes.
Back to top
