Modify Photogram Theme

HI there!

Today i want to share a simple modification for your Photogram theme. At this modification, you will be able to:

  • Hide the slider
  • Add Custom credit

Great isn’t it?

Step#1

At this first step you have to modify a file named ‘theme-options.php‘. At this file you have to declare the options to displaying/hide the slider and also a text area where you can type your credit.

If you don’t know where is the file, you can login into your FTP and access this directory: wp-content > themes > photogram > includes.

Open that file and find out this code:

$options[] = array( "name" => __("FrontPage Settings","colabsthemes"),
					"type" => "heading",
					"icon" => "home");

Modify that code become:

$options[] = array( "name" => __("FrontPage Settings","colabsthemes"),
					"type" => "heading",
					"icon" => "home");

$options[] = array( "name" => "Disable Slider",
					"desc" => "You can disable slider on the homepage",
					"id" => $shortname."_disable_slider",
					"std" => "false",
					"type" => "checkbox");

$options[] = array( "name" => __("Custom Credit", "colabsthemes" ),
					"desc" => __("Type your credit here", "colabsthemes" ),
					"id" => $shortname."_credit_custom",
					"class" => "",
					"type" => "textarea");

That’s on the step#1. You can check the theme dashboard, there should be 2 new options added under front page settings.

Step#2

At this second steps you have to modify 2 files: header.php and footer.php. At those files you have to declare the options you just create at the first step.

First, we will modify the header.php. As you can check on the first step, there is an option to displaying a check box. If this check box is active, then your slider will be hidden.

Open the file and find out this code:

<?php
if(is_home()){
$featured = new WP_Query(array('post__in' => get_option('sticky_posts'), 'ignore_sticky_posts' => 1));
if ($featured->have_posts()) :
?>
<section class="featured-slider container">
  <div class='row'>
  <div class="slider-container">
    <?php

		while ($featured->have_posts()) : $featured->the_post(); if(colabs_image('link=img&return=true')==null) continue;
		$image = colabs_image('width=55&height=55&return=true');
		$pattern = '/src="([^"]*)"/';
		preg_match($pattern, $image, $matches);
		$src = $matches[1];
		unset($matches);
		echo'
			<div class="slider-slide" data-thumbnail="'.$src.'">
			  <div class="slider-image">
				'.colabs_image('width=563&height=370&return=true').'
			  </div>
			  <div class="slider-text">
				<h2 class="slider-title"><a href="'.get_permalink().'">'.get_the_title().'</a></h2>
				<p>'.home_excerpt().'</p>
			  </div>
			</div><!-- .slider-slide -->
		';
		endwhile;
		wp_reset_postdata();
    ?>

  </div><!-- .slider-container -->
  </div>

  <div class="slider-dir-nav row">
    <a href="#" class="prev"></a>
    <a href="#" class="next"></a>
  </div>
  <div class="slider-nav row"></div>
</section><!-- .featured-slider -->
<?php
endif;
}
?>

Edit that code become:

<?php
global $themename,$colabs_options;
if( $colabs_options['colabs_disable_slider'] != 'true' ){

if(is_home()){
$featured = new WP_Query(array('post__in' => get_option('sticky_posts'), 'ignore_sticky_posts' => 1));
if ($featured->have_posts()) :
?>
<section class="featured-slider container">
  <div class='row'>
  <div class="slider-container">
    <?php

		while ($featured->have_posts()) : $featured->the_post(); if(colabs_image('link=img&return=true')==null) continue;
		$image = colabs_image('width=55&height=55&return=true');
		$pattern = '/src="([^"]*)"/';
		preg_match($pattern, $image, $matches);
		$src = $matches[1];
		unset($matches);
		echo'
			<div class="slider-slide" data-thumbnail="'.$src.'">
			  <div class="slider-image">
				'.colabs_image('width=563&height=370&return=true').'
			  </div>
			  <div class="slider-text">
				<h2 class="slider-title"><a href="'.get_permalink().'">'.get_the_title().'</a></h2>
				<p>'.home_excerpt().'</p>
			  </div>
			</div><!-- .slider-slide -->
		';
		endwhile;
		wp_reset_postdata();
    ?>

  </div><!-- .slider-container -->
  </div>

  <div class="slider-dir-nav row">
    <a href="#" class="prev"></a>
    <a href="#" class="next"></a>
  </div>
  <div class="slider-nav row"></div>
</section><!-- .featured-slider -->
<?php
endif;
}
}
?>

After you done with it, you can start trying the option to hide the slider.

The next objective is to displaying a custom credit. Open a file named footer.php and find out this code:

<?php colabs_credit(); 	?>

Modify that code become:

<?php
		global $themename,$colabs_options;
		if( $colabs_options['colabs_credit_custom'] != '' ){
			echo get_option('colabs_credit_custom');
		} else {
			colabs_credit();
		}
		?>

And done!

At the text area to write down the custom credit, you can also type a custom HTML code.

Advertisements

10 thoughts on “Modify Photogram Theme

  1. Hi Christian, thanks for the tip above.

    You said “…At the text area to write down the custom credit, you can also type a custom HTML code…”
    Can you please give an example using the code your provided above?

    I did the above like so:
    “global $themename,$colabs_options;
    if( $colabs_options[‘colabs_credit_custom’] != ” ){
    echo get_option(‘colabs_credit_custom’);
    } else { … ”

    Every time I tried putting a text in the custom credit , the enter credit note is missing;
    eg, if( $colabs_options[‘colabs_credit_custom’] != ‘My text here’ ).
    Could you please help?

    I am considering going into ‘theme-options.php’ and ‘theme-functions.php’ to change it (hard code?) from there but I would prefer to play it safe and customise it via footer.php in my child theme.

    • Hi Dream,

      You can use this code for the theme option:

      $options[] = array( "name" => __("Footer Settings","colabsthemes"),
      					"icon" => "misc",
      					"type" => "heading");
                          
      $options[] = array( "name" => __("Footer Credit","colabsthemes"),
      					"desc" => __("Type your custom credit here","colabsthemes"),
      					"id" => $shortname."_footer_credit",
      					"std" => "",
      					"type" => "textarea");  		
      

      And to call the footer credit which you have to put at footer.php:

      <?php
      			echo get_option('colabs_footer_credit');
      			?>
      
  2. How can I remove the slider from all pages? The above instructions remove it from the main page but for each post the slider still appears.

  3. What im asking is how to remove the slider from the site entirely. As of now I was able to remove it from the main page but it still appears within each post. Thx!

    • You can open and edit a file named ‘single.php’ and find out this code:

      $attachments = get_children( array(
      				'post_parent' => get_the_ID(),
      				'numberposts' => 100,
      				'post_type' => 'attachment',
      				'post_mime_type' => 'image' )
      

      modify it become:

      $attachments = get_children( array(
      				'post_parent' => get_the_ID(),
      				'numberposts' => 100,
      				'post_type' => 'attachment',
      				'showposts' => 1,
      				'post_mime_type' => 'image' )
      				);
      
  4. Is there any way to adjust the slider so it does not show every single post that has a featured image? I would like it very much if I could just handpick the posts that I want to show through the slider, but I can’t seem to find out where or what to edit.

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