Using WordPress

Performing general tasks with your website

This page will explain how to use your WordPress site by adding content, adding pages, adding images, adding galleries, and other ways to publish your data.

Logging on to your website

This is the first thing that you must do in order to have access to do anything with your website.  While anyone can view the material on your website (unless configured otherwise), to make changes, post, or comment on anything will require a user to log on to the website.

SSL Certifiicates and Warnings

NOTE:  If the device that you are viewing your website from doesn’t have the certificate for my certificate authority installed, it will prompt you with a message that looks like if you proceed very bad things will happen.  This is a safe guard put into place on all browsers when establishing an SSL encrypted connection to another host.  This message will appear for a number of reasons including the name on the certificate does not match the URL in the address bar, The issuing certificate authority is not known or trusted by your device, or even that the certificate is expired.  In this case, the warning is being displayed because your computer doesn’t trust / know the certificate authority that the certificate for your website was issued from.  I have supplied the certificate required to prevent this message in the welcome email.  To install the certificate, please follow the section Installing the Certificate Authority Certificate.

The reason for configuring the website to use SSL is to encrypt the data traveling between the website and your device.  By default the website will use standard HTTP protocol when communicating with your device.  However, if a logon is required, the protocol is changed to HTTPS to provide encryption of the communication and to establish identity of the server.  Once you have installed the certificate I provided, and the warning message no longer appears, it means that the server identity has been verified and that the communication between the server and your device is encrypted.  I value my data and yours as well and I therefore felt that a little extra effort should be taken to ensure the safety of that data.  A third party certificate could have been used, but those certificates usually cost on average about $60.00-$100.00 a year.  Since I have a limited budget, I am using my own certificate authority.

The Logon Page

Once you have cleared up the certificate issues, (by the way it is also OK to accept the risk that you can’t verify the identity of the server you are connecting to, but not recommended), clicking the “Sign In” link on the right side of your website will take you to a page that will present you with a logon.  This logon will provide a couple of methods for authentication; domain authentication (the username and password provided in your “welcome” email), and Facebook authentication.

This is the link used to sign in to the website.
This is the link used to sign in to the website.

Domain Authentication

The primary method of authentication will be domain authentication.  This should be used always.  The Facebook logon was setup more to allow other visitors of the site to have a way to setup an account using Facebook to minimize the amount of work required for someone to comment on a post for example.  I have setup accounts for everyone on my domain that your websites then query to authenticate your logon attempt.  These accounts have been set to “editor” accounts which is the highest level of authorization with the exception of “administrator”.  Since an “administrator” role only provides the access to install updates, and other maintenance tasks beyond what the “editor” account provides, I thought it would be best to set everyone to “editor” and then I will manage the updates and maintenance tasks for you.

The page that is used to sign in to your website.
The page that is used to sign in to your website.

The “Remember Me” check box works and if you want your device to remember you, selecting this option will retain your credentials for the next time you login.  There is a timeout set, which means that after a certain period of inactivity, you will be automatically logged out and asked to sign in again.

Facebook Authentication

Facebook authentication should be reserved for users that are not primary users of your site.  These include really everyone but you.  The default role for a user who authenticates using Facebook is subscriber.  While this provides them access to make comments, it doesn’t give them any other access.  It was the goal of this decision to hopefully improve security slightly.  To authenticate using Facebook simply click the Facebook link and follow the instructions.

This is the link that can be used to authenticate with a Facebook account.  Simply click the Facebook icon and follow the on screen instructions.
This is the link that can be used to authenticate with a Facebook account. Simply click the Facebook icon and follow the on screen instructions.

Now that you have successfully logged on to the website, you should see your menu bar across the top of the page.

The menu bar that appears when you have successfully logged on to the website.
The menu bar that appears when you have successfully logged on to the website.

Now, you can begin creating and modifying your website.

Adding Content

Posting

One of the most basic tasks when working with your website is posting content.

Creating your first post

