Building WordPress Themes From Scratch with Photoshop

Make money building custom Wordpress Themes

Course Description

Design your own Wordpress themes from scratch for fun and profit. Have you ever noticed that web designers make money by developing their own themes for Wordpress and selling them on marketplaces like Envato? Well, now you can too! Learn Wordpress theme design from the ground up in this massive Stone River eLearning course. Join award-winning veteran trainer Geoff Blake as he takes you through the entire workflow process of scratch-building a WordPress theme using Photoshop! About the Course The training begins in Photoshop, where you’ll be introduced to some setup options and settings to optimize Photoshop for web design. Then, learn about building and using various grid systems, which will serve as the template for the theme layout. Next, it’s on to the next phase in the workflow process, wireframing and UI design... Read More »

Design your own WordPress themes from scratch for fun and profit.

Have you ever noticed that web designers make money by developing their own themes for WordPress and selling them on marketplaces like Envato? Well, now you can too! Learn WordPress theme design from the ground up in this massive Stone River eLearning course.

Join award-winning veteran trainer Geoff Blake as he takes you through the entire workflow process of scratch-building a WordPress theme using Photoshop!

About the Course

The training begins in Photoshop, where you’ll be introduced to some setup options and settings to optimize Photoshop for web design. Then, learn about building and using various grid systems, which will serve as the template for the theme layout. Next, it’s on to the next phase in the workflow process, wireframing and UI design in Photoshop. Learn how to stay organized and work quickly and efficiently.

Once the wireframe structure is complete, you’ll see how to apply design to the wireframe, and then move the entire layout from Photoshop into the world of code.

You’ll discover how to construct a WordPress theme from the ground up, starting with a completely blank canvas! You’ll see a variety of techniques for working between Photoshop, WordPress’s architecture, and the HTML, PHP, and CSS code that pulls it all together.

Read Less
Course Outcomes:
  • You’ll gain an in-depth and complete look at theme building, which you can directly apply to your projects — it’s literally a freelance startup kit!
  • You can use your newfound skills in your own business, or to land bigger and bigger clients!
  • Clearly laid out, easy to follow lessons lead you each step of the way through the process of building fully functional WordPress themes.
  • Invest in your knowledge and skills, and discover how creative, straightforward, and profitable building themes can be!
  • You’ll gain a strong, valuable, highly marketable set of design, coding, and graphics skills, allowing you to build themes quickly and efficiently.
Course Details:

Access Timeframe

Lifetime Access
Certificate Info:

Type of Certification

Certificate of Completion

Format of Certification

Digital

Method of Obtaining Certification

To earn a Certificate of Completion you must view all the course material, but are not required to pass an exam or submit any projects. These certificates are open to all students.
  • 1. You must have viewed all course videos (this will be verified by the Stone River staff)

  • 2. Open a support ticket at the top of this page requesting your certificate

  • 3. Allow up to 1-2 business days for processing - Your certificate will arrive via email
About Instructor:

Geoff Blake

Hey, I'm Geoff Blake. I create online video courses to help people gain serious web skills, helping them to expand their business, develop their projects...and yeah, make more money!

Award-winning teacher, 15+ years experience

I've helped thousands of people build businesses, develop new skills, become more indispensable, and earn much more than they were before. I'd love to help you get onto the right path!

Published author, college professorship Writing for top industry magazines and websites allowed me to help people all over the world. I also wrote 'Ten Ton Dreamweaver' with Peachpit Press (ISBN: 0321374126). I held a professorship at Seneca college, and ran graphics workshops at George Brown, and Humber colleges in Toronto.


