0% found this document useful (0 votes)
29 views107 pages

Chapter 18 Web

fundamentals of web development
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
29 views107 pages

Chapter 18 Web

fundamentals of web development
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 107

Content

Management
Systems

Chapter 18

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Textbook to be published by Pearson ©
Ed2015
in early
Pearson
2014
Randy Connolly and Ricardo Hoar Fundamentals of Web Development
http://www.funwebdev.com
Objectives
1 2
Managing Content
Management
websites
Systems (CMS)

3 CMS
Components 4 WordPress
Technical
Overview

5 6
Customizing
Modifying WordPress
Themes Templates

7
Creating a
Custom Post
Type
8
7
Writing a Plugin

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Section 1 of 8

MANAGING WEBSITES
Randy Connolly and Ricardo Hoar Fundamentals of Web Development
Managing Websites

The most significant drawback to the sites you have


created so far is that these sites require a software
developer to edit the code in order to make changes
For a small company, this can be a significant problem,
since they cannot afford a full-time programmer on
staff.
These companies want a system that is
• Easy for a nontechnical person to make changes to
• Consistent and professional looking across the site
• Cost effective

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Managing Websites
Components of a Managed Website

A typical website requires :


Management provides a mechanism for uploading and
managing images, documents, videos, and other assets.
Menu control manages the menus on a site and links menu
items to particular pages.
Search functionality can be built into systems so that users can
search the entire website.
Template management allows the structure of the site to be
edited and then applied to all pages.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Managing Websites
Components of a Managed Website

User management permits multiple authors to work


simultaneously and attribute changes to the appropriate
individual. It can also restrict permissions.
Version control tracks the changes in the site over time.
Workflow defines the process of approval for publishing
content.
WYSIWYG editor allows nontechnical users to create and edit
HTML content and CSS styles without manipulating code.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Managing Websites
It can seem overwhelming

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Content Management Systems
Try to make it manageable

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Section 2 of 8
CONTENT MANAGEMENT SYSTEMS (CMS)

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Content Management Systems
Try to make it manageable

Content management system (CMS) is the name given


to the category of software that easily manages
websites with support for multiple users.
CMS is a Document management systems (DMSs)
which has many features for documents including: file
storage, multiuser workflows, versioning, searching,
user management, publication, and others.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Types of CMS
There are a lot

A Wikipedia page of available web CMSs had 109


open-source systems and 39 proprietary systems.
These systems are implemented using a wide range of
development technologies including PHP, ASP.NET,
Java, Ruby, Python, and others.
Some of these systems are free, while others can cost
hundreds of thousands of dollars.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Types of CMS
There are a lot

Other CMSs include:


• DotNetNuke
• Drupal
• ExpressionEngine
• IBM Enterprise Content Management (ECM)
• Joomla!
• Moodle
• Sharepoint

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Types of CMS
How to pick

When selecting a CMS there are several factors to consider


including:
• Technical requirements: the functionality it offers as
well as the server software and database compatibility.
Your client may have additional requirements to
consider.
• System support:. Since you are going to rely on the
CMS to patch bugs and add new features, it’s important
that the CMS community be active in supporting these
types of updates or you will be at risk of attack.
• Ease of use: Probably the most important consideration
is that the system itself must be easy to use by
nontechnical staff.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Types of CMS
We will be using WordPress

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Section 3 of 8

CMS COMPONENTS
Randy Connolly and Ricardo Hoar Fundamentals of Web Development
CMS Components

• Post and Page Management


• WYSIWYG Editors
• Template Management
• Menu Control
• User Management and Roles
• User Roles
• Workflow and Version Control
• Asset Management
• Search
• Upgrades and Updates

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


CMS Components
Post and Page Management

Blogging environments such as WordPress use posts as


one important way of adding content to the site.
Posts are usually displayed in reverse chronological
order (i.e., most recent first) and are typically assigned
to categories or tagged with keywords as a way of
organizing them.
Many sites allow users to comment on posts as well.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


CMS Components
Screenshot of a Post Editor in WordPress

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


CMS Components
What You See is What You Get

What You See Is What You Get (WYSIWYG) presents


the users with an exact (or close) view of what the
final product will look like.
These tools generate HTML and CSS automatically
through intuitive user interfaces

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


CMS Components
Template Management

Template management refers to the systems that


manage the structure of a website, independently of
the content of each particular page

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


CMS Components
Menu Control

Some key pieces of functionality that should be