In order to post anything on your website, you need to log on  The can be accomplished with the following [log on howto]. Once logged on, you will have access to your dashboard. This is your control panel to manage your website. To access the dashboard, you will notice that once you log in, you will see a dark bar across the top of the screen. This bar contains drop down menus that when you hover over them with the mouse will provide menu options one of which is the dashboard.

This is the dark menu bar across the top of page after logging in.  The highlighted menu item will take you to your Dashboard page.
This is the dark menu bar across the top of page after logging in. The highlighted menu item will take you to your Dashboard page.

Once you have clicked “dashboard” in the menu the dashboard page is displayed.

This is the top of your dashboard page.
This is the top of your dashboard page.

On the left side of the page are all the menus that provide access to modify and add to your website.

The menu that provides access to all your website options and features
The menu that provides access to all your website options and features

There is a section that will show statistics about your websites in the middle of the page.  This can be useful to determine how many drafts you have, the number of failed log on attempts since your last logon, how many posts you have published, etc.

This section will provide information and details about your website.
This section will provide information and details about your website.

The dark menu bar across the top is still visible with slightly different menus.

This is the Top Menu Bar when on the dashboard page.
This is the Top Menu Bar when on the dashboard page.

On this dark bar is a “+” sign which is visible on both the main webpage as well as the dashboard page as long as you are logged in. This “+” is a shortcut to creating items for your webpage, a post being one of them.

The menu at the top of the page to add new items to your site.
The menu at the top of the page to add new items to your site.

So as with most things on a computer, you have options. You can use this “quick access” to create a post, or under the dashboard page down the left-hand side there is a “posts” menu that will also have a link to “add a new post”.

Location on the left-side menu to access creating a new post
Location on the left-side menu to access creating a new post

Either option will take you to the same place.

The window that is presented to you will look similar to a word processing program. Obviously not nearly as fancy as Microsoft Word, but it will provide you with a significant amount of functionality.

The tool used to add content to your website in the form of a post.
The tool used to add content to your website in the form of a post.

There are a couple of things that you want to remember to do when you are creating your post.
– First your post needs to have a title

This is where you will provide a title for all your posts.
This is where you will provide a title for all your posts.

– Obviously, you will have the body of the post which is the content of the post.

This is where you supply the message or content of your post.
This is where you supply the message or content of your post.

– You will want to set at least one category for your post

This section allows you to set the category(s) for your post.  At least 1 category is required for every post.
This section allows you to set the category(s) for your post. At least 1 category is required for every post.

– you can set optional tags as well. The more you categorize and tag your content, the easier it will be to find, but only one category is required.

This is the section that will allow you to apply tags to your post.  These are not required.
This is the section that will allow you to apply tags to your post. These are not required.

– Determine if you want to post to Facebook as well. There are 4 check-boxes

Do not select these if you want to send your post to your Facebook wall as well.
Do not select these if you want to send your post to your Facebook wall as well.

– Publishing and / or Previewing your post.  The section below shows the options for publishing your post.  There are several options available.

  • “Save Draft” which will save a copy of your current working copy similar to saving a file in Word.
  • The “Preview” button will show you on a new tab (or new window) what the post will look like if you publish it right now.
  • The “Status” section tells you the status of the post and allows you to modify this status.  It is also important to note, that “Published” doesn’t appear in the menu below, but once a post has been published, it will be the “status” of the post.  You can also revert a published document back to a draft with this menu.
Probably won't be used too much, but you can set the status of the post with this menu.
Probably won’t be used too much, but you can set the status of the post with this menu.
Status will be "Published" when a post has been published, and can be changed back to draft using this menu.
Status will be “Published” when a post has been published, and can be changed back to draft using this menu.

 

  • The “Visibility” section allows you to set who will be able to see the post.  By default all posts are set to “Public” which means anyone can view them, and they will be available for everyone.
Set who you would like to be able to view your post.
Set who you would like to be able to view your post.

Under the “Public” setting, is an option to stick it to the front page.  This will place a copy of this post on the front page and it will always be visible regardless of the number of new posts that have been published.(see screenshot above)  The next option is “Password Protected”, and this option will require you to supply a password for the post.  The title will be visible to visitors but the supplied password will be required for the content of the post to be displayed.