Course Outline

  • Hello and Welcome
  • Understanding WordPress and WordPress Themes
  • The Workflow Process
  • Viewing the Finished Site
  • Setting Photoshop’s Preferences
  • Arranging The Workspace
  • Setting Panel Options
  • Customizing Menus And Keyboard Shortcuts
  • Saving Photoshop’s Workspace
  • Photoshop Color Management For Web Design
  • Common Photoshop Productivity Techniques
  • A Few Final Photoshop Settings
  • Understanding Monitor Resolution
  • Fixed Versus Flexible Web Layouts
  • Introducing the 960 Grid System
  • Available Column Widths in the 960 Grid System
  • Free Lesson: Building A Custom Grid System
  • Using Photoshop’s Grid for Layout
  • Understanding the Golden Ratio
  • Understanding the Areas of A WordPress Site
  • Roughing Out The Design
  • Getting Started with Wireframing
  • Creating the First Wireframe Object
  • Continuing to Wireframe Objects
  • Deleting Wireframe Objects
  • Faster Methods for Creating Wireframe Objects
  • Building Up the Wireframe
  • Adding in Horizontal Rules
  • Wireframing Additional Objects, Plus Some Extra Techniques
  • Continuing the Wireframe Development
  • Placing Objects for Loop Post Thumbnails
  • Roughing in A Photo Gallery
  • Wireframing the Menu Text
  • Creating More Wireframe Text
  • Adding in Additional Text Objects
  • Finishing Up the Text Wireframing
  • Getting the Layers Panel Organized
  • Additional Layer Group Techniques
  • Adding Text Labels to the Wireframe
  • Exporting the Wireframe for Review
  • Preparing the Wireframe for the Design Phase
  • Determining the Design’s Message
  • Choosing A Typeface Hierarchy
  • Choosing Colour Combinations
  • Free Lesson: Saving Out Custom Photoshop Color Palettes
  • Sourcing Photography and Textures
  • Creating the Site Logo (And Using Smart Objects)
  • Introducing Layer Style Special Effects
  • Finishing Up the Header
  • Building the Menu
  • Developing the Slideshow and Body Background
  • Formatting the New Additions Area
  • Blog Loop Formatting
  • Developing the Sidebar
  • Finishing Up with the Footer & Saving Out Custom Styles
  • Adding A Texture to the Header with A Clipping Group
  • Including Additional Textures
  • Adding A Photo to the Slideshow
  • Inserting Photography for the New Additions Area
  • Adding Post Thumbnails in the Loop
  • Inserting Thumbnails in the Photo Gallery
  • Tools of the Trade
  • Understanding Template Hierarchy
  • A Look At Geoff’s Setup
  • Applying A Blank WordPress Theme
  • Reviewing & Adjusting the Style Sheets
  • Creating the First
    and CSS Rule
  • Roughing in the Layout
  • Further Roughing in the Layout
  • Adding The Photoshop Colour Palette To The Theme's Style Sheet
  • Creating Our Site’s Page Structure and Main Navigation Menu
  • Creating Sample Posts for the Loop
  • Pulling the Header Graphic Out of the Layout
  • Inserting the Header Graphic Into the Theme
  • Extracting the Logo From Photoshop and Inserting it Into the Theme
  • Rebuilding the Navigation Menu Using CSS
  • Building up the Main Content Area
  • Roughing in the Inner Containers
  • Inserting the Positioning Statement
  • Creating Button Formatting with CSS
  • Building and Formatting the New Additions Area, Part One
  • Building and Formatting the New Additions Area, Part Two
  • Font Replacement with Google Fonts API
  • Consolidating Font Usage and Organizing Typography
  • One Giant Leap for Theme Design…
  • Formatting the Loop
  • Adding Post Thumbnails to the Loop
  • Getting the Sidebar Started
  • Reviewing How the Footer was Built
  • Formatting Hyperlinks
  • Limiting the Number of Posts Appearing on the Home Page
  • Inserting Custom Loop Pagination
  • Inserting the Slideshow
  • A Better Way for Building WordPress Menus
  • Building and Formatting WordPress Subpages
  • Applying Formatting to Post Pages
  • Completely Customizing the Comments Area
  • Adding A Ribbon Graphic to the Comments Area
  • Free Lesson: Customizing Category And Search Results Pages
  • Adding A Search Field to the Header
  • Building A Lightbox Photo Gallery
  • Finishing Touches
  • Addressing Browser Compatibility Issues
  • Final Site Checklist
  • Thanks for Watching, That Was Fun!

DON'T HAVE TIME?

We can send you everything you need to know about this course through email.
We respect your privacy. Your information is safe and will never be shared.