public
Last active

Loads a template part incl. the appropriate stylesheet for desktop or mobile devices, based on custom conditional tags.

  • Download Gist
get_device_template.php
PHP
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69
<?php
/**
* STYLESHEETS
*/
function print_device_styles( $client = 'desktop' )
{
$client = apply_filters( 'set_theme_client', $client );
wp_enqueue_style( $client.'-css' );
}
add_action( 'wp_head', 'print_device_styles', 11 );
/**
* TEMPLATE PARTS
* The functionallows 3 subfolders for template parts that sit in a theme root folder named _devices_.
*/
function get_device_template_part( $args = array( 'file' => NULL, 'suffix' => 'default', 'client' => 'desktop', 'media' => 'screen' )
{
if ( ! $args['file'] )
wp_die( sprintf( __('You have to specify a file name if you want to load a template part with the %1$s function.', 'textdomain', '<pre>get_device_template_part()</pre>' );
$template_path = trailingslashit( STYLESHEETPATH.'/devices/templates-'.$args['client'] );
$ui_path = trailingslashit( STYLESHEETPATH.'/ui/css-'.$args['client'] );
$ui_suffix = '.css'; // could be switched between '.dev.css' & '.css'
// add styles & template directory
// NOTE: You have to define the following two functions on your own.
// Just get some device detection class and add them.
if ( is_condition_mobile() )
{
$args['client'] = 'mobile';
$args['screen'] = 'handheld';
}
elseif ( is_condition_tablet() )
{
$args['client'] = 'tablet';
$args['screen'] = 'handheld';
}
// register styles
// Example: wp_register_style( 'mobile-css', /theme_root/ui/css-mobile/mobile.css, false 'handheld' );
wp_register_style( $args['client'].'-css', $ui_path.$args['client'].$ui_suffix, false, $args['screen'] );
add_filter( 'set_theme_client', function('set_theme_client') { return $args['client'];} );
// REQUIRE file
// {$template}-{$suffix}.php
if ( file_exists( $template_path.$args['file'].'-'.$args['suffix'].'.php' ) )
{
require( $template_path.$args['file'].'-'.$args['suffix'].'php' );
}
// {$template}.php
elseif ( file_exists( $template_path.$args['file'].'.php' ) )
{
require( $template_path.$args['file'].'.php' );
}
// {$template}-default.php
elseif ( file_exists( $template_path.$args['file'].'-default.php' ) )
{
require( $template_path.$args['file'].'-default.php' );
}
}
// CALL THEM in a template file
// This will require a file named {$template}-{$suffix}.php from your devices folder
// based on your conditional functions that detect your devices
// If not found, it will search for a file named {$template}.php
// and if it wasn't found it will search for a file named {$template}-default.php
get_device_template_part( array( 'file' => 'nav', 'suffix' => 'main' ) );
?>

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.