Content is obviously the heart of an intranet, and there are many options for adding it to your site.
There are many ways for you to add content to your intranet, including the following:
- Pages - add information using either a Content or a Widget page, with full html capability. Learn more about working with Pages.
- Apps - Applications are pre-formatted content libraries, ready for you to add content such as documents, policies, recipes, news, photos, etc. Learn more about Apps.
- Widgets - widgets are boxes of content which allow you to add text or images, or pull in feeds of content from within your intranet or from external sources. Learn more about Widgets.
From the IC Blog
Standard Text Editor
When you're editing text on the intranet, you'll have a full toolbar available, with standard options such as bold, italics, alignment, bullets, etc. As you mouse over each of the toolbar options, a small label will appear with the name of the tool. Note that depending on where you're editing text, you may need to click a small black arrow (lower right in image below) to reveal the full toolbar.
Our intranet software uses a built-in tool called CKEditor for our toolbar which comes with a standard full configuration.
Adding text is most easily done by simply typing in the text window. However, sometimes you might want to add existing content to an intranet page. If you copy and paste text from Word or other software, you'll get a prompt about cleaning the text before pasting. Best practice is to click OK and clean your text so you remove random formatting which could cause issues with text layout.
Add Links
You can easily add internal or external links for content in your intranet. To do this:
- In the text editing view, highlight the text you want to link (e.g. if you want the text read the Vacation Policy to be linked, highlight those 4 words).
- In the Text Editor toolbar, click on the link icon (the chain icon in the first image on this page). The Link box opens.
- If you're linking to a standard website or intranet link, leave the Link Type (1) as the default of URL.
- Other Link Types are an anchor within the current document, or a link to an email which will require you to enter an email address.
- Paste the URL into the available box (2); the protocol will adjust automatically so you can ignore it.
- Click the Target tab (3) to choose how your link will open. The default is New Window.
- If you want the link to open in a new window you don't need to change the Target; just click Save and your link is done. Opening in a new window is best practice for links external to your intranet navigation.
- If you want the link to open in the same window and replace the current contents, select Same Window. This is recommended when you're linking to intranet content, so you avoid creating multiple open windows for users. When you've made your selection, click Save and your link is done.
Add Images
Images can be added to any content field which has a Standard Text Editor (as well as in the Image Widget and Image Slider Widget). Note that images in the format of jpeg/jpg, png, or gif can be added to the intranet. Images taken with a mobile device (e.g. cellphone) aren't produced in these standard formats, so they'll need to be converted first using software such as PhotoShop or an online converting tool.
There are three different ways to add an image to a page: upload to the intranet, re-use an intranet image, or use a website's image.
A. Upload Image to Intranet
- Within a text window, click your cursor where you want the image to be inserted.
- In the Text Editor toolbar, click on the image icon (the icon with mountains in the first image on this page). The Image Properties box opens.
- Click Choose File (1 in below image). This opens a window which allows you to browse your system for the image you want to add.
- Click on the image file name to select it (2).
- Click the Open button (3) to finalize your image selection.
- Click the Send it to the Server (4) button to upload it to the intranet. You'll now see your image preview along with its Width and Height in pixels; if you need to adjust it, change any image properties as explained in the next section of this article.
- Click OK (5) to finalize the image on your page.
B. Re-Use Intranet Image
- Within a text window, click your cursor where you want the image to be inserted.
- In the Text Editor toolbar, click on the image icon (the icon with mountains in the first image on this page). The Image Properties box opens.
- Click the Image Info tab at the top of the box.
- Click the Browse Server button and look for the file name of the image (this is where good file naming is useful!).
- Click on the file name of the image you want, and you're shown a preview of the image.
- If the image is what you want, change any image properties as explained in the next section of this article; if the image isn't right, click the Browse Server button again and repeat the steps.
- Click OK to finalize the image on your page.
C. Use a Website's Image
- Within a text window, click your cursor where you want the image to be inserted.
- In the Text Editor toolbar, click on the image icon (the icon with mountains in the first image on this page). The Image Properties box opens.
- Click the Image Info tab at the top of the box.
- Paste the URL of the image you want to use (e.g. something you located in a Google image search).
- Tab or click outside of the URL box and you're shown a preview of the image.
- Change any image properties as explained in the next section of this article.
- Click OK to finalize the image on your page.
Note that since this method links to active website content, if the image is ever removed from the linked website, your image will be a broken link in the intranet.
Change Image Properties
For any image within a text editor box, you can right-click on it and click Image Properties.
On the Image Properties screen you can:
- Change the image size - ensure the padlock icon (1) is locked to maintain the image proportions, then change either the Width or Height and the other dimension will automatically resize. Click the arrow here to reset the image to its original size. Note that if you try to make the image larger than its original size, the quality will decrease.
- Add Border (2) - enter a value of 1 or greater to add a border around the image.
- Horizontal padding (3) - the option HSpace adds padding on either side of the image so text won't wrap directly beside the image.
- Vertical padding (4) - similarly, the option Vspace adds padding above and below the image so text won't wrap directly above and below the image.
- Alignment (5) - choose the alignment of your image on the page.
Add Videos
The process for adding a video varies, depending on whether it's your video you're uploading, or a video available on a website such as YouTube. Before uploading your videos, keep in mind that the webserver hosting your intranet software will typically have some restrictions to the size of files allowed to be uploaded.
To adjust these restrictions to allow larger files to be uploaded, check out our Large File Uploads article before proceeding.
Upload and Embed a Video
- Click the 'Embed Video' icon
- Choose the file you are uploading
- Click Upload
- Select the newly uploaded video from the list
- Set a Width and Height (we recommend 600 x 400)
- Click 'Ok'
- Save the Widgets or item you're editing to complete this process and you should see the video now embedded on the page.
Note: If you're experiencing issues and seeing a Flash error, please patch up to at least 14.5.10+ or 15.0.6+.
Embedding using HTML
- X is the ID found in the URL of the browser which is unique to the item in your app where the file has been uploaded to
- Y is the AppID or MenuID value in the same URL
- Add a new item to the desired app
- Confirm that you have a Message Box field and a File Upload field in your app
-
To get to the App Admin screen, navigate to the app > hover over the admin icon in the toolbar > click app admin:
- Message Box field - Navigate to the App Admin screen > click Manage Fields > drag the Message box field from the Custom fields section on the left menu to the form > Save changes
- File Upload field - Navigate to the App Admin screen > click Manage Fields > drag the File Upload field from the System fields section on the left menu to the form > Save changes
- If you've added fields, you'll need to update your app layouts to include these fields > click item view or list view from the right menu of the App Admin screen
-
To get to the App Admin screen, navigate to the app > hover over the admin icon in the toolbar > click app admin:
- Upload the file to the File Upload field
- Save the item before proceeding on to step 5
- Click 'Source' on the Message Box field
- Paste in the following code:
<video controls="" height="320" src="/includes/secure_file.cfm?ID=X&menuID=Y" width="640"></video> - Adjust the width and height as desired for your video (keep in mind that this may stretch the content of your page/site if the size is too large)
- Locate the ID and AppID or MenuID values as per the instructions above.
- Save the item
Note: if you have a larger files over 100MB, it would be recommended to manually add the video file to a folder on your webserver within the Intranet folder. For example: Navigate to ...\Intranet\Graphics\Editor\kellybristow2\ and put your video in this folder. The above script would be adjusted to: <video controls="" height="320" src="/Graphics/Editor/kellybristow2/yourvideo.mp4" width="640"></video>
Watch the video below for a walkthrough of how this is accomplished (this video assumes you have a File Upload field on the app):
As this method uses custom code, we cannot provide support for any issues you may experience with this code.
With regards to the Message Box fields and widgets, you'll find an option to embed a video as shown in the image below. The Flow Player that is built-in to the HTML editor component runs on Flash which is disabled by default in modern browsers. As a result, we recommend embedding videos by either using the process above, or using the embed options provided from websites such as YouTube or Vimeo.
Embedding Audio files
Similar to embedding video files, Audio files have a slight tweak to the code, refer to the instructions above for the walkthrough and replace the code with the following:
<audio controls="" src="/includes/secure_file.cfm?ID=X&menuID=Y"></audio>
Embed a Video from Website
To embed a video from a website such as YouTube or Vimeo, you'll need to get the embed code (assuming this has been made available by the uploader of the video). Usually, this involves going to the video page, looking for a 'Share' option, then copying 'Embed' code, but this will depend on the video site.
To add the video to your intranet:
- On a content page or message box where you can add video, in the CKeditor click Source.
- Paste the video embed code where it should be placed on the page. Adjust size or other information as needed.
- Click Source again to show the embedded video along with your page content.
- Click Save or Save Widgets as applicable to finalize your changes.
Multiple File Upload
Another way to add content to your site is to add documents of various types.
Learn more about working with multiple file uploads in Documents and Policies.