information management

1

Information Management

DIG 3563 – Lecture 8

Content Management Systems:

Plugins for Wordpress

J. Michael Moshell

University of Central Florida

Original image* by Moshell et al .

Imagery is fromWikimedia except where marked with *.

-2 -

• There are LOTS of them• Their quality varies widely

- Maturity (length of service; number of users)

- Continuing support

- Experience of the builder

How to find out? Read the posting and forums!

-3 -

Some Random Plugin Visits

• Petfinder Listing

Relies on the Petfinder.com API

(So you don’t have to build your own back-end).

Petfinder.com can host an entire animal-welfare

website.

Petfinder Listing allows YOUR site to get data

from a Petfinder.com – hosted website.

-4 -

Gpawisconsin.org

-5 -

Some Random

Plugin Visits

• Buddypress

Actually a COLLECTION of plugins

to support social networking

http://wordpress.org/extend/plugins/buddypress/

Example:

http://helloecoliving.com/community/

-6 -

How is it built? See Source!

-7 -

How is it built? See Source!

-8 -

Examples:

• BuddyMobile

“Mobile BuddyPress theme optimized for ... iPhone,

iPod touch. Will also work on Android & some

Blackberry devices.”

For BuddyPress 1.5 only.

-9 -

Examples:

• BuddyPress Media

“Production grade” social media hosting

“Drag and Drop” photos, audio, video between

Facebook, Flickr, YouTube ...

ecommerce capabilities

2.7 million users, 16,000 sites.

-10 -

Beer Ratings

• Requires a RateBeer API Key

Better not say too much about this one;

somebody might do it for a term project

and we've had TOO MANY like this!

-11 -

WP Survey and Quiz Tool

• Promising topic; many people need this•Maintenance via GitHub

BUT: Daunting feedback.

-12 -

SS Quiz

• Downloads: 5,319• Apparently a Russian product

• I decide to get it and try it.

-13 -

SS Quiz

• Downloads: 5,319• Apparently a Russian product

• I decide to get it and try it.

1) Download and unzip

2) Move into

wordpress/wp-content/plugins

3) In the Plugin menu, activate

-14 -

SS Quiz

• Downloads: 5,319• Apparently a Russian product

• I decide to get it and try it.

1) Download and unzip

2) Move into

wordpress/wp-content/plugins

3) In the Plugin menu, activate

4) A new row appears in the Dashboard

-15 -

SS Quiz

“To insert quiz into page, use short code

