WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Twenty Twelve Child Theme Body Class? (5 posts)

  1. Inspired Media
    Member
    Posted 1 year ago #

    Hi All,

    Currently I am working on a child theme for Twenty Twelve theme, where I have a custom made homepage. I first created this homepage, so it all looks good. But now when I add a widget to the sidebar, it changes the body class.

    From:
    <body class="home page page-id-5 page-template page-template-startpagina-php logged-in full-width custom-font-enabled single-author">

    Into:
    <body class="home page page-id-5 page-template page-template-startpagina-php logged-in custom-font-enabled single-author">

    How do I fix this, so it doesn't change body class on the homepage? The rest of the content pages on this side will all have a sidebar.

  2. paulwpxp
    Font hero
    Posted 1 year ago #

    You can remove the action in function.php or add your own, but there is no benefit in doing this, because you will mess up the layout for full-width page template and attachment page too.

  3. alchymyth
    The Sweeper & Moderator
    Posted 1 year ago #

    you will need to compensate the change of the body_class in functions.php of your child theme, for the startpagina.php page template;

    example:

    function twentytwelvechild_body_class( $classes ) {
    
    	if ( is_page_template( 'frontpagina.php' ) )
    		$classes[] = 'full-width';
    
    	return $classes;
    }
    add_filter( 'body_class', 'twentytwelvechild_body_class', 20 );
  4. Inspired Media
    Member
    Posted 1 year ago #

    Alchymyth, thanks alot, this fixed it!

  5. paulwpxp
    Font hero
    Posted 1 year ago #

    The point of body_class() is so that you can assign changes based on CSS classes, so in this case I find it a little unintuitive to filter the function instead of making use of classes that WP already made for you.

    It only needs 1 line of CSS targeting your class to make the page behave like .full-width.

    For example ( used in child theme's)

    @media screen and (min-width: 600px) {
    	body.page-id-5 .site-content {width:100%;}
    }

    The thing that has to be done in function is changing the $content_width of this page to 960 if you care for the embed to be full width on this page.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.