Intermediate

jamiecavanaugh

Feel free to contact me:

cavanaugh_jamie@smc.edu

The website for this workshop is located at:

www.classes.jamiecavanaugh.com/wordpress/intermediate

What other digital education tools do I use?

Check out my profile on edshelf


Workshop Topics

  • Getting Started
  • Don’t have a WordPress account yet?
  • WordPress.com versus WordPress.org
  • WordPress.com Store
  • Self-hosted WordPress (WordPress.org)
  • How to install Self-hosted WordPress
  • Appearance
  • Widgets
  • Using Shortcodes
  • Inserting a Gallery
  • Inserting Audio
  • Tools > Export
  • Plugins
  • Resources

Getting Started

To get started with WordPress, I highly recommend using the learn.wordpress.com website to get you up and running. In particular, the Quick Start Guide is very useful.

http://learn.wordpress.com/

http://learn.wordpress.com/quick-start-guide/


Don’t have a WordPress account yet?

Use this test site: smcwp.wordpress.com

Go to:
smcwp.wordpress.com/wp-admin
username: smcwp
password: everyone4smc


WordPress.com versus WordPress.org


WP.org vs WP.com from WooThemes on Vimeo.


WordPress.com Store

http://store.wordpress.com/

Available Upgrades

Bundles
A bundle is a combination of upgrades that offer convenience and good value. With a bundle, you get the must-have upgrades at a discounted price.

Custom Design
With the Custom Design upgrade, you can make your blog look exactly the way you want. The Font Editor lets you customize the fonts in your theme in a just few clicks — no coding knowledge required! The CSS Editor lets you customize the stylesheets of any available theme. Some themes, like the plain but versatile Sandbox and Toolbox, are blank canvases waiting for your custom CSS, fonts and images. Please note, however, that the Custom Design Upgrade does not permit the editing of the core PHP or template files of any theme. This upgrade costs $30.00 per blog, per year.

Domain Mapping and Domain Registration
Take the ‘wordpress’ out of your blog’s URL by registering a custom domain for your blog, or adding one you already own. Add a domain from Store -> Domains to purchase. This upgrade starts at $13.00 per domain, per blog, per year.

Guided Transfer
Have one of our Happiness Engineers transfer your WordPress.com site to a self-hosted WordPress.org site. This upgrade is a one time fee of $129.00 per blog transferred.

No-ads
We sometimes run discreet advertisements on your blog to users who aren’t logged in and aren’t regular visitors. Purchasing the No-Ads upgrade will eliminate any ads on your blog so no one sees them at all. This is especially useful for business blogs. This upgrade costs $30.00 per blog, per year.

Premium Themes
Add more options for site customization, exclusive designs, and support direct from theme authors with a Premium Theme upgrade. Pricing for each theme can be found under the Premium tab in the Appearance → Themes page of your dashboard. Premium themes are priced per blog, for the lifetime of that blog.

Site Redirect
Easily redirect your blogname.wordpress.com blog, and all of its permalinks, to your new domain, if you decide to leave WordPress.com. This upgrade costs $13.00 per blog, per year.

Space Upgrade
Increase the space available for all of your uploads by 10GB, 25GB, 50GB, 100GB, or 200GB, and add the ability to upload audio/music files. See the Space Upgrade page for pricing information.

VideoPress
Upload and embed your own videos directly within your blog posts and pages. This upgrade costs $60.00 per blog, per year.


Self-hosted WordPress (WordPress.org)

Resources

WordPress.com vs. Self-Hosted WordPress – What You Need To Know
How to Choose the Best WordPress Hosting

If you choose to host WordPress on your own, you will need to do the two following things:

1. Purchase a Domain Name

The first step to creating a website is to choose a domain name (www.domainname.com) for your site.

Before you start working on a website, be sure to check if a particular domain name is available. Use a “Find a Domain” feature on a website like Network Solutions. Here you can check too see if a potential domain name is available.

In order to self-host WordPress, you’ll need to register your own domain name and purchase a web hosting plan.

