Using custom widgets

Custom widgets can be created and placed on your homepage as determined by your course’s specific needs. Custom widgets can also be created at the organization level and shared with your course offering.

Shared widgets appear in the custom widgets tab in the Widget Management tool and they are distinguishable by a Shared Widget icon. They are available to add to your course homepage, but you cannot modify their content. You can only modify the content for custom widgets that are created within your course offering.

Create a custom widget

1. Click on the Edit Course link from the course navbar.
2. Click Widgets. The Manage Widgets page displays.
3. Click New Widget.
4. Type a Name for the widget and an associated Description.
5. Add a thumbnail image for your widget by clicking the Add a File button.
6. Click Save.
7. Click the Customize tab to change the following settings:
8. • Border  Select this check box if you want to display your widget in a box.
   • Box Style  Select the border thickness for your widget.
   • Title Bar  Select this check box if you want to show the title bar.
   • Title Bar Color  Choose a color for your Title Bar.
   • Widget Title  Type a title for the box (e.g. Search Engines, Campus Info, etc).
   • Title Color  Choose a color for your widget title.
   • Title Alignment  Choose how you want the widget title aligned within its associated column.
   • Expand/Minimize  Select this check box if you want to prohibit the ability to minimize widgets.
9. Click the Release Conditions tab and click Attach Existing or Create and Attach to add applicable release conditions.
10. Click the Content tab to add your custom content.
11. Click Save.

Edit a custom widget

1. Click on the Edit Course link from the course navbar.
2. Click Widgets. The Manage Widgets page displays.
3. From the Custom Widgets tab, click the Edit icon for your widget.

Add HTML custom code

1. Go to the Content tab on the Edit Widget page.
2. Click the Edit HTML Source icon in the bottom left corner of the HTML Editor to open the HTML Source Editor.
3. Add your HTML custom code. For example, the following HTML custom code can be used to create a YouTube solar car video feed using a “solar car” tag:

   <iframe height="350" width="265" frameBorder="0" src="http://www.youtube.com/videos_list?tag=solar car" marginHeight="0" marginWidth="0" name="videos_list" id="videos_list"></iframe>

4. Click Update.
5. Click Save to apply your changes.