set a password here that must be used to view the post.
set a password here that must be used to view the post.

Finally there is the “Private” option. This option will make the posts only available to authenticated users.

  • The “Publish” section will allow you to set the date and time you want to publish your work.  It will allow you to publish something in the future, i.e. it won’t be displayed until the set date and time, or you can modify the publish date to make it look like the post was published a month ago.
Use this section to set the publish date and time.
Use this section to set the publish date and time.

Adding Pages

Adding pages are very similar to adding posts, but there are some key differences about them.  Pages will be displayed in the menu at the top of the page.  They can also be “nested” which means you can build menus of pages.  An example is shown below.  The “WordPress Help” link is the primary or “parent” page, and the list of links below are other pages that have “WordPress Help” set as the Parent page.

This is what "nested" pages will look like when you create them.
This is what “nested” pages will look like when you create them.

So in the above example, the Frequently Asked Question, Troubleshooting, and Using WordPress links are all “children” of the WordPress Help link which is the “parent”.

Pages also are not posted to your website like a post.  They are pages that can contain content, but will not be included in the rotation like a post would be.  Using categories and / or tags, posts can be placed on specific pages and / or removed from the main page.

Creating Your First Page

When creating a page, you need to do some additional planning.  While a post can be published any time, a page is something that will have higher visibility and can have things associated with it.  The best way to explain a page might be to run through an example of a page.

Page Example

In this scenario, a page called “Family Memories” will be introduced.  It will contain image galleries of your family growing up.  A couple of requests for this page are the following:

  • None of these posts should appear on the main page.
  • Due to the vast number of pictures, several pages will help separate the different topics and / or time periods

In order for this to happen, a “parent” page is setup called “Memories”.  Please see Setup a Page, Step by Step.  Using this page as the parent page, several other pages are setup below this page.  For example, “Apple Picking”, “Christmas”, “Birthdays”, “Vacations”, etc.

Once you have all the pages created and setup, the next step is to create categories that can be leveraged to create a workflow for your site setting options and designing layout dynamically.  Using the WordPress Plugin tools “rules” can be setup to establish a workflow that will prevent any posts categorized with the following categories to be posted to the main page; “Memories”, “Apple Picking”, “Christmas”, “Birthdays”, “Vacations”.  Using those same categories, pages that the posts should appear can also be defined.  This addresses the needs in the bullet list above.

A Step by Step guide to setting up a page

Pages can be created much the same way that posts are created.  You have a couple of options to initiate the “New Page Dialog”, either via the Dashboard on the left side menu

 

This is how a new page is accessed from the left menu bar in the dashboard.
This is how a new page is accessed from the left menu bar in the dashboard.

or by the top menu hovering over “+ New” and selecting “Page”.

 

This is how a new page can be added using the top menu bar.
This is how a new page can be added using the top menu bar.

Once you have navigated to the “New Page” options page, it will look very similar to the “New Post” options page.  You will have to provide the following information:

  • Supply the title of the page
This is the title of the page and what will be displayed in menus
This is the title of the page and what will be displayed in menus
  • Provide the content of the page (if any)
This is the information to be placed on the page.  Unlike posts, this information is static and does not change.
This is the information to be placed on the page. Unlike posts, this information is static and does not change.
  • Set Publishing Options.  Again pay close attention to these options.  If you want to publish something privately, make sure that is set here.  If you want to publish something automatically at a future time, this can be set here as well.
These are the publishing options available when publishing pages on your site.
These are the publishing options available when publishing pages on your site.
  • Set Parent Page (if any)
This allows you to associate pages together to provide a group of pages that can be a menu under the main page.
This allows you to associate pages together to provide a group of pages that can be a menu under the main page.
  • The Page “Template” can also be set here.  You will find that the defaults are generally acceptable, but if an optional template is needed, this is where it would be set.  The Order that page links appear on a menu can be set here as well.  The lower the number the higher the priority.  For example, a page with the order number 2 will be placed in a menu before a page with the order number 7.

