1

I am working with twenty fourteen theme. I want to customize the full-width template for my needs, to make it wider on specific pages. so I copied it into a sub folder in my child theme.

how do I embed styling that will affect this template ONLY?

tried this, but it doesnt work: http://www.transformationpowertools.com/wordpress/real-full-width-page-template-twentyfourteen

p.s: I am not a developer :(

  • what is the sub-folder name, and what is the file name of the full width page template? what CSS class have you tried to use? – Michael Feb 27 '17 at 2:25
  • sub-folder, file name: twentyfourteen-child/page-templates/real-full-width.php CSS: .site { max-width: 100%; } .site-header { max-width: 100%; } .site-content .entry-header, .site-content .entry-content, .site-content .entry-summary, .site-content .entry-meta, .page-content { max-width: 80%; } .comments-area { margin: 48px auto; max-width: 80%; padding: 0 10px; } .site-content .entry-meta { max-width:100%; } .primary-navigation { float: left; margin: 0 65px; } .hentry { max-width: 930px; } – troy Feb 27 '17 at 13:25
  • couldnt paste the code properly, sorry. back-ticks didnt work for some reason. – troy Feb 27 '17 at 13:34
0

How do I embed styling that will affect this template only?

The trick is to hook into template_include. This allows us to see which template is being applied to a page.

Suppose we have a template with a basename of 'full-width.php'. Inside our template_include callback, we can conditionally enqueue a CSS style only when the template is full width.

function wpse_258048_template_include( $template ) {
  if( 'full-width.php' === basename( $template ) ) {
    wp_enqueue_style( 'full-width', PATH_TO . '/full-width.css' );
  }
  return $template;
}
add_action( 'template_include', 'wpse_258048_template_include', 1000, 1 );
|improve this answer|||||
  • so I figured it out thanks to dobsondev.com/2015/06/05/… I added this code to functions.php and it works great. looks very similar to your solution: ` function register_foundation_style() { if ( is_page_template( 'page-templates/full-width.php' ) ) { wp_enqueue_style( 'full-width', get_stylesheet_directory_uri() . '/full-width.css' ); } } add_action( 'wp_enqueue_scripts', 'register_foundation_style' ); ` – troy Feb 27 '17 at 20:07
0
function register_foundation_style() {
  if ( is_page_template( 'page-templates/full-width.php' ) ) {
    wp_enqueue_style( 'full-width', get_stylesheet_directory_uri() . '/full-width.css' );
  }
}
add_action( 'wp_enqueue_scripts', 'register_foundation_style' );
|improve this answer|||||

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.