Post Formats

Intro

Post Formats is a theme feature introduced with Version 3.1. A Post Format is a piece of meta information that can be used by a theme to customize its presentation of a post. The Post Formats feature provides a standardized list of formats that are available to all themes that support the feature. Themes are not required to support every format on the list. New formats cannot be introduced by themes or even plugins. The standardization of this list provides both compatibility between numerous themes and an avenue for external blogging tools to access this feature in a consistent fashion.

In short, with a theme that supports Post Formats, a blogger can change how each post looks by choosing a Post Format from a radio-button list.

Using Asides as an example, in the past, a category called Asides was created, and posts were assigned that category, and then displayed differently based on styling rules from post_class() or from in_category('asides'). With Post Formats, the new approach allows a theme to add support for a Post Format (e.g. add_theme_support('post-formats', array('aside'))), and then the post format can be selected in the Publish meta box when saving the post. A function call of get_post_format($post->ID) can be used to determine the format, and post_class() will also create the “format-asides” class, for pure-css styling.

Supported Formats

The following Post Formats are available for users to choose from, if the theme enables support for them.

Note that while the actual post content entry won’t change, the theme can use this user choice to display the post differently based on the format chosen. For example, a theme could leave off the display of the title for a “Status” post. How things are displayed is entirely up to the theme, but here are some general guidelines.

  • aside – Typically styled without a title. Similar to a Facebook note update.
  • gallery – A gallery of images. Post will likely contain a gallery shortcode and will have image attachments.
  • link – A link to another site. Themes may wish to use the first <a href=””> tag in the post content as the external link for that post. An alternative approach could be if the post consists only of a URL, then that will be the URL and the title (post_title) will be the name attached to the anchor for it.
  • image – A single image. The first <img /> tag in the post could be considered the image. Alternatively, if the post consists only of a URL, that will be the image URL and the title of the post (post_title) will be the title attribute for the image.
  • quote – A quotation. Probably will contain a blockquote holding the quote content. Alternatively, the quote may be just the content, with the source/author being the title.
  • status – A short status update, similar to a Twitter status update.
  • video – A single video or video playlist. The first <video /> tag or object/embed in the post content could be considered the video. Alternatively, if the post consists only of a URL, that will be the video URL. May also contain the video as an attachment to the post, if video support is enabled on the blog (like via a plugin).
  • audio – An audio file or playlist. Could be used for Podcasting.
  • chat – A chat transcript, like so:
John: foo
Mary: bar
John: foo 2

Note: When writing or editing a Post, Standard is used to designate that no Post Format is specified. Also if a format is specified that is invalid then standard (no format) will be used.

Function Reference

Main Functions
Other Functions

Adding Theme Support

Themes need to use add_theme_support() in the functions.php file to tell WordPress which post formats to support by passing an array of formats like so:

add_theme_support( 'post-formats', array( 'aside', 'gallery' ) );

Note that you must call this before the init hook gets called! A good hook to use is the after_setup_theme hook.

Adding Post Type Support

Post Types need to use add_post_type_support() in the functions.php file to tell WordPress which post formats to support:

// add post-formats to post_type 'page'
add_action('init', 'my_theme_slug_add_post_formats_to_page', 11);

function my_theme_slug_add_post_formats_to_page(){
    add_post_type_support( 'page', 'post-formats' );
    register_taxonomy_for_object_type( 'post_format', 'page' );
}

Next example registers custom post type ‘my_custom_post_type’, and add Post Formats.

// register custom post type 'my_custom_post_type'
add_action( 'init', 'create_my_post_type' );
function create_my_post_type() {
    register_post_type( 'my_custom_post_type',
      array(
        'labels' => array( 'name' => __( 'Products' ) ),
        'public' => true
    )
  );
}

//add post-formats to post_type 'my_custom_post_type'
add_post_type_support( 'my_custom_post_type', 'post-formats' );

Or in the function register_post_type(), add ‘post-formats’, in ‘supports’ parameter array. Next example is equivalent to above one.

// register custom post type 'my_custom_post_type' with 'supports' parameter
add_action( 'init', 'create_my_post_type' );
function create_my_post_type() {
    register_post_type( 'my_custom_post_type',
      array(
        'labels' => array( 'name' => __( 'Products' ) ),
        'public' => true,
        'supports' => array('title', 'editor', 'post-formats')
    )
  );
}

Using Formats

In the theme, make use of get_post_format() to check the format for a post, and change its presentation accordingly. Note that posts with the default format will return a value of FALSE. Or make use of the has_post_format() conditional tag:

if ( has_post_format( 'video' )) {
  echo 'this is the video format';
}

An alternate way to use formats is through styling rules. Themes should use the post_class() function in the wrapper code that surrounds the post to add dynamic styling classes. Post formats will cause extra classes to be added in this manner, using the “format-foo” name.

For example, one could hide post titles from status format posts by putting this in your theme’s stylesheet:

.format-status .post-title {
display:none;
}

Suggested Styling

