search

htmlburger / wpemerge-theme

An organized, ES6 and SASS powered theme taking advantage of the WP Emerge framework. 🚀
https://wpemerge.com/
GNU General Public License v2.0
286 stars 33 forks source link
blade php starter-theme wordpress wp-emerge-theme wpemerge

readme

WP Emerge Starter Theme Logo

Packagist Build Gitter

A modern WordPress starter theme which uses the WP Emerge framework.

This is the WP Emerge Starter Theme project - for the WP Emerge framework please check out https://github.com/htmlburger/wpemerge.

Summary

Documentation

http://docs.wpemerge.com/#/starter/theme/overview

http://docs.wpemerge.com/#/starter/theme/quickstart

Development Team

Brought to you by Atanas Angelov and the lovely folks at htmlBurger.

Comparison Table

WP Emerge Theme Sage Timber
View Engine PHP, Blade, Twig, any PHP, Blade Twig
Routing ✔ ✖ ✔
WP Admin Routing ✔ ✖ ✖
WP AJAX Routing ✔ ✖ ✖
MVC ✖✔✔ ✖✔✖¹ ✖✔✖
Middleware ✔ ✖ ✖
View Composers ✔ ✔/✖² ✖
Service Container ✔ ✔ ✖
Stylesheets SASS + PostCSS SASS + PostCSS N/A³
JavaScript ES6 ES6 N/A³
Front end, Admin, Editor and Login Bundles ✔✔✔✔ ✔✖✖✖ N/A³
Automatic Sprite Generation ✔ ✖ N/A³
Automatic Cache Busting ✔ ✖ ✖
WPCS Linting ✔ ✖ ✖
Advanced Error Reporting ✔ ✖ ✖
WP Unit Tests for your classes ✔ ✖ ✖

¹ Sage's Controller is more of a View Composer than a Controller.

² Sage's Controller provides similar functionality but is limited to 1 composer (controller) per view and vice versa.

³ Timber does not provide a front-end build process so you can implement whatever you prefer.

Email any factual inaccuracies to hi@atanas.dev so they can be corrected.

Features

Non-goals

Requirements

Directory structure

wp-content/themes/your-theme
├── app/
│   ├── helpers/              # Helper files, add your own here as well.
│   ├── routes/               # Register your WP Emerge routes.
│   │   ├── admin.php
│   │   ├── ajax.php
│   │   └── web.php
│   ├── src/                  # PSR-4 autoloaded classes.
│   │   ├── Controllers/      # Controller classes for WP Emerge routes.
│   │   ├── Routing/          # Register your custom routing conditions etc.
│   │   ├── View/             # Register your view composers, globals etc.
│   │   ├── WordPress/        # Register post types, taxonomies, menus etc.
│   │   └── ...
│   ├── config.php            # WP Emerge configuration.
│   ├── helpers.php           # Require your helper files here.
│   ├── hooks.php             # Register your actions and filters here.
│   └── version.php           # WP Emerge version handling.
├── dist/                     # Bundles, optimized images etc.
├── languages/                # Language files.
├── resources/
│   ├── build/                # Build process configuration.
│   ├── fonts/
│   ├── images/
│   ├── scripts/
│   │   ├── admin/            # Administration scripts.
│   │   ├── editor/           # Gutenberg editor scripts.
│   │   ├── login/            # Login scripts.
│   │   └── frontend/         # Front-end scripts.
│   ├── styles/
│   │   ├── admin/            # Administration styles.
│   │   ├── editor/           # Gutenberg editor styles.
│   │   ├── login/            # Login styles.
│   │   ├── frontend/         # Front-end styles.
│   │   └── shared/           # Shared styles.
│   └── vendor/               # Any third-party, non-npm assets.
├── vendor/                   # Composer packages.
├── views/
│   ├── layouts/
│   └── partials/
├── views-alternatives/       # Views for other engines like Blade.
├── functions.php             # Bootstrap theme.
├── screenshot.png            # Theme screenshot.
├── style.css                 # Theme stylesheet.
├── wpemerge                  # WP Emerge CLI shortcut.
└── ...

Notable directories

app/helpers/

Add PHP helper files here. Helper files should include function definitions only. See below for information on where to put actions, filters, classes etc.

app/src/

Add PHP class files here. All clases in the MyApp\ namespace are autoloaded in accordance with PSR-4.

resources/images/

Add images for styling here. Optimized copies will be placed in dist/images/ when running the build process.

resources/styles/frontend/

Add .css and .scss files to add them to the front-end bundle. Don't forget to @import them in index.scss.

resources/styles/[admin,editor,login]/

These directories are for the admin, editor and login bundles, respectively. They work identically to the main resources/styles/frontend/ directory.

resources/scripts/frontend/

Add JavaScript files here to add them to the frontend bundle. The entry point is index.js.

resources/scripts/[admin,editor,login]/

These directories are for the admin, editor and login bundles, respectively. They work identically to the main resources/scripts/frontend/ directory.

views/

While views that follow the WordPress template hierarchy should go in the theme root directory (e.g. index.php, searchform.php, archive-post.php etc.), others should go in the following directories:

  1. views/layouts/ - Layouts that other views extend.
  2. views/partials/ - Small snippets that are meant to be reused throughout other views.
  3. views/ - Named custom post templates or views that don't fit anywhere else.

Avoid adding any PHP logic in any of these views, unless it pertains to layouting. Business logic should go into:

Contributing

WP Emerge Starter Theme is completely open source and we encourage everybody to participate by: