Phase 2: Introduction to WordPress

1. What is WordPress?

WordPress is a free, open-source content management system (CMS) designed for creating websites and blogs. Initially a blogging platform, WordPress has grown into one of the most popular CMSs, powering over 40% of websites globally. It is based on PHP and MySQL and offers a wide variety of themes, plugins, and customization options.

Key Concepts:

  • WordPress.org: Self-hosted WordPress software (free and open-source).
  • WordPress.com: A hosted version of WordPress (limited customization but easier to use).
  • CMS (Content Management System): A tool that allows you to create and manage website content without coding.
  • Key Features:
    • User-friendly for beginners and developers
    • Extensible with plugins and themes
    • SEO-friendly structure
    • Large, active community providing support
    • Regular updates for security and new features
Key Differences: WordPress.org vs WordPress.com
FeaturesWordPress.org (Self-Hosted – offline)WordPress.com (Hosted – online)
HostingYou need to purchase web hostingHosting is included (managed)
CostFree to use, but domain & hosting costFree (basic) or paid plans available
CustomizationFull control over plugins, themes, codeLimited on free and lower-tier plans
ThemesCan upload/install any themesLimited to available themes (upgrades allow more)
PluginsCan install any pluginsNo plugin support on lower plans, only available in higher plans
MonetizationFull monetization (ads, e-commerce)Restricted unless on higher-tier plans
SEO ControlFull SEO controlLimited SEO control unless you upgrade
MaintenanceYou manage backups, security, updatesManaged for you by WordPress.com

Hands-On Exercise:

  • Compare WordPress.org and WordPress.com by visiting their websites and exploring their features.

2. Setting Up WordPress

Key Concepts:

  • Local Installation: Install WordPress on your computer for testing and development.
  • Live Installation: Install WordPress on a web hosting server to make your website accessible online.

Hands-On Exercise:

  • Install WordPress locally by downloading it
  • Install WordPress on a live server using a hosting provider like Bluehost or SiteGround.

Setting up WordPress locally on your computer using XAMPP

1. Go to WordPress.org
2. Get WordPress
  • Navigate to the Get WordPress section, which provides the option to download the latest WordPress version.
3. Download WordPress 6.6.2
  • On the WordPress download page, click on the download button for WordPress 6.6.2 (the latest stable release at the time).
  • A ZIP file will be downloaded.
4. Download XAMPP
  • Open Google Chrome and visit the official XAMPP website: https://www.apachefriends.org/download.html.
  • Scroll to find the version of XAMPP that supports PHP 8.2.12. Select 8.2.12 (64-bit) for your operating system.
5. Choose Version – 8.2.12 / PHP 8.2.12
  • Select the correct version of XAMPP for your system that runs PHP 8.2.12, which is required for running WordPress 6.6.2.
6. Install XAMPP
  • Once the XAMPP installer is downloaded, open the file and follow these steps:
    • Next > Select all components (Apache, MySQL, PHP, etc.) > Next > Choose installation directory (default is usually fine) > Next > Install.
  • Once installed, launch the XAMPP Control Panel.
  • In the XAMPP Control Panel, click Start for both Apache and MySQL to begin running the local server.
7. Download WinRAR

Once everything is installed (WordPress, XAMPP, WinRAR):

1. Start XAMPP Services
  • Launch the Control Panel: Open the XAMPP Control Panel (you can find it in the directory where you installed XAMPP).
  • Start Apache and MySQL:
    • Click the Start button next to Apache (this starts your local web server).
    • Click the Start button next to MySQL (this starts the local database service).
    • Click the Admin button next to MySQL (this opens the browser window).
  • Both services should turn green, indicating they are running.
2. Access Localhost
  • Open a web browser and type localhost or 127.0.0.1 in the address bar.
  • You will see the XAMPP dashboard, which indicates that your server is running successfully.
3. Setup a Local Website (With WordPress Example)
Extract WordPress Files
  • Use WinRAR to extract the downloaded WordPress 6.6.2 ZIP file.
  • Place the extracted WordPress folder inside the XAMPP > htdocs folder (located in the XAMPP installation directory). Click on the File Explorer Menu Button in XAMPP Control Panel.
  • Place Files in htdocs:
    • Go to the xampp/htdocs folder (located in your XAMPP directory). This is where you place your website files.
    • For example, if you are installing WordPress, extract the WordPress files into a folder (e.g., wordpress) inside the htdocs folder.