As you can see, creating a page is very similar to creating a post, with the only real difference being the use of categories and tags for posts and setting page attributes for pages.

Additional options are also found on this page, but these are the options that need to be set for a successful page creation.  Details on these other options will be provided in detail later.

Adding Media

Adding media has been one of the most challenging things for me to understand.  While it should be straightforward, the built-in media manager is missing some functionality that I feel should be part of any media manager, and using third party plugins can make things confusing.

Adding Images

Adding images to your website can be accomplished in 2 ways.  First using the built-in media manager, and the second option is using the Nextgen Gallery.  I have found that if adding images inline is the goal, the media manager works pretty well.  If you would like to show off an entire group of images, the Nextgen Gallery is preferred.

Media Manager

The media manager has some nice features, but fails to really shine when working with large galleries of images.  To add an image or images using Media manager, the same 2 options exist as for posts and pages.  The “Media” section on the left side menu bar of the dashboard or the “+ New” section of the top menu bar.  A third way to add media is also available.  Inside a new post or new page editor page, there is also a button to add directly here as well.  This button will import the image and “attach” it to the “new” item that is being worked on currently.

This is the menu option from the top menu bar for adding new media.
This is the menu option from the top menu bar for adding new media.
This is the menu that will allow you to add your media from the dashboard.
This is the menu that will allow you to add your media from the dashboard.
This button is found in the posts and pages editor page.
This button is found in the posts and pages editor page.

Once you have clicked one of those links, the method for adding media is really easy.  You can simply drag and drop an object on to the page or by clicking the “select file” button you can browse your computer for the file(s) you would like to add.

An example of the page that you will be presented with when uploading media to your site.
An example of the page that you will be presented with when uploading media to your site.

If you are using the links to add media and not the link to add media directly to a post or page, you will be shown your image(s) and behind each one is the option to edit the image.

This is an example of the list you will see when uploading images.
This is an example of the list you will see when uploading images.

This will present a page the will allow you to modify the information about the image only.

These are the details that can be modified or added when adding media not associated with a page / post.
These are the details that can be modified or added when adding media not associated with a page / post.

The size and alignment cannot be set here.  If you have uploaded the media directly to a post / page, you will be presented with an “edit” window right away that will allow you to set details and information about the media.

This is the editor options for inserting media directly into a post / page.
This is the editor options for inserting media directly into a post / page.

By default the media you just uploaded will be selected, but this page will allow you to make changes to any media file you have attached to the post / page.  For example, a name, description, caption, etc. can be supplied and the size and alignment can also be set by selecting the item you wish to make changes on.

This shows the image is selected.  Multiple items can be inserted to a page / post at the same time with this tool, or simple selection for modification can be leveraged as well.
This shows the image is selected. Multiple items can be inserted to a page / post at the same time with this tool, or simple selection for modification can be leveraged as well.

It is important to note, that you need to “Update” your image or media file to save the changes once you have modified something or the changes will not be retained.  Also, the best use of this method of adding media is if you want to add media inline and you are not adding a large number of items.  If you would like to just display your images as a collection, the Nextgen Gallery is the best way to accomplish this.  The Nextgen Gallery will only handle images where the media manager can manage all the different media types.

Nextgen Gallery

The Nextgen Gallery is a plugin / addon to WordPress that helps manage and display your media in an organized manner.  It has a lot of options that really help make it successful.  You can sort your media by authors, by date, and a number of other criteria.  Roles can be assigned to the different functions to limit users from perform various tasks.  Media files can be tagged, categorized, placed in galleries, placed in albums, etc.

To start using the Gallery before anything else can be done, a gallery must be created that will contain your images.  The can be done by selecting “Add Gallery / Images” link below the “Gallery” link.

This link will produce a page that will allow you to add a gallery if none exist or images to a gallery if a gallery has been already created.
This link will produce a page that will allow you to add a gallery if none exist or images to a gallery if a gallery has been already created.

Of course, like everything else, there is also a “Gallery” menu on the top menu bar that will also allow you to access this page.

This is the menu on the top bar that provides the functions to work with the Gallery.
This is the menu on the top bar that provides the functions to work with the Gallery.

