WordPress.org

Forums

Events Manager
[resolved] Full-width at Twenty Fourteen Theme (15 posts)

  1. T_eki_
    Member
    Posted 2 years ago #

    Hi,

    i'am using the Twenty Fourteen Theme with the Event Manager plugin.
    At the single-event site, i would like to use the Full-width.
    I changend at backend the settings for "Full-width template".

    But nothing happend.

    In your tutorial (http://wp-events-plugin.com/tutorials/using-theme-templates-for-event-and-location-pages/), I read that I have to fill the textbox of Body Class with "full-width".

    But also there, nothing happend.

    What i have to do?

    https://wordpress.org/plugins/events-manager/

  2. caimin_nwl
    NetWebLogic Support
    Posted 2 years ago #

    Hi,

    Can you post a link to the page that's not working and a link to a page that uses the template you want to use? Thanks.

  3. T_eki_
    Member
    Posted 2 years ago #

    Hi,

    the new site is secured with .htaccess, at the moment. :(

    I did to screenshots:

    1) Setting:"Full-width template" // Body Classe: empty

    http://s1.directupload.net/images/140205/ekv5evmt.png

    2)Setting:"Full-width template" // Body Classe: "full-width"

    http://s1.directupload.net/images/140205/nmemgvwj.png

    With the secound optinon, the content move only right

  4. caimin_nwl
    NetWebLogic Support
    Posted 2 years ago #

    Thanks, but I was hoping to be able to see something in the source code.

    Different idea: try making a copy of the template you want to use and renaming it single-event.php. If you have events set to display as posts, your theme should use that template for the single events page.

  5. T_eki_
    Member
    Posted 2 years ago #

    I tested it with the single-event.php. Nothing changed.

    As in the tutorial, I copied the config of the body-clas from a page with full-width:

    class="page page-id-6 page-child parent-pageid-4 page-template page-template-page-templatesfull-width-php custom-background masthead-fixed full-width singular"

  6. Philip John
    Member
    Posted 2 years ago #

    Hiya,

    You shouldn't need to (nor should you) set the body class manually - you should use the body_class() function.

    Can you confirm if you copied the full width template file and named it single-event.php? That should so it.

    Or, edit your main event page and choose the Full Width template in the drop down.

    Thanks

  7. T_eki_
    Member
    Posted 2 years ago #

    I copied the full-width.php to single-event.php

    full-width.php

    <?php
    /**
     * Template Name: Full Width Page
     *
     * @package WordPress
     * @subpackage Twenty_Fourteen
     * @since Twenty Fourteen 1.0
     */
    
    get_header(); ?>
    
    <div id="main-content" class="main-content">
    
    <?php
    	if ( is_front_page() && twentyfourteen_has_featured_posts() ) {
    		// Include the featured content template.
    		get_template_part( 'featured-content' );
    	}
    ?>
    
    	<div id="primary" class="content-area">
    		<div id="content" class="site-content" role="main">
    			<?php
    				// Start the Loop.
    				while ( have_posts() ) : the_post();
    
    					// Include the page content template.
    					get_template_part( 'content', 'page' );
    
    					// If comments are open or we have at least one comment, load up the comment template.
    					if ( comments_open() || get_comments_number() ) {
    						comments_template();
    					}
    				endwhile;
    			?>
    		</div><!-- #content -->
    	</div><!-- #primary -->
    </div><!-- #main-content -->
    
    <?php
    get_sidebar();
    get_footer();

    The diferent to the normal side is that there is no entry for the right sidebar.

    There was no diferent to the other configuration.

  8. angelo_nwl
    NetWebLogic Support
    Posted 2 years ago #

  9. bluantinoo
    Member
    Posted 2 years ago #

    This happens because of the way twentyfourteen applies classes to the body.

    Infact it doesn't uses different html layout for for pages without sidebar. It just adds some classes to the body, with a function (that you can find at line 412 of twentyfourteen/functions.php)

    I mean, the full width pages are 100% width just because there is this rule in css

    .full-width .hentry {
    max-width: 100%;
    }

    if you want a quick hack just edit that function at line 427/432
    from this:

    if ( ( ! is_active_sidebar( 'sidebar-2' ) )
    		|| is_page_template( 'page-templates/full-width.php' )
    		|| is_page_template( 'page-templates/contributors.php' )
    		|| is_attachment() ) {
    		$classes[] = 'full-width';
    	}

    to this (adding your custom template file name)

    if ( ( ! is_active_sidebar( 'sidebar-2' ) )
    		|| is_page_template( 'page-templates/full-width.php' )
    		|| is_page_template( 'page-templates/contributors.php'
                    || is_page_template( 'page-templates/MY-PAGE-TEMPLATE.php' )
    		|| is_attachment() ) {
    		$classes[] = 'full-width';
    	}

    obviously you have to put your MY-PAGE-TEMPLATE.php file inside the page-template folder of twentyfourteen.

    Instead, if you're using a child theme, you can just look at the body tag of the page you want to be 100% width and replicate that rule in css for a class present in your page (like it's done for "full-width"):

    .YOUR-CLASS .hentry {
    max-width: 100%;
    }

    Last one: if you can't find a specific class you can use, just add this snippet in your child theme functions.php
    http://stv.whtly.com/2011/02/19/wordpress-append-page-slug-to-body-class/
    it adds the current page slug as body class, so you can use it in your css rules.

  10. Michael
    Forum Moderator
    Posted 2 years ago #

    the 'full-width' page tempalte of Twenty Fourteen only refers to the elimination of the right sidebar (if present at all) - the left sidebar remains unchanged.

    for a 'real full width' page template see my recent article http://www.transformationpowertools.com/wordpress/real-full-width-page-template-twentyfourteen

  11. bluantinoo
    Member
    Posted 2 years ago #

    alchymyth, indeed your page is a full-full-width :)

  12. reseo
    Member
    Posted 1 year ago #

    Hello everyone,

    I have an issue with my full width page. I followed @alchmyth article. But that didn't fix my problem.

    you can see my issue here:
    http://www.arthalla.com/store/

    I can't figure out how to remove the right sidebar. I also don't know why it's still there. I followed Michaels guide and according to this - it should actually work.

    Just can't find the problem here.. uff...

    thx for any little help - appreciate it !

  13. astromono
    Member
    Posted 1 year ago #

    Hi, I tried to add the following code to a child theme. It's supposed to call a custom post type template I made but every time I try it, I get a blanks screen and WordPress breaks:

    function astra_body_classes( $classes ) {
    	if ( ( ! is_active_sidebar( 'sidebar-2' ) )
    		|| is_page_template( ‘page-templates/single-am_extra.php' )
    	$classes[] = 'full-width';
    	return $classes;
    }
    
    add_filter( 'body_class', 'astra_body_classes' );

    Please help!

    Thanks!

  14. astromono
    Member
    Posted 1 year ago #

    Nevermind, guys!

    Solved it (with a bit of help) by using this code:

    // Add specific CSS class by filter
    add_filter( 'body_class', 'my_class_names' );
    function my_class_names( $classes ) {
     if ( get_post_type() == 'am_extra' ) {
            if ( is_single() ) {
     // add 'class-name' to the $classes array
     $classes[] = 'full-width'; }
    }
     // return the $classes array
     return $classes;
    }

    It adds the full width class only to single posts that use the "am_extra" template for my registered post type. I think it's neat in that it's short and won't get wiped out if we ever get a new twenty fourteen version.

    Cheers,

    Luis

  15. kreativito
    Member
    Posted 1 year ago #

    do you have to add this code only to your css file ?
    is this all ?

    do you mind sharing what needs to be done step by step ?
    is it possible to install it like a plugin ?

    I can't program at all and would need to have a basically two columns.

    One left for navigation, and then one on the right side.
    That's it.

    thank you so much for any little help !

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • Events Manager
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic

Tags

No tags yet.