O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Learn to Create WordPress Themes by Building 5 Projects

Book Description

This book will help you take your first steps in the WordPress theme development process, with 5 different projects centered around creating unique and responsive WordPress themes

About This Book

  • Learn the basics of WordPress theme development in a step by step manner
  • Make your themes more dynamic by integrating components of Bootstrap and JQuery
  • 5 carefully-selected projects to help you get beyond the theory and create highly marketable WordPress themes from scratch

Who This Book Is For

If you are a blogger or a WordPress user who wants to learn how to create attractive, eye-catching WordPress themes, this book is for you. A basic understanding of HTML5, CSS, PHP, and some creativity is all you need to get started with this book.

What You Will Learn

  • Simple and advanced themes ? covers basic syntax and files along with archives and search pages
  • Photo Gallery ? add simple animation and use the W3.CSS framework to design a photo gallery theme
  • Wordstrap ? incorporate Twitter Bootstrap into the theme and use the WP_NavWalker class
  • E-commerce theme ? build an e-commerce theme using the Foundation framework

In Detail

WordPress has emerged as a powerful, easy-to-use tool to design attractive, engaging websites. Themes play a big role in making WordPress as popular as it is today, and having an eye-catching, fully-functional theme could separate your website from the rest!

This book will help you take your first steps in the WordPress theme development process, with 5 different projects centered around creating unique and responsive WordPress themes. Start with creating a simple WordPress theme using HTML5, CSS, and PHP. Then, you will move on to incorporate different APIs, widgets, and tools such as Bootstrap and jQuery to create more dynamic and highly-functional themes. Whether you want to create a photo gallery theme, a highly customizable e-commerce theme, or a theme designed to suit a particular business, this book will teach you everything you need to know.

By the end of this highly interactive book, you will have the required mastery to develop WordPress themes from scratch.

Style and approach

This book takes a projects-based approach, where every project incrementally builds on your programming skills required to create different kinds of WordPress themes. With the difficulty of the projects ranging from basic to complex, this book will help you get beyond the theory and put your understanding of WordPress theme development to practical use.

Table of Contents

  1. Preface
    1. What this book covers
    2. What you need for this book
    3. Who this book is for
    4. Conventions
    5. Reader feedback
    6. Customer support
      1. Downloading the example code
      2. Downloading the color images of this book
      3. Errata
      4. Piracy
      5. Questions
  2. Creating a Simple Theme with WordPress
    1. Installing and setting up WordPress
      1. Creating and enabling themes
        1. Creating an HTML structure
          1. Working with the style sheet
          2. Adding a function in the head tag
        2. Building the HTML body
      2. Base styling
    2. Single posts and thumbnails
      1. Adding an image to the post
    3. Pages and menus
    4. Widget locations and comments
      1. Working with widgets
      2. Adding the comment functionality
    5. Summary
  3. Building a WordPress Theme
    1. Post formats
    2. Creating a design using HTML and CSS
      1. Building the HTML body
      2. Adding CSS
    3. Creating a WordPress theme
    4. Displaying blog post
    5. Creating a single post and adding an image
    6. Creating custom archive pages
    7. Different post formats
    8. Pages, custom templates, and sub navigation
    9. Working with Theme Widgets
    10. Custom home page
    11. Comment Functionality
    12. Summary
  4. Building a WordPress Theme for Photo Gallery
    1. Creating the layout of the home page in HTML and CSS
      1. Creating the HTML layout
      2. Creating the header
      3. Adding the title and search box
        1. Shifting the search box
      4. Adding the sidebar and main area
        1. Adding the sidebar
          1. Changing the color of the background and text of the sidebar
        2. Adding the main area
          1. Adding images to the column
          2. Adding a footer in the main area
    2. Implementing the animation and single.html page
      1. Implementing the Fade In animation
      2. Creating animation on the single page
        1. Adding a single image for animation
    3. Adding the theme header and footer
      1. Creating a theme inside the wpthemes folder
        1. Adding a theme
        2. Activating the theme
        3. Converting static markup to WordPress
        4. Adding the wp_head function
        5. Adding the body_class function
        6. Adding the footer
        7. Splitting the header and footer
      2. Changing the site name
    4. The post loop
      1. Adding the theme support function
        1. Passing the function into action
      2. Working on index.php for the content post
        1. Adding the while loop for the post
        2. Adding an else statement
    5. Displaying the post content
      1. Adding a regular post content
        1. Adding a title to the regular post content
        2. Adding metadata
        3. Checking the thumbnail in content post
      2. Adding a gallery post
        1. Checking the thumbnail in the gallery post
          1. Creating an array of attributes
      3. Adding a new post
        1. Adding proper proportions to the image
    6. Adding the category widget and search option
      1. Adding a function to use the category widget
        1. Specifying the widget locations
        2. Registering the widgets
      2. Styling our category widgets
        1. Adding the widget to the code
        2. Removing the title
        3. Adding the class
        4. Adding a link at the top of the widgets
      3. Changing the top margin of the page
      4. Making the search bar functional
    7. Working on the single post theme
      1. Creating a single HTML page
        1. Making metadata dynamic
        2. Changing the static image
        3. Changing the back button, title, and content
    8. Summary
  5. Building a Twitter Bootstrap WordPress Theme
    1. Building a Bootstrap theme
      1. Adding the sidebar
      2. Adding the footer
      3. Header and footer
    2. The post loop
      1. The Featured Image area
      2. Creating categories
      3. Formatting the post
      4. Wrapping the post in an article tag
      5. Adding content to the post
      6. Adding a Read More button
      7. Dealing with post without an image
      8. Adding a bit of style
    3. Implementing Navbar
      1. Displaying menu
      2. Setting the sidebar
    4. Adding a search bar and single post page
      1. Dealing with the search box
      2. Dealing with the single post page
    5. The comment functionality
    6. Summary
  6. The Foundation E-Commerce Theme
    1. E-commerce HTML template – Part A
    2. E-commerce HTML template – Part B
    3. Theme setup, logo, and navigation
    4. The custom showcase widget plugin
    5. The sidebar widget setup
    6. The main product post page
    7. Single product and single page
      1. Adding multiple images
    8. Summary
    9. Conclusion