Although you can style and design your formats to be displayed any way you see fit, each of the formats lends itself to a certain type of “style”, as dictated by modern usage. It is well to keep in mind the intended usage for each format, as this will lend them towards being easily recognized as a specific type of thing visually by readers.

For example, the aside, link, and status formats will typically be displayed without title or author information. They are simple, short, and minor. The aside could contain perhaps a paragraph or two, while the link would probably be only a sentence with a link to some URL in it. Both the link and aside might have a link to the single post page (using the_permalink()) and would thus allow comments, but the status format very likely would not have such a link.

An image post, on the other hand, would typically just contain a single image, with or without a caption/text to go along with it. An audio/video post would be the same but with audio/video added in. Any of these three could use either plugins or standard Embeds to display their content. Titles and authorship might not be displayed for them either, as the content could be self-explanatory.

The quote format is especially well suited to posting a simple quote from a person with no extra information. If you were to put the quote into the post content alone, and put the quoted person’s name into the title of the post, then you could style the post so as to display the_content() by itself but restyled into a blockquote format, and use the_title() to display the quoted person’s name as the byline.

A chat in particular will probably tend towards a monospaced type display, in many cases. With some styling on the .format-chat, you can make it display the content of the post using a monospaced font, perhaps inside a gray background div or similar, thus distinguishing it visually as a chat session.

Formats in a Child Theme

Child Themes inherit the post formats defined by the parent theme. Calling add_theme_support() for post formats in a child theme must be done at a later priority than that of the parent theme and will override the existing list, not add to it.

add_action( 'after_setup_theme', 'childtheme_formats', 11 );
function childtheme_formats(){
     add_theme_support( 'post-formats', array( 'aside', 'gallery', 'link' ) );
}

Calling remove_theme_support('post-formats') will remove it all together.

Backwards Compatibility

If your plugin or theme needs to be compatible with earlier versions of WordPress, you need to add terms named post-format-$format to the “post_format” taxonomy. For example,

wp_insert_term( 'post-format-aside', 'post_format' );

You must also register the post_format taxonomy with register_taxonomy().

Source File

External Resources

Comments in WordPress

Comments allow your website’s visitors to have a discussion with you and each other. When you activate comments on a Page or post, WordPress inserts several text boxes after your content where users can submit their comments. Once you approve a comment, it appears underneath your content. Whether you want to customize how your receive comments or tweak how your site displays comments, WordPress provides a thorough set of options to build a community from the visitors to your site.

Discussion Settings

Before you enable comments on posts or Page, reviewing the options under Settings > Discussion can help make your life as a moderator easier. Settings > Discussion contains a list of options that change how WordPress processes comments. Experimenting with these settings can help you find a balance between restricting comments to reduce the amount of spam or less-relevant comments you receive and encouraging your users to actively participate on your site.

Notification

  • Attempt to notify any blogs linked to from the article: This option will enable your site to automatically notify the sites you linked to that you have linked to them. They can then choose to tell their users that another site linked to them through a trackback or pingback.
  • Allow link notifications from other blogs (pingbacks and trackbacks.): This is similar to the previous option, only your position is reversed. Instead of allowing your site to notify other sites, you are allowing other sites to notify your site. If you enable this option, pingbacks and trackbacks are managed in a similar way to comments.

Commenter Rules

  • Allow people to post comments on new articles: This will turn comments on for all future articles. The easiest way to prevent comment spam is to not allow any comments. If you don’t need comments, you can disable them by default by unchecking this option.
  • Comment author must fill out name and e-mail: This prevents people from leaving anonymous comments (however, people could still use a fake name and e-mail address).
  • Users must be registered and logged in to comment: This option will only allow registered users of your site to post comments.
  • Automatically close comments on articles older than _____ days: Closing comments on posts that are no longer active is a good way to limit spam comments. This option will allow your site to do this automatically.

Comment Display

  • Enable threaded (nested) comments _____ levels deep: Enabling threaded comments allows your users to reply to one another. A reply to a comment is shown “nested” underneath the original comments. You can limit how many levels (a reply to a reply) of replies your site will allow by changing the number of levels here as well.
  • Break comments into Pages with _____top level comments per Page and the _____ Page displayed by default: This option changes how your comments are displayed. You can set how many comments you see per Page and if oldest or newest comments are displayed first.
  • Comments should be displayed with the _____ comments at the top of each Page: Set if you want newer or older comments at the top of each Page.

Comment Administration

  • Email me whenever … Anyone posts a comment and/or A comment is held for moderation: If you don’t check your site often, this feature can help you stay up to date on your comments.
  • Comment must be manually approved: If you don’t check this option, comments can appear on your site without your permission. This will not only allow an influx of spam comments, but they will appear on your posts and pages immediately after being submitted. Check this box to maintain the maximum amount of control over your site’s comments.
  • Comment author must have a previously approved comment: This option will allow you to cut down on the number of comments you have to approve. Once you approve one comment by an author, their future comments will be automatically approved.

