Now Live: Rob Livingstone Advisory

Posted on

I’ve just launched the new website for Rob Livingstone Advisory! It’s been an absolute pleasure to create a site that is very strategically oriented, flexible and hopefully going to be a launching pad for greater things this year.

The site is fully responsive, retina-ready, WordPress-powered and packed with great content. Check it out if you get a chance.

Restrict Page Parents Updated to 1.1.0

Posted on

I’ve just pushed up an update to Restrict Page Parents with a new feature. Version 1.1.0, now available through WordPress, lets you turn the page parent restrictions you set up on or off for each post type.

Hopefully this makes the plugin even more useful! Get in touch if you find any bugs or have feature ideas.

A Basic jQuery Rotator

Posted on

There are a hundred jQuery rotator scripts online, most are ultra-powerful, doing everything a rotator could every dream to do. Here’s another one that’s super simple, lightweight and easy to use.

Features:

(more “what it doesn’t do”)

  • Only has a next button (not a previous one)
  • Only changes on click
  • Has a slight fade effect
  • Adjusts height accordingly
  • Can be applied to multiple elements on a page
  • You only have to change 2 things

Usage:

Add the code below into a jQuery $(document).ready( function() { }); call. Change the two identifiers under ‘Settings’.

Code:

/ Settings
var wrapper = '.testimonials'; // the element around your rotator
var child = 'blockquote'; // the element to be rotated

// Rotate Script
$(wrapper).each( function() {

	$(this).append('<a href="#" class="next button inner">Next Testimonial</a>');
	$(this).find(child).each( function() {

		if ( $(this).is(child + ':nth-child(1)') ) {
			$(this).addClass('active');
		} else {
			$(this).hide();
		}

	});
	$(this).find('.next').click( function() {

		var $item = $(this).parent().find(child + '.active');

		if ($item.next().is(child)) {

			$item
				.removeClass('active')
				.hide()
				.next()
				.fadeIn('fast')
				.addClass('active');

			} else {

				$item
					.removeClass('active')
					.hide()
				$(this).parent().find(child + ':nth-child(1)').fadeIn('fast').addClass('active');
			}

		return false;

	});

});

Restrict Page Parents Launched!

Posted on

Restrict Page Parents started here on the blog as a quick bandaid plugin designed to solve a small issue within the new UN Youth Australia website. Users with only the permission to edit pages owned by them, could add or move their pages under a parent page they did not own, creating issues around page hierarchy and menus within the site. They could also not set a parent page, meaning their page would be on the base level with the main site pages.

This of course wasn’t ideal, and the script I created kind of solved it, but not really.

A few months later I got some emails from some people who’d found the hack-plugin and found it useful, although massively buggy. They also found that there needed to be more control over the restrictions set by the plugin.

I decided to do it properly, if I had this issue surely others who were using WordPress as a CMS were to. Restrict Page Parents is a very lightweight, niche plugin, but it does what it does well. There’s options for the users and/or roles to restrict, and the restrictions to put in place. It does those restrictions properly through WordPress actions and hooks (not PHP find & replace), and also places the restrictions on Quick Edit.

Check it out on your WordPress site, and let me know if you run into any bugs. If you feel like contributing to the code (or I’ve made a horrendous mistake somewhere) then there’s also a GitHub project.

Add Custom Image Sizes to WordPress Media Uploader

Posted on

Here’s a little trick to include custom image sizes as options in the WordPress 3.5+ media uploader for your themes. It means more image size options for your pages, with all the magical ease of WordPress’ image management and cropping.

Firstly create a function setting theme support for post thumbnails, and your custom sizes. Add that function to the after_theme_setup hook.

function custom_image_sizes() {
	add_theme_support('post-thumbnails');
	add_image_size('banner', 960, 355, true);
	add_image_size('thumb', 120, 120, true);
	add_image_size('widget', 170, 400, false);
}
add_action('after_setup_theme', 'custom_image_sizes');

Then add the sizes you want to display to the uploaded through an array and the image_size_names_choose filter like so:

add_filter( 'image_size_names_choose', 'add_custom_sizes' );
function add_custom_sizes( $imageSizes ) {
	$my_sizes = array(
		'banner' => 'Banner'
	);
	return array_merge( $imageSizes, $my_sizes );
}

Turn on Error Reporting with .htaccess

Posted on

I’m putting this up because I seem to look for it with every site I work on. To turn on PHP error reporting temporarily using a .htaccess file, enter the following:

php_flag display_errors on 
php_value error_reporting 7

A New Website for UN Youth

Posted on

It went live a week or so ago, but introducing the best website I’ve ever built.

It’s HTML5, with some great CSS3/jQuery animations. It is a mobile web app, adaptive and Retina-ready. It uses paralax (retina.js). It’s also the first site I’ve built with LESS CSS. It was entirely voluntary.

It’s one of those projects that keeps you loving web design and development.

WordPress Plugin: Restrict Page Parents

Posted on

Notice: Restrict Page Parents has grown up!

It’s been rewritten from the ground up, using much better (proper) coding techniques. It’s faster, more comprehensive, reliable and will soon be in the WordPress plugin repository. The new plugin includes an options page to control your permissions, and the ability to make a ‘page parent’ required.

You can find out more at the plugin site and Github project.

 

——

