WordPress Basics

When you’re viewing the front-facing side of your site (like a random visitor), you’re seeing the frontend. When you’re logged in and editing your site, you’re seeing the backend.

The Dashboard

The Dashboard is usually the first page you see when you log into the WordPress backend. You typically won’t need to do much on the Dashboard itself.

Customizing the Dashboard

  • You can reorder dashboard widgets (the panels on your dashboard menu) by dragging and dropping the widgets’ title bars.
  • You can minimize a dashboard widget by clicking the upper right corner of that widget.
  • You can also hide dashboard widgets entirely by going to the “Screen Options” menu in the upper right of the dashboard menu and unchecking the boxes next to the dashboard widgets you wish to hide.
  • You can also change the number of columns on the Dashboard in “Screen Options”.

Administration Menus

The administration menus are found along the left side of the WordPress backend. These are where you go to edit pages, change settings, etc. You may find it more productive to make some customizations to your administration menus.

Customizing the Administration Menus

  • In the upper right of each administration page, there is a menu labeled “Screen Options.” This allows you to customize elements of that particular administration menu. For example, the Pages and Posts menus display 20 items by default. You can increase the number of visible items so you can see more on the same screen.
  • You can minimize the left side menu by clicking on the “Collapse menu” link at the very bottom. This gives you more screen space to work, which is especially useful on smaller screens. When you mouse over one of the menu icons in the collapsed state, the sub-menus for that menu appear directly to the right. To undo this setting, you can click on the bottom icon again.

Pages and Posts

The Difference Between Pages and Posts

Pages and posts are similar, and they have similar processes for adding, editing, and deleting. In general, if you’re using your website to blog or display news items, you will use Posts for that content. If not, you will probably only use Pages on your website.

Pages:

  • Are typically used in your navigation menu
  • Can be put in a hierarchy (i.e. sub-pages)

Posts:

  • Are essentially specialized pages, used for blog entries, news items, or other purposes
  • Are typically not included in the navigation menu
  • Can be categorized and tagged
  • Are typically used for dated material, like news and updates

Adding Pages and Posts

Go to the Pages > Add New menu (or the Posts > Add New menu to add a post). This will bring up a new, blank page or post. See the Editing Pages and Posts section below.

Deleting Pages and Posts

Go to the Pages > All Pages menu (or the Posts > All Posts menu to delete a post). Here you can delete items individually or in bulk. Hover your mouse over the name of the page/post you want to delete and click the Trash link to delete the page. It will remain in your Trash for 30 days, but you can empty the trash earlier if you like. Click the Trash link at the top of the list, and you can permanently delete items individually or click the Empty Trash button to delete all items in the Trash.

If you need to restore a page, go to the Trash link, hover over the page, and click the Restore link.

To bulk delete pages and posts, check the boxes next to the ones you want to delete, select Move to Trash from the Bulk Actions drop-down menu, and click Apply.

Editing Your Pages and Posts

Go to the Pages > All Pages menu (or the Posts > All Posts menu to edit a post). Click on the name of the page/post to edit it. You can also hover your mouse over the name of the page/post and click the Edit link. You can use the Quick Edit link to change some basic information about the page.

