Lensa Page Sidebar

Hello again!

By default, the page of Lensa theme doesn’t have any sidebar. The sidebar only available when you are on the single post, a template, archive and the shop page.

The question now is, how to get a sidebar displayed when you are on the page.

To make this work, you have to modify 2 files: theme-options.php and page.php.

Step #1

At this first step, you have to edit a file named theme-options.php. At this file you have to create an option to let you choose whether your page should have a sidebar or not. You can find out this file via FTP > wp-content > themes > lensa > includes.

Open the file and find out this code:

$colabs_metaboxes = array();
$colabs_metabox_settings = array();
global $post;

Once you find it, put this code just below it:

$colabs_metabox_settings['page'] = array(
                                'id' => 'colabsthemes-settings',
								'title' => 'ColorLabs' . __( ' Page Detail Settings', 'colabsthemes' ),
								'callback' => 'colabsthemes_metabox_create',
								'page' => 'page',
								'context' => 'normal',
								'priority' => 'high',
                                'callback_args' => ''
								);

if ( ( get_post_type() == 'page') || ( !get_post_type() ) ) {

	$colabs_metaboxes[] = array (  "name"  => $shortname."_get_sidebar",
					            "std"  => "",
					            "label" => __("Display Sidebar?","colabsthemes"),
					            "type" => "checkbox",
					            "desc" => __("","colabsthemes"));

}

Once you made it, save your file and you can go to: WordPress dashboard > page. You can test to add/edit your page, a new meta box already there named Display Sidebar?. By this option later we will able to choose whether the sidebar should be displayed or not.

Step#2

At this step you have to modify your page.php. You can copy the code below and replace all codes inside it:

<?php get_header(); ?>
<div class="row">
    <header class="page-heading block-background block-inner">
      <h3><?php the_title(); ?></h3>
	  <div class="minimize"></div>
    </header><!-- .page-heading -->
  
	<?php if(get_post_meta($post->ID, 'colabs_get_sidebar', true)=='true') {?>
		<div class="main-content block-background column col8">
	<?php } else { ?>
		<div class="main-content block-background column col12">
	<?php } ?>
	 <?php
	  if(have_posts()) : while(have_posts()): the_post();
	 ?>
      <div class="block-inner">
        <article class="entry-post">
          
          <div class="entry-content">
			<?php the_content(); ?>
			<?php wp_link_pages(array('before' => __('<p><strong>Pages:</strong>','colabsthemes'), 'after' => '</p>', 'next_or_number' => 'number')); ?>
		  </div><!-- .entry-content -->
          
        </article>
        
		<?php comments_template(); ?>
        
      </div><!-- .block-inner -->
	 <?php
	  endwhile;	  
	  endif;
	 ?>
    </div><!-- .main-content -->
    <?php 
	if(get_post_meta($post->ID, 'colabs_get_sidebar', true)=='true') { get_sidebar(); } else {} 
	?>
  </div>
<?php get_footer(); ?>

And done!

Advertisements

