Blog

Updating and Managing Translations with WP Clips

May 25 2016 ·Written by Jon Barratt

Managing your Clips‘ custom code translations is very simple with WP Clips. Firstly, when you install, update or upgrade the plugin, a new /languages/wp-clips.pot file is added, containing all translatable text within the plugin. But, what about the strings in your customizations? Well, here a couple of easy steps to follow:

Use the ‘wp-clips’ text domain for translatable strings in your core and custom Clips. This is loaded by the plugin only once and is the most efficient way to manage your Clip translations.
Update your wp-clips.pot file after any changes to your custom Clips or Precoded Clips, or when updating or upgrading the plugin.
Update your ‘wp-clips.pot’ file either locally or remotely.

If installed locally, download and install the Poedit translation editor, open the wp-clips.pot file and ‘Update’ the wp-clips.pot file from its sources.

If installed remotely, you can either download a copy of your WP Clips plugin folder, update the file within the folder and then overwrite the file to the remote server. Or, if you wish to update via WordPress admin, install the Loco Translate plugin, go to ‘Manage Translations’, locate and click the wp-clips.pot file, then ‘Sync’ and ‘Save’.

Yup, it’s just that easy!

Helpful Resources

How to Internationalize Your Plugin – WordPress.org Plugin Handbook
I18n for WordPress Developers – WordPress.org Codex
Localization – WordPress.org Plugin Handbook

Add or Customize Page Templates with WP Clips

May 05 2016 ·Written by Jon Barratt

The custom Clip installed with WP Clips contains three custom files for adding functions (PHP), scripts (JS/jQuery) and styles (CSS). But, what about page templates? How do you customize an existing template (e.g. front-page.php) or add a new template (e.g. new-page.php)?

Well, there are several methods available, each with its own application –

Customize the native template and log any changes (existing templates).
Copy a custom page template from the Clip to the child theme folder (new templates).
Point directly to a custom template in the Clip (existing and new templates).

Customize the native template and log any changes

Limiting files, functions and calls is always preferable in terms of efficiency. So, if there are only minor changes to an existing template, best practice is to modify the native template directly and log your changes in the custom Clip‘s log.txt file. If the template is ever refreshed or updated, simply refer to your record to reinstate the changes.

Copy a custom page template from the Clip to the child theme folder

If you want to add a new page template and have it appear under Page Attributes > Templates in WordPress admin, you can add the template to your custom Clip directory and set a function to copy the file to your child theme directory.

For example, if adding a new-page.php template, you would add the new template file to your custom Clip directory and the following code to your custom-functions.php file –

//* Copy new page template to active theme folder
add_action( 'after_setup_theme', 'clip_new_page_template' );
function clip_new_page_template() {
    $newdir = get_stylesheet_directory() . '/new-page.php';
    if( ! file_exists( $newdir ) ) {
        $dir = dirname( __FILE__ ) . '/new-page.php';
        copy( $dir, $newdir );
    }
}

In this case, should your child theme ever be refreshed or updated, the new template will automatically be reinstated. This method might also be useful for plugins which permit template overrides within the active theme folder.

Point to a custom template in the Clip (recommended).

For major customizations or new templates, the recommended method is to refer directly to a new template or customized template copy within the custom Clip. This is achieved using the template_include filter hook and a suitable condition to engage the template.

For example, if including a portfolio-page.php template on a page called ‘portfolio’, you would add the new template file to your custom Clip directory and the following code to your custom-functions.php file –

//* Point to new page template in clip folder
add_filter( 'template_include', 'portfolio_page_template', 99 );
function portfolio_page_template( $template ) {
    if( is_page( 'portfolio' )  ) { // this is the condition
        $new_template = dirname( __FILE__ ) . '/portfolio-page.php';
        if ( '' != $new_template ) {
            return $new_template ;
        }
    }
    return $template;
}

Alternatively, if overriding your theme’s front-page.php template, the condition would be –