This will provide you with a section with some tabs at the top.  Using the first tab “Add new gallery”, type a name for the gallery and click the “Add gallery” button.

Type a name for your gallery and click "Add gallery" to create a new gallery.
Type a name for your gallery and click “Add gallery” to create a new gallery.

That is all there is to creating a gallery.  The gallery will be empty, but now a new tab will appear that will allow you to add your files to the newly created gallery, or if you have several galleries, the gallery of your choice.

This is the tab that will appear once a gallery has been created that will allow uploads of a single file or multiple files.
This is the tab that will appear once a gallery has been created that will allow uploads of a single file or multiple files.

There are also other tabs at the top of the page that provide other ways of adding media.  The tabs at the top are the following:

  • Upload Images, this is just what it says, it allows uploading of a single or multiple images.
  • Add New Gallery, this also does what it says.  This will provide a way to add additional galleries.
  • Upload a Zip-File, this tab is pretty cool.  It will take a zipped file of images and automatically add those images to the gallery of your choice.
  • Import Image Folder, this tab allows you to select an existing folder of images on the server to import from.  This will probably not be used by most users.

Adding images to a gallery is pretty simple.  It requires that you can drag and drop your images on the webpage or browse to them on your computer.  When you have selected all the images that you would like, the page will look similar to the following image.

An example of what the page will display after selecting the images to be uploaded.
An example of what the page will display after selecting the images to be uploaded.

It is important to remember to select the gallery you would like to upload your images into at this point.  Also, no images have been transferred at this point.  A queue has simple been created for the images that are going to be uploaded.  You can select the gallery you would like to place the images into at the bottom of the list if you haven’t already selected a gallery earlier.

This is an example of the gallery selection tool where the images will be placed when uploaded.
This is an example of the gallery selection tool where the images will be placed when uploaded.

NOTE:  The scale functionality is great to reduce load on the server and time required to transfer files, however, the images look really ugly when reducing to this size, so I recommend avoiding that check box.

Now that the images have been selected and the gallery chosen, clicking the “Upload Images” button will complete the process and upload the files.  If you have a large number of files and / or the files are large in size, this will take some time to complete.

This is the button that will start the upload process.
This is the button that will start the upload process.

During the upload you will see 2 separate “progress” windows appear.

1 for the upload itself

This is the progress bar that will be displayed while the images are being uploaded.
This is the progress bar that will be displayed while the images are being uploaded.

1 for the image thumbnail creation

This is the second progress bar that will be displayed.  It will provide information on the status of the thumbnail creation process.
This is the second progress bar that will be displayed. It will provide information on the status of the thumbnail creation process.

When everything has completed and all images have been successfully loaded to your site, the following message will be displayed on the top of the page to indicate you can safely move on to the next step.

This is the message displayed when all the images have been successfully loaded.
This is the message displayed when all the images have been successfully loaded.

At this point, it is a good idea to edit the gallery.  This will allow you to set titles, captions, etc for all your images.

This is an example of the image information that can be set or changed for each image.
This is an example of the image information that can be set or changed for each image.

Another “gotcha” when setting the information for images in the gallery is the fact there are 2 “Save Changes” buttons.  One of the buttons is for the gallery information and the other button is for the image files themselves.  It is good practice to pay close attention to which one needs to be used.

This is the section that allows modification of the gallery details, not the image file details.  It is above the images on the page and should not be confused with the image(s) section.
This is the section that allows modification of the gallery details, not the image file details. It is above the images on the page and should not be confused with the image(s) section.

The gallery section allows changes to be made to the gallery itself.  Things like Title, Description, Preview Image and Author can all be modified here.  It is a good idea to avoid making changes to the Location option as this can break your gallery if not configured correctly.  Below is the “Save Changes” button for the image files.  It will be located directly above the first image.

The location of the "Save Changes" button for the image file(s).
The location of the “Save Changes” button for the image file(s).