Comment Spam

  • Hold a comment in the queue if it contains _____ links: Spam comments are designed to get users to click on links in order to drive traffic to other sites. As a result, many spam comments contain multiple links. Setting this option to hold all comments that contain 2 or more links will help catch more spam.
  • Comment Moderation and Comment Blacklist: You can experiment with these text boxes to catch spam that contains certain words or is posted from a particular IP address. Comments caught through blacklisting are not deleted, but instead moved to your spam folder.

Avatars

The settings under “Avatars” control the images your site displays next to comments. For an introduction to Gravatars, read the WordPress Lesson about How to Use Gravatars in WordPress.

Comment Spam

Because spam is pervasive on the Web, some of the comments you receive will most likely be spam. However, WordPress developers and administrators have already developed a number of successful strategies to help you prevent spam comments from appearing on your site. In addition to experimenting with different options in Settings > Discussion, you can install a WordPress Plugin like Akismet or make other changes to help you keep spam comments under control.

Enabling Comments on Your Site

Once you have decided on your discussion options, you are ready to enable comments. If you chose not to enable comments on all articles automatically, you can turn on comments for a specific post or Page in several ways.

Turning on Comments for a Single Post or Page

discussion checked.png

After navigating to the editing screen for the post or Page you wish to add comments to, find the “Discussion” box and check “Allow Comments.” (If you do not see the “Discussion” box on the edit Page, click “Screen Options” in the upper right corner of the browser window. Make sure the box next to “Discussion” is checked.) Save your changes by clicking “Publish”, “Save Draft” or “Update.”

Turning on Comments from the Posts or Pages Screen

quick edit link.png

Navigate to the Posts or Pages screen. In the list of Pages or posts, find the one you want and hover your cursor over the title of the post. You will see several links appear underneath the title. Click “Quick Edit” and check “Allow Comments.” Click “Update” to turn comments on for that post.

Turning on Comments for Multiple Posts or Pages

bulk action allow comments.png

From the Posts/Pages screen, check the boxes next to the posts or Pages on which you want to enable comments. Select “Edit” from the “Bulk Edit” Dropdown box and click Apply. Then, select “Allow” next in the Comments dropdown box and finish by clicking “update.”

Managing Incoming Comments

recent comments dashboard.png

Once you start receiving comments on your site, you can check the status of comments quickly by looking at the dashboard, the admin bar, or the left navigation menu. When you log in, the dashboard’s “Activity” box will show you the status of your comments. Hover over a comment to see your moderation options. From “Activity – Comments” you can approve, reply, edit, mark as spam, or trash comments. Alternatively, you can look to see if there is a number next to the comment bubble in the admin bar or “Comments” in the left navigation. This number represents how many pending comments require your attention.

Moderating Comments with the Comment Screen

WordPress makes moderating your users’ comments a simple process. The Comments Screen lays out the basic information about each comment and lets you decide what to do with it.

The Comments screen is divided into three columns: Author, Comment and In Response To. Each of these columns provide you with a different category of information about a particular comment.

comment pending numbered smaller.png

Number Key

  1. Commenter Gravatar
  2. Commenter Name
  3. Commenter Website URL
  4. Commenter Email Address
  5. Commenter IP Address
  6. Time and Date Comment was submitted
  7. Comment Text
  8. Comment Moderation Options. You can approve, spam or trash a comment with one click. Reply, Quick Edit or Edit will open up a new screen for you to write a reply to the comment or edit the comment.
  9. Post Name
  10. Number of Comments on the Post, Link to View Post

Bulk Edit Comments

bulk approve comments.png

Like the posts and Pages screens, the Comments screen supplies a Bulk Action dropdown box. Select the comments you want to edit, and then select Unapprove, Approve, Mark as Spam, or Move to Trash from the dropdown and click “Apply.”

Using Images

ar-media-content-marketing-facebook-google

Working with Images

Adding images in WordPress is very easy. All of your images will be stored and can be managed in the Media Library, but you can take several different paths to get there.

The most common path is adding an image directly to a post or page. This automatically saves the image in the Media Library and displays the image wherever you inserted it.

You can also add images directly to the Media Library through the multi-file loader or the single-file loader. For advanced user, you can upload images directly using an FTP Client.

Adding Images Through Pages/Posts

When writing or editing a post, you can add an image using the Add Media button above the editor box. This opens a window that displays the multi-file uploader. From here you can drag and drop your picture or select it using the file selector.

The images you add here will be automatically added to the Media Library.

Adding Images Directly To The Media Library

If you want to upload an image for a future post, from the dashboard go to Media –> Add New. From here you can bulk upload multiple images before you know which post you want them to go into.

Adding Images By FTP

If you know what an FTP program is, you can upload images directly to the /wp-content/uploads folder.

For more information, see FTP Client.

Miscellaneous

WordPress can resize images and create thumbnails.

Refer to the following for more information:

  • Inserting Images into Posts and Pages
  • Wrapping Text Around Images
  • Styling Images in Posts and Pages
  • Using Image and File Attachments