if( is_front_page() ) {

Note that with this method, the template is included only when the condition(s) is being met and does not appear in admin’s Page Attributes > Templates.

So, there you go!

Adding new templates or customizing existing templates is really very simple. Remember, you can do almost anything within the custom Clip directory – from adding image folders to enqueuing javascript files to referencing alternate templates. WP Clips offers the ideal customizing environment for your child themes and plugins.

Safely Customizing Genesis Child Themes with WP Clips

Jan 29 2016 ·Written by Jon Barratt

CUSTOMIZING GENESIS – A QUESTION OF ‘BEST PRACTICE’

Some time ago, I stumbled upon a YouTube video entitled “How to Safely Customize Your Genesis Child Theme”, in which Katrinah (katrinah.com) explained how to customize Genesis child themes using secondary custom files to protect customizations from theme updates.

As a fellow Genesis user and third-party developer, I saw Katrinah’s tutorial as a helpful resource for the Genesis community. However, I recently happened upon the video again to find the original content removed and several comments taking issue with adding secondary files over editing theme files directly. StudioPress support also weighed in, stating that Best Practice is to edit theme files directly because Genesis child themes do not get updated.

Well, this might be true of some StudioPress themes. However, many Genesis child themes do get updated, including StudioPress and third-party themes adapting to new technologies (e.g. responsiveness) or respecting new web protocols (e.g. accessibility), and those which integrate frequently-updated plugins (e.g. WooCommerce) which, in turn, necessitate theme updates.

Another limitation is WordPress multisite. Customizing the Genesis child theme’s native files restricts the developer to either network-wide customization using one theme, or multiple theme copies to customize each site. Alternatively, secondary custom files offer a simple, light-weight solution to target individual site customizations while using the single Genesis theme.

Check out my other article entitled, “You Don’t NEED to Update Your Genesis Child Theme … but SHOULD You?” for a deeper analysis of the Great Update Debate.

BENDING THE RULES, NOT BREAKING THEM

So, in view of the little debate above, here are a few considerations up-front –

WP Clips uses secondary custom files.
I believe there is good reason to abide by StudioPress’s Best Practice method. However, I also believe there is a place for adding secondary custom files, in particular for customizing Genesis child themes which offer updates or require ongoing customization.
WP Clips is still extremely useful in combination with Best Practice.
You can always transfer your code back to the theme’s native files. In this case, WP Clips offers both a helpful facility for massaging and testing your code, and an easily activated or deactivated back-up of your customizations.
WP Clips is ideal for customizing with code.
At just 10kb in size, the starter plugin contains little more than a folder of empty files. It’s not intended to replace more intuitive customizers such as Genesis Extender or Design Palette Pro. However, if you want to dive into code and get your hands dirty, WP Clips offers a great outdoor playground while keeping your home neat and tidy.
WP Clips is ideal for customizing multisite environments.
The multisite plugin enables customizations to be applied across the network or to individual sites using one Genesis child theme installation.

… if you want to dive into code and get your hands dirty, WP Clips offers a great outdoor playground while keeping your home neat and tidy.

PUTTING WP CLIPS INTO PRACTICE

So, you’ve installed your Genesis child theme and it’s time to start customizing. Well, here are some very simple steps:

Download WP Clips from wpclips.net
Note that multisite requires WP Clips Multisite plugin to be installed. Further information on using the multisite plugin can be found at wpclips.net/wp-clips-multisite
Install and activate the plugin.
Both plugins can be installed as must-use (mu-) plugins for best security.
Now, dive in and start customizing.
I won’t use this forum to expand on the how-to’s of customizing Genesis child themes. I’ll simply discuss in relation to WP Clips, and include some resources at the end.

So, central to customizing with WP Clips are the custom files located in the wp-content/clips/clip-core/ and wp-content/clips/clip-custom/ directories – the core and custom Clips. These files include:

core-functions.php – for WordPress core functions
custom-functions.php – for theme/plugin custom PHP functions
custom-script.js – for theme/plugin custom JS/jQuery scripts
custom-style.css – for theme/plugin custom CSS styles

Visit https://wpclips.net/customizing/ to learn about customizing with WP Clips.
Life after customizing.
If you are comfortable keeping your customizations within the active Clip (my preference), then start celebrating. You’re done! If, however, you wish to adhere to Best Practice, then carefully transfer the customizations across to your native theme files (adjust paths and parameters where required) and simply deactivate the plugin.

Leave the plugin installed for future customizing and as a back-up should you ever need to restore or update the original child theme. Your customizations will be reinstated immediately upon reactivation.

This is the practical advantage to using secondary custom files when customizing Genesis child themes. You can always return to basecamp in seconds. It’s not so easy when your customizations are scattered throughout the theme’s native files.

A FEW TIPS

Additional files and content
You can add and enqueue any required files and content within the custom Clip folders (e.g. images or lib folders, jquery plugins). There’s really no limit to how you use the Clip.

Customizing native theme files
Sometimes, it just makes good sense to customize native files directly. A log.txt plain text file is included within the Clip to record any such changes.

Translation
The WP Clips plugin itself is translation-ready and includes a /languages/wp-clips.pot file. If leaving the custom Clip active, this file can be updated at any time with a simple translation plugin (e.g. Poedit) to include all translatable custom text.

Changing to a must use (mu-) plugin
After development, you may want to consider transferring the plugin folder contents (not the plugin folder) to a new or existing /wp-content/mu-plugins/ directory. This will block access to custom files and prevent plugin deletion via WordPress admin. A good final safeguard before hand-over to a client.

Don’t stress and have fun
As I said before, WP Clips is like an outdoor playground for customizing Genesis themes. You can get your hands dirty, try new things, toss ideas in the air and see how they land, anything you like, always knowing that your fundamental theme remains unchanged.

FINALLY …

Please check out the WP Clips website wpclips.net. There is plenty of documentation and FAQ’s on how the plugin works and how you can tailor WP Clips to fit your needs. Also, learn about WP Clips Multisite, Precoded Clips and the new ClipBank™.

And remember, WP Clips is constantly being improved. So, please send us your feedback – maybe a new feature you’d like to see, or a different application you’ve discovered, or perhaps you’d simply like to weigh in on the ‘question of custom files’. Don’t be shy. Throw your comments our way!

Helpful Resources for Customizing Genesis Themes

StudioPress website (where it all starts) – www.studiopress.com
Brad Dalton’s WP Sites (awesome code snippets and tutorials) – wpsites.com
Sridhar Katakam (equally awesome code snippets and tutorials) – sridharkatakam.com
Carrie Dils (more awesome customizing Genesis info) – www.carriedils.com
Nick Davis’s Genesis Guide (keep up to date on all things Genesis) – genesiswp.guide
Chrome DevTools (learn how to use the inspector and other browser dev tools) – developers.google.com/web/tools/chrome-devtools/