Setup WordPress Locally
  • Open your web browser and type localhost/wordpress (or the folder name you gave it) in the URL bar.
  • In your browser, type localhost/your-folder-name (e.g., localhost/wordpress), and you will see your website.
  • Follow the WordPress installation wizard, where you’ll need to set up:
    • Database Name: Create a new database using phpMyAdmin (found at localhost/phpmyadmin).
    • Database Username: Usually root (no password for local installs).
    • Complete the rest of the setup, including the site name, admin credentials, etc.

You’ve now installed WordPress on your local server using XAMPP. You can develop and test your WordPress site locally before pushing it to a live server.

4. Stopping Services
  • To stop your server, go back to the XAMPP Control Panel and click the Stop button next to Apache and MySQL.
  • It’s important to stop services when not in use to free up system resources.
Common XAMPP Features and Usage
  1. Apache: Powers your local web server, allowing you to host web pages.
  2. MySQL: Manages databases locally, perfect for testing applications that require data storage.
  3. phpMyAdmin: Provides a user-friendly interface to manage MySQL databases.
  4. File Management: Place any HTML, PHP, or WordPress project files inside the htdocs folder for them to run on localhost.
  5. Local Development: XAMPP is perfect for developing websites and applications without needing to use a live web server. You can debug and make changes locally before deploying.
XAMPP Advantages
  • Free and open-source.
  • Works on Windows, macOS, and Linux.
  • Supports multiple development environments like PHP, MySQL, and Perl.
  • Great for local testing and development without affecting live websites.
Essential Web Development Stacks
  • LAMP: For Linux-based systems.
  • MAMP: For macOS systems.
  • WAMP: For Windows systems.
  • XAMPP: Cross-platform (Windows, macOS, Linux) solution with more flexibility.
Must-have WordPress plugins
  • Yoast SEO – Optimize your website for search engines with easy content analysis and suggestions.
  • Elementor – Drag-and-drop page builder for designing custom layouts without coding.
  • Akismet Anti-Spam – Automatically filters and blocks spam comments to keep your site clean.
  • WooCommerce – Transform your site into a fully functional online store with e-commerce features.
  • WPForms – Simple and intuitive form builder for creating contact forms, surveys, and more.
  • Jetpack – All-in-one tool for security, performance, backups, and marketing.
  • UpdraftPlus – Backup and restore plugin for automatic backups and easy restoration.
  • Wordfence Security – Protects your site with firewall protection, malware scanning, and login security.
  • WP Super Cache – Boosts site performance by creating static HTML versions of your pages.
  • Smush – Optimizes and compresses images for faster website loading times.

3. Navigating the WordPress Dashboard

WordPress Dashboard Explained

1. Dashboard Home – The main screen when you log in to WordPress, offering an overview of your website’s status.

  • Uses:
    • Quick access to website stats (posts, pages, comments)
    • Shortcuts to create new posts, manage plugins, and change themes
    • At-a-glance updates on recent activities

2. Posts – Section for managing blog posts.

  • Uses:
    • Create, edit, and delete blog posts
    • Organize posts using categories and tags
    • Manage comments and post settings

3. Media – Library for managing all media files (images, videos, documents).

  • Uses:
    • Upload, edit, and organize media filesAdd media to posts and pagesManage file descriptions and SEO metadata

4. Pages – Section for creating and managing static pages like ‘About Us’, ‘Contact’, etc.

  • Uses:
    • Create pages that don’t change frequently
    • Customize page templates
    • Set privacy and publication settings for each page

5. Comments – Manages user comments on blog posts.

  • Uses:
    • Approve, delete, or mark comments as spam
    • Respond to comments
    • Manage comment moderation settings

6. Appearance – Customizes the look and feel of your website.

  • Subsections:
    • Themes: Install, activate, or customize themes.
    • Widgets: Add and manage sidebar widgets like search bars or recent posts.
    • Menus: Create and customize navigation menus.
    • Customizer: Preview and make real-time changes to your site’s appearance

7. Plugins – Manage the functionality of your website by adding or removing plugins.

  • Uses:
    • Install plugins to extend WordPress functionality (SEO, security, e-commerce)
    • Activate or deactivate plugins as needed
    • Update plugins for new features and security fixes

8. Users – Manage who has access to your website and their roles.

  • Roles:
    • Administrator: Full access to all settings.
    • Editor: Can manage content (posts, pages).
    • Author: Can write and publish their own posts.
    • Contributor: Can write but not publish posts.
    • Subscriber: Can only manage their own profile.