To avoid tedious repetitive actions, a “Bulk Actions” function exists to allow for modification of all files at the same time.  In the above image, notice the “Bulk Actions” drop down menu.  This will provide a listing of all the available changes that can be made in bulk.  Be careful using this feature, it can change a lot of information very quickly.  An example of using the “Bulk Actions” function would be to add tags to all the images.  Tags are really nice ways to organize your files.  You can tag files with anything that describes them.  You can also associate existing tags to your new images, or provide several tags to a single image.  To Add tags to a selection of images, the first things to do is select the images to work with.  There are 2 ways of doing this:

  1. Using the “Select All” check box at the top of the image list shown below

    This is the check box that will allow selection of all the image files
    This is the check box that will allow selection of all the image files
  2. Using the individual check boxes next to the image files
    These are the check box that will allow selection of one image file at a time.
    These are the check box that will allow selection of one image file at a time.

     

Once the selection has been made of the images, the next step is to select the function to be used.  In this case, “Add Tags” is used.  There is a bit of a trick here, once the function has been selected in the drop down menu, the apply button must be clicked for the next dialog window to display

Notice that "Add Tags" has been selected, now clicking apply will initiate the process.
Notice that “Add Tags” has been selected, now clicking apply will initiate the process.

The “Add new tags” dialog window will be displayed allowing entry of as many tags as needed.  Tags only need to be separated by commas.

This is an example of the "Add new tags" window.  Notice that the tags are separated by commas.
This is an example of the “Add new tags” window. Notice that the tags are separated by commas.

Once the tags have been entered, clicking the “OK” button will change, or in this case add the tags to all selected images.  If everything is successful, all the selected images will have the new tags in the tags input box.

 

All the tags have been updated to include the tags input on the bulk add window.
All the tags have been updated to include the tags input on the bulk add window.

NOTE:  Don’t forget to click the “Save Changes” window when you have made all the changes required.  Failure to do so will cause all changes to be lost.  I have noticed that using Google Chrome web browser provides a warning of sorts when forgetting to save changes.  It pops up a dialog that asks if you really want to navigate away from the page.  This is a pretty good indication that the changes have not been saved.  I am sure that other browsers have similar messages, but I work almost exclusively with Google Chrome.

Once images have been successfully added to a gallery, that gallery can be used in pages and / or posts.  The same gallery can also be used in several posts and / or pages.  To add a gallery to a page or a post (the process is the same),  Click the “Add NextGEN Gallery” button in the content toolbar shown below.

This is the NextGEN button that produces the dialog to add a gallery.
This is the NextGEN button that produces the dialog to add a gallery.

Once you have clicked the “Add NextGEN Gallery” button, you are presented with a dialog window that will allow selection of a gallery, album, or single picture.  Since we are working with galleries currently, this example will show adding a gallery to your page / post.  To add a gallery, simply select the gallery from the drop down menu that you would like to add, choose how to display it, and click the “Insert” button.

Clicking the drop down menu, selecting the gallery, and selecting one of the display options is all that is needed to add a gallery to your post / page.
Clicking the drop down menu, selecting the gallery, and selecting one of the display options is all that is needed to add a gallery to your post / page.

When you click “Insert”, nothing very fancy happens at this point.  You are returned to the page / post editor, and a new line is now added to your content section that will look something like the screenshot below.  This is mandatory for displaying your gallery, it is called “short code” and your site will recognize it as short code and run the functions required to display your gallery.  This will only be seen when editing your post / page content.

This is what will be put on your page / post in the content section.  This is all that is required to display a gallery, but must be included in the content section.
This is what will be put on your page / post in the content section. This is all that is required to display a gallery, but must be included in the content section.

If you would like to make your images downloadable, adding “template=download” to the end of this code will add this functionality.

Adding "template=download" to the short code will allow the gallery to be downloaded.
Adding “template=download” to the short code will allow the gallery to be downloaded.

Now once the page / post has been published or if you preview the page / post, you will see your gallery of images.  There are many other options that can be configured to provide additional ways to display your images.  These options are covered in another section.

Adding Audio

[coming soon]

Adding Video

[coming soon]

Adding Slideshows

[coming soon]

Adding documents

[coming soon]