Information Technology

[toc]

What is a blog?

… a discussion or informational site published on the World Wide Web and consisting of discrete entries (“posts”) typically displayed in reverse chronological order (the most recent post appears first) … A majority are interactive, allowing visitors to leave comments … it is this interactivity that distinguishes them from other static websites. In that sense, blogging can be seen as a form of social networking service. Indeed, bloggers do not only produce content to post on their blogs, but also build social relations with their readers and other bloggers. (wikipedia)

OSUL Blogs

… are on WordPress

• WordPress is one of the most popular content management systems (Built With).
• Blogging is one available content type of WordPress (it’s how WordPress got its start).

Getting Started

How to request a blog

Send a ticket to the Hub

What you will get

• Branded site with standard layout and widgets
• Your own URL: library.osu.edu/site/[yourblog]
• Your editors given appropriate access
• Added to OSUL blogs listing (when you’re ready)
• Added to OSUL blogs aggregated RSS feed
• A custom header image (if you so choose) Example
• Training upon request

Logging in

• Go to https://library.osu.edu/site/[yourblog]/wp-admin
• Log in with Shibboleth:

Using Your Dashboard

• You can find all of the features and options you will need on the left hand column of your dashboard. If you can’t find something you need, just go back to your Dashboard.

At a Glance & Recent Activity

•  View latest events, such as recent posts

Site Stats

• See a snapshot of visitor statistics on your dashboard.
• Click View All for a nice informative Google Analytics-like dashboard: Example

Comments

• Comments require moderation. You can see a list of comments waiting on approval from your dashboard.

Broken Links

• A broken link checker is turned on for all blogs. You can see broken links from your dashboard.

• You also are given an indicator that a link is broken within a page/post.

Posting

Writing for the Web

• People quickly skim and scan web pages. Don’t lose your readers by getting verbose and building “walls of words” between you and your audience.
• Quick Tips For Making Your Web Pages Friendlier
• See OSUL’s Writing for the Web workshop documentation for more detailed instructions.

Long posts

• Example
• How to snip posts

Featured image

•  Appears above the post: Example

Categories

• Appear at the bottom of each post: Example

• Can be added to sidebar or footer as widgets: Example

• Make sure all of your contributors understand what the categories mean and use them consistently.
• Don’t get crazy with the number of categories or they will become unwieldy and unhelpful to the visitor.

Discussion

• You can choose to enable comments on a post: Example
  

  

• If you do not see the option below the editor, be sure the ‘Discussion’ widget is selected from the ‘Screen Options’ menu on the top of the page.
• Comments require moderation. Check your dashboard to see what comments need to be approved.

Sharing

• A selection of social media buttons can be added to posts so your readers can share your awesome content: Example
• Can include Email and Print

Related Posts

• Automatically displays 3 posts that are related in content to the current post: Example

Clickable Meeting Invitations

• Make it easy for people to add your events to their calendars by embedding an Outlook meeting invitation into your content.
•  How to add clickable Outlook appointments
•  Example: Add Blogging Workshop to Outlook Calendar

Quote Formatting

Highlight text and click quotation mark icon on the menu bar in the editor

This is a horizontal line, inserted from the Editor:

Adding Media

Insert images

• When you are editing a page or post, you can add images by clicking the Add Media button above the editor.
• Either pick an image that has already been uploaded from the Media Library, or upload new files.

Editing images

• Click on the image and choose the edit icon:

•  Why is my image much smaller than it should be? Edit the image and try Size: Full Size

Manipulating images

• You can do a lot with images within WordPress: crop, rotate, resize, etc. Click Edit Original button after choosing to Edit an image:

Alternative text

•  Don’t forget the alt-tag (alternative text)! This text is what would display instead of the image to someone with images turned off (or not loading) or heard by someone using a screen reader.

Insert documents

• Follow the same steps for inserting images except choose the document that you have uploaded through Add Media.
• Example: Writing-for-the-Web_Handout.pdf

Wrap text around images

• To get text to flow around an image, you will need to choose an alignment option.
• Click on the Edit icon when you click on the image after it has already been inserted into the content.
• Choose how the text should flow around the image:
  • Left means the image appears on the left and the text wraps along the right side of the image.
  • Right means the image appears on the right and the text wraps long the left side of the image.
  • None means the text does not wrap.