In Theme Design

header-img.jpg
Theme featuring Image in Header.

You can add images to your WordPress site through the use of template tags, Plugins, and in the stylesheet of your Theme as background images. It is really up to your imagination and web design skills on how you include images in WordPress.

  • WordPress Design and Layout
  • Lists
  • Menus
  • Categories
  • Template Tags
  • Graphics Symbols
  • Header
  • Headings
  • Sidebar

Special Contents Using Images

post-avatar.jpg
Gravatar in comments
  • PhotoBlog or Gallery – Keep a online photo album with plugins, themes and tons of resources.
  • How to Use Gravatars in WordPress – Display avatars in your comment stream.
  • Graphics in Feeds- Display RSS Fed icons.
  • Links and Blogrolls- Icons for your favorite links.
  • Next and Previous Links- Customize your navigation links.
  • Smilies – How to use smilies or emoticons on WordPress

Plugins

plugins

Introduction

Plugins are ways to extend and add to the functionality that already exists in WordPress.

The core of WordPress is designed to be lean and lightweight, to maximize flexibility and minimize code bloat. Plugins then offer custom functions and features so that each user can tailor their site to their specific needs.

For instructions and information on downloading, installing, upgrading, troubleshooting, and managing your WordPress Plugins, see Managing Plugins. If you want to develop your own plugin, there is a comprehensive list of resources in Plugin Resources.

Plugin Repositories

WordPress Plugins are available from several sources. The most popular and official source for WordPress Plugins is the WordPress.org repo.

  • Official WordPress Plugins Repository

Just to note, not all WordPress Plugins make it into the above repository. Search the web for “WordPress Plugin” and the keywords for the type of functionality you are seeking. There is bound to be a solution out there for you.

Default Plugins

The following two plugins are included with WordPress core:

Akismet 
Akismet checks your comments against the Akismet web service to see if they look like spam or not. You can review the spam it catches under “Manage” and it automatically deletes old spam after 15 days.

See all of the features in Akismet here: https://wordpress.org/plugins/akismet/

Hello Dolly 
This is not just a plugin, it symbolizes the hope and enthusiasm of an entire generation summed up in two words sung most famously by Louis Armstrong. Hello, Dolly. This is, by the way, the world’s first official WordPress Plugin. When enabled you will randomly see a lyric from “Hello, Dolly” in the upper right of your Administration Screens on every page.

What is a Theme?

elegance-wordpress-theme

Fundamentally, the WordPress Theme system is a way to “skin” your weblog. Yet, it is more than just a “skin.” Skinning your site implies that only the design is changed. WordPress Themes can provide much more control over the look and presentation of the material on your website.

A WordPress Theme is a collection of files that work together to produce a graphical interface with an underlying unifying design for a weblog. These files are called template files. A Theme modifies the way the site is displayed, without modifying the underlying software. Themes may include customized template files, image files (.jpg, *.gif), style sheets (.css), custom Pages, as well as any necessary code files (*.php). For an introduction to template files, see Stepping Into Templates.
Let’s say you write a lot about cheese and gadgets. Through the use of the WordPress Loop and template files, you can customize your Cheese category posts to look different from your Gadgets category posts. With this powerful control over what different pages and categories look like on your site, you are limited only by your imagination. For information on how to use different Themes for different categories or posts, see The Loop in Action and Category Templates.

Get New Themes

The WordPress Theme Directory is the official site for WordPress Themes which have been checked and inspected, and are free for downloading. The site features the ability to search by type and style, and offers a demonstration of the page view elements of the Theme.

Using Themes

WordPress currently comes with three themes: the default Twenty Fifteen theme, and previous defaults Twenty Fourteen theme and Twenty Thirteen theme. You can switch between Themes using the Appearance admin panel. Themes that you add to the theme directory will appear in the Administration Screen > Appearance > Themes as additional selections.

Adding New Themes

Appearance Panel

There are many Themes available for download that will work with your WordPress installation.

If the Theme that you are installing provides instructions, be sure to read through and follow those instructions for the successful installation of the Theme. It is recommended that Theme developers provide installation instructions for their own Themes, because Themes can provide special optional functionality that may require more steps than the basic installation steps covered here. If your Theme does not work after following any provided instructions, please contact the Theme author for help.

Adding New Themes using the Administration Panels

You can download Themes directly to your blog by using the Add New Themes option in the Appearance sub-menu.

  1. Log in to the WordPress Administration Panels.
  2. Select the Appearance panel, then Themes.
  3. Select Add New.
  4. Either use the Search or Filter options to locate a Theme you would like to use.
  5. Click on the Preview link to preview the Theme or the Install Now link to upload the Theme to your blog,
  6. Or use the Upload link in the top links row to upload a zipped copy of a Theme that you have previously downloaded to your machine.

Adding New Themes by using cPanel