The Page/Post Editor. When you are adding or editing a page, the center section, the Content Editor, should look and feel similar to many email and word processing programs. Important panels in the Page/Post Editor:

  • Title. The text box at the top is where you can add or edit the page title.
  • Permalink. Beneath the title is the Permalink, which is the URL for that page. It is automatically generated from the text you type in the Title. Note: if you write a title and click outside the title box, the permalink will be set. If you change the title after that, you will need to edit the permalink again. We recommend writing human-readable permalinks, i.e. words separated by hyphens (spaces are not permitted in URLs).
  • Content Editor. This is where you control the content of the page.
    • Upload/Insert Buttons. These buttons allow you to upload and insert images, video, audio, PDFs, and other media into your page.
    • Visual and HTML Views. The content editor is present when editing both pages and posts. There are two views – Visual and HTML. We recommend using the Visual view, even if you are familiar with HTML.
    • Editing Buttons. There is a button in the upper right corner of the Visual Editor labeled Show/Hide Kitchen Sink (the label appears when you hover your mouse over the button). Clicking this button will toggle extra editing buttons. We recommend leaving these buttons visible. You can add and remove buttons from the Visual Editor through the TinyMCE Advanced Plugin. The settings for this plugin can be found in the Settings > TinyMCE Advanced menu. (If the menu is not there, you will need to activate the plugin. Go to the Plugins > Plugins menu and click the Activate link next to TinyMCE Advanced.)
    • Inserting Links. See the Links section below for more details.
    • Inserting Images. See the Images section below for more details.
    • Tables. Note: tables are tricky to use and do not always behave as expected. We recommend avoiding the use of tables if you can. If you want multiple columns, please use the Shortcodes Ultimate plugin. If you have the “Kitchen Sink” shown and you do not see any table buttons, you need to enable them. To do this, go to the Settings > TinyMCE Advanced menu, drag the table buttons to the editor, and save the changes. (If the menu is not there, you will need to activate the TinyMCE Advanced plugin.) The first step is to insert a new table by using the Inserts a New Table button. You can specify settings, such as the number of rows and columns. You can add and delete rows and columns later, change the properties of specific table cells and table rows, and merge/unmerge table cells.
    • The Editor Box. This large box is where you can add and edit your content. You can make this panel larger or smaller by clicking and dragging the area with diagonal lines in the lower right corner of the panel.
    • Undo. You can Undo actions by using the Ctrl-Z keyboard shortcut or using the Undo button (it looks like a curved arrow).
    • Line breaks. When you hit the Enter button, you get paragraph spacing by default. This leaves extra space between lines. If you do not want this extra space, hit Shift+Enter for a normal line break
    • Blank lines. To insert a blank line in your page or post, make sure you have the TinyMCE Advanced plugin enabled, and then go to the Settings > TinyMCE Advanced menu. Add the non-breaking space (“NB Space”) button to the toolbar, and click Save Changes. Go back to edit your post/page and use the button to insert the non-breaking space on any lines you want to be blank
    • Copying text from another source (email, Word, other websites, etc). If you need to copy text content from another source, you should use the “Paste as text” button in the WordPress editor and reformat the text manually. If you copy and paste text directly into the WordPress editor, you could end up with a lot of hidden styles that cause the pasted text to not match with your design.
  • Preview, Save Draft, and Publish/Update. In the upper right corner of the window, there is a section called Publish. This is where you can save the page as a draft (visitors to your website will not be able to see it until you publish it), Preview Changes before saving, or Publish/Update it (make it visible to your visitors). You can also make the page Private (only logged in users can see it), Password Protected (visitors will be able to see it in the navigation menu, but cannot view the content without the password), and publish the page at a later date.

Revisions

You can see the revision history of a page or post in the Revisions panel, which can be found below the main content editor. When you click one of the revision links, you will be taken to a new Revisions screen. On that screen, you can compare the current version of the page with the previous revisions. There’s a clickable bar where you can select from previous revisions. The content is in HTML format, but you can get the idea. The changes are color coded for easy reference. When you find the revision that you want, click the “Restore This Revision” button.

Content

Images

Adding Images and Galleries

  1. In your page/post, put the cursor where you want the image to appear.
  2. Click the Add Media button, located in between the page title box and the editing buttons. You will see an overlay panel on your screen.
  3. Look at the options on the left hand side of the overlay.
    1. If you want to upload a single image, select Insert Media (usually the default).
    2. If you want to upload a gallery, select Create Gallery.
  4. Look at the tabs across the top of the overlay.
    1. If the images are not already uploaded, click the Upload Files tab. Click the Select Files button to find and select the image you want to use, or drag the image onto the window. Wait for the images to finish uploading (there will be a progress bar).
    2. If the images are already uploaded, click the Media Library tab. On the left side, select the images you want to use.
  5. On the right side, change any settings if necessary (caption, alignment, where the image links to, what size to use).
  6. Click the button in the lower right (you may need to scroll down to see it).
    1. If you are adding a single image, it will be called Insert Into Post.
    2. If you are adding a gallery, it will be called Create a New Gallery. Once you click the button, you will get another overlay panel.
      1. On the left side, you can change the display order by dragging the image thumbnails around.
      2. On the right side, you can change some other settings, such as the number of columns in the gallery. We recommend you set the Link To drop-down to “Media File.”
      3. After you are finished, click the Insert Gallery button in the lower right (you may need to scroll down to see it).

Editing and Deleting Images and Galleries

In the page/post editor, click on the image or gallery in the page/post editor. Two icons will appear in the upper left of the image/gallery. Click on the pencil icon to edit the image/gallery, or click on the X to delete it from the page/post. You will then see the same options as when you add new images and galleries.

Stock Images

