Welcome to

WordPress

Overview1. What is WordPress?

2. Open Source and General Public License

3. Installing WordPress

4. WordPress Dashboard

5. WordPress Themes

6. WordPress Plugins

7. Design Your Website

1. Planning Your Website

2. General Layout and Design Options

3. Page Builder Concepts

4. Home Page Design

5. Static Page Design

8. Google Search Console

9. Links and Resources

What is WordPress• Open Source website creation software and

Content Management System (CMS)

• First available in 2003

• Over 27 million websites currently online

• 51% of all CMS based websites are built with WordPress

Open Source & General Public License

Open source is a term used to describe computer programs with their source code available for everyone to study.

WordPress is released under the GPL license, which means that WordPress is an open source software that can be used, modified, and extended by anyone.

• Anyone can download and run the software

• Anyone can modify it

• Anyone can redistribute free copies of the software

• Anyone can distribute modified versions of the software.

Installing WordPress

• Options available (automatic or manual)

• Installing it the automatic way via cPanel and Softaculous

• Overview of manual installation from wordpress.org

The WordPress Dashboard• Dashboard Boxes and how to hide them

• The admin menu

• Posts, Pages, and Media

• Themes

• Plugins

• Settings

Themes

• Free themes vs Paid themes

• Themes with Page Builders

• The Divi Theme and Page Builder

• Download from https://www.sawebservices.co.za/resources/

Plugins

• What are plugins?

• Where to find plugins

• Free vs Paid

• Free plugins that make life easier

• Disable Comments

• Classic Editor

• WP Super Cache

• Duplicate Post

Design Your Website

Planning Your Website

• Content is King – Start with content structure

• Deciding what pages you will need. – Home, About, Contact

• Will you have dynamic content such as a blog, news, promotions, etc?

• How much content do you have, ie copy (text) and images?

• Deciding on your menu structure.

General Layout and Design Options• Website width – Full Width or Boxed

• Logo placement options

• Website colour palette

• Menu options

• Primary navigation position

• Secondary navigation

• Fixed navigation

• Typography (Fonts)

• Using Google Fonts

• Heading fonts

• Body fonts

• Footer options

Page Builder Concepts• Front End Visual Builder

• Switching to the Layout Editing View

• Page Layout

• Sections

• Full width, Regular, and Specialty

• Rows & Columns

• Inserting modules

• Editing module content and designs

• Editing page settings

Home Page Design• Above and below the fold sections

• Designing for desktop and mobile

• The design grid – How rows and columns work

• Above-the-Fold design

• Full screen

• Including animation (slide show or video)

• Call to action buttons

• Below-the-Fold design

• Multi column layout

• Summarise key aspects of the website content

• Call to action (Get in touch, subscribe, etc)

Static Page Design

• Difference between the Home Page design and the Static Page design

• Decide on a Static Page concept for the rest of the website

• The page header

• Page title

• Header design (background image, colour, font size, dividers)

• Page content layout

• Choosing the best layout for your content

• More on modules

• Useful tips

• Saving layouts to your library

• Creating global layouts

• View your design on Desktop, Table, and Mobile

• Switching design views

Google

• What Google is and what Google is not

• Website Indexing vs Website Ranking

• Submitting you website for Indexing

• Yoast SEO plugin

• Google webmaster tools

Links and Resources

• Official WordPress.org Websitehttps://wordpress.org/

• Official WordPress Documentationhttps://wordpress.org/support/

• Useful WordPress guideshttps://www.wpbeginner.com/

• Google Search Consolehttps://search.google.com/

• Google Fontshttps://fonts.google.com/

• Free Stock Image Librarieshttps://www.pexels.com/https://unsplash.com/https://pixabay.com/

• Free Image Editing Softwarehttp://x.photoscape.org/https://www.nchsoftware.com/photoeditor/ppadfreesetup.exe

• Free Quick Batch Image Resizerhttps://www.bricelam.net/ImageResizer/

• PicPick Screen Capturehttps://picpick.app/en/download/