Advanced Blog Documentation
Use these techniques only if you are comfortable working with HTML code and CSS style sheets.
Adding Additional Editors
Add Editors and Commenters
This version of the blogging tool allows you to add users with Penn State Access Account userids as editors or commenters to your blog.
Note: This tool is still in beta mode and has not been tied in to any Penn State directory or blog-internal searches.
Potential Editors Must Login
In order for you to add a Penn State person as an editor to your blog, you must ask that person to log in to http://blogs.psu.edu and create a blog.
Add an Editor
- Login and enter your blog.
- Click Manage in the top links then select Users.
- Click the link Add a user to this blog.
- Navigate through the list to add a user (the list may be ordered by when a person created a blog). You will have to click through each page in the list to find the appropriate user. If you do not see the appropriate user, contact that person and ask him or her to log in to http://blogs.psu.edu.
Note: The search option is not functional at this time.
- Check the entry for the appropriate user then click Continue.
- Check the appropriate role name then click Confirm. Names and descriptions of selected roles are given below:
- Blog Administrator – full rights to edit the blog
- Editor – Can write and edit entries, change categories and upload files.
- Author – can write an edit entries and upload files, but change categories
- Contributor – can write and edit entries, but not upload files
- Moderator – can approve and edit comments from others
- Commenter – approved commenter
- Design – Can edit templates only
- Webmaster – Can only publish pages and edit templates
Delete an Editor
- Login and enter your blog.
- Click Manage in the top links then select Users. You will see a list of users with different access permissions.
- Place a check for any user you wish to remove, then click the Remove button above the list.
Change Permissions for an Editor
At this time you must delete a user, then add the individual again with the updated permissions.
Linking to Blog Headlines in ANGEL
The following options are available to instructors using both the ANGEL Course Mangement System and the Blogs at Penn State who wish to create links between the two tools.
Option 1 - Link to Blog in ANGEL
The easiest option is to create a Link in ANGEL to your blog in either the Lessons Tab or the Communicate Tab to your Blog. See the ANGEL Help & Information Page for more detailed instructions.
Note: Cookies are required to view dymanic ANGEL Help Documents.
Option 2 - Create Headline Feed in ANGEL
You can use the Feed2JS utility hosted at Penn State Education Technology Services to create JavaScript Code which will display the contents of your blog news feed within ANGEL
Find Subscription Feed
- Open the public version of your blog.
- Look for the Subscribe to this blog's feed link in one your sidebars.
- Right click on the link and copy the link location or URL.
Note: Make sure the link ends with a .xml extension.
Create JavaScript Code
- In a new browser window, open http://ets.tlt.psu.edu/feeds/build.php
- Paste the feed link in the URL field.
- Select appropriate display options for the Show Channel field.
- To display all entries, leave Number of Items to Display set to "0". Change the number only if you want only the first few entries.
- Select appropriate options for Show/Hide Item descriptions.
- Select Yes for Use HTML in item display. This will preserve the formatting of your blog entry.
- Select appropriate option for Show Item posting date?
- Leave Time Zone Offset set to "feed" or some other appropriate value.
Note: For Pennsylvania, the value is -5 for Daylight Standard and -4 for Daylight Savings.
- Select appropriate setting for Target links in the new window.
- Check the option for use UTF-8 Character encoding. This will ensure that "exotic characters" are correctly displayed.
- Check Yes for Podcast Enclosures.
- Scroll to the top of the page and click the Generate JavaScript button. This will open a new window.
- Copy the JavaScript code into a Word or text document. It begins with a <script> tag and ends with a </noscript> tag. See example code below.
<script language="JavaScript" src="http://ets.tlt.psu.edu/feeds/feed2js.php?src=http%3A%2F%2Fwww.personal.psu.edu%2Fxyz123%2Fblogs%2Fmyblog%2Findex.xml&chan=y&date=y&utf=y&html=a" type="text/javascript"></script>
<noscript>
<a href="http://ets.tlt.psu.edu/feeds/feed2js.php?src=http%3A%2F%2Fwww.personal.psu.edu%2Fxyz123%2Fblogs%2Fmyblog%2Findex.xml&chan=y&date=y&utf=y&html=y">View RSS feed</a>
</noscript>
Feeding Headlines into ANGEL
Headlines can be posted in any tool which allows you to switch between Smart Text and HTML formats including Announcements, the Syllabus Editor and pages in the Lessons Tab. This demo will use the ANGEL Page tool.
- Create an Announcement in ANGEL under the Communicate Tab. See the ANGEL Help & Information Guide for full documentation.
- Paste the JavaScript code generated in the step above into the Announcement field.
- Change the Format menu from Smart Text to HTML Text.
- Set the End Date for some date after the semester ends or else the announcement will disappear.
- Save the announcement. When the students view the announcement, the headlines will be displayed. The headlines will update themselves as you add entries to your blog.
Headlines will be displayed in the Announcements area for the course and in the My Announcements nugget in each students personal profile.
Redirect Your Personal Homepage to Your Blog
In the current blog configuration, if you want your blog to be your Penn State Personal Homepage, you will need to create a redirect page.
- Find the URL of your blog by clicking View Site button or link.
- Create a blank HTML document called index.html (the homepage). Make sure you are in the view HTML code window.
- Insert the following HTML code into your document
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Refresh" content="0; url=BLOG URL HERE" />
</head>
<body>
</body>
</html>
- After the url=tag, copy and paste the URL of your blog.
- Download and archive your old home page, then upload the new index.html into your www directory via SFTP or the Penn State Portal Pass Explorer (http://www.psu.edu/portalproject/passexplorer/).
When users go to your homepage (e.g. http://www.personal.psu.edu/xyz123), they will be redirected to your blogs.
See A Guide for Penn State Web Developers for more information on posting static HTML pages.
Add a Custom Header Image to a Professional Web Site
1) Create or select an image that is 905 x 170 pixels. If it is bigger then just the first 905x170 pixels will show on the Web page.
2) If you created your blog before October 24th, 2008, refresh your templates.
3) On your dashboard, select Upload File under the Create tab. Click Browse to select your file and then click Upload.
4) When the File Options screen appears deselect “Create a new entry using this uploaded file”, add the tag "@banner" in the tags field, and then click Finish.
5) Rebuild your blog.
Watch the screencast tutorial
