WordPress Basics
 
 

WordPress is a free open source blogging tool and content management system. You can use WordPress to create a blogging site where you will create and publish blog posts to share with visitors. However, you can also use WordPress to create a traditional website for business or personal use.

As one of the oldest and most popular blogging systems on the web, WordPress has grown into an intuitive and feature-rich option for anyone, regardless of experience, who needs a website or blog. Its ease of use stems from its early days, when WordPress was simply a free blog hosting site.

Users could create a blog almost instantly by simply choosing a template – or theme, then populating it with posts. Plug-ins were available to further customize the blog. These plug-ins could be used to integrate WordPress with Twitter or similar sites, as well as add photo galleries and etc.

This plug-in and template system carried over to WordPress websites. This system made it so that anyone with a desire to create a website can do so fairly quickly and easily. Using WordPress themes, users can create a professional website in just a few minutes. Then, using WordPress' abundant tools and features, add content and customization without writing a line of code (if they don't want).

WordPress is open source, meaning the templates (or themes) you use for your blog or website can be customized to your preferences or needs. You can make changes to the code, such as HTML or CSS, without having to worry about copyright issues. Plus, you have access to plug-ins that allow you to add advanced features to your website, such as social media integration, photo galleries, and forms. All you need to do is install them.

Because of its ease of use and built in content management system, WordPress is not only the most popular blogging system on the Internet today; it's also becoming a popular choice for individuals and businesses who want to create professional websites.

A Brief History of Blogs

A blog, or a web log, is an informal discussion found on the Internet. A blog is made up of posts – or entries – that are usually displayed in chronological order. Most blog posts (or entries) are very similar to articles you may read on news sites and the like. Most blogs allow comments so that people who visit and read the blog can enter the discussion and communicate with the author and other readers.

When blogs first started, they were typically created by individuals or small groups of people. In addition, they were usually focused on one topic. For example, a mother may create a blog to keep out-of-town family updated on her children. Someone into politics, antique cars, or books may have created a blog to talk about the things of interest to them. At that time, blogs were more like journals. Sometimes they even seemed like diaries.

However, that all started to change around 2009. Multi-author blogs started to emerge. These blogs had multiple authors and were sometimes created by media outlets, colleges, and even businesses. They became more than just a way to express opinions or share an interest. They became a way to communicate with the world. The media keeps blogs to inform readers of the latest news stories and interact with its readers. Colleges use blogs to relay important information to students and discuss the latest happenings on their campuses.

Business use blogs as a marketing tool. Blogs give businesses a way to educate their customers and potential customers alike on information related to their specific industry. For example, a company that sold skin care products may provide blog posts about how to have healthy skin. Whereas the company could use their website to advertise their products, they could use the blog to "talk to" their customers; thereby, turning themselves into a resource for valuable information, as well as valuable products.

On the Internet today, we crave interaction. Blogs are a huge part of this interaction. As of February 2014, there were over 156 million blogs. More importantly, 75.8 million were WordPress blogs. It's safe to say that blogs have become an important method of communication used for both personal and professional reasons. They are also now an integral part of most websites.

Blog Sites vs. Websites

As important as it was to discuss the history of blogs, it's even more important to discuss the differences between a blog site and a website.

A blog site and a website are both found on the Internet. They can both have their own domain, such as www.UniversalClass.com, and they can both contain text, images, videos, etc. However, they are two birds of a very different feather.

A blog is typically arranged into columns. The blog posts will be on one column with navigational links in another column.

Take a look at the WordPress blog below.

As you can see, the posts appear in the left column while the navigational links appear on the right.

Blogs also have features that are fairly unique, such as posts that appear in chronological order, archived posts, commenting, and RSS (really simple syndication) feeds for posts, as well as comments.

Look at the snapshot of the WordPress website below. As you can see, it doesn't have columns as a blog does. It also doesn't have posts.

Websites typically have such pages as Home, About, Contact, and etc. They can even have a link to a blog. However, websites do not use the same type of look and feel as blogs. They also are focused more on presenting information organized into pages instead of discussions through posts and comments.

