10 Easy Steps to Add Content to WordPress

Image of a crane and a web page under construction.My last article titled, "7 Steps to Quickly Build Your Website" outlined how to install plugins, create Web pages, and select a layout. By following the instructions of that article, you should have selected your WordPress theme, installed some basic plugins, and created some common website pages. Now we’re ready to move on to the next steps which, involve adding more content and widgets to your website.

This article will provide detailed instructions on how to add more content and user interaction to your website. With the use of various widgets, you can add functionality such as calendars, call-to-action buttons, photo galleries, social media buttons, and many other elements. Let’s start by installing some basic widgets on your Website.

Adding Widgets

1.From your WordPress Dashboard select “Appearance,” then “Widgets”. On the Widgets page you’ll see columns of widgets on the left side of the page and columns of page sections with drop-down arrows on the right. (The sections on the right will differ depending on your current website theme.) Typically, the sections on the right side are labeled Section 1 and Section 2, etc.; Sidebar 1 and Sidebar 2, etc.; and Footer 1 and Footer 2; etc. In this article, we’ll install the following widgets.

  • Call-to-Action Button
  • Social Network Share Buttons
  • Visual Editor

2.On the right side of the Widgets page select a section that will be located close to the footer section of your Web page and click the drop-down arrow on the right to open that dialogue box. On the left side of the page find the “Call-to-Action” widget and drag it into the open dialogue box.

3.Once the widget is inside of the dialogue box, click the drop-down arrow of the Call-to-Action widget to open it. Select the desired settings of the call-to-action button then select “Save.” After saving the settings, click “Done.”

4.Next, locate the “Footer” section on the right side of the Widgets page and click the drop-down arrow to open that dialogue box. Find the “Social Media Buttons” widget on the left side of the page and drag and drop it into the open Footer dialogue box.

5.Once the widget is inside of the dialogue box, click the drop-down arrow of the “Social Media Buttons” widget to open it. Select the desired settings of the social media buttons then select “Save.” After saving the settings, click “Done.”

Adding Text and Images

The previous article provided instructions on how to install the “Page Builder” plugins. The Page Builder plugin and widgets make it simple and easy to add content to the website. Using the following instructions, we’ll add some text and images to your website. This will require selecting the website pages, then adding rows to the pages to accommodate the “Visual Editor” widget.

1.From the WordPress Dashboard, select “Pages,” then select “All Pages.” Scroll to the “About” page area and click edit. There are several tabs at the top of the interface, but we’ll only focus on the “Add Row,” and “Add Widget” tabs for now.

2.Click the “Add Row” tab then select the desired number and size of the row. Click the “Insert” button. Click inside of the row that you added then click “Add Widget.” Select the “Visual Editor” widget then click the “Save Draft” button (When you are ready for the website to go live, you would click the “Publish” button.)

3.To insert content, rollover the right edge of the “Visual Editor” widget and click on “Edit.” Inside the open Visual Editor dialogue box there are two tabs; “Visual” and “Text”.

  • The Visual tab is used to type or copy plain text and add images.
  • The Text tab is used to insert HTML code and short-code that is used to add forms to the web pages.

4.Click on the “Visual” tab and type a few sentences about the website. Use the editing tools to select the font family, color, and size of the text then click the “Done” button. Once you are at the page interface again, click the “Save Draft” button again. The “Text” tab is used in a similar manner, except that instead of typing text into the dialogue box, you would paste code into the dialogue box instead.

5.To add an image to the text, click where you would like to insert the image. Then click the “Insert Image” tab. Then follow the instructions for uploading the image from your computer to the “Media Library” of your website. Once the image is inserted next to the text, click on the image to get options for positioning the image on the page. When you are happy with the image, click the “Done” button. Once you are at the page interface again, click the “Save Draft” button again.

We’ll discuss using the “Text” tab in more detail in my next article where we will learn how to add Google services to the website. Google has a lot of resources that are compatible with the WordPress application. My next article will provide instructions on how to add Google services to your website using plugins and widgets for ExactMetrics (formerly Google Analytics - GADWP), Google Feedburner, and Google Maps.

If you would like to see great video tutorials on Web development, you can visit the Diane Penny Web Design YouTube channel where you’ll find free videos from experts in the Web development field. Also, please subscribe to my YouTube channel to be the first to see some of the best teaching videos in the industry.

Thanks for taking the time to read this article. Please share your comments or questions in the comments section below. Also, visit the blog often for more articles on Web design and development.

Diane Penny is a full-stack Web designer, author, and blogger. For more information on how to set up a professional website and stay up-to-date on current Web trends, use the Sign-up button above to subscribe to the "Tech Realm Newsletter.

Diane Penny is also a member of the Amazon Affiliate Program and receives a commission on sales generated using this "Shop at Amazon!" link. The revenue generated from commissions is used to maintain the Diane Penny Web Design blog so that we can continue to provide free Web development and other resources to our subscribers and guests.


Image Citation:

Web Page 2226631_640. Diegovr7. Pixabay.com. Web. 25 Apr. 2018.


Copyright 2018-2021 - Diane Penny Web Design - All Rights Reserved

7 Ways to Quickly Build Your Website<< >>Great Technology Gifts for Dad

About the author : Diane Penny