Lesson One Creating the Website and the WordPress Process

Transcription

1 Techedutainment Services Creating a Dynamic Website with WordPress Page 1 In the beginning and start up Welcome! I welcome to your WordPress class. This document provides a guideline to the lectures, exercises, and accompanies your book to reinforce your knowledge and provide additional details. The good news is WordPress constantly improves and updates; the bad news information may not be current. We will work through changes and updates and I ll provide information about the latest and greatest version. I have established a web site for our use during our time together I will set-up an Editor account for each client to use; I will accomplish this live in our first class. While I use Network Solutions, BlueHost, and other providers for my website services, I am not endorsing these fine organizations, but I want to be as detail as possible so I will their set-up and other information for illustrative purposes. There are tons of other Domain Name registration and hosting companies. Here are our lessons. Lesson One Creating the Website and the WordPress Process 1. Domain Get your domain name and check availability I use Network Solutions, 2. Host You will need a host provider to contain your content and PHP/MySQL database with WordPress I use BluHost, 3. WordPress Install and configuration. You will need a host that provides WordPress support (there are many) and I chose BluHost that contain PHP and MySQL support and functionality. In class I will sign-on to Network Solutions, BluHost, and WordPress to demonstrate how I set up my website and my client s website. Here are the overall steps for creating a WordPress website from the ground up. 1. Domain Name Registration (Network Solutions) 2. Hosting Web server with login and password (BluHost) 3. Download and setup File Transfer Protocol (FTP) program (FTP Explorer, FileZilla) 4. Install WordPress on your computer through and use the zip files 5. Through your web host (BluHost) set up your MySQL database (Page ) I use cpanel to configure MySQL Database. a. User PHP SQLDB and SQLDB PHP User b. PHP is a program that translates requests from the user to the SQL database and from the SQL database back to the user with the requested information.