WordPress and Content Management

Whenever you create a blog or a website, you add content to it. Content can be defined as text, video, images, etc. WordPress helps you manage that content by giving you tools to publish, edit, and archive it. That is what makes it a content management system. About WordPress Themes

WordPress themes are simply templates that you will use to create a website. A theme typically contains a color scheme, fonts, and layout. That said, WordPress offers you numerous themes that are free to use. There is a theme directory located on the WordPress site. Using the directory, you can look through the different themes that are offered. If you can't find a free theme that you want, you can purchase a premium theme to use for your website.

Getting Started with WordPress

You can use WordPress to build a website, just as you could use a WYSIWYG or HTML editor. You don't need coding or design expertise to do so. However, the steps you'll need to take to get started creating your website using WordPress differs from other website creators, such as WYSIWYG editors.

With WYSIWYG website editors, you follow these steps:

1. Select a template for your website.

2. Customize the template.

3. Purchase a domain for your website.

4. Purchase a hosting plan for your website.

5. Prepare the files to be uploaded to your website's server.

6. Publish your site by uploading the files via FTP or another method.

With WordPress, you'll follow these steps to get started. 1. Purchase a domain for your website.

2. Purchase a hosting plan for your website.

3. Install WordPress on your website's server.

4. Select a theme.

5. Customize the theme.

6. Publish your site.

Gathering the Right Tools for the Job

Creating a website with WordPress isn't hard to do. This includes simple tasks like getting your website ready and downloading free programs that you might want to use in conjunction with WordPress.

In this section, we're going to learn about:

  • Choosing the right text editor

  • Selecting the best web browser

  • About cross-browser compatibility

  • An introduction to FTP

Let's get started.

Choosing the Right Text Editor

There may be times where you want to write snippets of your own code or modify existing code, especially if you already have experience designing websites.

If you're new to creating a website, believe us when we say that website coding will start to become familiar to you, even if you read a book or take a course on it. All you have to do is pay attention and study it a bit and, before long, you'll not only start to understand the coding, you'll be able to edit code and write small snippets yourself.

That said, in order to write pieces of code, you need a text editor. A text editor is a program that allows you create plain text documents. You don't want to use MS Word for this, although Word is certainly a great program. Word tends to insert formatting, characters, and hidden spaces into documents. These are the things you can't have when writing code. The idea is to be able to save a document as CSS or HTML right from the text editor. You can't do that if hidden spaces, characters, and formatting are added because browsers won't recognize that.

Listed below are the text editors that are recommended for writing or editing HTML, CSS, and PHP. You can choose the one you want to use, then install it on your computer. Of course, it's optional if you want to install a text editor. You don't have to do it to use WordPress, but it will become helpful as you become more and more proficient at creating websites.

Notepad

Notepad is a basic text editor. Unlike Word, it doesn't add formatting or special characters. Best yet, it's most likely already installed on your computer if you're running a Windows OS (operating system). You can create basic CSS and HTML files using Notepad. By default, documents are saved with a .txt extension. This means a basic text document without formatting. However, you can also safe files with an .html, .css, or .php extension. Here's how:

Open Notepad, then create your HTML, CSS, or PHP document.

Go to File>Save As. Choose the location on your computer to save the document, then type a name for the file plus the extension, as shown below.

Click the Save button.

Notepad++

Notepad++ is a text editor that looks a lot like the Notepad we just talked about, but has more advanced features, including code indentation, line numbering, color-coded syntax, etc. This is perfect for someone who already writes some or a lot of their own code, whereas regular Notepad is fine for the beginner.

TextMate

TextMate is a lot like Notepad++, except it's only for Mac (and it's not free). You can get a free trial, however.

The text editor you choose should be based upon your coding abilities and the operating system you are currently using.

Selecting the Best Web Browser

Most of us already have a favorite web browser. We have one set as the default browser on our computers, and we use that browser for all of our Internet surfing, shopping, and etc. Perhaps you prefer the layout of the browser, the tools, that are offered, or simply the look and feel. Maybe you've just used it so long, that it's familiar, and you don't want to switch. That's fine. The choice is up to you.

