WP theming

From Things and Stuff Wiki
Jump to navigation Jump to search

todo; fill out, rearrange and link up

Templates

Adding styles and scripts

Or wp_register_style/script with details then wp_enqueue_style on the registered item to choose when to load. Maybe wrapped up as a function and called with add_action

Theme Features

  • Theme Features allows a theme to register support of a certain feature. Theme support functions should be called in the theme's functions.php file to work.

Settings API

  • Settings API - Allows admin pages containing settings forms to be managed semi-automatically. It lets you define settings pages, sections within those pages and fields within the sections.
    • Example given for choosing a background image.

Options API

  • Options API - a simple and standardized way of storing data in the database. The API makes it easy to create, access, update, and delete those options. All the data is being stored in the wp_options table under a given custom name. This page contains the technical documentation use the Options API.

Theme Options

  1. Copy “options.php” from the Options Check theme into your own theme.
  2. Edit the array in “options.php” to define the options you want to use.
  3. Add the following function to your theme so it will use default settings even if the Options Framework plugin is not installed:
/*
* Helper function to return the theme option value. If no value has been saved, it returns $default.
* Needed because options are saved as serialized strings.
*
* This code allows the theme to work without errors if the Options Framework plugin has been disabled.
*/
if ( !function_exists( 'of_get_option' ) ) {
function of_get_option($name, $default = false) {
   $optionsframework_settings = get_option('optionsframework');
   // Gets the unique option id
   $option_name = $optionsframework_settings['id'];
   if ( get_option($option_name) ) {
       $options = get_option($option_name);
   }
   if ( isset($options[$name]) ) {
       return $options[$name];
   } else {
       return $default;
   }
 }
}

Preprocess

See also preprocess, sass.

SASS/SCSS

  • wp-sass - This plugin allows you to write and edit .sass and .scss files directly and have WordPress do the job of compiling and caching the resulting CSS. It eliminates the extra step of having to compile the files into CSS yourself before deploying them.
    • uses phpsass!

install;

git clone git://github.com/sanchothefat/wp-sass.git wp-sass
git submodule update --init --recursive

functions.php:

<?php

// Include the class (unless you are using the script as a plugin)
require_once( 'wp-sass/wp-sass.php' );

// enqueue a .less style sheet
if ( ! is_admin() )
   wp_enqueue_style( 'style', get_stylesheet_directory_uri() . '/style.scss' );
else
   wp_enqueue_style( 'admin', get_stylesheet_directory_uri() . '/admin.sass.php' );

// you can also use .less files as mce editor style sheets
add_editor_style( 'editor-style.sass' );

?>

You can also create .sass.php or .scss.php files that will be preprocessed in the WordPress context. What this means is that you can use WordPress functions within the stylesheets themselves eg:

$red: <?php echo get_option( 'redcolour', '#c00' ); ?>;

body {
  background: $red;
}

LESS

  • WP-LESS - Implementation of LESS (Leaner CSS) in order to make themes development easier.
    • uses lessphp v0.3.1, plugin-toolkit.

Process, etc.

  • Theme Review - Guidelines for designing and developing WordPress Themes plus WordPress Theme Directory standards and practices.

Theme customizer in 3.4 - still need to grok relation to Settings API, etc...

GUI

Testing

Layout

Sidebars

Typography

quick webfont plugin hack;

Performance

Minify; http://bit51.com/prepare-your-wordpress-theme-to-be-minified/