Slavin-Dodson Piece, With Code.
Upcoming SlideShare
Loading in...5
×
 

Slavin-Dodson Piece, With Code.

on

  • 1,987 views

 

Statistics

Views

Total Views
1,987
Views on SlideShare
1,986
Embed Views
1

Actions

Likes
1
Downloads
3
Comments
0

1 Embed 1

http://www.slideshare.net 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Slavin-Dodson Piece, With Code. Slavin-Dodson Piece, With Code. Document Transcript

  • Section 1: Creating Dynamic Subject GuidesLaura Slavin and Joshua Dodson walk through using WordPress custom post types forsubject guides at the Lincoln Memorial University Carnegie -Vincent Library.Like most academic libraries, Carnegie-Vincent Library (CVL) built web pages from the groundup. Over the years it became apparent that the current form and design of these pages did notmeet the needs of the students, faculty, staff, and community at large. The format and design ofthe website had become antiquated. Library staff spent hours revising the pages often repeatingthe same changes on page after page. The users of the pages were inundated with a huge amountof information with poor navigational options.The librarians at CVL were just beginning to embrace the concept of Web 2.0. They wanted theopportunity to be more involved with the website users by collaborating with students whenhelping them with a research question or information literacy. The other requirement was that adynamic subject guide be created so that duplication of entry is eliminated. This also allowslibrarians to provide subject expertise via the web.How did we begin? The first step was to convince university administration that WordPress is agood solution for the librarys web design needs. This was not a hard sell. Administration waspleased with our demonstrations and appreciated the fact that almost of the work will be in thelibrary with very little help needed from our information services department. Soon we werebeginning the famous five minute install. 1
  • The installation was successfully completed thanks to the expertise of our then TechnicalServices Technician, Joshua Dodson. A web committee was formed and training sessions wereheld for all librarians and staff. WordPress proved to be all that we anticipated and more.The most innovative creation of our Technical Services Technician was the dynamic subjectguides. Joshua was able to take the custom post type functionality of WordPress and create adynamic component that updated our ability to add and control content in our WordPressinstallation. Over the past two years, WordPress enhanced their capabilities making it easier toprovide this type of functionality. As this is the most innovative of our WordPress endeavors atCVL, below is a step-by-step guide for creating dynamic subject guides using the latestenhancements in WordPress.A Subject Guide in WordPressIt is easy to create a subject guide using WordPress, especially with the new custom post types inthe WordPress core.INSERT IMAGE [Chapter4_Part1_1.png]CAPTION [Once you setup the subject guides as a custom post type, there will be an additionalarea in your WordPress Dashboard for you to add and edit subject guides and the relatedtaxonomies ("Subjects" and "Subject Tags").]INSERT IMAGE [Chapter4_Part1_2.jpg]
  • CAPTION [You are able to go into the "Subject Guides" screen to make modifications to thesubject guide posts that you create.]As you add a new subject guide, you will want to treat each one as a post that will be categorizedwithin at least one subject. Your full subject guides will actually be displayed by subject whenutilizing the full potential of this system. It is best to add a title, a description within the postbody area, the website address or linked internet resource under the "Subject Guide Options"screen, the subject categories and sub-categories that this post will fall under, and the appropriate"Subject Tags." The subject categories are hierarchical, so you will most likely only need toselect one of the sub-categories per parent category. You will need to be sure to plan out thestructure of your hierarchy before you begin creating the subject guides. You will save yourselfmuch time later on if you plan first. Also, the subject tags are much less structured and canprovide additional places to describe the content in a way that will not interfere with thehierarchy that you designate. The tags are a good place to add all of the extra metadata that thereis no clear place for beforehand.INSERT IMAGE [Chapter4_Part1_3.jpg]CAPTION [When you need to add or edit the subject categories, it will be very similar to addingand editing the normal WordPress post categories. It uses a comparable structure. One thing tonote is that the description that is added here will be displayed later on in the subject guidetemplate. Be sure to add an informative description if you choose to utilize this feature.]
  • INSERT IMAGE [Chapter4_Part1_4.jpg]CAPTION [When you need to add or edit the subject categories, it will be very similar to addingand editing the normal WordPress post categories. It uses a comparable structure. One thing tonote is that the description that is added here will be displayed later on in the subject guidetemplate. Be sure to add an informative description if you choose to utilize this feature.]INSERT IMAGE [Chapter4_Part1_5.jpg]CAPTION [Similarly to the categories, the subject tags are very similar to the standar dWordPress post tags. You can add and modify the tags by clicking "Subject Tags" on the leftside of the WordPress Dashboard under "Subject Guides."INSERT IMAGE [Chapter4_Part1_6.jpg]CAPTION [The A-Z Subject List will display all of the parent categories that have been createdfor the subject guides. When you click on the parent category, then the 2nd level categories, orsub-categories, will be listed with the descriptions and the posts under them.]INSERT IMAGE [Chapter4_Part1_7.jpg]
  • CAPTION [The Subject Guide Index will list all of the posts that have been created as a subjectguide. This will list all of the posts, regardless of category. When you click on an individual postit will take you to the page for that item, which includes a description of the item and also thefull list of categories and tags that has been assigned to this item.]INSERT IMAGE [Chapter4_Part1_8.jpg]CAPTION [An example subject guide posts individual listing.]The complete subject guide, when brought together reveals the following functionality, whichincludes the page title, category descriptions, sub-categories, and each post that has been addedbeneath each sub-category. Note that this example is using simple theming options based on theWordPress default Twenty Ten theme. You are able to include additional customizations as yousee fit by using CSS, JavaScript, and by modifying the PHP and (X)HTML that is describedbelow.INSERT IMAGE [Chapter4_Part1_9.jpg]CAPTION [An individual subject guide for philosophy.]
  • Using Custom Post Types to Create Dynamic Subject Guides in WordPressTo preserve functionality and maintain compatibility with the current WordPress theme, we willbegin by creating a child theme. The newest default theme at the time of this writing is TwentyTen, the HTML5 compatible and very flexible theme. We will use this as our base and create achild theme so that we can take advantage of its rich structure and syntax. Creating child themeshas never been easier. First create a folder called “sg-theme” (or name it anything else you wouldlike) and a style.css file within the folder. The only requirement is that the stylesheet contain thefollowing lines: /* Theme Name: Subject Guide 2010 Theme URI: Description: Subject Guide 2010 Child Theme Author: Joshua Dodson and Laura Slavin Author URI: Template: twentyten Version: 1.0 */WordPress will look for this file first to verify that it is actually a regular theme or a child theme.Since we used the “Template: twentyten” declaration, WordPress now knows that we are goingto inherit the functionality of the Twenty Ten theme, but add some pieces to it ourselves. Notethat it is important that both this folder and the original Twenty Ten folder reside in your“themes” folder within the “wp-content” folder.At this point it is not necessary to add anything else to the stylesheet, but since we want tomaintain the look and feel of the original theme for our example we will add the style importdeclaration below: @import url(../twentyten/style.css);
  • To provide the full functionality of a dynamic subject guide through the use of the newWordPress custom post types we will need to add a few additional files to our new theme folder“sg-theme.” We will add five additional files to the “themes” folder and one file to the “plugins”folder found inside of the “wp-content” folder.Writing the PluginLet’s start with the plugin that will enable the custom post types and provide the corefunctionality. Below is the code for the plugin with the explanations embedded as commentsthroughout the PHP.Note that the opening lines (Plugin Name, etc.) is what WordPress automatically looks for todetermine if the file is a plugin file or not. <?php /* Plugin Name: Subject Guide Plugin Plugin URI: Description: Subject Guide Custom Post Types for WordPress 3.0 and above. Author: Joshua Dodson and Laura Slavin Version: 1.0 Author URI: http://betterwebstrategy.net */ class subject_guide10 { var $meta_fields = array(sg10-website-address); function subject_guide10() { /* The following code will register our subject guide custom post types and defines all of the variations of the term that we specify, namely "Subject Guide." */ register_post_type(subject_guide, array(
  • labels => array( name => __( Subject Guides ), singular_name => __( Subject Guide ), add_new => __( Add New ), add_new_item => __( Add New SubjectGuide ), edit => __( Edit ), edit_item => __( Edit Subject Guide ), new_item => __( New Subject Guide ), view => __( View Subject Guide ), view_item => __( View Subject Guide ), search_items => __( Search SubjectGuides ), not_found => __( No Subject Guidesfound ), not_found_in_trash => __( No SubjectGuides found in Trash ), parent => __( Parent Subject Guide ), ), singular_label => __(Subject Guide), public => true,// This designates that we use the UI in the admin panel. show_ui => true,// This specifies that it is a custom post type, not abuilt in post type. _builtin => false, _edit_link => post.php?post=%d, capability_type => post, hierarchical => false,//This will set up our permalink structure. rewrite => array("slug" => "subject-guide"), query_var => "subject_guide",//This specifies the capabilities that we are going toallow the subject guide to have. supports => array(title,author, editor,revisions) )); add_filter("manage_edit-subject_guide_columns",array(&$this, "edit_columns")); add_action("manage_posts_custom_column",array(&$this, "custom_columns"));/*The following will register our subject guide customtaxonomies. The first taxonomy will register ashierarchical categories. The second taxonomy will registerin a similar fashion as tags. Both of these will allow for
  • adding the appropriate meta data to the post.*/ register_taxonomy("subject",array("subject_guide"), array("hierarchical" => true,"label" => "Subjects", "singular_label" => "Subject","rewrite" => true)); register_taxonomy("subject_tag",array("subject_guide"), array("hierarchical" => false,"label" => "Subject Tags", "singular_label" => "SubjectTag", "rewrite" => true));/*Initiate the admin interface.*/ add_action("admin_init", array(&$this,"admin_init")); add_action("template_redirect", array(&$this,template_redirect)); add_action("wp_insert_post", array(&$this,"wp_insert_post"), 10, 2); }/*The following will designate columns for how the customtaxonomies and the description will appear in the "EditSubject Guide" page.*/ function edit_columns($columns) { $columns = array( "title" => "Subject Guide Title", "sg10_description" => "Description", "sg10_website_address" => "Website Address", "sg10_subjects" => "subjects", "sg10_subject_tags" => "Subject Tags" ); return $columns; }/*The following function specifies the content that will bedisplayed within the columns for "Edit Subject Guide" thatwe setup in the above code.*/ function custom_columns($column) { global $post; switch ($column)
  • { //This will take the excerpt of the custom post and use it for the description. case "sg10_description": the_excerpt(); break; //This will display the custom URL that we use to link our custom post to an internet resource. case "sg10_website_address": $custom = get_post_custom(); echo $custom["sg10-website-address"][0]; break; //This will use the hierarchical meta data for the custom post type. case "sg10_subjects": $subjects = get_the_terms(0, "subject"); $subjects_html = array(); if ($subjects) {foreach ($subjects as $subject) array_push($subjects_html, <a href=" . get_term_link($subject->slug, "subject") . "> . $subject->name . </a>); echo implode($subjects_html, ", ");} break; //This will use the subject guide tags that we create. case "sg10_subject_tags": $subject_tags = get_the_terms(0, "subject_tag"); $subject_tags_html = array(); if ($subject_tags) { foreach ($subject_tags as $subject_tag) array_push($subject_tags_html, <a href=" . get_term_link($subject_tag->slug, "subject_tag") . "> . $subject_tag->name . </a>); echo implode($subject_tags_html, ", "); } break; } } /*The following function is an optional function that will create a redirection to take place underspecific conditions. This ultimately supplies our designated templates if the page that the user isviewing is one of the subject guide pages. Our taxonomy-subject.php example that we will
  • discuss later on takes that place of the last statement by using the inherent template hierarchystructure of WordPress. The following code will ultimately change the natural structure, ormodify it as necessary. */ function template_redirect() { global $wp; $custom_types = array("subject_guide"); if (in_array($wp->query_vars["post_type"], $custom_types)) { if($wp->query_vars["name"]): include(STYLESHEETPATH . "/single-subject- guide.php"); die(); else: include(STYLESHEETPATH . "/category- subject.php"); die(); endif; } } /* When a post is created or updated, this function will loop through all of the post data . */ function wp_insert_post($post_id, $post = null) { if ($post->post_type == "subject_guide") { foreach ($this->meta_fields as $key) { $value = @$_POST[$key]; if (empty($value)) { delete_post_meta($post_id, $key); continue; } /* This determines whether it is an array, or string, and updates or adds the meta data for the post. */
  • if (!is_array($value)) { if (!update_post_meta($post_id, $key,$value)) { add_post_meta($post_id, $key,$value); } } else { delete_post_meta($post_id, $key); foreach ($value as $entry) add_post_meta($post_id, $key,$entry); } } } }/*This function will allow us to create custom meta boxes forthe "Edit Subject Guide" page.*/ function admin_init() { add_meta_box("sg10-meta", "Subject Guide Options",array(&$this, "meta_options"), "subject_guide", "normal","high"); }/*The following function will specify the content and displayfor our subject guide in the admin screen.*/ function meta_options() { global $post; $custom = get_post_custom($post->ID); $website_address = $custom["sg10-website-address"][0];?><p> <label>Website Address:</label> <br /> <input name="sg10-website-address" value="<?php echo$website_address; ?>" /></p><?php
  • } } /* Now we are finished setting up how WordPress will handle all of our subject guide custom post types and the meta data and other taxonomies that are associated with it. All that is left to do is to initiate the plugin, which will be taken care of in the following lines. */ add_action("init", "subject_guide10Init"); function subject_guide10Init() { global $sg10; $sg10 = new subject_guide10(); } ?>Creating the TemplatesThe plugin will do most of the heavy lifting for us on the admin-side. Now we need to specifyhow we are going to display the contents of our subject guide custom posts. We will handle thisthrough our templates. Since we are using a child theme, WordPress will look at our customfolder first and display the content that we specify for our templates. After it looks at our childtheme folder, WordPress will look for the rest of the functionality in the parent theme folder.Subject Guide Taxonomy TemplateUsing the built-in WordPress theme structure we will create a file called taxonomy-subject.phpWe will use the categorization to display the subjects, so that when one clicks on the category,then all of the posts classified as that subject and all of the sub-categories with their respectiveposts will be displayed in a hierarchical fashion.Note that there is a lot going on in this example. This is really the bread and butter of the subject
  • guide system in terms of the way it is displayed. This example does most of the heavy lifting forus. <?php /* taxonomy-subject.php takes advantage of the internal taxonomy template system of WordPress. Since our custom taxonomy is "subject," WordPress will look at the taxonomy- [custom taxonomy name here].php file structure and use this file for the look and feel of our 1st level subject categories. */ // We will start by setting the variables and getting the header. $term = get_term_by( slug, get_query_var( term ), get_query_var( taxonomy ) ); $tax = get_query_var( taxonomy ); get_header(); ?> <div id="container"> <div id="content" role="main"> <h1 class="page-title"><?php echo $term->name; ?></h1> <?php if ($term->description) { ?> <blockquote><?php echo $term->description; ?></blockquote> <?php } ?> <?php /* If there are sub-categories, then retrieve them and display them as a Heading 2 and also display the description of the category. */ if (get_term_children($term->term_id, $tax) != null) { $term_children = get_terms( $tax, array( child_of => $term->term_id, ) ); foreach ($term_children as $term_child) { echo <h2> . $term_child->name . </h2>; if ($term_child->description) { ?> <blockquote><?php echo $term_child->description;
  • ?></blockquote> <?php } query_posts(array( subject => $term_child->slug, orderby => title, order => ASC, ) );/*This will look through all of the posts that arecategorized with the sub-category and display the title ofthe post as a link to the subject URL (not the permalink tothe post), and also will display the content of the post--this will allow any additional information, links, orimages of the post to be displayed.*/ if (have_posts()) : ?> <?php while (have_posts()) : the_post(); ?> <h3 <?php post_class(); ?>> <?php global $post; $custom =get_post_custom($post->ID); $website_address =$custom["sg10-website-address"][0]; ?> <a href="<?php if($website_address) { echo$website_address; } else { the_permalink(); } ?>"> <?php the_title(); ?> </a> </h3> <?php the_content(); ?> <?php endwhile; ?> <?php endif; }/*If there are no sub-categories, then only the post titlesfor the top level custom taxonomy will be displayed.*/ } else { if (have_posts()) : ?> <ul> <?php while (have_posts()) : the_post(); ?> <li <?php post_class(); ?>> <a href="<?phpthe_permalink(); ?>"> <?php the_title(); ?> </a> </li> <?php endwhile; ?> </ul>
  • <?php endif; } ?> </div> <!-- #content --> </div> <!-- #container --> <?php get_sidebar(); ?> <?php get_footer(); ?>Subject Guide IndexThis template lists all of the subject guide posts across all categories (subjects) and displays theURL of the internet resource next to it. When the post title link is clicked on, it will take you tothe single page listing of the post resource. <?php /* Template Name: Subject Guide Index */ get_header(); ?> <div id="container"> <div id="content" role="main"> <ul> <?php global $post; $tmp_post = $post; $myposts = get_posts(array( post_type => subject_guide, numberposts => -1, orderby => title, order => ASC, )); foreach($myposts as $post) : setup_postdata($post); ?> <?php global $post; $custom = get_post_custom($post->ID); $website_address = $custom["sg10-website- address"][0]; ?> <li><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"> <?php the_title(); ?>
  • </a> - <?php echo $website_address; ?></li> <?php endforeach; ?> <?php $post = $tmp_post; ?> </ul> </div> <!-- #content --> </div> <!-- #container --> <?php get_sidebar(); ?> <?php get_footer(); ?>The "Subject Guide A-Z List" template and the "Subject Guide Category" template will take onvery basic functionality from the standard Twenty Ten loop. We will use our functions.php fileto make some modifications to this to provide additional functionality. Note that the "SubjectGuide A-Z List" template takes on the page loop functionality, while the "Subject GuideCategory" template uses the single post loop.Subject Guide A-Z List <?php /* Template Name: Subject Guide Subject A-Z List */ get_header(); ?> <div id="container"> <div id="content" role="main"> <?php get_template_part( loop, page ); ?> </div><!-- #content --> </div><!-- #container --> <?php get_sidebar(); ?> <?php get_footer(); ?>Subject Guide Category <?php /* Template Name: Subject Guide Category */ get_header(); ?> <div id="container"> <div id="content" role="main">
  • <?php get_template_part( loop, single ); ?> </div><!-- #content --> </div><!-- #container --> <?php get_sidebar(); ?> <?php get_footer(); ?>Functions.phpTo bring everything together we will use a custom functions.php file. <?php /* This function will include additional classes to the built- in body class. This allows for additional styling of the subject guide posts within the CSS stylesheet. */ function taxonomy_body_class( $classes ) { if( is_tax() ) { global $taxonomy; if( !in_array( $taxonomy, $classes ) ) $classes[] = "taxonomy " . "taxonomy- ".$taxonomy; } return $classes; } add_filter(body_class,taxonomy_body_class); /* The following two functions will allow us to pull the full taxonomy list of terms that are associated with each of our subject guide posts. */ function sg_get_terms( $id = ) { global $post; if ( empty( $id ) ) $id = $post->ID; if ( !empty( $id ) ) { $post_taxonomies = array(); $post_type = get_post_type( $id ); $taxonomies = get_object_taxonomies( $post_type , names ); foreach ( $taxonomies as $taxonomy ) { $term_links = array(); $terms = get_the_terms( $id, $taxonomy );
  • if ( is_wp_error( $terms ) ) return $terms; if ( $terms ) { foreach ( $terms as $term ) { $link = get_term_link( $term, $taxonomy ); if ( is_wp_error( $link ) ) return $link; $term_links[] = <a href=" . $link . " rel=" .$taxonomy . "> . $term->name . </a>; } } $term_links = apply_filters( "term_links-$taxonomy" ,$term_links ); $post_terms[$taxonomy] = $term_links; } return $post_terms; } else { return false; }}function sg_get_terms_list( $id = , $echo = true ) { global $post; if ( empty( $id ) ) $id = $post->ID; if ( !empty( $id ) ) { $my_terms = sg_get_terms( $id ); if ( $my_terms ) { $my_taxonomies = array(); foreach ( $my_terms as $taxonomy => $terms ) { $my_taxonomy = get_taxonomy( $taxonomy ); if ( !empty( $terms ) ) $my_taxonomies[] =<span class=" . $my_taxonomy->name . -links"> . <spanclass="entry-utility-prep entry-utility-prep- .$my_taxonomy->name . -links"> . $my_taxonomy->labels->name . : . implode( $terms , , ) . </span></span>; } if ( !empty( $my_taxonomies ) ) { $output = <ul> . "n"; foreach ( $my_taxonomies as $my_taxonomy ) { $output .= <li> . $my_taxonomy . </li> ."n"; } $output .= </ul> . "n"; } if ( $echo ) echo $output; else
  • return $output; } else { return; } } else { return false; }}/*This will apply a filter that will insert the subject listwithin the "Subject Guide A-Z List" template.*/add_filter(the_content,insert_subject_list);function insert_subject_list($content) { if ( is_page_template(subject-guide-subject-a-z.php)) { echo $content; $args = array( orderby => name, order => ASC, show_last_update => 0, style => list, show_count => 0, hide_empty => 1, use_desc_for_title => 1, child_of => 0, hierarchical => true, title_li => __( Subjects ), number => NULL, echo => 1, depth => 1, current_category => 0, pad_counts => 0, taxonomy => subject ); wp_list_categories( $args );} else {return $content;}}/*Here we will apply a filter that modifies the singlesubject guide item display to also show the full taxonomylisting for that item.*/add_filter(the_content,insert_custom_taxonomy);
  • function insert_custom_taxonomy($content) { if (is_singular(subject_guide)) { echo $content; $content.= "<div class=taxonomy>"; $content.= sg_get_terms_list(); $content.= "</div>"; } else {return $content;} } ?>Creating dynamic subject guides using WordPress will add a level of usability to your librarywebsite. You will be able to add and manage content with greater efficiency. As we discoveredat Lincoln Memorial University Carnegie-Vincent Library, these guides also help involvelibrarians and users.Using WordPress gives CVL a professional, functional presence on the web. What is excitingabout WordPress is that it is evolving and improving. No matter the size of your library or yourspecific needs, WordPress will almost always provide for you a solution. With the step-by-stepguide weve provided, we hope you will take the time to experiment with our response to aspecific need at our library and that you will then branch out and utilize the multifacetedcapabilities of WordPress.More InformationThis is really just the tip of the iceberg. We fully expect that WordPress will release even morecustomizable functionality in future releases. The WordPress Codex is the top resource for allthings WordPress. It is best to look there first for the definitive word on how to use theWordPress functions and capabilities that were mentioned. With that said, there are many
  • additional resources on the web that will provide tips and different approaches. WordPress isexpanding into a fully functional content management system--it has been for a while. Thebeauty in using and customizing a system like WordPress is that the more people who use it, themore support will be provided. The full community of support in WordPress is a remarkablething. You never know when your question will be answered by another user who hasexperienced the same issues, or even one of the lead developers.Please look at the following references and resources for more information on using WordPressand custom post types.• WordPress Custom Post Types on the WordPress Codex http://codex.wordpress.org/Custom_Post_Types• Showing custom post types on your home/blog page http://justintadlock.com/archives/2010/02/02/showing-custom-post-types-on-your-home-blog- page• Custom post types in WordPress http://justintadlock.com/archives/2010/04/29/custom-post-types-in-wordpress• Custom Post Types in WordPress 3.0 http://kovshenin.com/archives/custom-post-types-in-wordpress-3-0/ Extending Custom Post Types in WordPress 3.0 http://kovshenin.com/archives/extending-custom-post-types-in-wordpress-3-0/This has been presented to the best of our knowledge. As with all open source code, the coreWordPress functionality may change and leave sections of the code represented above asnonfunctional. If you choose to implement the ideas expressed herein, please research WordPressfurther and share your findings with the WordPress community. The authors do not guaranteeexact results as expressed herein.Bios
  • Laura Slavin is the Technical Services Librarian at Lincoln Memorial University Carnegie -Vincent Library. She earned her Masters in Library and Information Science from theUniversity of South Florida School of Library and Information Science and her Masters inBusiness Administration from Lincoln Memorial University.Joshua Dodson is a Web Analytics Strategist for Stamats, Inc. in Cedar Rapids, IA.Laura and Joshua have published and presented numerous times on WordPress and the use andcustomization of other open source software for over two years.