What we're going to do in this section is cover the top five browsers that are used today, as well as the web design tools that each of these browsers offer you. As we just stated, you are free to use whichever browser you want while using WordPress; however, you should have access to all the browsers to test your website in each.

Internet Explorer

Internet Explorer, or IE, is one of the most popular web browsers simply because it comes as part of the Windows operating system. However, IE has been known for its problems in keeping up with web standards, and this has hurt its reputation.

One problem that web designers face with IE is that there are so many versions. IE keeps releasing versions to become more compliant with open web standards, but users are slow to upgrade to the new versions when they are released. As a result, you have several different versions of IE being used and not all of these may be compatible with all websites – meaning the websites won't display properly, etc.

Web designers typically make sure their websites display properly in the last two or three versions, but doing more than that can be impossible if you don't know exactly what you're doing (and what causes older versions of IE to be incompatible). That said, you can download and use a tool called IETester to test your website for compatibility in older versions of IE.

Google Chrome

Chrome is without a doubt the most popular web browser in existence. It was developed by Google and offers add-ons that you can install on any computer, whether it's Mac, Windows, or Linux. You can also download web developer tools.

Mozilla Firefox

Firefox adheres to open web standards and renders CC better than other browsers. It's actually the preferred choice of most web designers. As with Chrome, it also offers add-ons and tools that make it a web development tool, as well as a web browser.

Opera

Opera can be used on Windows, Mac, and Linux. It's compliant with open web standards. Although it's not as popular as Firefox or Chrome, it's a solid browser as well with add-ons available for web developers.

Safari

Safari is the Mac web browser, but it can also run on Windows. It has built-in web developer tools, such as a developer bar for testing.

About Cross-Browser Compatibility

It goes without saying that you want your website to display correctly in every browser. You want it to look just as you designed it without any bugs or errors that will jumble the layout, design, or content. That is why it's important to test your website (as you create it) in different browsers to detect any problems that may exist.

Problems arise because each browser uses a different layout engine. A layout engine is the code behind the browser that interprets your website's language (code) to decide how to display your site to viewers. As a result, each browser can display CSS differently.

What you have to do when there are issue that arise in different browsers is adjust your CSS so it accommodates the different layout engines available. Sometimes it can be corrected by adjusting the version of CSS that you use. However, this sounds more technical than it needs to be.

For now, we're just going to list the versions of CSS that each browser recognizes.

  • IE – CSS v1, v2, and a little of v3

  • Chrome – CSS v1, v2, and most of v3

  • Firefox – CSS v1, v2, and most of v3

  • Safari – CSS v1, v2, and most of v3

  • Opera – CSS v2, v2, and most of v3

Again, it's important to test your website in every browser. You can do this by hand and use each browser to bring up your website, or you can use online tools to do it, such as Browsershots or BrowserStack.

An Introduction to FTP

When you install WordPress on your computer, you're going to need to use FTP to do that. So far in this section, we've simply introduced you to tools that you might want to use when creating your website. However, FTP is something you're going to need to use. But don't worry, it's not difficult or too technical in nature.

FTP stands for File Transfer Protocol. You use FTP to upload and download files to/from your website, edit files, and change file permissions.

Below are some terms and aspects of FTP that you should become familiar with:

  • Upload. This means to transfer files from your computer to your web server (or your site).

  • Download means to transfer files from your web server (or site) to your computer.

  • View Files. You can view all the files located on your web server.

  • Dates modified. You can see when the files on your server were last modified – or changed.

  • File sizes. You can see the size of each file on your web server.

  • Edit files. You can open and edit files using the FTP client interface.

  • Change permissions. This is referred to as change mode or CHMOD. It allows you to control the read/write/execute permissions for the files stored on your web server.

You'll need an FTP client (or program) downloaded and installed on your computer to use FTP. SmartFTP and FileZilla are two excellent FTP clients you can download. Best yet, they are free.