WordPress

Services for Faculty, Staff, and GTAs

Services for Students

InstructionalDesign & ProjectConsulting

InstructionalEquipmentCheckout

Tech TrainingWorkshops:Open-enrollmentand Custom

Tech TrainingWorkshops

MultimediaEquipment(Digital Aquarium)

WordPress

ObjectivesIn this course, you will:• Hear an overview of WordPress • Navigate the administrator side of the

GSU WordPress Network• Access the Digital Asset Library• Create content, including using widgets,

the media manager, and plugins• Manipulate images for use on WordPress

Lesson 1WordPress @ GSU

Advantages of WordPress

• Theme-driven• Easy to create & update• Highly customizable• Incorporates many content types

through plug-ins• Content objects are easily shared

between many web pages

Pages and Posts

• Static, longer-lasting content

• Not affiliated with a particular date

• More of a container

• Dynamic, short-lived

• Affiliated with a particular date

• Searchable via categories (tags)

Pages• Static, longer-

lasting content• Not affiliated with

a particular date• More of a

container

Posts• Dynamic, short-

lived• Affiliated with a

particular date• Searchable via

categories (tags)

Lesson 2Navigating WordPress

Dashboard

Displays list of all content on your site, with clickable links for quick access

Dashboard

Displays list of forms on your site with completed form entries

Dashboard

Allows quick creation of posts, but limits the amount of customizability

Dashboard

Displays recently created content

Sidebar• All forms of

content creation• Full Dashboard

access

EditorAdmin

Sidebar• All forms of content

creation• Full Dashboard access

Plus

• Access to change appearance of Pages:– Menus– Widgets present– Calendar theme and settings

EditorAdmin

SidebarCaution!Making changes in the Tools and Settings tabs can have very far-reaching implications. Use them with care.

EditorAdmin

Lesson 3Creating Content

Before We BeginTwo things to be familiar with before you begin:• Shared content• Shortcodes

Shared Content• With all created items being shared

between many pages, tracking content can be difficult

• Solution: add ID numbering to track items as well as to quickly add items to different pages

Shortcodes• One way WordPress helps simplify

HTML creation is through the use of Shortcodes, which:– Reduce complex HTML often to one word

or short sentence– Produce consistent look and feel across

many sites

Publish

Create

Menus

Create

Pages

Process

1. Write down what Pages need to be created, what Pages will include Posts, and what Media will be required to support the Pages and Posts

2. Collect media from departmental resources as well as digital asset library

(http://commkit.gsu.edu/tools/dal/)

Prep Media

Plan

Publish

Create

Menus

Create

Pages

Process

1. Upload Media

Prep Media

Plan

Publish

Create

Menus

Create

Pages

ProcessPrep

MediaPlan

2. Edit Uploaded Media

• Caption & Alternative Text

• Tags• Click Edit Image

button to:– Scale– Crop– Adjust thumbnail

display of image Best Practice: Make note of Item IDs

Publish

Create

Menus

Create

Pages

ProcessPrep

MediaPlan

Process is essentially the same for Pages & Posts

A – Choose a Layout1. Expand Help in top-right of page2. Choose Featured Page Layouts3. Select the layout you’d like to use. A

new browser tab opens with a preview and the shortcode you will need to copy to your page

B – Edit the Layout Code

Your code will looks something like this:[slide attachment_id="1299" alignment="bottomright" style="gunmetal" title="Main Title Goes Here"]Extra Text goes Here[/slide]

1. Replace ID # in the code with the ID# of the item you want presented.

2. Enter main title text as well as subtitle text in the respective locations

C – Enter and Format Content

Two Toolbar items to be aware of1. Kitchen Sink – allows you to see all

formatting options2. Paste from Word – strips all Word

formatting, which can wreak havoc in WordPress

1

2

C – Enter and Format Content

ADA

Ensure that all media and links include:• Title• Alternate Text (media)

Note: you can also edit this information after the fact, in the respective sidebar items

Publish

Create

Menus

Create

Pages

ProcessPrep

MediaPlan

1. Select Appearance>Menus from sidebar2. Select Items from Categories & Pages list3. Add pages not under your administration

rights using Custom Links4. Arrange Menu items to change order and

create hierarchies

Publish

Create

Menus

Create

Pages

ProcessPrep

MediaPlan

• Status – for unpublished pages, allows you to promote items for review

• Visibility – sets access levels once published

• Publish immediately – schedules publishing times in the future

Publish

Create

Menus

Create

Pages

…plusPrep

MediaPlan

• For Quick Edits: visit the page you want to edit and click Edit in the Wordpress menu at the top of your browser

• For Substantial rewrites: use Create Clone to copy your page, with all its settings, and then you can replace the original when you have completed your edits without fear of breaking your page

Edit!!

Other Items

Aside from your main content, you will be able to create:• Events• Forms• Widgets to display content• Embedded YouTube videos

Events

• Similar process as other content creation

• Address field can auto-populate, using building names

• Can show map

Forms

Created fields

AvailableFields

Widgets

Widget Ninja

• Conditional rules for when widgets are or are not displayed

• Accessible via dropdown for each active widget

Lesson 3Image Manipulation

Images

You can find professional images in the Digital Asset Library, here:

http://commkit.gsu.edu/tools/dal/You can also use your own photos.If using your own photos, it’s important to use the smallest image file to achieve a professional looking result

Simple Photo Editing ToolsAdjustment Type Windows Photo

GalleryMac - Preview

Crop Edit > Crop Select Portion of image you want visible > click crop tool in toolbar

Resize Edit > Properties > Resize

Click resize tool in toolbar

Adjust color Edit > Fine tune > select option

Click color adjustment tool in toolbar

Cropping in Photoshop

Procedure

1. Choose Crop Tool from left sidebar

2. Adjust Setting in toolbar, including constraint sizes

3. Click and drag cursor over area of photo you want to keep

4. Click OK to accept changes

Resizing in Photoshop

Procedure

Select File > Save for Web…

Choose compression type (JPEG, PNG-24), Quality, Image Size, etc

Verify your file size

Click Save…

Adjusting Color in Photoshop

Procedure

Select Image > Adjustments > the property to manually adjust

(you can alternatively select Image > Auto Tone, Contrast, or Color)

Applying Filters in Photoshop

Procedure

Artistic Filters: Select Filter > Filter Gallery… to select and adjust settings

Subtle Filter effects: Select Filter > Blur etc to add subtle effects to your photos

Add additional filters from Adobe: Select Filter > Browse Filters Online…

Advanced Photo Editing

For advanced photo editing, Adobe PhotoShop may be the best option for:• Compositing• Retouching

To learn about these skills, check for free workshops at technology.gsu.edu/training

What’s next?OpenLab Thursdays – every Thursday, 9:30-3:30 Suite 424 in One Park Place – one-on-one consulting