Child Themes Code Snippets.txt

Code Snippets for Building Child Themes in WordPress
by Morten Rand-Hendriksen

-----------------------------------------------------------------------
1.3
-----------------------------------------------------------------------

/*
Theme Name: The New Cool
Theme URI: URI to your theme
Description: Twentyten child-theme with seriously good looks
Author: Your name and a link to your site
Version: 0.0.1
Template: twentyten
Tags: two-columns, right-sidebar, custom-header, custom-colors, custom-background, custom-menu, theme-options, threaded-comments, sticky-post, translation-ready, microformats, rtl-language-support, editor-style
*/



-----------------------------------------------------------------------
1.4
-----------------------------------------------------------------------

/* Imports all styles from the TwentyTen stylesheet */
@import url('../twentyten/style.css');



-----------------------------------------------------------------------
2.2
-----------------------------------------------------------------------

/* Changes the width of the header and shifts it 20px to the left */
#header {
	padding: 0;
	margin: 0 0 0 -20px;
	background: #fff;
	width: 980px;
}

/* Sets the width of the header content */
#branding {
	width: 980px;
}

/* Positions the branding image */
#branding img {
	position: absolute;
	top: 0;
	left: 0;
	border-top: none;
	border-bottom: none;
	float: none;
	z-index: 0;
}

/* Gives the branding image a reference to position based on and sets the overall height */
#masthead {
	position: relative;
	height: 310px;
}

/* Lifts the site title to the top and changes its position and appearance */
#site-title {
	position: absolute;
	margin: 0;
	float:none;
	top: 170px;
	left: 20px;
	font-size: 40px;
	z-index: 10;
}

/* Lifts the site description to the top and changes its position and appearance */
#site-description {
	float: none;
	font-style: normal;
	margin: 0;
	position: absolute;
	color: #ffffff;
	text-transform: uppercase;
	top: 150px;
	left: 20px;
	width: 100%;
	z-index: 10;
}

/* Repositions and restyles the menu as a whole */
#access {
	background: #ffffff;
	margin: 5px auto 0 auto;
	width: 980px;
	position: absolute;
	bottom: 0px;
	height: 86px;
	border-top: 1px #ffffff solid;
	border-bottom: 1px #ffffff solid;
}

/* Realigns the menu by negating styles from TwentyTen */
#access .menu-header,
div.menu {
	font-size: 13px;
	margin-left: 0px;
	width: 978px;
}

/* Changes the size and appearance of each individual menu item */
#access a {
	line-height: 1.3em;
	padding: 14px 20px;
	width: 123px;
	height: 58px;
	font-size: 1.1em;
	text-transform: uppercase;
	color: #333333;
	font-weight: bold;
}



/* **************** */
/* OPTIONAL CONTENT */
/* **************** */

/* Changes the appearance of the menu item for the currently open page */
#access ul li.current_page_item > a,
#access ul li.current-menu-ancestor > a,
#access ul li.current-menu-item > a,
#access ul li.current-menu-parent > a {
	color: #fff;
	background: #358aa9;
}

/* Changes the hover state of the menu items */
#access li:hover > a,
#access ul ul :hover > a,
#access li:hover > a span,
#access ul ul :hover > a span {
	background: #358aa9;
	color: white;
}

/* Changes the colour of the description text when on the current page */
#access ul li.current_page_item > a span,
#access ul li.current-menu-ancestor > a span,
#access ul li.current-menu-item > a span,
#access ul li.current-menu-parent > a span {
	color: #fff;
}

/* Changes the position and width of the sub-menu list */
#access ul ul {
	top: 86px;
	left: 0;
	width: 123px;
}

/* Changes the width of each sub-menu item */
#access ul ul li {
	min-width: 123px;
}

/* Changes the colour and padding of the sub-menu items */
#access ul ul a {
	background: #4da9ca;
	color: #fff;
	padding: 10px 20px;
	width: 123px;
}

/* ******************** */
/* END OPTIONAL CONTENT */
/* ******************** */



-----------------------------------------------------------------------
2.3
-----------------------------------------------------------------------

define( 'HEADER_IMAGE_WIDTH', apply_filters( 'twentyten_header_image_width', 980 ) );
define( 'HEADER_IMAGE_HEIGHT', apply_filters( 'twentyten_header_image_height', 224 ) );
	

	
-----------------------------------------------------------------------
3.1
-----------------------------------------------------------------------

<a href="<?php echo home_url( '/' ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">

</a>



-----------------------------------------------------------------------
3.2
-----------------------------------------------------------------------

