Create Clone

advertisement
WordPress
Services for Faculty, Staff, and GTAs
Instructional
Design & Project
Consulting
Instructional
Equipment
Checkout
Tech Training
Workshops:
Open-enrollment
and Custom
Services for Students
Tech Training
Workshops
Multimedia
Equipment
(Digital Aquarium)
WordPress
Objectives
In 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 1
WordPress @
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 2
Navigating
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
Editor
Admin
• All forms of content
creation
• Full Dashboard
access
Sidebar
Editor
Admin
• All forms of content creation
• Full Dashboard access
Plus
• Access to change appearance of
Pages:
– Menus
– Widgets present
– Calendar theme and settings
Sidebar
Editor
Admin
Caution!
Making changes in the Tools and
Settings tabs can have very farreaching implications. Use them
with care.
Lesson 3
Creating
Content
Before We Begin
Two 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
Process
Plan
Prep
Media
Create
Pages
Create
Menus
Publish
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/)
Process
Plan
Prep
Media
1. Upload Media
Create
Pages
Create
Menus
Publish
Process
Plan
Prep
Media
Create
Pages
Create
Menus
Publish
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
Process
Plan
Prep
Media
Process is
essentially the
same for Pages
& Posts
Create
Pages
Create
Menus
Publish
A – Choose a Layout
1. Expand Help in top-right of page
2. Choose Featured Page Layouts
3. 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
1
2
Two Toolbar items to be aware of
1. Kitchen Sink – allows you to see all
formatting options
2. Paste from Word – strips all Word
formatting, which can wreak havoc in
WordPress
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
Process
Plan
Prep
Media
Create
Pages
Create
Menus
Publish
1. Select Appearance>Menus from sidebar
2. Select Items from Categories & Pages list
3. Add pages not under your administration
rights using Custom Links
4. Arrange Menu items to change order and
create hierarchies
Process
Plan
Prep
Media
Create
Pages
Create
Menus
Publish
• 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
…plus
Plan
Prep
Media
Create
Pages
Create
Menus
Publish
Edit!!
• 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
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
Available
Fields
Widgets
Widget Ninja
• Conditional rules
for when widgets
are or are not
displayed
• Accessible via
dropdown for
each active
widget
Lesson 3
Image
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 Tools
Adjustment Type
Windows Photo Gallery
Mac - 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?
OpenLabThursdays – every Thursday, 9:30-3:30
Suite 424 in One Park Place – one-on-one
consulting
Download