Scentric is a development skeleton for WordPress aimed at people who want to build totally custom WP themes without writing basic content display code. Scentric is based on the _s theme from Automattic which is meant to be a modern toolkit for theme work. Scentric in particular makes it easy to replace the default reset with Normalize using Sass and Compass. Scentric also uses many elements from the HTML5 Boilerplate in its templates.
One of the coolest things about Scentric is that it's totally responsive-ready. It does not include any grid systems or any assumptions about what sort of layout you might want, but it does include responsive units wherever possible as well as a full copy of Modernizr with the HTML5 shim for proper progressive enhancement.
Please submit patches on Github at bytefair/scentric if you find bugs or would like to make improvements.
- WordPress 3.4 installation or highers
- Method to compile Compass/Sass be it the Unix tools, CodeKit, etc. Scentric does not come with a default stylesheet out of the box. The stylesheet must be compiled from sass/style.scss.
- PHP 5.3
- Scentric is not suitable for parent theming (yet), it is meant to be updated directly. There's little in here that you would need to upgrade. The JS libraries and such are self-upgradeable. Some functions may be moved to core or deprecated, but you should be dealing with that on an individual basis and checking your themes with the popular testing tools anyway.
- Set up your basic CSS in sass/style.scss.
- Set up your basic JS stack.
- Install the testing tools located here on the WP codex and also on this page about the Theme Reviewers team. This will assure your theme works correctly.
- If you want to define custom types or taxonomies in your theme, use the helper class defined in inc/custom-types.php and define those types in functions.php. If you do not need them, consider deleting inc/custom-types.php and all references.
- There are several dynamic widget areas, 2 in the sidebar and 4 in the footer. Disable them if you don't need them or create more. They are definied in functions.php and called in sidebar.php and footer.php.
- _s has several desirable tweaks located in inc/tweaks.php. You might want to include them in functions.php. They are located in a separate file because their functionality is likely to move into core. They are disabled by default.
- Once your theme is developed and it passes your testing plugins satisfactorily, it's ready for deployment.
- Make sure you minimize and compress your CSS and JS. Scentric includes the development versions of the JS libraries only. You will need to include compressed ones or link to CDN versions yourself.
- If you use Apache, consider adding the directives in add-to-htaccess.txt to your .htaccess file.
Scentric utilizes Sass and Compass for organizing CSS styles. It's entirely possible that the helpers and such will even be rewritten in Sass entirely to make them as small as possible. For now, they are simply carved out of _s theme's styles.
- Choose whether you want to use Compass's default reset (Eric Meyer's) or Normalize.css (recommended). If you use Normalize, you will probably have to edit some of the default WP styles in sass/partials/_wp-styles.scss.
- Set up the way you want your CSS compiled in sass/style.scss. Editor styles are defined in sass/editor-style.scss.
- Boilerplate helpers are in sass/partials/_bp-helpers.scss. You probably want to keep these classes.
- Include your own Sass files in style.scss under the line specified in the Sass file.
- Compile your Sass file to generate style.css in the theme root. You will need to use the command line tools or a third party tool like Compass.app or CodeKit to do this.
- All scripts are loaded from scentric_scripts() in functions.php. Modernizr is loaded in the head, jQuery is loaded the default way, and js/plugins.js and js/scripts.js are loaded in the footer. If want to use something else, change it here.
- jQuery plugins go into plugins.js and custom scripts go in scripts.js.
- If you don't need a menu, remove small-menu.js. If you don't need any JS, obviously remove all of this and the script loaders from functions.php.
There's nothing particularly wrong with defining custom functionality in your themes, just be aware that you will have to carry this functionality over to another theme if you want to access it from your administrative backend. You might want to consider doing this with a plugin instead.
If you can handle doing it in your theme, Scentric comes with some nice helper classes for taxonomies and class types. Meta boxes have not been integrated into the helpers yet and you must create these manually for now.
You define custom types and taxonomies in functions.php. There are examples of function calls at the bottom of this file. Scentric establishes sane defaults for most options, but you will of course want to pass in any options as an array like in the example.
If you need help with custom types or taxonomies, WordPress has an extremely informative Codex page about this. If you do not need custom types, please consider deleting all the content related to them.
v0.1
- Switched the reset from Blueprint's to Normalize.css, which is superior for developer tools and arguably for developers too
- Switched some of the header elements over to Boilerplate style and CSS style as well as fixing most CSS collisions
v0.2
- Added Rainbow.js for code theming out of the box. This jQuery plugin is located in plugins.js
- Moved all the Boilerplate style loading over to be handled by WordPress, like it wants
v0.3
- Many small bugfixes including fixing the buttons and input sizing from _s defaults
v0.4
- Brought in tons of bugfixes from _s 1.1
v0.5
- Updated content.php and removed Google Analytics snippet from footer.php
v0.7
- Switched all CSS to Compass format for easier management. Files are located in
sass/and are compiled fromstyle.scsstostyle.cssin the root directory. I still use Normalize rather than Compass reset but that may change before 1.0.
v0.9
- Merging of features from mens-tk, another WP framework I was working on. I am now merging these themes.
- Readded small-menu.js and removed rainbow.js
- Ran theme against many checks and removed deprecated function overrides and other deprecated functionality
v1.0
- Theme validates and meets all normal expectations for WP.org themes aside from post thumbnail support built in.
- Lots of minor cleanup of the code.
- Finally created a screenshot.png file
- Added 4 more widget areas to footer
- Added more informative documentation
v1.1
- Added jQuery 1.8.0 and had it queued by default. Change the line in functions.php if you want to use 1.7.2. It will be removed if there are few problems with jQuery 1.8.
- Removed old Modernizr library.
v1.1.1
- Updated Normalize.css to v1.0
v1.2
- Updated Normalize.css to v1.0.1
- Added Normalize.css 2.0.1
- Updated to jQuery 1.8.2
- Updated to Modernizr 2.6.2
v1.5
- Updated all the core files to reflect new code in the bases (_s theme and HTML5 Boilerplate)
- Bumped the versions of Normalize 2 and jQuery 1.8.3
- Added new JS code from _s
- Reorganized Sass files and removed all _s styles
- Now only include the print helpers from Boilerplate
- Preperations for drastic changes in 2.0, will include many advanced Sass features like heavy use of Compass and Susy and opinionated style choices
- (Definitely) Include code for configuring Nginx as well as Apache.
- (Likely) Include helper class for meta boxes in custom-types.php
- (Likely) Include several Sassified grid systems for easy responsive development. I'm not sure how I want to do this yet or which systems I should even include.
- (Possibly) Move custom types to a plugin, which is probably the way to go. In the meantime, I endorse using Easy Custom Content Types for WordPress. I've heavily examined the code and it's of extremely high quality and uses almost entirely native WP functionality. You don't even need to keep the plugin installed once you've generated the code. If you'd like to do custom types as a plugin, use this.
- (Possibly) Write an admin backend for custom types
- (Possibly) Write a default template handler for custom types.
Copyright (C) 2011-2012 Paul Edmon Graham
This program is free software; you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation; either version 2 of the License, or (at your option) any later version.
This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details.
You should have received a copy of the GNU General Public License along with this program; if not, write to the Free Software Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.