If your host offers the cPanel control panel, and the Theme files are in a .zip or .gz archive follow these instructions. Note: This assumes the Theme you download is a compressed (.zip) file containing a folder under which all the Theme files reside.

  1. Download the Theme .zip file to your local machine.
  2. In cPanel File Manager, navigate to your Themes folder. If your WordPress is installed in the document root folder of your web server you would navigate to “public_html/wp-content/themes” and if you have WordPress installed in a sub-folder called wordpress, you would navigate to “public_html/wordpress/wp-content/themes”.
  3. Once you’ve navigated to the Themes folder in cPanel File Manager, click on Upload file(s) and upload that .zip file you saved in Step 1.
  4. Once the .zip file is uploaded, click on the name of that file in cPanel, then in the panel to the right, click on “Extract File Contents”, and that .zip file will be uncompressed.
  5. Follow the instructions below for selecting the new Theme.

Adding New Themes Manually (FTP)

To add a new Theme to your WordPress installation, follow these basic steps:

  1. Download the Theme archive and extract the files it contains. You may need to preserve the directory structure in the archive when extracting these files. Follow the guidelines provided by your Theme author.
  2. Using an FTP client to access your host web server, create a directory to save your Theme in the wp-content/themes directory provided by WordPress. For example, a Theme named Test should be in wp-content/themes/test. Your Theme may provide this directory as part of the archive.
  3. Upload the Theme files to the new directory on your host server.
  4. Follow the instructions below for selecting the new Theme.

Selecting the Active Theme

To select a Theme for your site:

  1. Log in to the WordPress Administration Panels.
  2. Select the Appearance panel, then Themes.
  3. From the Themes panel, roll over the Theme thumbnail image for the Theme you are interested in to see options for that theme.
  4. You can view more information about any theme by clicking Theme Details.
  5. A live preview of any Theme (using your blog’s content) can be seen by clicking Live Preview.
  6. To activate the Theme click the Activate button.

Your selection will immediately become active.

Note: If the Theme preview is blank, do not activate the new Theme without investigating further. Your site may not be displayed correctly, otherwise.

Creating Themes

If you are interested in creating your own Theme for distribution, or learning more about the architecture of Themes, please review the documentation regarding Theme Development.

If you simply want to customize your current Theme for your own use, consider creating a Child Theme.

Setting Up Your Site

what-should-your-website-look-like.jpg

Before you get to the graphic look of your site, let’s do a little more administration to your site to set it up. Consider making your first plugin installation the Enhanced Admin Bar with Codex Search. It allows you to search both the WordPress Codex and WordPress Support Forum from your WordPress Administration Screens. Click on one of the search results and the page will open in a new window or tab so you can have the article or discussion open while working on WordPress. This will make your transition to WordPress a much gentler one with information right at your fingertips. You can also work from this page by clicking on a link with a Right Click and opening the documents in a new window or tab, so you can read along as you work on your site.

You may also want to install plugins such as Jetpack by WordPress.com to supercharge your website, and don’t forget to activate the Akismet WordPress Plugin that is available with all WordPress sites to help protect it from comment spam.

But now, let’s start with making those categories you wrote down before.

Create Categories

In the Posts > Categories tab, in the Add New Category area, fill in the information about your category. Continue to add your parent categories, going down the list. Hold off on entering subcategories until all the main categories are entered.

NOTE: You can add any new categories at any time, but make a note of the fact that categories can be sorted in WordPress in two ways: by name (alphabetically) or by ID number. As you enter the categories, they are assigned an ID number. It is difficult to change this, so if you don’t want your categories sorted alphabetically, enter them in the order you want to see them presented on the screen.

WordPress Admin Categories

When you have the parent categories entered, enter your subcategories. In the pull down menu for Parent Category, you can select the parent to the subcategory you are adding. When you view your categories in the Manage > Categories Screen, you will see the categories listed like this:

Computer Tips

– Windows
– Linux
– Mac

Internet News
Web Page Design

– Web Standards
– WordPress

– – Plugins
– – Themes

Put Posts into Categories

Let’s put some of your test posts into categories so you can see how this works.

WordPress Admin Posts

From the Posts > Category Screen, click on the tab for All Posts. You should see the test posts you entered here. When you hover your mouse over each post title, under the title, you should see the Edit | Quick Edit | Trash | View links. Click on Edit to edit one of the posts. On the right side of the Edit Post screen you will now see your Categories. Choose one of them by clicking in the box next to it. Then in the Publish module above, click the Update button. Repeat this for your other test posts, putting each one in a different category.

Now view your page by clicking on your site name in the toolbar at the top of your Administration Screen. Do you see the categories listed in the sidebar now? Great. If you are missing a category, that usually means that there are no posts in it. This is the default function of WordPress, so not to worry. When you add a post to the “missing” category, it will appear on your web pages. Click on one of the categories and you will be taken to a page for just that category. You should see the posts that went into that category. This is a generated Category page.

Now, click on the Archives for the month showing. Now you are visiting a generated page of your posts listed in chronological order for this month – well, specifically for today only. Two methods of finding the same information.

Preventing Spam