Here’s my advice:

  • I recommend you secure domain registration with an ICANN-Accredited Registrar. If you don’t want to sift through the hundreds of companies, you may want to consider Network SolutionsGo Daddy, Bluehost or Dreamhost.
  • The big difference between companies such as Network Solutions and Go Daddy is price and service.
  • Registering a domain name with Network Solutions costs more than registering a domain name with Go Daddy. Network Solutions has excellent customer service and has been around forever.
  • But GoDaddy is more economical and GoDaddy’s customer service has been impressive recently. (I’ve been told they send both a follow-up email and call new customers to answer questions, wow!)
  • Feel free to register your domain name at a different company than the three given above. These are my recommendations based on the fact that I’ve hosted websites with these three companies. Whichever company you choose, make sure the registrar you’ve chosen is ICANN-Accredited and you know someone who’s had a good experience with the company.

2. Purchase Web Hosting

There are hundreds of web hosting companies. Be sure to pick one that provides 1-Click Installs for WordPress. Most of the major web hosting companies do. Bluehost, Dreamhost, Media Temple, GoDaddy all do.

What is  1-Click Self Installation?

1-Click installation is an easy way to install WordPress using your own domain name and web hosting.

1-Click Self Installation Bluehost


1-Click Self Installation DreamHost


1-Click Self Installation Media Temple


Appearance

WordPress uses a database to manage/store our content, one of the nice things about it is that we can change the appearance of this information relatively quickly by using a theme, or creating our own. We can browse through the library of themes to choose a new look for our website. To switch themes:

Changing Themes

  • Browse for the theme using the search or navigation.
  • Notice you can either activate or preview the theme.
  • After you activate the theme, view your site and its new appearance.

In general when choosing themes we want to find a theme that has the general structure of how we want the layout for our website.

Things to consider when selecting a theme – Does the theme need to have the following features?

  • One, two, three, or four columns
  • Right or left sidebar
  • Custom and flexible headers
  • Custom background
  • Fixed, Flexible, or Responsive Width
  • Custom menu
  • Featured Images
  • Post formats
  • Theme Options

“Responsive” WordPress themes

A responsive theme fully adjusts to the size of the screen, even changing the layout to make the best use of space, so your posts will be easy to read on phones and tablets as well as full-size computers. Many WordPress themes are already responsive, and all new releases will be.

Go to Appearance > Themes > Blaskan (Preview) then Activate.

In Appearance (using Blaskan theme) notice the following:

Premium Themes

WordPress.com
Add more options for site customization, exclusive designs, and support direct from theme authors with a Premium Theme upgrade. Pricing for each theme can be found under the Premium tab in the Appearance → Themes page of your dashboard. Premium themes are priced per blog, for the lifetime of that blog.

Self-hosted WordPress.org
 Free WordPress themes

Premium themes (to install on self-hosted site)*

The sites below offer premium themes from $30 – $60 for a theme or bundle of themes

Theme Forest: http://themeforest.net/category/wordpress 
Themify: http://themify.me/themes 
Elegant Themes: http://www.elegantthemes.com/ 

Responsive WordPress Themes
http://mashable.com/2013/03/08/responsive-wordpress-themes/
http://responsivethemes.org/
http://www.tripwiremagazine.com/2013/02/responsive-wordpress-themes.html

* There are links to other themes in the resources section at the bottom of the page.


Widgets

Widget is a fancy word for tools or content that you can add, arrange, and remove from the sidebar(s) of your blog. Widgets make it easy to customize the content of your sidebar(s). You can access your widgets from the Appearance -> Widgets screen in your Dashboard.

Adding Widgets

To add a widget, drag the widget from the Available Widgets or Inactive Widgets area on the left into the Sidebar area on the right. When you see a dashed line appear, you can drop the widget into place.

Configuring Widgets

Each widget has configuration options. To make changes to a widget in the sidebar, click on the triangle on the right side. http://en.support.wordpress.com/widgets/

Demonstration

  1. Add Facebook Like Box Widget (For Pages only)
    https://www.facebook.com/pages/SMC-graphic-design-club/109334002480952
  2. Add Twitter Widget
  3. Add Milestone Widget

Navigation Menus

Custom Menus

Sometimes we want a custom menu structure. A lot can be done out of the box or via plug-ins, but there are ways to create custom menus via the dashboard. If you plan on doing custom menus, it’s best to have a theme that supports them from the get-go, but you can also make the theme support it, by modifying your functions.php file.

WP Custom Menus: http://codex.wordpress.org/Appearance_Menus_Screen