supported in the menu control include:
• Rearrange menu items and their hierarchy.
• Change the destination page or URL for any menu
item.
• Add, edit, or remove menu items.
• Change the style and look/feel of the menu in one
place.
• Manage short URLs associated with each menu
item.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


CMS Components
User Management

User management refers to a system’s ability to have


many users all working together on the same website
simultaneously.
A CMS that includes user management must support:
• Adding a new user
• Resetting a user password
• Allowing users to recover their own passwords
• Allowing users to manage their own profiles,
including name, avatars, and email addresses
• Tracking logins
Randy Connolly and Ricardo Hoar Fundamentals of Web Development
CMS Components
User Roles

Users in a CMS are given a user role, which specifies which


rights and privileges that user has.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


User Roles
An important CMS Component

Content Creator
• Create new web pages
• Edit existing web pages
• Save their edits in a draft form
• Upload media assets such as images and
videos

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


User Roles
An important CMS Component

Content Publisher
• Everything a creator can do
• determine if a submitted piece of content
should be published
• they can publish immediately

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


User Roles
An important CMS Component

Site Manager
• Everything a publisher can do
• Menu management
• Management of installed plugins and widgets
• Category and template management
• CMS user account management
• Asset management

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


User Roles
An important CMS Component

Super Administrator
• Everything a manager can do
• Managing the backup strategy for the site
• Creating/deleting CMS site manager accounts
• Keeping the CMS up to date
• Managing plugin and template installation

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


WordPress Roles
An implementation of Roles

In WordPress the default roles are


• Administrator
• Author
• Editor
• Contributor
• Subscriber

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


WordPress Roles
The change in dashboard options with Roles

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


CMS Components
Workflow and Version Control

Workflow refers to the process of approval for


publishing content.
It is best understood by considering the way that
journalists and editors work together at a newspaper.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


CMS Components
Workflow and Version Control

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


CMS Components
Asset Management

Asset management software enables the user to:


• Import new assets
• Edit the metadata associated with assets
• Delete assets
• Browse assets for inclusion in content
• Perform searches or apply filters to find assets

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


CMS Components
Asset Management Interfaces in WordPress

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


CMS Components
Search

Searching has become a core way that users navigate


websites.
There are three strategies to do website search:
• SQL queries using LIKE
• third-party search engines
• search indexes.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


CMS Components
Upgrades and Updates

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Section 4 of 8
WORDPRESS TECHNICAL OVERVIEW

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


WordPress Installation
5 minute install

WordPress proudly boasts that it can be installed in five


minutes! The five-minute installation has only four steps:
1. Download and unzip WordPress.
2. Create a database on your server and a MySQL user
with permissions to that database.
3. Move the unzipped files to the location on your
server you want to host from
4. Run the install script by visiting the URL associated
with that folder in a browser and answering several
questions (about the site generally and connecting
to the database).

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


WordPress Installation
<5 minute install

The file wp-config.php allows you to set all the values


asked about in the interactive installation

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


File Structure
In the end it’s all PHP code

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Multiple Sites on 1 Installation
Advantages for the host (sometimes)

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


WordPress Nomenclature
A visual summary

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


WordPress Nomenclature
Posts and Pages

• Posts are designed to capture a blog post, or a new


update, or something else where you don’t require
a menu item.
• Pages in WordPress are blocks of content, which
are normally associated with menu items.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


WordPress Nomenclature
Templates and Themes

• WordPress templates are the PHP files that control


how content is pulled from the database and
presented to the user.
• WordPress themes are a collection of templates,
images, styles, and other code snippets that
together define the look and feel of your entire site.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


WordPress Nomenclature
Widgets

WordPress widgets allow dynamic content to be arranged in sidebars by


nontechnical users through the dashboard. Examples include:
• Calendar displays a clickable calendar with links if any posts occurred
this month.
• Categories displays lists of links to all existing categories.
• Links is a widget that allows users to manage internal or external links.
• Pages displays links to all pages.
• Recent Comments displays the most recent comments.
• RSS displays an RSS feed.
• Tag Cloud displays a clickable cloud of the top 45 words used as tag
keywords.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


WordPress Nomenclature
Plugins

Plugins refer to the third-party add-ons that extend the


functionality of WordPress, many of which you can download
for free.
• Plugins are modularized pieces of PHP code that interact
with the WordPress core to add new features.
• Plugins are managed through the Plugins link on the
dashboard.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


WordPress Nomenclature
Permalinks

Permalinks is the term given to the links generated by