There is more to think about when it comes to having comments on your site. Unfortunately we live in a world where spam is a fact of life. It is recommended that you begin battling the comment spammers with the helpful article, Introduction to Dealing with Comment Spam.

What Is Next

You’ve now done all the basics for your new WordPress website. You know how to write a post, create a category, and how to view your site’s information by category and archive. You can start the customization process, and when you are done, don’t forget to delete your test posts! Then start writing some wonderful information to share with your new-found public!

Customizing Your WordPress Site

Once you are familiar with how WordPress works, it’s time to get creative and start customizing. The tutorial now splits into different subjects that require no order. From here on you can do whatever you want, adding and subtracting, perfecting and scrambling your site at will. The amount of effort you put into the site is now up to you. You can work with the two WordPress Themes that came with the installation, or seek out another Theme that better meets your needs. Or you can create your own Child Theme. You can totally customize all the links and information, or get serious and completely re-design the entire site to do whatever you want. You have the basics, the rest is up to your imagination.

Finding a WordPress Theme
Look for one that better suits the look you desire on your site.
Customizing the Look
When you are ready to plunge into the code, you can customize the look and layout of your site through CSS and modifying the Themes (or create your own). If your customizing goals are not seriously extensive, a good bet would be to develop your own Child Theme. A minimal Child Theme is a fairly simple project if you have a little coding experience.
Enhance Your Site with Plugins
Plugins add function and sometimes fun to your site. There are hundreds of different plugins for adding custom links like related articles to your sidebar to adding weather reports. Just like Child Themes are an easy way to customize the look of your site, with a bit of coding experience, your own minimal Plugin is an easy way to change how your site works.

WordPress Themes

There are hundreds of WordPress Themes to choose from. All do basically the same thing but graphically present the information in a myriad of ways. Choose a few that look interesting to you, and meet your audience’s needs and your desires, and then test drive them following the test drive instructions above. Click through the whole site, the categories and archives as well as the individual posts to see how the Theme handles each one. The look may be nice on the front page, but if it handles things in a way you don’t like in the single post, then you will have to dig into the code and make changes. Not ready for that, try another theme.

If you run into problems, check out the Codex’s Troubleshooting Themes article.

Customizing The Look

If you are familiar with CSS, HTML, and even PHP and MySQL, consider either customizing the Theme to your own needs, or creating your own Child Theme. This is not for the timid, this is for the informed and experienced. That said, a Child Theme is an easy, safe way to tinker under the hood/bonnet of WordPress. If things go badly with your customizations, simply activate an approved, unmodified theme and your site is up and running and looking perfectly again. If you want to expand your website design and development skills, the Codex can help:

  • WordPress Theme Directory
  • Using Themes
  • Theme Development
  • Child Themes
  • Stepping Into Templates
  • Templates Files
  • Blog Design and Layout
  • CSS Overview, Tips, Techniques, and Resources
  • FAQ – WordPress Layout
  • Stepping Into Template Tags
  • Template Tags
  • CSS Troubleshooting
  • CSS Fixing Browser Bugs

WordPress Plugins

Plugin Screen

WordPress Plugins are also known as add-ons or extensions. They are software scripts that add functions and events to your website. They cover the gamut from up-to-date weather reports to simple organization of your posts and categories. Plugins are designed by volunteer contributors and enthusiasts who like challenges and problem solving. They are usually fairly simple to install through the WordPress Admin Plugin Screen, just follow the instructions provided by the plugin author. Remember, these are free and non-essential. If you have any problems with plugins, contact the plugin author’s website or plugin source first, then search the Internet for help with that specific plugin, and if you haven’t found a solution, then visit the WordPress forums for more help.

  • WordPress Plugin Directory
  • Managing Plugins
  • Plugins

Now What?

slide1

You’ve just completed the 5 Minute Installation of WordPress or one-click install from your web host. Now what?

Let’s take a step-by-step tour through your WordPress site and see how the different functions work and how to make your new site your own. During the first part of this tutorial, please don’t change anything within the program unless it is part of the tutorial. After following these steps, you’ll soon be changing everything.

Log In

View Log In Form

