Pixelgrade Theme Basis
– – –
These are the rules to follow while developing a new WordPress theme.
The Roots Of Our Structure
We follow the Underscores structure(_s
) since it is a simple and popular framework. It is easy to use and understand for every WordPress community member.
WordPress Coding Standards
Since we are working with WordPress, we respect the environment, concepts and coding standards.
Aside from the rules from Codex we also need to check:
Simple Quotes First
The simple quotes '
should always be your fist pick, excepting the case of HTML attributes. So:
- A simple string in PHP should be wrapped in single quotes
<?php echo 'a string'; ?>
. - Array keys should also use the single quotes
<?php echo $my_array['a_custom_key'];?>
HTML Escape
Every string must be output in an escaped way with gettext functions like esc_html__
or esc_html_e
:
- For these gettext functions always use the same string textdomain which is set here and use only strings (no variables or constants).
- Never add HTML code inside the functions above, if you need to compose an HTML block with strings inside use
sprintf
. - Also note that strings added to
sprintf
are XSS safe, and they can be output simply with__
or_e
functions.
Javascript parameters
Always localize JavaScript strings or parameters needed (here is an example).
Every PHP function must be prefixed with the theme name like this: guides_get_option
.
PHP functions naming should also be completed by these 2 rules:
- Use
the_
prefix for functions which should display something like: ‘guides_the_title. - Use
get_
prefix for function which should return something like:guides_get_custom_logo_ID
. - Uppercase
ID
whenever you can.
Since the use of actions and filters is a day by day job in themes and plugins, they turn out to be pretty important. Also how we organize them is a fact that requires attention, so:
1) Avoid putting actions and filters directly in functions.php, try to find a file with context like template-tags.php
or extras.php
.
2) If is a plugin based action, there is a folder integrations
exactly for this purpose.
3) We recommend writing actions and filters like the following example
” | markdownify }}
/theme/code_style.png)
Please note that this code style is available only for PHP files.
For SCSS, CSS or JS files you will need to setup your own style and add Smart Tabs or a proper spacing to function parameters.
A Child Theme’s Perspective
- Every theme should have a child theme repository as an example following this structure.
- For child themes to succeed we need to allow them control, so whenever we declare a function we check it with the
function_exists
function, in case it does exists it means it was created by a child theme. - Try to break down templates into smaller pieces as much as you can in order to be easier for child themes to overwrite templates.
Plugins Integrations
- We use TGMA to recommend plugins
- For various integrations with plugins we use the integrations.php file and folder. For example the woocommerce.php file
- For Theme Options we use Customify
- For Custom Post Types and Custom Metadata we use PixTypes
- For Shortcodes management we use PixCodes
- We strive to keep things licensed under GPLv3. The sky is the limit.