For photos, there are a lot of great license free images out there. I first go to Unsplash and Pixabay, which are small collections of really nice images. If I don’t find what I’m looking for there, I’ll go to resources with bigger collections: Every Stock Photo and Creative Commons.

For icons, here are a few sets to look at: Entypo, Metrize, Font Awesome, IcoMoon, and Glyph Icons.

Background Images

Audio

To embed an audio player, use the [audio] shortcode with the URL of the audio file. The format is:

[audio src="http://example.com/audio.mp3"]

You can also turn on looping, autoplay, and preloading. For more information, see https://codex.wordpress.org/Audio_Shortcode.

Video

To embed a video, you’ll first need to upload it to a video host, such as YouTube. Then you can embed the video by using the [video] shortcode with the URL of the video. The shortcode supports the major video hosts like YouTube, Vimeo, Hulu, and more. The format is:

[video src="http://youtube.com/examplevideo"]

You can also turn on looping, autoplay, preloading, and an image thumbnail. If you wish to customize the video player size, you can set a maximum height and width as parameters, i.e.

[video src="http://youtube.com/examplevideo" height="123" width="456"]

For more information, see https://codex.wordpress.org/Video_Shortcode.

Downloadable Files

You can allow people to download or open a file, such as a PDF or Word document.

  1. In the content editor, make sure the blinking cursor is in the position where you want to insert the file.
  2. Click the Add Media button at the top of the content editor. It is to the right of where it says Upload/Insert.
    • If the file has not been uploaded to your website, upload the file (click the Select Files button and find the file on your computer).
    • If the file has already been uploaded to your website, click the Media Library tab at the top of the pop-up. Find the file and click the appropriate “Show” link next to the file.
    • Note: We do not recommend linking to a file on another website; if that file is moved or renamed, your link will be broken. It’s better to upload a copy to your website and link to that copy.
  3. Change the settings as necessary. You may want to change the Title, which will appear in your page or post as the link text.
  4. Click the “Insert into Post” button.

Links

Text Links. To add a link to another website or a file on your website (such as a PDF or Word document), you must first type the link’s anchor text in the content editor. The anchor text is the text that you want to be clickable. Then select (highlight) that text and click the Insert/Edit Link button in the editor (near the center of the first row of buttons). In the pop-up window that appears, find the Link URL box and type or paste in the URL of the website or file you want to link to.

Image Links. You can also make a displayed image act as a link. To do this, select the image by clicking on it, then click the Insert/Edit Link button in the editor, and follow the previously outlined steps.

Opening Links in New Tabs/Windows. By default, links will open in the same tab/window. This means that the visitor clicking the link will be taken off your website. To set a link to open in a new tab/window, check the box labeled “Open link in a new window/tab.”

Users

If you want to have anyone else edit or configure your site, you should give them their own user accounts. If you’re logged in with different user accounts, pages and posts you’re editing will be temporarily locked so other people don’t accidentally overwrite your changes. You can also give other users different levels of permissions. For example, you might want someone to be able to write new posts and pages, but not be able to change your site configuration or settings.

User Levels

The following is a brief description of the user levels.

  • Subscriber. Can read published pages and posts and submit comments (if comments are enabled).
  • Contributor. All Subscriber capabilities plus the ability to create and edit their own posts (but not publish them). If you have guest bloggers, you may want to add them as Contributors to your website.
  • Author. All Contributor capabilities plus the ability to publish their own posts and upload files.
  • Editor. All Author capabilities plus the ability to manage comments, categories, and sidebar links; edit others’ posts; create/edit pages; read/create/edit private pages.
  • Administrator. All Editor capabilities plus the ability to add/assign/remove users, activate/deactivate plugins, change themes, and change other settings. This is the highest level available to our customers. Your primary user will be given Administrator level access.

For a more detailed explanation of the user levels, see the Roles and Capabilities page in the WordPress Codex.

Adding Users

Go to the menu Users > Add New. Fill in the desired username and email address. Then select the Role (user level). Make sure you understand the user levels described on this page. Do not assign the Administrator level to a user unless you trust that person with your entire website. Click the “Add User” button.

Editing User Profiles

To edit your user profile, go to the menu Users > Your Profile. On the following menu, you can edit your displayed name, password, and other settings. Click the “Update Profile” button at the bottom when you are finished.

To edit other users, go to the menu Users > All Users. Hover your mouse over the username and click the word “Edit” when it appears. You will see a menu similar to your own user profile menu.

To remove a user, go to the menu Users > All Users. Hover your mouse over the username and click the word “Remove” when it appears.