WordPress Website Creation Course Notes

Course Overview

• Instructor: Beau, FreeCodeCamp.org
• Focus: Creating and customizing websites using WordPress.
• Target Audience: Beginners
• Goal: By the end of the course, students will know how to set up and customize various types of websites.

Initial Setup

• Domain Name: The address users enter in browsers to access the website (e.g., youtube.com, freecodecamp.org).
• Hosting: Service where website files are stored. Users access these files through a hosting provider.
• WordPress: A content management system (CMS) enabling users to create websites without coding knowledge (HTML, CSS, JavaScript).
  • Popularity: Used by 40% of all websites.
  • Cost: Free to use.

Setting Up Domain and Hosting

• Cost: Domain typically costs $10-$20/year; hosting around $5/month.
• Provider: Hostinger recommended for domain and hosting (offers free domain, SSL, 99% uptime).
  • Promotional links available for better deals.
• Plans:
  • Single Shared Hosting: Best for beginners, includes free domain.
  • Premium Shared Hosting: Higher cost, may not include free domain.

Claiming and Buying Domain

• Claiming Free Domain: Follow the process under premium shared hosting.
• Buying Domain: Similar to claiming, choose a domain name and check availability.
• DNS Settings: If domain purchased from another provider, update name servers to connect to Hostinger.

Installing WordPress

• Auto Installer: Use this feature in Hostinger to install WordPress.
• User Roles: Add users with different permissions for managing the site.
• Permalinks Settings: Update URL structure to include only the post name for better SEO.

Updating Theme and Design

• Themes: Determines the website's look and feel.
  • Ocean WP: Popular, customizable theme suitable for beginners.
• Customization: Change logos, colors, and layouts easily through the theme panel and WordPress customizer.

Installing Plugins

• Plugins: Add features and functionality to the website.
  • Recommended: Ocean Extra and Elementor for enhanced design options and usability.
• Backup Plugin: Install All-in-One WP Migration for backing up the website.

Customizing the Website

• Customization Process: Use WordPress customizer or Elementor for live editing.
• Elements: Add text, images, buttons, videos, and more by dragging elements within Elementor.
• Styles: Change color, typography, and layout settings through the Elementor editor.
  • Global colors can be set for consistency across the site.

Creating and Editing Pages

• Creating Pages: Add new pages easily and structure content using sections and columns.
• Blog Setup: Configure blog settings and create posts using the built-in WordPress editor for consistency.
  • Set homepage to display latest posts if desired.

Contact Page Setup

• Contact Form: Use WPForms to create a contact form for user submissions.
• Email Settings: Ensure email notifications are set up for form submissions.
• Google Maps Integration: Update location settings on the contact page.

Updating Footer and Header

• Footer Customization: Adjust footer menus, remove unnecessary widgets, and add contact information.
• Top Bar Options: Can be customized or removed completely.

Final Steps

• Testing Site: Ensure all links work, and the design is as intended before publishing.
• Cleanup: Remove sample posts and comments before going live.

Conclusion

• You now have the knowledge to create and customize your own WordPress website.