Get under the hood of WordPress - WP 101 for editors

WordPress 101 for Editors

WordPress 101 for Editors

The basics of WordPress from an editor's point of view.

WordPress started as a modest blogging platform and evolved over the years to what it is today: a flexible and powerful Content Management System (CMS), which can be customized and extended to create from simple blogs to intricate E-Commerce shops.

In this article I'll go over the basics of WordPress from an editor’s point of view.

Writing Content

WordPress as two main types of content: posts and pages. In order to create a well organized site it’s important to understand the differences and akins between them. These display distinct kinds of content.

Posts

These are dynamic, appear in reverse chronological order and frequently are used for content like: blog, articles and news. The kind of content that is continuously updated and organized by publish date and time. It is important to organize your posts properly by adding them to a Category and adding Tags. It will help people to search and find your content.

You can add and manage Posts, Categories and Tags from the Wordpress backend.

add-post-wp.jpg

Categories and tags can be added directly on Post editing page on the right side panels “Categories” and “Tags”. And also from backend left side bar under Posts section.

categories-tags.jpg

Note: if you do not see these panels when adding/editing a post it means that they have been deselected on screen options, top right button.

screen-options.png

Once you’ve inserted your post title and content you want to publish or save it as a draft. Use the Publish panel on the right side to do so. Several options are presented to you: Save draft, preview, status, visibility, schedule when to publish, move to trash and publish. All of these functions can be changed later.

publish-panel.png

Beyond this you can select a post Format. This is a theme feature which means that the post will have a presentation according to what is set on theme customization. Formats available go from Standard to Chat.

format.png

Tip: You can click and drag the panels to reorganize your working space.

drag-panels.jpg

Pages

As opposed to Posts, Pages are static and usually contain static content with no real relation to other pages - eg. About page and Contact.

addpage.jpg

These are organized based on a Parent/child relationship. You can write one page and say that it is the child of another existing page. This relationship will display in the menu, the child-page will be subsidiary from the parent.

page-attributes.png

child-of-child.jpg

Children of pages can also have children of their own. This would result on a 3 level menu structure.

By default the main menu item will appear on alphabetical order, to change that you can use the Order option on the Page Attributes window. Although, this is not practical. If you add a new page and want it to display between 3 and 4 you need to change all the other pages order.

The easier and proper way to set the order for you menu is to go into the Edit Menus section. There you can create menus, add pages, external links, links to categories and manage locations according to the WordPress theme you’re using.

menus.jpg

One other major distinction from Pages and Posts is the ability to natively change the template for certain pages to make them look different from other pages. This is done on the Page attributes and the variety of templates will depend on the theme in use. You’ll most certainly feel the need for this when setting up the homepage, has you want users to be able to visually identify it.

Content Editing

Posts and pages rely on a WordPress built-in WYSIWYG editor which allows you to add some basic formatting to paragraphs. Most of them you should be familiar with from other word processors like Microsoft Word. More functions for editing are shown by selecting the advanced toolbar icon at the far right side.

wysiwyg-wordpress-builtin.jpg

Note: Use the Text tab when pasting text from word processors, this will avoid improper processor’s formating being brought into WP. All text formatting should be done within WordPress.

textonly.png

Tip: You can resize the Edit window by dragging the bottom right corner.

drag-corner.jpg

Most of these functions are pretty self explanatory. However there are some you might not be familiar with, like:

moretag.png

Insert more tag: this is a feature that you often see in blogs, in the post list you’ll see an excerpt of the story and underneath a button with “read more”. You place it by putting your cursor where you want this break and click the insert more tag button.

moretag.jpg

fullscreen-button.png

Distraction free writing mode: toggles full screen on and off.

headings.png

Formatting headings: this is important because when search engines go trought your content they look for heading and hierarchies and see that everything that is H1 is more important that H2 and index your content properly.

blockquote.png

Block quote: a portion of text that is supposed to be a long quote separated out from the rest of the text.

link.png

Link: Select a portion of text and click the link button to point it to a desired url. The same process can be used to add//change links on images.

 

link.jpg

add_media.png

Adding media in WordPress is made pretty simple just by selecting the Add media button and uploading the files. If you are adding an image it will be placed where you last had the cursor. In the insert media window, where you select the uploaded images, you have a few available options/fields which should not be left empty for SEO and accessibility reasons. Those are: the image Title and the Alt Text (a description of your image for people that for some reason don’t see your image) fields. The Attachment Display settings allow alignment, link to and select a desired preformatted size options.

images-settings.jpg

When you select an image on your content you’ll see 2 buttons on top left of that image. These are the edit (nice for changing/adjusting the image size, alignment, Alt Text, etc), and the delete image buttons. Also notice that if the image is pointing somewhere the link buttons on the WYSIWYG editor will be active.

edit-delete-image.png

Tip: If you’ve added a caption to your image you’ll not be able to move the image within your content/text.

All your uploads will be available in the media library for further use and management. Make sure you upload optimized images for the web and that suit your theme, otherwise you might end up messing the layout of the pages. Furthermore, do not upload images that are not relevant to the content, if no correlation simple do not add images.

media-library.jpg

Lastly, I would like to make a remark on the comments management section, this is where you can approve, edit, delete comments on the pages/posts that you leave open for discussion. If you want discussion to occur on your website make sure you have a anti-spam plugin installed, if it is not important at all simply install a disable comments plugin.

As WordPress evolves constantly some parts of this article might get outdated. Meanwhile, hope you find it interesting and useful.

Hélder Mendes

Hélder Mendes

Les flere artikler fra Hélder Mendes.

Head of Frontkoms office in Madeira. Frontend developer and designer.