[ssquiz id=‘#’].

So I create a page and call it ‘Mikwiz’, insert

[ssquiz id=‘1’].

Quiz appeared. I took it.

-16 -

SS Quiz: Control Panel

-17 -

SS Quiz: Control Panel

Issues: (1) Why were questions 3, 4 radio buttons?

while 1,2,5 were textboxes?

(2) Is the data stored anywhere?

Answers: Exploring, I found:

-18 -

SS Quiz: Scores

Stores the number of correct answers; no details

-19 -

SS Quiz: Template

Augmented HTML, with %%TITLE%% etc.

-20 -

SS Quiz: Template

How do I set “Title” and other variables?

Experimenting with the user interface, I observe

the phrase “Let’s start the quiz “%%TITLE%%”!

On the quiz page, I see:

-21 -

SS Quiz: Template

Likewise, I observe:

-22 -

SS Quiz: Template

SO I conclude that these “variables” correspond

to built-in features of the SS Quiz Plugin:

TITLE

DESCRIPTION

QUESTIONS (number of questions entered)

-23 -

SS Quiz: Template

And likewise,

PERCENT

TOTAL

-24 -

SS Quiz: We Played a bit

Experiment with creation of a Quiz

and

the use of the Question Editor

-25 -

SS Quiz: We Play a bit

Experiment with creation of a Quiz

and

the use of the Question Editor

Identify one or more shortcomings of the Plugin:

-26 -

SS Quiz: We Play a bit

Experiment with creation of a Quiz

and

the use of the Question Editor

Identify one or more shortcomings of the Plugin:

•no UNDO. I delete a question, it’s gone•no actual answer storage. I can’t diagnose...

-27 -

Time to Build our Own

Plugin. I seek a Tutorial.

http://codex.wordpress.org/Writing_a_Plugin

I start a log (word document) to remember what I do.

-28 -

Step 1: Trivially modify existing code

Hello Dolly

Go to Plugins menu, activate the plugin.

Small lines of text appear in upper right

corner of the Admin screen.

-29 -

Step 1: Trivially modify existing code

Understand the Header Comment

It’s NOT ignored by the system. It’s essential!

-30 -

Step 1: Trivially modify existing code

Make a copy of hello.php, call it hello2.php

Look at plugins menu again. Wierd, huh?

-31 -

Step 1: Trivially modify existing code

Modify hello2 just enough to recognize it.

Change its name to dolly2

change text to refer to ‘Herman’

Note and fix the

add_action( ) function.

KEY QUESTION: WHAT ARE ‘actions’?

-32 -

Step 1: Trivially modify existing code

Learn about ‘actions’.

http://codex.wordpress.org/Plugin_API/Action_Reference

NOTE: You are not required to program in

this course. But you are required to understand

key concepts, and action is one of those.

-33 -

Step 1: Trivially modify existing code

An Action in Wordpress is called an event

in other languages.

As Wordpress runs, it will check its action lists

for functions that should be called, at various

times.

Each plugin can add functions to those lists.

-34 -

-35 -...and many more ...

-36 -

Step 1: Trivially modify existing code

There's a plugin that looks "Suspiciously"

like a Hello-World (starter kit) example

-37 -

Step 1: Trivially modify existing code

The action in this “Hello Dolly” story

is called admin_notices.

'admin_notices', which

apparently has to do with the top row of

the admin screen.

-38 -

Step 1: Trivially modify existing code

So, I add my OWN action to see what happens.

-39 -

Step 1: Trivially modify existing code

So, I add my OWN action to see what happens.

I edited hello.php as above. And the result ...

-40 -

Step 2: Make something more interesting

I wanted to put something into the main

data area, where PAGES appear.

It took me an hour of exploring to discover an

example. Cut to the chase ... here’s what I

found.

-41 -

Step 2: Make something more interesting

I wanted to put something into the main

data area, where PAGES appear.

It took me an hour of exploring to discover an

example. Cut to the chase ... here’s what I

found.

-42 -

Step 2: Make something more interesting

Example: A ‘filter’ to replace all the “<h1>”

tags in a page with ‘<h3>’ tags.

How was that done?

With REGULAR EXPRESSIONS!

-43 -

Step 2: Make something more interesting

I wanted to actually inject some copy

into a page. So I added an operator to replace

a tag ‘JMMtrigger’ with the text.

-44 -

Step 2: Make something more interesting

-45 -

And I had to find an Action to use.

The example code showed me this:

A ‘filter’ is an action that will take in the content

of a page, do stuff to it, and then send it on

to the screen.

So this filter will add the JMMexchange stuff.

-46 -

JMMexchange will do two things:

1) Replace H1 with H3 tags, and

2) replace the word JMMtrigger

with the data provided by my function.

-47 -

Then I needed a page to contain the

stuff. Edit-view:

-48 -

Then I needed a page to contain the

stuff. HTML-view

-49 -

AND the result on my front page.

-50 -

Things to understand about Plugin-making:

1)Making Plugins requires PHP skills

2)What is an Action

3)What is a Filter

4)What is the relationship between the code in the Plugin, and the text of a page?

How is the plugin’s activity triggered?

How can it modify the text of a page?

-51 -

Things to understand about Plugins:

1) Their quality and complexity varies WIDELY

2) They seldom do exactly what you want

3)You can modify ‘em, but keep a clean copy.

AND the MORAL:

Invest the effort to find a module* that actually

does what you need (or, as close as possible.)

(*: Plugin, in Wordpress-speak!)