9. Tools – Offers a set of additional tools for managing content.

  • Subsections:
    • Import: Import content from other platforms or WordPress installations.
    • Export: Export your content for backup or transfer.
    • Site Health: Check your website’s performance and security issues.

10. Settings – Configure the basic settings of your WordPress site.

  • Subsections:
    • General: Manage site title, tagline, and URL.
    • Writing: Adjust writing and post settings.
    • Reading: Set your homepage and control the number of posts displayed.
    • Discussion: Configure comment settings.
    • Permalinks: Change the URL structure of your posts and pages.

This structure outlines the essential components of WordPress and its dashboard, helping beginners or advanced users understand its functionality and potential alternatives.

Key Concepts:

  • Dashboard: The admin area where you manage your website.
  • Posts vs. Pages: Posts are for blog entries, while pages are for static content (e.g., About, Contact).
  • Themes: Control the design and layout of your website.
  • Plugins: Add functionality to your website (e.g., contact forms, SEO tools).
Metadata
  • Definition: Metadata is information that describes other data, providing details about its characteristics or structure. Example:
    • Image (Data): A photo file
    • Metadata: Information about the image such as:
      • Date taken
      • Size
      • File type
      • Geo-location
Static Pages
  • Definition: Static pages are web pages where the content remains unchanged unless manually updated by a user. Example:
    • About Us, Contact, or Services pages on a website.
    Key Features:
    • Fixed content that doesn’t change frequently
    • Faster to load compared to dynamic pages
    • Ideal for evergreen content
Dynamic Pages
  • Definition: Dynamic pages are pages where the content changes automatically based on user interaction, database inputs, or real-time data. Example:
    • Blog posts, Product pages, or Course listings
    Key Features:
    • Content is pulled from a database and updated regularly
    • User-specific content may be displayed
    • Often built using templates
Upvote & Downvote
  • Definition: A system used on websites (often in forums, social media, and community-driven platforms) to let users express approval (upvote) or disapproval (downvote) of content. Example:
    • Reddit, Stack Overflow
    Key Features:
    • Upvote: Signals that content is valuable or helpful
    • Downvote: Signals that content is unhelpful or irrelevant
    • Helps rank or prioritize content based on user feedback
Custom Post Type
  • Definition: In WordPress, a custom post type is a specific content type that can be added beyond the default post types (like posts and pages). Example:
    • Custom post types could be:
      • Portfolio items
      • Testimonials
      • Products
      • Events
    Key Features:
    • Allows more control over how content is organized and displayed
    • Created via code or plugins (like Custom Post Type UI)
    • Makes WordPress more flexible for non-blog content creation

Hands-On Exercise:

  • Explore the WordPress dashboard and create a new post and page.
  • Install a free theme (e.g., Astra or Neve) and activate it.

4. Creating Your First Website

Basic pages of a website

1. Home Page
  • The main entry point, providing an overview of what the site is about and directing visitors to important sections.
2. About Us Page
  • A page that explains the background, mission, and key people behind the website or business.
3. Contact Us Page
  • A page that provides contact information like email, phone, address, and sometimes a contact form for user inquiries.
4. Services/Products Page
  • Lists the services offered or products sold, often with detailed descriptions, pricing, and features.
5. Gallery/Portfolio Page:
  • A visual showcase of images or projects highlighting the work, products, or creative content of a business or individual.
6. Blog/News Page
  • A section for regular updates, articles, or news related to the industry or business.
7. FAQ (Frequently Asked Questions) Page
  • A page that answers common questions visitors may have about the business, services, or products.
8. Testimonials/Reviews Page
  • A page displaying customer feedback, reviews, or success stories to build trust.
9. Privacy Policy Page
  • Outlines how the website handles user data, cookies, and privacy-related concerns.
10. Terms and Conditions Page
  • Specifies the rules and regulations for using the website and its services.

These pages form the core of a well-rounded website, providing essential information and functionality to visitors.

Key Concepts:

  • Customizing Themes: Use the WordPress Customizer to change colors, fonts, and layouts.
  • Adding Content: Create posts, pages, and menus.
  • Media Library: Upload and manage images, videos, and other files.

Hands-On Exercise:

  • Customize your theme using the WordPress Customizer.
  • Add a few posts and pages to your website.
  • Create a navigation menu and add it to your site.

This is the end of Phase 1 and the beginning of Phase 2. Once you’ve completed these steps, you’ll have a solid understanding of the internet, how websites work, and how to set up and navigate WordPress. Ready to move on to Phase 3: Building Your First WordPress Website?

Related Posts

One comment

Leave a Reply

Your email address will not be published. Required fields are marked *