Begin by logging into the “administration area” or the back end of your website. Visit your site’s login page by placing “wp-admin” after your domain name (e.g. http://example.com/wp-admin). You can also place “login” after your domain as of WordPress 3.4. Some themes provide a “login” link or form on the front end as well. Now log into WordPress using your username and password.

Start at the Top

View Site Link

After logging in you are on the main Administration Screen called the Dashboard. This is the brain behind your website, the place where you can let your creativity explode, writing brilliant prose and designing the best and most lovely website possible. This is where the organization of your site begins – and this is just the start.

At the top of the screen is the area called the “toolbar.” Click on the link that is your site name. This will take you to a view of your new WordPress site. Like it? Don’t like it? Doesn’t matter, just look at it. This is where you are going to be spending a lot of time!

Test Drive Your WordPress Site

twentytwelvedefault1.png

Take time to look at the site before you get into the changing of things and figuring out how all of this works; it’s important to see how the WordPress Twenty Seventeen theme is laid out and how it works. Consider this the test drive before you start adding on all the special features.

The layout you are looking at is called a WordPress Theme. It is the appearance of your website, styling the look of the site and the framing of the content. The WordPress Twenty Seventeen theme features a “header” at the top with the title and tagline for your site. Below this is your Menu. Along the side you will see some titles and links. This comprises Widgets. Within the main middle section of the page is the content area. At the bottom of the page is the footer.

Let’s look at the post for a moment. There is a “title,” and below the title is the date the post was written, then the body of the post, and finally some information about the post. This is called the post meta data and contains information about the post such as the category assigned to that post.

Scroll down the page and notice the bar at the end of the page. This is called the “footer.” It says “Proudly powered by WordPress.”

Back to the sidebar, you will see different sections with information. Among these you may find a list of Recent Posts, Recent Comments, Archives, Categories, and links to the Administration Screens, Log Out, and RSS feeds. This is part of the menu or navigation Screen that people will use to move around your site, visiting posts from different categories or time periods.

It’s All in the Details

Take time to notice the smaller details of this web page layout and design. Move your mouse over the title of the article post. Notice how it changes color. This is called a hover. Most Themes feature a distinctive color or underline when you move your mouse over a link. Move your mouse over any of the links in the sidebar. Do they change? Is the change the same? You can change your link hovers to look different in different sections of your page. Also look at the color of the links. How are they colored or underlined to stand out from the rest of the text?

Observe the small design details and where they are placed within the page. In the near future, you may want to change some of these details, such as the color of the title in the white box at the top of the page. If you remember that it is called the header, then you will know to look within the header section of your style sheet (the file that controls the look of your web page), when you want to make changes to it.

Take a Quick Trip Around

For now you only have one post. It is residing within a page that is laid out as your home page or the front page. If you click on the title of the post, it will take you to the specific page for that post. The first page or home page of your site features the most recent posts on your site. Each post title will link to the actual page of the post. Some Theme designers design their single post pages to look different from the home page. By clicking on the title, you are taken to another web page that looks different from the home page.

Again, in the single post, pay attention to the layout and notice what is now different about the design elements. Is the header different? Smaller, larger, or a different color? Is there a sidebar?

Posts are usually stored in Categories and/or Tags so you can keep related topics together. Right now you only have one category, but will soon want more. Click on the single category that appears in the sidebar of the home page. You are now in a page that has been generated to display only the posts within that category. Again, take a look at the layout and see how it may be different from the home page and the single post.

Do the same with the Archives. You may only have one post, but look at how the page is laid out.

All of these changes are created from only a few files called template files and you can learn more about how they work in Stepping Into Templates. For now, however, let’s get on with how the rest of WordPress works.

Test Drive the WordPress Administration Screens

WordPress Admin Dashboard

Now that you have an idea of how your site looks and what the different layout sections are called, it’s time to test drive the WordPress Administration. This is like familiarizing yourself with the backend of your new website. In fact, the first page you see after logging in is called the Dashboard, a collection of information and data about the activities and actions on your WordPress site.

The Dashboard helps to keep you up to date on new and interesting bits of information from the many WordPress resources. In the corner, it also features a list of the most recent activity you’ve accomplished on your site.

On the left side of the screen is the main navigation menu detailing each of the administrative functions you can perform. Move your mouse down the list and the sub-menus will “fly out” for you to move your mouse to and click. Once you choose a “parent” navigation section, it will open up to reveal the options within that section.

The various menu items are as follows:

  • Dashboard
  • Posts
  • Media
  • Links
  • Pages
  • Comments
  • Appearance
  • Plugins
  • Users
  • Tools
  • Settings

The links in the above list will take you to a series of articles that will guide you step-by-step through every aspect of the Admin Screens. You are anxious to get started, so for now, let’s start with the Users Screen.

User Profile Screen

Click on the Users tab. The screen will change and you will see the Screen called All Users that shows a list of all your users; from here you can add or change existing users and authors accounts. In the navigation menu, click on the Your Profile menu choice. This is where you will enter information about you, the author and administrator of the site. Fill in the information and click Update Profile when done.

Now, let’s look at some other powerful features of the WordPress Admin.

Quick Changing the Look

The Appearance Screen

The Appearance, Themes Screen allows you to change the look of your site using different Themes. Themes are presentation styles that completely change the look of your site. Designed by WordPress developers and users, there are hundreds of themes available for you to choose from. In your Appearance Screen, you will see a list of currently installed themes, including the WordPress Twenty Seventeen theme. To quickly change the theme, simply click on the Activate button under one of the themes listed, then click on your site name in the top toolbar to see how it looks. Wow, you have another look and nothing else on the site has changed. It’s that easy.

Go back to the Appearance > Theme Screen and click the Activate button under the WordPress Twenty Seventeen theme to bring the design back to what you had. To see it again, click your site name in the toolbar, and there it is.

Writing and Managing Posts

Add New Post Screen

Back at the Administration Screen, take a look at the Posts Screen. You can use the tabs under the Posts Menu to write and manage your posts. Let’s start by making your first test post in the Add New tab.

If the screen looks a little intimidating, the Codex article on Writing a Post will take you step-by-step through the process of writing a post. Take a moment to read through the article and post your first entry and then return to this article and we’ll take you onto the next step.

If you are in a hurry, then simply fill in the blanks, one by one, in the post beginning with the title and then write a little test message in the post window. This is just for a test, so you can write anything you want. When you are done, click the Publish button that is to the right of the post entry window and it is done. You will then see a blank Write a Post screen and you’re ready to write another post. Go ahead. But do only three to four entries. There’s more exciting work ahead!

Now that you’ve gotten a feel for writing posts, you can view your posts by clicking your site name in the toolbar on top of the screen. Now it’s time to get down to the real work.

Planning Session

If you want to create a good and solid website, you need a good and solid plan. I know it’s hard to do, and I know you want to keep playing with your new website, but it’s time to take a break away from your computer and turn to pen and paper.

On a piece of paper, describe your site. Take five to twenty minutes to come up with a purpose for your site, or better yet, call it your Mission Statement.

Answer the following questions:

  1. What am I going to do with this?
  2. Who is going to read this?
  3. What kinds of information will I be posting?
  4. Why am I doing this?
  5. Who am I doing this for?
  6. How often am I going to be posting and adding information?

Now, compile this information into a paragraph so it looks like this:

This website will be dedicated to X, Y, and Z,

and cover the topics of A, B, and C. The audience will

be __________ ________________ _______. I will be adding

posts every _____________ about ________ _______ ______________.

I am doing this because _____________ _____________ __________________.

Using the Information

From this exercise, we’ve gathered a lot of information. We’ve uncovered information on how you might layout and design your site. If you know your audience is mostly made up of young people under the age of 25, you will probably want a fashionable look ranging from wild colors and crazy graphics to dark foreboding tones. If you are providing factual information about a serious subject, then you will probably want a more conservative look where the information is more important than a lot of pop and flash.

You may already have a design idea in mind, or perhaps you will be copying over from your previous site, but take a moment to use this information to reconsider your design, and to see how what you want will work with the WordPress options.

You have also uncovered the possible categories for your site. The topics and subjects you will be covering are listed in your purpose statement. Let’s say your purpose statement said,

“The website will be dedicated to providing news and information on computers, web pages, and the internet and cover the topics of computer tips, web page design, and internet news.”

Your topics are your categories. Write your categories down below your purpose paragraph and notes about your web page design.

Now, what subcategories might be under these topics? Under Computer Tips, you might want to segregate them by Windows, Linux, and Mac. Or maybe Software and Hardware. You can have sub-sub-categories, but let’s stop with subcategories for right now. Write these down.

Remember the question about why you are doing this? Is it because you have valuable and timely information or knowledge to share, because you want to talk about a subject that interests you, or maybe because you just think it will be fun to do.

Understanding the timeliness of the information you want to present on your site helps you organize the information on your website. Your website is organized by several different methods. If the date of when you posted the information is critical to the success of the page, then having links to your posts referenced by date is important. If the information itself is more important and timeless, then having your posts referenced by category is the best choice.

Have you noticed that you are starting to lay out your website? If you remember our earlier test drive of your new WordPress website, we examined the sidebar menu. This is the area where your past posts are organized. If you take another look, you will see the sidebar is laid out in a list, including Archives by date and Categories by category. It may even feature a calendar.

As you lay out your website on paper, consider whether you want both categories and dates, or just one of them in your sidebar. What information you have and how you want to help the user find the information is critical to your website design.

What Information Do You Want to Share

As you think about what information the user will need to know, you have to consider what information you are willing to share with them. That information may include how to contact you, what the purpose of the site is, who you are, and what your expertise is.

A WordPress feature called Pages makes the process of presenting this information easier. Pages, similar to posts, are most commonly used to present unchanging information such as About Us, Contact Us, Sign Up for Our Mailing List, and other static information. Before creating your individual Pages, you need to think about what information you would like the Page to hold. Write down the possible Page titles and describe the information you want to share on each Page.

Comments

Part of the fun of WordPress is the ability to have viewers leave comments on your site. It creates a dynamic interchange between you and the viewer. Do you want comments on your posts? Comments on posts come in a variety of forms, from pats on the back (Good job! Like the post!) to extensive conversations and commentary about the posts. Or maybe you are seeking comments that add to the information you’ve posted.

Responding to comments and moderating them can also take up a lot of time. If they are critical to your site, then include them and consider how you want them presented. Go back to your test site; the first post created at the time of installation included a sample comment. You can even make a few comments yourself on the posts you created. Take a look at how they are laid out and consider how you might want them to look to fit into the design and layout of your site.

When you have reached your decision about how you want to handle comments, take time to read through the article on comments and WordPress discussion options to help you set those features.

With this basic information, you are ready to return to your computer and start setting up your site.