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. About Wordpress Modules Plugins • 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.

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: • Making Plugins requires PHP skills • What is an Action • What is a Filter • 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?