WordPress when rendering the navigation (and other links) for
the site.
Consider an unsightly URL such as the following:
Example.com/?post_type=textbook&p=396
Permalink mappings allow URLs to be rewritten in order to
make them easier for the user to understand.
Example.com/textbook/fundamentals-of-web-development/

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


WordPress Nomenclature
Permalinks – Easy to SEO

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


WordPress Nomenclature
Taxonomies

WordPress supports classification of your posts with metadata


related to
• Authors
• Categories
• Tags
• Link Categories
• Custom Taxonomies

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


WordPress Nomenclature
Taxonomies - Categories

Categories are the most intuitive method of classifying your


posts in WordPress

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


WordPress Nomenclature
Taxonomies – Other classifications

• Tags are almost identical to categories except they are more


open-ended, in that content creators can add them on the
fly, and are not limited to the predefined terms like they are
with categories.

• Link categories are used internally by WordPress by those


who want to categorize external links.
• WordPress lets you define your own types of taxonomy

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


WordPress Template Hierarchy
Which file executes?

The default WordPress installation comes with a


default theme containing many templates to support
the most common types of wireframes you will need.
There are templates to display:
• a single page or post
• the home page
• 404 not found page
• categories of posts
• an archive of posts

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


WordPress Template Hierarchy
Which file executes?

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


WordPress Template Hierarchy
Which file executes?

When a user makes a request, the WordPress CMS


determines which template to use to format and
deliver the content based on the attributes of the
requested page.
If a particular template cannot be found, WordPress
continues going down the hierarchy until it finds one,
ultimately ending with index.php.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Section 5 of 8

MODIFYING THEMES
Randy Connolly and Ricardo Hoar Fundamentals of Web Development
Modifying Themes
Easy in WordPress

The easiest customization you can make to a


WordPress installation is to change the theme through
the dashboard
All the files you need to edit themes are found in the
folder /wp-content/themes/ with a subfolder
containing every theme you have installed.
Each theme contains many files found in the
previously shown hierarchy

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Changing themes
In Dashboard

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Creating a Child Theme
Once you finish you can activate though dashboard

To start a child theme from an existing one, create a


new folder on the server in the theme folder.
In that folder create a style.css file with the comment
from Listing 18.2, which defines the theme name and
the template to use with it.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Creating Theme Files

You may want to change what HTML is output


1. determine which template file you want to
change.
2. Copy the newly particular template file to the child
theme, leaving existing page templates alone

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Creating Theme Files
Tinker with the footer

Many sites want to modify the footer for the site, to


modify the default link to WordPress if nothing else, all
of which is stored in footer.php

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Section 6 of 8
CUSTOMIZING WORPRESS TEMPLATES

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Customizing Templates

Writing your own WordPress template is the easiest


way to integrate your own custom functionality into
WordPress
You’ve already seen how we can tinker with a template
file.
Next you must understand the way WordPress works,
which means learning about its core classes, the
WordPress loop, template tags, and conditional tags

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


The WordPress Loop
The main loop

The WordPress loop is the term given to the portion of


the WordPress framework that pulls content from the
database and displays it, which might include looping
through multiple posts that need to be displayed.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


The WordPress Loop
The main loop

the template taken from the Twenty Twelve theme’s


page .php template that illustrates use of the loop and
common WordPress tags.

It creates a header, loops through all posts, and displays the


content of each one (no title, no author, no date) and then
outputs a sidebar and a footer.
Randy Connolly and Ricardo Hoar Fundamentals of Web Development
The WordPress Loop
The main loop

Because WordPress was written in a functional way to


ensure efficient operation, the loop code can be
somewhat tricky to understand.
We must first understand the core WordPress classes
(written in PHP) that are used in the loop.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Core WordPress Classes
WP_Query

WP_Query takes the URL (or post data) and parses it


to build the appropriate object.
You never have to explicitly create an instance of the
WP_Query object.
When you want WordPress to deviate from the default
query, you can use the method query_posts() to
change it and replace it entirely for use in the
WordPress loop.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Core WordPress Classes
WP_Query

The valid keys available to be passed to the WP_Query


object and query_posts() are numerous.
As you develop you should be aware that
print_r($query->query_vars);
will output all the query values that are currently
present so you can easily find out if you are setting the
variables properly.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Core WordPress Classes
WP_Query example

To select posts by author with ID 7 in category number


1,2, or 5, except those with tag 17, you would write:
$queryArray= array("author" => 7,
"cat" => array(1,2,5),
"tag_not_in" => array(17));

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Core WordPress Classes
WP_User and the current user