• Some browsers may not do a good job of spacing between image and text. There’s not much you can do about that.

 Check out this blog post for examples of different options for text wrapping

Insert image slider

• When you are editing a page or post, you can insert a slideshow of images by clicking the “Add slider” button above the editor. Example

Create a gallery

• There are a few nice options for presenting images as a gallery. Example of tiled mosaic
• Click on the “Add Media” button above the editor (just like inserting any other image), select images, and save.
• You can change the shape of the images by editing the gallery.

Embed videos

• It is extremely easy to embed YouTube videos in your posts. Just copy and paste the link to the video in the post. Example

Accessibility

• Make sure you’ve added alt tags (alternative text) to all images! This text will display instead of the image to someone with images turned off (or not loading) or heard by someone using a screen reader.
• How to add alternative text
• Resources on web accessibility (WebAIM.org)
• Test a web page with WAVE
• Ohio State Web Accessibility Center
• ODEE Universal Design and Accessibility | Session at OSUL with Jessica Phillips

Adding Pages

Pages vs Posts

• Almost everything you can do with posts, you can do with pages, except pages are static (they stay where you put them).
• Unlike posts, pages need to be linked to or added to a menu. They don’t just automatically appear.
• Pages don’t show up in RSS feeds.

Headings

• Use headings to outline your page.
• Headings are important for readability and web accessibility.
• They are styled to reflect hierarchy; don’t mess with their formatting.
• Start with Heading 2 and don’t skip levels.

Heading 2

Heading 3

Heading 4

Heading 5

Paragraph

Creating Menus

• Menus are easy to create with simple drag and drop: Example
• Go to the Dashboard…choose Appearance from the left hand side menu…choose Menus
• Can attach pages to menus and even use a menu item to display posts by a category Example
• Dropdown menus appear when you nest pages: how easy is that?! Example

Using Plugins and Widgets

Plugins are ways to extend and add to the functionality that already exists in WordPress. The core of WordPress is designed to be lean and lightweight, to maximize flexibility and minimize code bloat. Plugins then offer custom functions and features so that each user can tailor their site to their specific needs. (WordPress Codex)

Please request assistance before changing plugin settings! 

JetPack

• Everyone has access to JetPack’s features. Some are administrative, some are user-facing such as Subscriptions and Carousels.

Forms

You need to submit a request to use these plugins.

• FS Secure Form: build really nice web forms
  Sample form: Featured Employee

• Contact Form DB: where the submitted data is stored, can export to a spreadsheet

Tables

• TablePress: unless you have advanced HTML skills, please use this plugin for tables, so you don’t have to worry about accessibility-compliant tagging and responsiveness
  Sample table: AD&S Quarterly Report

Events

• Your new site will have a selection of widgets already added to the sidebar and footer, including Search This Site, Contact Us, Recent Posts, Subscribe to This Blog, Archives, and Categories. Please don’t remove or move the widgets, as we want to have a standard layout for all OSUL blogs.
• You can add widgets. Go to Appearance…Widgets and drag and drop them to the Sidebar, Footer A (left column), Footer B, or Footer C (right column).

How do I request a plugin or widget?

• If you need to do something that is not currently available, chances are there is a plugin for that.
• Send a request through the Hub and describe the functionality you desire.
• IT researches available plugins (must be compatible with our version of WordPress, actively maintained, used by a significant number of other installations, thoroughly tested, secure, won’t break other blogs).

Publishing

• Keep the post in Draft mode until you are really, really sure you are ready to publish for everyone to see!
• To save without publishing, click the Update button.
• At any time, you can preview posts, even if they are not published.
• As soon as you publish, the post will be added to the aggregated OSUL blogs RSS feed, so make sure you have completed the pre-publishing checklist to avoid mistakes.

Scheduling publication

• You can draft a post and configure when it should be published in the future.

Scheduling expiration

• You can set an expiration date when a post will be unpublished.
• There are a lot of settings for this feature. Please ask for help.

Reverting to a previous version

• You can revert your post to any previous version of the post by browsing and comparing revisions. Be careful!

Getting ready to publish

Pre-Publishing Checklist 

Acknowledgments

Thank you to David Ensinger, Nick Rodgers, and Sue Rahnema for their assistance in testing plugins and preparing this documentation.