About Base Camp
Awesome WordPress starter theme with own CLI for developers based on modern web technologies.
Features
- Bulma (Responsive CSS framework based on Flexbox)
- Timber
- Twig Template Engine
- Cleaner and better code
- Separates the logic from presentation
- Webpack
- Sass / Scss for stylesheets (Minimize in production)
- ES6 for Javascript (Minimize in production)
- Automatic Cache Busting
- Split javascript code to two chunks, app.js and vendor.js
- Vuejs for boosting frontend development
- BrowserSync for synchronised browser testing
- Luna (Command-line interface included with Base Camp)
- WooCommerce support with basic boilerplate.
Requirements
- Wordpress >= v4.9.6
- Composer >= v1.6.5
- PHP >= v7.0
- Yarn >= v1.7.0 or npm >= v6.1.0
- Nodejs >= v8.11.1
Installation
- Go your themes folder and run
composer create-project suomato/base-camp
cd base-camp
yarn
ornpm install
- define your custom webpack config to
build/config.js
file yarn watch
ornpm run watch
- Happy developing :)
Structure
base-camp/ # Theme root
βββ app/ # Theme logic
β βββ config/ # Theme config
β β βββ wp/ # WordPress specific config
β β β βββ admin-page.php # Register here WordPress Admin Page config
β β β βββ image-sizes.php # Register here WordPress Custom image sizes
β β β βββ login-page.php # Register here WordPress Login Page config
β β β βββ maintenance.php # Maintenance mode config
β β β βββ menus.php # Register here WordPress navigation menus
β β β βββ scripts-and-styles.php # Register here WordPress scripts and styles
β β β βββ security.php # Things that increase the site security
β β β βββ sidebars.php # Register here WordPress sidebars
β β β βββ theme-supports.php # Register here WordPress theme features
β β βββ autoload.php # Includes all config files (DON'T REMOVE THIS)
β β βββ timber.php # Timber specific config
β β βββ woocommerce.php # Init woocommerce support
β βββ models/ # Wrappers for Timber Classes
β βββ timber-extends/ # Extended Timber Classes
β β βββ BaseCampSite.php # Extended TimberSite Class
β βββ bootstrap.php # Bootstrap theme
β βββ helpers.php # Common helper functions
βββ build/ # Theme assets and views
β βββ config.js # Custom webpack config
β βββ webpack.config.js # Webpack config
βββ resources/ # Theme assets and views
β βββ assets/ # Front-end assets
β β βββ js/ # Javascripts
β β β βββ components/ # Vue Components
β β βββ sass/ # Styles
β β β βββ components/ # Partials
β βββ languages/ # Language features
β β βββ base-camp.pot # Template for translation
β β βββ messages.php # Language strings
β βββ views/ # Theme Twig files
β β βββ components/ # Partials
β β βββ footer/ # Theme footer templates
β β βββ header/ # Theme header templates
Models
Models are wrapper classes for Wordpress Post Types and Taxonomies. They provide very simple interface to interact with the database.
How to use
// index.php
<?php
use Basecamp\Models\Post;
// returns an array of TimberPost objects
Post::all();
// returns TimberPost object with the ID 1 (if it exists)
Post::find(1);
// returns first two posts;
Post::take(2)->get();
// skips first two posts;
Post::skip(2)->get();
// returns published posts;
// Supported values: https://codex.wordpress.org/Post_Status#Default_Statuses
Post::status('publish')->get();
// returns all posts except post with ID 1;
Post::exclude([1])->get();
// returns only posts with ID 1;
Post::include([1])->get();
// returns an array of posts descending order by author;
// Supported Values: https://codex.wordpress.org/Class_Reference/WP_Query#Order_.26_Orderby_Parameters
Post::orderby('author', 'desc')->get();
// returns an array of posts authored by admin;
Post::author('admin')->get();
// returns an array of posts which are in category 'cars' or 'vehicles';
Post::inCategory(['cars', 'vehicles'])->get();
All queries are chainable. For example you can get three first incomplete posts authored by admin:
Post::status('draft')->author('admin')->take(3)->get();
All models are able to use almost every methods. However there are some exceptions:
- Only
Post
model hasinCategory()
method - Taxonomies (Category, Tag) have
hideEmpty()
method