In WordPress you are either serving to a logged-in user


or a nonauthenticated user.
To get access to the currently logged-in user, you call
$current_user = wp_get_current_user();
This $current_user is an instance of the WP_User
class. That class has many properties including ID,
first_name, and last_name.
These functions include the ability to determine what
capabilities a logged-in user has.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Core WordPress Classes
WP_User and the current user

To ask, for example, if the current user is allowed to publish a


post you would write:
$cu = wp_get_current_user();
if ($cu->has_cap('publish_post',123)) {
//the current user is allowed to publish post 123.
}

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Template Tags
For referencing elements within the loop

Template tags are really functions that can be called from


inside the WordPress loop. Categories of tags are:
• General Tags
• Author Tags
• Comment Tags
• Link Tags
• Page Tags

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Template Tags
General Tags

General tags exist to give you access to global or general things


about your site. Some key tags include:
• get_header() includes the header.php file into your page.
• get_footer(), like get_header(), includes footer.php into your
site.
• get_sidebar() works like the methods above, including
sidebar.php

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Template Tags
Author Tags

Since authors are WordPress users, you will be able to access


all the fields that can be associated with an author, including
their email, full name, visible name, and links to their detail
pages on the site.
the_author_meta() can be called with two parameters, the first
being the field you want to retrieve, and the second being the
userID. If no second parameter is passed, the userID for the
author of the current post is used.
Some commonly used fields include: display_name,
user_firstname, user_lastname, user_email, and user_url. Less
commonly used ones include: user_pass, ID, and description.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Template Tags
Comment Tags

WordPress manages comments for you and provides the


following functions to allow you to programmatically access
comments related to the current post.
• comments_template() allows you to import a comment
template into this template much like get_header(). This way
all customization for how comments are displayed can be
managed there.
• get_comments() outputs the list of comments matching a
range of options passed in.
• comment_form() embeds the form to add comments into
the page.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Template Tags
Link Tags

Although pages are just a particular type of post, they are also
associated with a site hierarchy and the menu. So while they
have many essential elements of posts (described later) such as
title, author, and date, they also have:
• get_ancestors() returns an array of the ancestor pages to
the current one. They can be used to build a breadcrumb
structure.
• wp_page_menu() can be used to create submenus of pages.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Template Tags
Page Tags

Link tags are especially important for a website, since links are
the basis for the WWW. Some important ones include:
• the_permalink() contains the permanent URL assigned to
this post. It should be wrapped inside a <A> tag if it is to be
clickable.
• edit_post_link() can be included if you want editors to easily
be able to browse the site and click the link to edit a page.
This is normally used in conjunction with conditional tags
that tell us if the user is currently logged in.
• get_home_url() returns the URL of the site’s home page.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Creating a Page Template
A new Page template

The end goal is that users in WordPress can choose to apply


your new template when editing or creating a page using the
dropdown interface

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Creating a Page Template
A new Page template

The end goal is that users in WordPress can choose to apply


your new template when editing or creating a page using the
dropdown interface

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Creating a Page Template
Get Started

To get started you should create a folder named


page_templates in the child theme to hold your
custom page types.
Create a PHP file (ours will be textbook.php) and add a
comment block to define the template name and a
description as shown

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Creating a Page Template
Post Tags

Both pages and posts have the following data


available:
• the_content() displays the content of the post; it
can optionally display a summary with a “More”
link to all content.
• the_ID() returns the underlying database ID, useful
elsewhere.
• the_title() returns the title of the current post and
optionally prints it out.
• the_date() returns the time and date of the post.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Creating a Page Template
Category Tags

Some template tags available to you, which draw their context


from the current post:
• the_category() will output a list of clickable links to each
category page which this post belongs to.
• category_description() outputs the text description
associated with the category of the post.
• the_tags() outputs clickable links to tag pages for every tag
used in the post.
• wp_tag_cloud() outputs a word cloud using all the tags
present in the site, not the post.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Creating a Page Template
Pagination Tags

Navigation tags in general are useful for building a well-


interconnected website.
previous_post_link()/next_post_link() provide the links to the
previous and next chronological posts if you wanted to have
navigation forward and backward for single posts.
previous_posts_link()/next_posts_link() are pluralized forms of
the above functions and allow you to get links to the previous
or next set of items (say 10 per page).

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Creating a Page Template
Illustration using many tags

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Section 7 of 8
CREATING A CUSTOM POST TYPE

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Custom Post Type
What types are there already?