10 thoughts on “Lensa Page Sidebar

  1. Hi, sorry i’m asking this in the wrong place. I’m new to wordpress and ur blog has been a great help but I can’t find your email to ask directly. Anyway, how do you change the font on Lensa theme? The default Header and Slider subject font of bebasneueregular is too thick, but every time I try to get it thin, or try something else like HelveticaNeueLight it seems to default to another font, and looks messy.

    Looking forward to your reply.

    • Hi Yahya4k,

      To change the font family, you can edit a file named ‘style.css’. Find out this code:


      .slide-title a {
      font-family: "BebasNeueRegular", sans-serif;
      font-size: 40px;
      color: #fff;
      padding: 9px 17px;
      text-decoration: none;
      display: -moz-inline-stack;
      display: inline-block;
      vertical-align: middle;
      *vertical-align: auto;
      zoom: 1;
      *display: inline;
      font-weight: normal;
      }

      .slide-caption {
      color: #d0cfcf;
      padding: 9px 17px;
      font-family: "Open Sans", sans-serif;
      }

      You can change the font declared on those codes

    • Hi Arturo,

      you can use this code at your style.css:

      body.page-template-template-contact-php .primary-sidebar {display:none;}
      body.page-template-template-contact-php .main-content {width: 100% !important;}
      
    • Hi,

      you can simply replace your single.php file with this codes:

      <?php get_header(); ?>
      <div class="row">
          <header class="page-heading block-background block-inner">
            <h3><?php _e("Single","colabsthemes"); echo ' '.get_post_type(); ?></h3>
      	  <div class="minimize"></div>
          </header><!-- .page-heading -->
        
          <div class="main-content block-background column col12">
      	 <?php
      	  if(have_posts()) : while(have_posts()): the_post();
      	 ?>
            <div class="block-inner">
              <article class="entry-post">
                <header class="entry-header">
                  <h2 class="entry-title"><?php the_title(); ?></h2>            
      		    <?php colabs_post_meta(); ?>
                </header>
                  
                <figure class="entry-media">
      			<?php  
      					$single_top = get_post_custom_values("colabs_single_top");
      					if (($single_top[0]!='')||($single_top[0]=='none')){
      						if ($single_top[0]=='single_video'){
      							$embed = colabs_get_embed('colabs_embed',400,231,'single_video',$post->ID);
      							if ($embed!=''){
      								echo '<div class="single_video">'.$embed.'</div>'; 
      							}
      						}elseif($single_top[0]=='single_image'){
      							colabs_image('width=620&link=img');				
      						}										
      					}
      			?>
                </figure><!-- .entry-media -->
                
                <div class="entry-content">
      			<?php the_content(); ?>
      			<?php wp_link_pages(array('before' => __('<p><strong>Pages:</strong>','colabsthemes'), 'after' => '</p>', 'next_or_number' => 'number')); ?>
      		  </div><!-- .entry-content -->
                
                <?php echo colabs_share(); ?>
              </article>
              
      		<?php comments_template(); ?>
              
            </div><!-- .block-inner -->
      	 <?php
      	  endwhile;	  
      	  endif;
      	 ?>
          </div><!-- .main-content -->
          
        </div>
      <?php get_footer(); ?>
      
      • Thanks !
        I’ll try it.
        Another option I’ve figured out yesterday and worked for me too:
        1) In the CSS file I’ve located the Sidebar definitions (ctrl-F and search for sidebar).

        2) Locate the part that defines the .primary-sidebar

        3) Either neutralize the specific lines of code by using /* in the beginning and */ at the end of the part you want to “neutralize” or just to delete it completely. I’ve just neutralized it like this:
        /* ===================================================================
        #Sidebar
        =================================================================== */
        /*.primary-sidebar {
        margin-right: 0.51125%;
        width: 33.84458%;
        }*/

        4) Instead of it I added the following lines of code:
        .primary-sidebar {display:none;}
        .main-content {width: 100% !important;}

        And that’s all. It worked great.

        Thanks for the help and support 🙂
        Ran

  2. Hello Tandamerah,
    I followed your instructions and the sidebar is displayed when I am creating a new page. However, it doesn’t work with my Shop page which is also called “Archive Product” page. Do you know if there is a way to activate a sidebar on it?

    • Hi Aragonlesage,

      Yes, the instruction can’t be used to controlling the shop page. There is another file you have to modify: single-product.php.

      If you are using WooCommerce, you can find out this file by logging in into FTP and go to directory: wp-content > themes > lensa > woocommerce. Once you open the file, find out this code:

      <div class="main-content block-background column col8">
      
      <?php do_action('woocommerce_sidebar'); ?>
      

      modify those codes become:

      <div class="main-content block-background column col12">
      
      <?php //do_action('woocommerce_sidebar'); ?>
      

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s