1. Go to Appearance > Menus. Click on plus sign and add name of menu to text field.

2. Select the pages to include in the navigation menu.

3. Order the pages.  You can create drop down menus (if supported in theme) by nesting the pages.

4. Select which menu you’d like to use as the primary menu.


Using Shortcodes

What is a shortcode?

A shortcode is a WordPress-specific code that lets you do nifty things with very little effort. Shortcodes can embed files or create objects that would normally require lots of complicated, ugly code in just one line. Shortcode = shortcut.

http://en.support.wordpress.com/shortcodes/

A few examples

Video
[vimeo] embeds a Vimeo video.
[youtube] embeds a YouTube video.
[hulu] embeds a Hulu video.

Audio
[soundcloud] embeds audio from SoundCloud.
[spotify] embeds music from Spotify.

Images and Documents
[instagram] embeds an image from Instagram.
[slideshow] embeds a slideshow of uploaded photos.
[googleapps] embeds a document from Google Docs.

Miscellaneous
[contact-form] adds a contact form to your page.
[googlemaps] embeds Google Maps.
[twitter-timeline] embed a Twitter timeline.


Media Library

Inserting a Gallery

To create a gallery to insert into a post, click on Add Media to access your Media Manager. Just drag and drop the images you want to include to the middle area, or click Upload Files near the top to select files from your computer.

You can also make a gallery of things you’ve already uploaded — if the images are already in your Media Library, just click Create Gallery on the left, and then click on the images you want to use. A checkmark will appear at the top right corner of the image when you choose it.

Download a zip file of images for demo:
http://www.everythingaboutweb.com/classes/images/gallery.zip

When you’re finished selecting photos, click the Create a new gallery button on the bottom:

Under Gallery Settings, pick the style of gallery you want to use:

For more information on inserting galleries: http://learn.wordpress.com/get-flashy/#addimage


Inserting an Audio file

Embedding an audio file using SoundCloud


SoundCloud
allows you to share your sounds.

SoundCloud makes music sharing fast & easy. The platform takes the daily hassle out of receiving, sending & distributing music for artists, record labels & other music professionals.

SoundCloud supports the uploading of AIFF, WAVE, FLAC, OGG, MP2, MP3, AAC, AMR and WMA files.

To embed SoundCloud groups or member track playlists or a single track in your blog explore the SoundCloud website and or use the search to find a sound that you like. Once you have located a song to embed, look for the Share button. If a track doesn’t have this button you you will not be able to play it outside of the SoundCloud web site.

https://soundcloud.com/jamiecavanaugh/mattmullenweg-interview

soundcloud

To create sound files:
GarageBand
Audactiy

For help inserting other media using shortcodes
http://en.support.wordpress.com/shortcodes/

For more information about inserting audio:
http://en.support.wordpress.com/audio/


Tools > Export

Export Your Content to Another Blog or Platform

It’s your content; you can do whatever you like with it. Go to Tools -> Export in your WordPress.com dashboard to download an XML file of your blog’s content.


Plugins (WordPress.org)

Key to the WordPress universe are plug-ins, which are custom bits of code made for reuse that expand the functionality of our blog. These run the gamut from galleries to shopping carts and all points in between. Likewise the implementation varies, but the process is generally the same.

  • Find the plug-in. Search via Google or the WordPress Plugin directory.
  • Download plugin file as a zip file.
  • Upload to your site via the plugin uploader, which is accessed via the Plugin tab on the dashboard menu.
  • Activate the plugin.
  • Read the documentation, see if you can make it work.

Suggested Plugins

  • Maintenance Mode
  • Google Analytics for WordPress
  • Akismet
  • All in One SEO Pack
  • Calendars
  • iframe
  • Galleria WP
  • Easy Contact
  • Sociable
  • Database backup (choose from several)

Comments

Settings > Discussion


Permalinks

Set permalinks

Settings > Permalinks > Custom structure
/%postname%/

This will give the page names the name of your post.


Resources

WordPress Support
http://learn.wordpress.com/
http://en.support.wordpress.com/
http://wordpress.stackexchange.com/
http://wpquestions.com/

WordPress Beginner
http://www.wpbeginner.com/

Themes


Footnotes

Many of the above materials are from the following site:
http://en.support.wordpress.com/