How to Build Your WordPress Website

Download How to Build Your WordPress Website

Post on 11-Apr-2017

201 views

Category:

Internet

1 download

Embed Size (px)

TRANSCRIPT

<p>PowerPoint Presentation</p> <p>How to Build Your Wordpress Website</p> <p>In this video, well go through the process of converting an HTML website to a WordPress website using the WordPress Responsive Theme Template.1</p> <p>OverviewWhat is HTML</p> <p>Why use HTML</p> <p>What is WordPress</p> <p>Why use WordPress</p> <p>What is web hosting</p> <p>What web hosting service is best</p> <p>Hypertext Markup Language (HTML) is a page markup language that allows you to design web pages and control every aspect, including content, colors, fonts, graphics, alignment, etc</p> <p>Hypertext Markup Language is useful for those who wish to have tight control over every aspect of their web pages.</p> <p>WordPress is an open-source content management system that can be used to create blogs and websites.</p> <p>WordPress has evolved into a feature-rich web development tool that is easy to use and takes website creation out of the hands of website developers and puts it in the hands of average folks who want to create and maintain their own website.</p> <p>Website hosting is the service that provides space on the Internet for websites. In order to have a website, you have to have web hosting.</p> <p>The best option for web hosting with WordPress is to use a service provider that has a one-click installation for WordPress. I prefer HostGator.com. They provide reliable web hosting, excellent customer support, and a reasonable price and a one-click installation for WordPress that will get you up and running in minutes.2</p> <p>Steps to Build Your WordPress WebsiteDecide what elements will be included in your website.</p> <p>Decide how these elements will be incorporated into your WordPress Theme.</p> <p>Map these elements into the WordPress.</p> <p>Add additional content over time.</p> <p>Get web hosting and install WordPress. I like HostGator.com. </p> <p>You need to decide what you want to take from your old website and bring into your new website. Its like buying a new home. What furniture do you want to take with you to your new home.</p> <p>For each item that you plan to migrate from your old website, you need to figure out where its going to go in your new website. Continuing with the moving analogy above, each item of furniture that youre taking with you has to gosomewhere in your new home. Where you decide to put it is dictated by the layout of your new home and logical placement of the furniture. Same thing for moving elements from your old website to your WordPress website.</p> <p>Now that you know where you want stuff to go, just do it.</p> <p>If there are additional items that you want to add to your website, you can add additional content.</p> <p> 3</p> <p>Content to Build the Website</p> <p>Heres the HTML website that I will be using to demonstrate. Its a simple webite with basic promotional and contact information.4</p> <p>Goal: Convert the HTML Website to WordPress Responsive Theme Website</p> <p>The goal is to add the content displayed on the right to a WordPress Responsive Theme website. </p> <p>A theme is a collection of page templates, widgets, template layouts, menus, etc... that establish a look and feel for the website. </p> <p>5</p> <p>Mapping HTML Website to WordPress Responsive Theme</p> <p>Here we see how the HTML objects will be mapped into the WordPress Responsive Theme Template.6</p> <p>Compare HTML Website withWordPress Theme Website</p> <p>Here we see the original content on the left and the WordPress Responsive Theme website after conversion.7</p> <p>Mapping HTML Website to the Final Converted WordPress Website</p> <p>Again, we see how the objects on the left map to the WordPress Responsive Theme template.8</p> <p>Compare Default WordPress Responsive Theme to Converted Website</p> <p>Here we see the default WordPress Responsive Theme on the left and the result after converting the HTML website.9</p> <p>Default WordPress Responsive Theme: Annotated</p> <p>The WordPress Responsive Theme Template is a cookie cutter that establishes a framework that controls the look and feel of the resulting website. You simply fill in the blanks in order to create your own website. This graphic shows the areas that need to be filled in.10</p> <p>HTML Website Converted to WordPress: Annotated</p> <p>This graphic shows the resulting WordPress Responsive Theme website with annotations showing the elements that were added in order build the website.11</p> <p>Steps to Build the Website</p> <p>Login to Wordpress: Go to http://website/wp-admin to access WordPress Dashboard</p> <p>Add Headline, Subheadline and Content Area</p> <p>Add Call to Action and Featured Content</p> <p>Add a Logo</p> <p>Add additional pages to add additional content</p> <p>Add Plugins to enhance your website</p> <p>Now well discuss the steps.</p> <p>Login to the WordPress dashboard in order to administer the website.</p> <p>Add Headline, Subheadline, and Content Area.</p> <p>Add Call to Action and Featured Content</p> <p>Add a logo (300X100 works well but it can be stretched out).</p> <p>Add addional ages to add content.</p> <p>Add Plugins to enhance the administration of your website. Plugins are additional, optional features that can be added to add functionality such as contact form, visual editor to make provide greater flexibility in adding text to widgets.12</p> <p>Login to Your WordPress Dashboard</p> <p>All work on your WordPress is performed in the WordPress Dashboard. You have to login to your dashboard in order to begin.13</p> <p>WordPress Dashboard - Annotated</p> <p>Here are the menu commands that are available in the WordPress dashboard. The ones that are most useful are annotated.14</p> <p>Add Headline, Subheadline, and Content Area. Go to Appearance =&gt; Theme Options=&gt; Home Page</p> <p>Go to the Appearance=&gt;Theme Options=&gt;Home Page to add Headline, Subheadline, and content area.15</p> <p>Add Call to Action and Featured ContentGo to Appearance=&gt;Theme Options=&gt;Home Page</p> <p>Go to Appearance=&gt;Theme Options=&gt;Home Page to add Call to Action and Featured Content.16</p> <p>Add a LogoGo to Appearance=&gt;Theme Options=&gt;Logo Upload</p> <p>Go to Appearance=&gt;Theme Options=&gt;Logo Upload to add logo. 300X100 is a good size but you can stretch the logo out if you want a wider logo.17</p> <p>Fill in Home Widgets 1, 2, and 3Go to Appearance=&gt;Widgets</p> <p>Go to Appearance=&gt;Widgets in order to add text or content to Widgets 1, 2, and 3.18</p> <p>Add New PagesGo to Pages=&gt;Add New</p> <p>Go to Pages=&gt;Add New in order to add new pages. New pages are useful for adding addiotional content.19</p> <p>WordPress Website</p> <p>Here the final result. Nice and concise.20</p> <p>I hope you found this information to be useful. Please visit my website to download the electronic version of the instructions and find other useful information relating to web hosting and website design using WordPress:</p> <p>http://www.WebsiteHelpingHand.com</p> <p>If you have not yet purchased your web hosting and plan to use HostGator.com, here are a couple of coupon codes that will provide savings when you sign up.</p> <p>EZCOUPON25 will get you 25% off your purchase.EZCOUPON994 will get you $9.94 off your purchase.</p> <p>If you use one of these coupon codes, I will receive a small commission from HostGator. I hope you will consider using one of these coupon codes as this allows me to produce videos to share information. I only recommend services that I use personally and believe will add value to my viewers. </p> <p>Thank you.</p> <p>www.WebsiteHelpingHand.com</p>