The new UN Youth Australia website involves an extremely granular permissions management system behind the scenes. I’ve had to use a range of plugins to pigeon-hole specific users into only being able to edit their content in their little corner of the website.

Most of this was easily accomplished with existing plugins, except restricting the parent pages a user can select for their pages. To solve this, I’ve quickly made a plugin that restricts the page parent options under ‘Page Attributes’ to only the pages the current user is an author of. The plugin only applies these restrictions for users without the edit_others_pages capability.

The plugin simply disables the option for any pages that aren’t owned by the current user.

I’ve included the plugin code below, or download the zip. Just drop the restrict-page-parents.php file into your plugins directory.

Note: There may be bugs, use at your own risk. It was written for a fairly specific purpose.

<?php
/*
Plugin Name: Restrict Page Parents
Plugin URI: http://tommaitland.net/2012/12/WordPress-plugin-restrict-page-parents
Description: Restricts parent page options to pages authored by the current user.
Author: Tom Maitland
Version: 0.1Beta
Author URI: http://tommaitland.net

	Copyright (c) 2012 Tom Maitland (http://tommaitland.net)
	Default Page Parent is released under the GNU General Public
	License (GPL) http://www.gnu.org/licenses/gpl.txt

	This is a WordPress 3 plugin (http://WordPress.org).
*/

function restrict_parent_pages($content) {

	global $current_user;
	get_currentuserinfo();

	if (!current_user_can('edit_others_pages')) {

	    $args = array(
			'sort_order' => 'ASC',
			'sort_column' => 'menu_order',
			'hierarchical' => 1,
			'authors' => $current_user->ID,
			'post_type' => 'page',
			'post_status' => 'publish'
		); 
		$pages = get_pages($args); 

		$content = str_replace('<option value="">(no parent)</option>', '<option disabled value="">(no parent)</option>', $content);
		$content = str_replace('<option class="level-0"', '<option disabled class="level-0"', $content);
		$content = str_replace('<option class="level-1"', '<option disabled class="level-1"', $content);
		$content = str_replace('<option class="level-2"', '<option disabled class="level-2"', $content);
		$content = str_replace('<option class="level-3"', '<option disabled class="level-3"', $content);
		$content = str_replace('<option class="level-4"', '<option disabled class="level-4"', $content);

		foreach ($pages as $page) {
			$content = str_replace('<option disabled class="level-0" value="' . $page->ID . '"', '<option class="level-0" value="' . $page->ID . '" selected', $content);	
			$content = str_replace('<option disabled class="level-1" value="' . $page->ID . '"', '<option class="level-1" value="' . $page->ID . '"', $content);
			$content = str_replace('<option disabled class="level-2" value="' . $page->ID . '"', '<option class="level-2" value="' . $page->ID . '"', $content);
			$content = str_replace('<option disabled class="level-3" value="' . $page->ID . '"', '<option class="level-3" value="' . $page->ID . '"', $content);
			$content = str_replace('<option disabled class="level-4" value="' . $page->ID . '"', '<option class="level-4" value="' . $page->ID . '"', $content);
		}

	}

	return $content;

}

if( strstr($_SERVER['REQUEST_URI'], 'wp-admin/post-new.php?post_type=page') || strstr($_SERVER['REQUEST_URI'], 'wp-admin/post.php' ) ) {
	ob_start('restrict_parent_pages');
}
?>

Update: Fixed a silly bug where the plugin only ran on new posts, not on the edit screen.

Update 2: Fixed a bug with WordPress 3.5 where Page Templates and Publish options were disabled. The code above and downloads are all updated.

Update 3: Fixed a bug where pages could be created without a parent. Now a parent is forced. Will try to make this an on/off option on a settings page in the future.

Fixing Text Flash with CSS3 Animation

Posted on

If you use CSS animations on a site you’ve probably noticed a strange text flash where the font smoothing changes whenever an animation runs. It’s been bugging me for months, and finally found the solution. It’s a known webkit bug.

To keep your font stable, simply add:

body { -webkit-transform: translate3d(0, 0, 0); }

Update: It seems this causes some other issues with page rendering and flashing as it is re-rendered on animations. I’ll update when I figure out a fix.

Display All Images Attached to a Post in WordPress

Posted on

I came across an issue for a site today where I wanted to display a ‘gallery excerpt’ for Gallery posts.

Letting the entire gallery through means (potentially) 100s of images loading on an index page, definitely not ideal visually or for page load. I gave the ‘Gallery Excerpt’ plugin a shot, but it doesn’t actually stop images being loaded – rather it just hides them with really poorly written markup.

The solution was instead to pull the first few images attached to the post and display them as the excerpt. Here’s the code to include in your theme:

<?php
$gallery = get_children( 'posts_per_page=5post_type=attachment&post_mime_type=image&post_parent=' . $post->ID );
$attr = array(
    'class' => "attachment-$size wp-post-image",
);
foreach( $gallery as $image ) {
     echo '<a href="' . wp_get_attachment_url($image->ID) . '" rel="gallery-' . get_the_ID() . '">';
     echo wp_get_attachment_image($image->ID, 'thumbnail', false, $attr);
     echo '</a>';
}
?>

Of course feel free to change the markup that is echoed out specific to your styling and for more or less photos adjust posts_per_page on the second line.