For testing:
<?php if (is_page()) { echo "This is a page"; } else { echo "This is not a page";} ?>

The actual query:
( is_page() && is_singular() && current_theme_supports( 'post-thumbnails' )



-----------------------------------------------------------------------
3.3
-----------------------------------------------------------------------

// For testing:
function remove_twentyTen_headers() {
	unregister_default_headers( 
	'berries'
	);
}

add_action('after_setup_theme', 'remove_twentyTen_headers', 11);

// Remove all:
function remove_twentyTen_headers() {
	unregister_default_headers( array(
	'berries',
	'cherryblossom',
	'concave',
	'fern',
	'forestfloor',
	'inkwell',
	'path',
	'sunset'	
	));
}

// Add new default header image
register_default_headers( 
	array(
		'TheNewCool' => array(
			'url' => "%s/../thenewcool/images/HPmainGeneric.png",
			'thumbnail_url' => "%s/../thenewcool/images/HPmainGenericThumb.png",
			/* translators: header image description */
			'description' => __( 'The New Cool Header', 'twentyten' )
		)
	) 
);



-----------------------------------------------------------------------
4.1
-----------------------------------------------------------------------

// This theme uses wp_nav_menu() in two locations.
register_nav_menus( array(
	'header' => __( 'Header Navigation', 'twentyten' ),
	'footer' => __( 'Footer Navigation', 'twentyten' ),
) );
	
// Remove the default menu function
function tnc_remove_default_menu() {
	unregister_nav_menu( 'primary' );
}

add_action('after_setup_theme', 'tnc_remove_default_menu', 11);



-----------------------------------------------------------------------
4.2
-----------------------------------------------------------------------

Based on theme location:
<?php wp_nav_menu( array( 'container_class' => 'menu-footer', 'theme_location' => 'footer' ) ); ?>

Based on name:
<?php wp_nav_menu( array( 'container_class' => 'menu-footer', 'menu' => 'Footer Menu' ) ); ?>

<div id="footerMenu">
	<?php wp_nav_menu( array( 'container_class' => 'menu-footer', 'theme_location' => 'footer' ) ); ?>
</div>



-----------------------------------------------------------------------
5.1
-----------------------------------------------------------------------

Test with text:
<li id="permanent">
	This is some permanent text
</li>

Permanent image with link to Twitter account
<div id="fixed" class="widget-area">
	<ul class="xoxo">
		<li id="permanent">
			<a href="http://www.twitter.com/mor10" title="Mor10 on Twitter" target="_blank"><img src="<?php echo get_stylesheet_directory_uri(); ?>/images/HPonTwitter.png" alt="Hansel &amp; Petal on Twitter" target="_blank"/></a>
		</li>	
	</ul>
</div>



-----------------------------------------------------------------------
5.2
-----------------------------------------------------------------------

// Remove parent theme widgets by calling unregister_sidebar() 
function tnc_remove_widgets(){

	unregister_sidebar( 'fourth-footer-widget-area' );
}

add_action( 'widgets_init', 'tnc_remove_widgets', 11 );


// Register new widgetized areas
function tnc_widgets_init() {

( register_sidebar() goes here )

}
/** Register sidebars by running twentyten_widgets_init() on the widgets_init hook. */
add_action( 'widgets_init', 'tnc_widgets_init' );

// Two new widgetized areas
	// Area 1a, below Area 1 to the left.
	register_sidebar( array(
		'name' => __( 'Left Widget Area', 'twentyten' ),
		'id' => 'left-widget-area',
		'description' => __( 'Left widget area', 'twentyten' ),
		'before_widget' => '<li id="%1$s" class="widget-container %2$s">',
		'after_widget' => '</li>',
		'before_title' => '<h3 class="widget-title">',
		'after_title' => '</h3>',
	) );

	// Area 1b, below Area 1 to the right.
	register_sidebar( array(
		'name' => __( 'Right Widget Area', 'twentyten' ),
		'id' => 'right-widget-area',
		'description' => __( 'Right widget area', 'twentyten' ),
		'before_widget' => '<li id="%1$s" class="widget-container %2$s">',
		'after_widget' => '</li>',
		'before_title' => '<h3 class="widget-title">',
		'after_title' => '</h3>',
	) );

	

-----------------------------------------------------------------------
5.3
-----------------------------------------------------------------------

Create two new widgetized areas:
<div id="leftRight">
<?php
	// Left widget area
?>

		<div id="leftWidgets" class="widget-area" role="complementary">
			<ul class="xoxo">
				<?php dynamic_sidebar( 'left-widget-area' ); ?>
			</ul>
		<...