Table of Contents

A. Preparing Your Collab Site
B. Configuring Your WP Site
C. Providing Your Instructor with the Address of Your Site
D. Adding Top-Level Pages to Your WP Site
E. Adding Sub-Level Pages to Your WP Site
F. Editing Pages in Your WP Site
G. Removing Pages from Your WP Site
H. Using Kaltura for Audio/Video Files in your WP Site
I. Customizing the Look-and-Feel of your WP Site
J. Reusing your WP site

Please Note: The video clips below do not have an audio track.

WordPress as an E-Portfolio Platform

Student Tutorial

This tutorial will guide you through the steps for creating your own Collab site and adding WordPress and Kaltura to it.  This will allow you to manage your media in Kaltura, and embed them in your WordPress pages.  Then, by giving your WordPress address to your instructor, she/he can create a link from the Course site to your WordPress posts and pages.  That way, all members of the class will be able to see and comment on your work, and you on theirs..

E-Portfolio Peer Consultants

 

A. Preparing Your Collab Site

  1. Log in to Collab. 
  2. Make sure you are on the Home tab. 
  3. Click on Worksite Setup.
  4. Click on Create New button.
  5. Click on Collaborations (under Create site from template).
  6. Select the Basic radio button. 
  7. Scroll down and click on Create site from template.
  8. Type your name in for your Site Title.
  9. Scroll down and click on Continue.
  10. Click Continue again.
  11. You new site will appear at the top of the screen next to My Workspace.
  12. Click on the name to go to the site.
  13. You can now add Kaltura and WordPress to your site.  
  14. Click on the Site Info in the Collab menu.
  15. Click on the Edit Tools button in the Site Info menu. 
  16. Scroll down and click the checkboxes next to Kaltura and WordPress.
  17. Scroll down and click Continue.
  18. Click Finish.
  19. Kaltura and WordPress will have been added to your Collab menu.  

B. Configuring your WP Site

  1. Log in to Collab. 
  2. Click on your site to go to it. 
  3. Click on WordPress in the Collab menu (you may have to wait a few seconds for WordPress to load…).
  4. WordPress does not work well within the Collab frame. So it needs to be opened in its own tab.
  5. Hover the mouse over the name of the site in the WordPress menu.
  6. “Right-Click” on the site name and choose Open Link in New Tab (Mac user: “Command-Click” on the site name).
  7. Click on the new tab you created to open WordPress without the Collab frame around it.
  8. WordPress will open in Dashboard mode in the new tab.
  9. Click on Settings in the WordPress menu.
  10. Select the General option.
  11. Edit the Tagline field and add an appropriate tagline for your site (ex. my Fren 2020 ePortfolio).
  12. Be sure to SAVE the changes! 
  13. Select Reading from the WordPress menu. 
  14. Set the Front page displays option to Static page.
  15. Select Sample page from the drop-down menu for Front page.
  16. Be sure to SAVE the changes!
  17. Scroll up and hover the mouse on the name of your site and choose Visit Site
  18. The initial configuration of your site is done! 

 