2 Techedutainment Services Creating a Dynamic Website with WordPress Page 2 6. Upload WordPress files from your computer to Host using FTP Program (Page 127) 7. Install WordPress script ( 8. Create Configuration file and enter database information and Hosting info at the WordPress screens (Pg ) WordPress will send you an with your admin account login and password. Login into your WordPress site as an administrator and begin your website design, pages, etc. using your website domain and wp info, such as Here are more details and screen shots for creating the WordPress site. 1. Domain Name Your Domain Name registrar and your hosting company can be the same organization; I choose not to have all of my eggs in one basket or in this case have one organization control my website. An important item in using a Doman Name registrar is the Domain Manager as pictured at right. You will need to update this if you are not using the same organization for your Domain name and hosting provider. I am using Network Solutions for my name registration and BlueHost for my hosting company, so I had to update my Domain to point to the correct website hosting provider in order to access my website. The screen shots at right illustrate the steps I took to update my DNS settings to access my website at BlueHost. I received an with this information of updating my information.

3 Techedutainment Services Creating a Dynamic Website with WordPress Page 3 2. Hosting Provider I am using BlueHost for my web hosting. They have the correct MySQL, Apache, and other required tools and functionality for a WordPress site. Your hosting company should provide with the information displayed at right. Keep this information to update your Doman Name information if necessary and for FTP and Web Directory information that you will need later. After creating and account, you will need to build an SQL database (not as frightening as it seems). BlueHost has a MySQL wizard which builds your database for WordPress based on a few items that you enter. The screen shots at right show me naming my data base and creating an Admin user with all privilges.

4 Techedutainment Services Creating a Dynamic Website with WordPress Page 4 Next I had to add the user to the database! Creating the users and admins does not assign them to the database in this case so I had to add a step of adding them to the database. After creating your SQL Database and adding users with all privileges to your account. You are ready to install WordPress onto your computer. 3. WordPress Installation Your WordPress website hosting provider should provide a link similar to the one at right for you to download or you may download WordPress from the wordpress.org website. The WordPress installation screen appears below. After downloading the zip file I extract all files to a folder named WordPress or my website name. Please remember where you are storing your WordPress site and information you will need to navigate to that area later.

5 Techedutainment Services Creating a Dynamic Website with WordPress Page 5 4. File Transfer Protocol (FTP) After you download your WordPress files and folders onto your computer, you will need to upload them to your hosting account to build your website. There are many providers for FTP File Transfer Protocol - to copy files from your computer to a server and vice versa. I use Filezilla, FireFox Fire FTP, and others. Here s a screen shot of my FTP pane showing my WordPress directory on my computer on the left and the server/webhosting site on the right. No matter the provider you will need to know your account information on your web hosting provider and other information. My account management and set-up screens appear below. Your hosting company will provide the Host information (usually an IP Address). You give the Account a name and provider your login information that you use for your hosting company. You will need to know the directories/folders on your computer and the hosting company where your WordPress information resides.

6 Techedutainment Services Creating a Dynamic Website with WordPress Page 6 5. Finally! WordPress Configuration Navigate to your website in this case creechwp.net and the screen below appears. Now, we create a configuration file and as displayed below we will need the SQL database name and user information from our Web Hosting account and SQL database section. Ilove it! After clicking the submit button, you may need to repeat the process as the information must be exact and match everything in your Web Hosting and SQL database. Next, the Sparky Screen! You are ready to run WordPress and set-up your basic site.

7 Techedutainment Services Creating a Dynamic Website with WordPress Page 7 The Welcome screen information is important in provided a name and the Admin (All Powerful User/Web Master) login information. Provide your and decide if you want your website included in search engines. I love success!

8 Techedutainment Services Creating a Dynamic Website with WordPress Page 8 Welcome! Now, we are ready to learn WordPress. First, in class I will use the Users item as Displayed above on my left sidebar of my dashboard to create accounts for each class participants. Due to the size of classes, I may have already assigned you a login and password for using for our lessons and learning WordPress. Lesson 2 The Dashboard, Settings, and Important items to learn and use Dashboard and Navigation Menu/Pane Overview and Demonstration. Modules in Dashboard Click module title to toggle from expand to collapse and vice versa Overview each module and the settings/configure information. Right Now Recent Comments Incoming Links Plugins QuickPress Recent Drafts

9 Techedutainment Services Creating a Dynamic Website with WordPress Page 9 Arranging the Dashboard and Settings: Click and drag a title bar of the module using the four headed arrow for PC or hand for the Mac a rectangle illustrates where you are moving the module. Screen Options for hiding or showing modules (Upper right hand corner button next to help). Very Important as this effects not only your options for the dashboard screen but options for your pages as well, such as viewing and allowing comments. Navigation Menu (Pane) Collapse/Expand button arrow at bottom of pane/menu Review each item for Settings: General Membership and user roles (Pg 77) o Contributor o Author o Editor o Administrator Date and Time Settings with Custom Formats (PG 132) Writing Reading Discussion Comment Approvals, Notification, and Administration, Blacklist and Links of more than 2 Gravatar and Avatars Demonstrate my account a. greg@gregcreech.com and Password Media I keep the defaults you may change when you upload a file or media content. Privacy Permalinks (Dash Widget Manager) Profile Settings Under Howdy, Greg Important! , Static website and bio Next overview and demonstrate each Navigation Pane item that is discussed in detail of the course: Posts Add, View Set Categories, and Tags (Page 148) Media Add a photos, files, video or music to the site Links Pages Viewing, editing, and adding pages Comments View my comments and lists

10 Techedutainment Services Creating a Dynamic Website with WordPress Page 10 Appearance Open my Themes, Widgets, Menus, Theme Options, Background, Header, and Editor sections to show folks my settings and items we will cover in detail during the course. Plugins Show my plugins Users Add a user in the class as Organization and Logisitics Categories (Page ) Under Posts Categories are topics and act like filing cabinet with folders so users and yourself can get to information/posts quickly and easily based on a topic or area. A post can be assigned to more than one category. Subcategories are assigned to Parent categories, for example I have Books and Materials under my Training main category.. Using a slug creates a web page based on a category which is a very nice feature of WordPress. As you set up your WordPress, use many categories to help with filtering, storing, and retrieving your information. For most small business and personal sites, I do not recommend using comments without your review and approval. Having comments without review and approval is fine for huge organizations that aren t impacted by a single or few negative comments but can hurt a small business or person with untrue, inaccurate comments. So, I use comments with my approval; however, thankfully, all of my comments are very positive and helpful. Tags Tags are searchable, keywords that do not have a hierarchy, are usually separated by commas, and websites/search engines love tags. Use them early and often to identify your content. (Page 158) I installed and used the convert categories to tags pluging to add tags to my site based on the current categories. BE CAREFUL! I believe after the import the stupid system deletes your categories so in reality if moves your categories into tags. There is a tag to category converter, too, but I m too scared to use it for fear of losing my tags in the conversion. So, I quickly create my categories and tags manually. Links Lists Create links for useful websites that support your website and create categories for the links. The links appear on pages through a widget I have my links on the Main Sidebar with categories. Demonstrate and edit links for pinelakega.com and gregcreech.com in class. Permalinks!

11 Techedutainment Services Creating a Dynamic Website with WordPress Page 11 Permalinks are important because they assign a web page for each post. I like using the Post Name for my permalink such as Permalink format is found under Settings and Permalinks. (Page 166) Lesson 3: Create, edit, and post your Blog/Post Have the class create a blog/post on a page and overview the Visual Text Editor with the Kitchen Sink toolbar (Page 201 and 204) Insert a hyperlink to another website. Set Categories, Tags, and Publish the post and add a featured image. Review the items for publishing and Status, reviewing, Save draft, Keep on top of front page (Sticky post), and Public/Private (Page 205 ). You may set the date and time to publish the post, too. These are set with the Edit link displayed at right. After creating and setting the post options, publish the post and then edit the post and update and publish again. Have class make comments and then approve, trash, reply, etc the comments. Add an image from the computer and gallery. Show the different options for the images including size, title, description, alternate text, etc. Use the image editor screen to rotate, flip etc. Advice the class that you should use another photo editor to get the photo as you like and then upload the photo to Wordpress. Insert an image into the post and then edit the alignment, etc. The gallery creates as you add images to the post. You may only use Gallery after you have uploaded the images. Show my gallery for a post and library.

12 Techedutainment Services Creating a Dynamic Website with WordPress Page 12 Lesson 4: Menus Using the Default Menu, Creating a custom menu, Adding pages and structure to your navigation menu through tabs and links with cascading menu options for primary and secondary menus, Lesson 5: Themes Default Themes Free Themes Customizing Themes Lesson 6: Widgets/Plugins Widgets are a type of plugin that allows functionality of your website. Here are the overall steps to add an important widget entitled Social Profiles which will allow quick access to your social network, including Facebook, LinkedIn, Twitter, YouTube, and many others. Navigate to Plugins through the Navigation Pane and in the cascading menu click Add New. Next search for the plugin/widget I searched for social profiles, I choose the Social Profiles Widget and from the menu clicked Install Now.

13 Techedutainment Services Creating a Dynamic Website with WordPress Page 13 I confirmed my installation and quickly the widget is available to activate I activate the widget from Activate Plugin link. Next I return to the Dashboard and hover over Appearance and from the cascading menu I click my Widget item I drag the Social Profiles widget from my available widgets area to my Primary Sidebar at the top. Next I expand the Social Profiles widget and choose my icons, size, and then for each social network I enter my URLs of social networks. RSS (Really Simple Syndication) (Page ) Add RSS Widget to Sidebar and show my RSS feed from Pinelakega.com and others sites. Ie plainhelps.org and USA Today, etc. Plugins I installed the Mini-Slides plug in using these steps on my gregcreech.biz site and I have added other such as Akismet, social profiles. (Chapter 10 ) Access plugins at and I used to access this plugin. I downloaded a zip file and then activated the zip file through a double click and moved the files to a WordPress minifile folder Next I used my FTP program (FileZilla) to transfer the files to the /public_html/wpcontent/plugins folder, Next I went to my Plugins in the Navigation menu to activate the plugin and then followed the plugin instructions to add it to a post which has not worked correctly YET. I did add the random images plugin-widget which works just great. I have a document entitled random image widget documentation.docx which gives details on how to activate and use the widget. I added this widget to my main sidebar.

14 Techedutainment Services Creating a Dynamic Website with WordPress Page 14 Lesson 7: Multimedia Inserting/embedding Video Linking to YouTube Linking Audio Files Lesson 8: Forms and Calendars I have used Gravity forms, Google forms, and other types of forms with Web sites and WordPress sites. I will use Google forms for ease of use, compatibility, and costs for this course. No matter the platform or provider that you choose for your WordPress site for forms there are common features: Form Design Design the form with questions that are easy to understand and to answer. Form editors allow for text boxes, drop down lists, scales, yes/no, and other field types that make input easy and restrictive for users. You should make many of your questions required (otherwise why ask the question?!). Submit Forms provide a submit button that s the person responsible or the owner of the form the information. With Google this goes to my gmail account. With other form editors, I can specify to whom I want the message sent. For example, using Gravity forms, I want a house watch form sent to my police chief not me nor the mayor. Response- You should include a personable response thanking the person and making them aware of your appreciation and results from completing the form. The response is automatic when the person presses the submit button or they may receive an with your appreciative response. Information Complication The s that you and other receive from forms and associated spreadsheet in Google forms will aid in compiling the information, BUT analyzing the information oh now that will cost you extra and you should attend my data analysis class to understand how to analyze information no matter how you gather your information. The important points are that forms make input easy, communication almost seamless, and provide immediate/quantitative feedback.