You can access the type of a post by using get_post_type()


anywhere in the loop.
• post is the default kind of content post, used for blog
entries.
• page is a WordPress page, that is, a page associated with
a menu item hierarchy.
• attachment defines a post that is an image or file
attachment.
• revision versioning is also stored, so you can have posts
that store versioning information
• nav_menu_item is reserved for menu items (which are
still posts).

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Oraganization
What types are there already?

If you were to create a new type called textbook, you


would be able to surf all posts of that type by going to
http://example.com/textbook/.
You could then create a file named single-
textbook.php to handle a single post, and archive-
textbook.php to handle displaying all the textbook
posts.
A new tab will appear
allowing users to easily
add and manage
textbook posts.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Registering your post type
Register with what? Where?

There is a file in WordPress named functions.php,


which allows you to integrate your own post types into
the framework.
To define the mere existence of the post type
textbook, you would create a functions.php file in your
child theme.
Unlike style.css, the functions.php of a child theme
does not override its counterpart from the parent.
Instead, it is loaded in addition to the parent’s
functions.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Registering your post type
Register with what? Where?

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Adding post specific fields
Now we’re making sense.

The reason you normally create a specific type of post


is that you can systematically define a new category of
“item” in such a way that users can easily enter them.
In our textbook example, you might want to say that
all textbook posts require details such as publisher,
date of publishing, and authors.
To add those fields to the form, you must use the
add_meta_box() function

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Adding post specific fields
Now we’re making sense.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Adding post specific fields
Now we’re making sense.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Under the Hood
Where do our posts go?

Two tables are used in


creating custom posts.
The first is the wp_posts
table where things like the
post date, author, title,
status, and type are
located.
Related directly to that is
a wp_postmeta table,
which is where our
custom fields are stored

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Under the Hood
Where do our posts go?

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Displaying our post type
Where do our posts go?

You will be need to define at least two templates.


• single-textbook.php and displays a single textbook,
and
• archive of all the posts matching the type served
from the file archive-textbook.php.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Displaying our post type
Display that data we just stored

You will be need to define at least two templates.


• single-textbook.php and displays a single textbook,
and
• archive of all the posts matching the type served
from the file archive-textbook.php.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Single Post Template
Display that data we just stored

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Archive Page Template
A List of posts

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Tweaking result sets
Changing Pages Per Archive Page

One of the customizations you may want to make is to


change how many posts are shown in an archive page.
To accomplish that you have to add a filter to
functions.php so that for our textbook post type the
value is say 20 books, rather than the default.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Section 8 of 8

WRITING A PLUGIN
Randy Connolly and Ricardo Hoar Fundamentals of Web Development
Writing a Plugin
Getting Started

Plugins allow you to write code independent of the


main WordPress framework and then use hooks,
filters, and actions to link to the main code.
Much like themes, WordPress plugins reside in their
own folder /wp-content/plugins/
Like themes, you should begin by creating a folder to
contain all the files for your theme. Name the plugin
folder something unique, which has not yet been used.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Writing a Plugin
Getting Started

Our first act is to create the main file for the plugin,
index.php, inside our folder.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Hooks, Actions and Filters
Getting Started

• Hooks are events that occur during the regular


operation of WordPress.
• Actions are PHP functions executed at specific
times in the WordPress core.
• Filters in WordPress allow you to choose a subset
of data before doing something with it

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Reuse some code from before
Convert Your Page Type Template to a Plugin

Take all the code we added to functions.php in the


child theme and add it to our plugin’s index.php.
Recall this code defined the textbook page, and added
code to properly display textbooks in the admin
interface.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Activate Your Plugin
Finally something super easy.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Output of the Plugin
To finish this plugin, you must move the code from the
templates into the plugin file (index.php).

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Make it a widget
Widget, Plugin, Template, oh my

To the user, widgets are easy-to-manage and


customizable components they can add to the sidebar.
To create a widget that displays a random book, we
therefore only have to define one function for
displaying the content of the widget.

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


Make it a widget
Widget, Plugin, Template, oh my

Randy Connolly and Ricardo Hoar Fundamentals of Web Development


What You’ve Learned
1 2
Managing Content
Management
websites
Systems (CMS)

3 CMS
Components 4 WordPress
Technical
Overview

5 6
Customizing
Modifying WordPress
Themes Templates

7
Creating a
Custom Post
Type
8
7
Writing a Plugin

Randy Connolly and Ricardo Hoar Fundamentals of Web Development

You might also like