C. Providing your Instructor with Access to your site
  1. Log in to Collab. 
  2. Click on your site to go to it. 
  3. Click on WordPress in the Collab menu. (You may have to wait a few seconds for WordPress to load…).
  4. WordPress does not work well within the Collab frame. So it needs to be opened in its own tab.
  5. Hover the mouse over the name of the site in the WordPress menu.
  6. “Right-Click” on the site name and choose Open Link in New Tab (Mac user: “Command-Click” on the site name).
  7. The address of your site is at the top of your screen (something like: https://pages.shanti.virginia.edu/<yourname>). Copy it and email it to your instructor. 

D. Adding Top Level pages to your site

  1. Log in to Collab. 
  2. Click on your site to go to it. 
  3. Click on WordPress in the Collab menu. (You may have to wait a few seconds for WordPress to load…).
  4. WordPress does not work well within the Collab frame. So it needs to be opened in its own tab.
  5. Hover the mouse over the name of the site in the WordPress menu.
  6. “Right-Click” on the site name and choose Open Link in New Tab (Mac user: “Command-Click” on the site name).
  7. Click on the new tab you created to open WordPress without the Collab frame around it.
  8. WordPress will open in Dashboard mode in the new tab.
  9. Click on the name of your site in the WP menu to go to your Home page. 
  10. Hover over the New button and select Page.
  11. Enter the tittle for your first “top-level” —“Journal Entries”.
  12. Set order number for your first “top-level” page to “1”. 
  13. Click on Publish (or Update) to save your work. 
  14. Click on Add New to enter your second “top-level” page. 
  15. Enter the title for your second “top-level” page — “Compositions”. 
  16. Enter the text for your second “top-level” page in the text area. 
  17. Set order number for your second “top-level” page to “2”.
  18. Click on Publish (or Update) to save your work. 
  19. Click on Add New to enter your third “top-level” page. 
  20. Enter the title for your third “top-level” page — “Recordings”.
  21.  Enter the text for your third “top-level” page in the text area. 
  22. Set order number for your third “top-level” page to “3”.
  23. Click on Publish (or Update) to save your work. 
  24. Click on Add New to enter your fourth “top-level” page.
  25. Enter the title for your fourth “top-level” page — “Reflections”. 
  26. Enter the text for your fourth “top-level” page in the text area. 
  27. Set order number for your fourth “top-level” page to “4”.
  28. Click on Publish (or Update) to save your work. 
  29. Click on Add New to enter your fifth “top-level” page.
  30. Enter the title for your fifth “top-level” page — “About Me”. 
  31. Enter the text for your fifth “top-level” page in the text area. 
  32. Set order number for your fifth “top-level” page to “5”.
  33. Click on Publish (or Update) to save your work. 
  34. Click on the name of your site in the WP menu to go to the Home page. 
  35. You will now see the links and can open each of your “top-level” pages.

E. Adding Sub Level pages to your site

  1. Log in to Collab. 
  2. Click on your site to go to it. 
  3. Click on WordPress in the Collab menu. (You may have to wait a few seconds for WordPress to load…).
  4. WordPress does not work well within the Collab frame. So it needs to be opened in its own tab.
  5. Hover the mouse over the name of the site in the WordPress menu.
  6. “Right-Click” on the site name and choose Open Link in New Tab (Mac user: “Command-Click” on the site name).
  7. Click on the new tab you created to open WordPress without the Collab frame around it.
  8. WordPress will open in Dashboard mode in the new tab.
  9. Click on the name of your site in the WP menu to go to your Home page. 
  10. Hover over the New button and select Page.
  11. Enter the title for the first “sub-level” page under “Journal Entries”. 
  12. Select the “parent” for the “sub-level” page (“Journal Entries” in this case). 
  13. Set the order number for your first “sub-level” page to “1”. 
  14. Click on Publish (or Update) to save your work. 
  15. Click on the name of your site in the WP menu to go to the Home page.
  16. You will now see the link and can open your “sub-level” pages.  

F. Editing Pages in Your Site

  1. Log in to Collab. 
  2. Click on your site to go to it. 
  3. Click on WordPress in the Collab menu. (You may have to wait a few seconds for WordPress to load…).
  4. WordPress does not work well within the Collab frame. So it needs to be opened in its own tab.
  5. Hover the mouse over the name of the site in the WordPress menu.
  6. “Right-Click” on the site name and choose Open Link in New Tab (Mac user: “Command-Click” on the site name).
  7. Click on the new tab you created to open WordPress without the Collab frame around it.
  8. WordPress will open in Dashboard mode in the new tab.
  9. Click on the name of your site in the WP menu to go to your Home page. 
  10. Select the page (“top-level” or “sub-level”) you want to edit. 
  11. Click on the Edit Page button on the WP menu. 
  12. You can copy-paste from Word or write directly in the text area of the page you are editing. 
  13. You can edit the text after pasting it in from Word.
  14. You can also add links to other pages on the Web.
  15. Highlight the text you want to make clickable.
  16. Click on the Insert/Edit Link tool in the text area menu.
  17. Paste or type in the address of the Web page in the URL field.
  18. Give the link a title.
  19. Click on the checkbox if you want the page to open in a new window.  
  20. Click on the Add Link button.
  21. You can also add images to the page you are editing.
  22. Place your cursor where you want the image to be.
  23. Click on the Add Media button in the text area menu.
  24. Click on the Upload Files button.
  25. Click on the Select Files button.
  26. Select the file you want to upload from your computer. It may take a few seconds to load.
  27. Click on the Insert into page button.
  28. To re-size the image, click on it and drag the small boxes.
  29. To position the image, click on it and use the menu in the image box.
  30. For example, in this case, we will set the alignment to the “left”.
  31. Be sure to click on the update button.
  32. Be sure to click on Publish or Update to save your work.
  33. Click on the name of your site in the WP menu to go to your Home page.
  34. Check the links on the page you edited to make sure everything works. 
  35. All of the pages in your site can be edited in this manner. 

G. Removing Pages from Your Site

  1. Log in to Collab. 
  2. Click on your site to go to it. 
  3. Click on WordPress in the Collab menu. (You may have to wait a few seconds for WordPress to load…).
  4. WordPress does not work well within the Collab frame. So it needs to be opened in its own tab.
  5. Hover the mouse over the name of the site in the WordPress menu.
  6. “Right-Click” on the site name and choose Open Link in New Tab (Mac user: “Command-Click” on the site name).
  7. Click on the new tab you created to open WordPress without the Collab frame around it.
  8. WordPress will open in Dashboard mode in the new tab.
  9. Click on the name of your site in the WP menu to go to your Home page. 
  10. Hover over the name of your site and select Dashboard.
  11. Hover over Pages in the WP menu and select All Pages.
  12. You can delete each page individually, or select pages to delete in bulk.
  13. Set the Bulk Actions drop-down menu to Move to Trash and click on the Apply button to remove those pages. 
  14. If you change your mind, you can click on the Undo button or click on the Trash link and select the files you want to restore individually, or using the Bulk Actions option.   
  15. You can see the restored pages by going to Pages, All Pages.

H. Using Kaltura for Audio/Video Files in Your WP Site

  1. Log in to Collab. 
  2. Click on your site to go to it. 
  3. Click on Kaltura.
  4. Click on the My Media tab.  
  5. Click on the Upload new media link. 
  6. Click on Upload tab, then click on Browse. 
  7. Select the media file you want to upload from your computer. 
  8. Click on the Upload button. (This could take some time depending on the size of your file.)
  9. Click the Next button.
  10. Fill out the “Title”, “Tags”, and "Description" fields.
  11. Click the Next button. (This could take some time depending on the size of your file.)
  12. Click the Finish button.
  13. Type in the name of your file in the Search field and click on it to bring it up to the player.  
  14. If Kaltura is still processing the file, you may have to wait for it to finish. 
  15. …otherwise, click on the Play button to male sure the video is ready. 
  16. Click on the Edit Details link below the player. 
  17. In the dialog box, click on the checkbox next to the World option.
  18. Click on the Save button.  
  19. Click on the Embed Code link below the player.
  20. Copy all of the code in the Embed Code box.  
  21. Click on WordPress to go to your WP site.
  22. You may have to wait a few seconds for WordPress to load…
  23. WordPress does not work well within the Collab frame. So it needs to be opened in its own tab.
  24. Hover the mouse over the name of the site in the WordPress menu.
  25. “Right-Click” on the site name and choose Open Link in New Tab (Mac user: “Command-Click” on the site name).
  26. Click on the new tab you created to open WordPress without the Collab frame around it.
  27. WordPress will open in Dashboard mode in the new tab.
  28. Click on the name of your site in the WP menu to go to your Home page. 
  29. Hover on New in the WP menu and select Page.
  30. Fill in the title of the new page.
  31. Click on the Text tab in the text area menu.  
  32. Click in the text area and paste the embed code you copied from Kaltura.
  33. Switch back to Visual on the text area menu.
  34. Re-size the video player using the handles on each corner.
  35. Select the appropriate “Parent” for this page (“Recordings” in the case.)
  36. Set the “Order” number for this page. (“1” in this case.)
  37. Click on Publish or Update to save your work.
  38. Click on the name of your site to go back to the Home page.
  39. Go to the page where you placed the video.
  40. …and test it to make sure it works.

I. Customizing Your WP Site

  1. Log in to Collab.
  2. Click on your site to go to it.
  3. Click on WordPress in the Collab menu. (You may have to wait a few seconds for WordPress to load…).
  4. WordPress does not work well within the Collab frame. So it needs to be opened in its own tab.
  5. Hover the mouse over the name of the site in the WordPress menu.
  6. “Right-Click” on the site name and choose Open Link in New Tab (Mac user: “Command-Click” on the site name).
  7. Click on the new tab you created to open WordPress without the Collab frame around it.
  8. WordPress will open in Dashboard mode in the new tab.
  9. Hover over Appearance in the WP menu and select Customize.
  10. Open Site Title & Tagline if you want to change or hide the title or tagline of your site.
  11. You can also change the colors for the site’s Header Text and or Background.
  12. You can also add a Header Image (or banner). (For the best results images need to be 960X250 pixels).
  13. Select the image, if it is already uploaded or click on Upload Files to upload your image.
  14. Click on Select and Crop to prepare your image.  
  15. Adjust the cropping lines and click on Crop Image.
  16. You can also add a Background Image, set your Front Page, and control your Widgets from here.
  17. Be sure to click on Save & Publish.

J. Reusing your WP Site

First, log in to your individual Collab site and open your WordPress site from last semester’s course in a new tab:

  1. Log in to Collab.
  2. Click on your individual Collab site to go to it.
  3. Click on WordPress in the Collab menu. (You may have to wait a few seconds for WordPress to load…).
  4. WordPress does not work well within the Collab frame. So it needs to be opened in its own tab.
  5. Hover the mouse over the name of the site in the WordPress menu.
  6. “Right-Click” on the site name and choose Open Link in New Tab (Mac user: “Command-Click” on the site name).
  7. Click on the new tab you created to open WordPress without the Collab frame around it.
  8. WordPress will open in Dashboard mode in the new tab.
  9. Click on the name of your WP site  to go your the Home page.
  10. You should see your Home page with your top level pages (in this case, Journal Entries, Compositions, Reflections, and About Me).

Follow the instructions below to archive your material from last semester’s e-portfolio under a new “Fall 2015” top level page:

  1. Add a new top level page by clicking on the New button and selecting the Page button.
  2. Name the new page Fall 2015.
  3. Set the Order number for the new page to 1.
  4. Click on Publish to save the page.
  5. Click on the name of your WP site to go back to the Home page and see the new top-level page (Fall 2015) you just added.
  6. Click on your top-level pages (in this case, Journal Entries) to open it. 
  7. Click on the Edit Page button to edit that page.
  8. Change the Parent setting to put the page under Fall 2015.
  9. Click on Update to save your change.
  10. Click on the name of your WP site to go back to the Home page.
  11. Repeat the process for each of the top level pages you want to move under Fall 2015.  (In this example, we have left the Home and About Me pages where they are, since they apply to your ePortfolio as a whole.)
  12. Click on New then select Page to create a new set of top-level pages for use in the current semester. (This is the same process you used to create your original site.)
  13. Notice that the Order number for your new top-level pages begins with 2.  That is because Fall 2015 is now taking the Order position of 1.
  14. Click on the name of your WP site to go back to the Home page.
  15. You have archived your Fall 2015 work and are now ready to use the same WP site for your new semester's work.