WordPress.org

Ready to get started?Download WordPress

Forums

Different post colors (29 posts)

  1. akoetsier
    Member
    Posted 3 years ago #

    Hi guys!

    I am working on a jobboard and came across the jobs.smashingmagazine.com jobboard which has a few options i also would like to see integrated but just dont know how.

    1) As you can see the first post has a white background , the second post has a grey bg , third white bg again etc etc.

    2) The new post have a "new" image behind the title , this will last for a day.

    Could anyone tell me how this is done , or point me in the right direction ?

    Thanks a lot

    Regards,
    Alvin

  2. chewbears
    Member
    Posted 3 years ago #

    Very easy to do. I am going to tell you how the site you mentioned did it as I do not know what your variables are in your layout.

    They have a div id for job (yours is post) has 2 classes. One class that is .listingItem and one class that is .even

    .listingItem {
    padding:13px 7px;
    position:relative;
    }

    .even {
    background-color:#F1F1FF;
    border:1px solid #EBEBFF;
    }

    so they then just use the php in the index.php to flip flop these 2 classes. One class is "listingItem" and the other is "listingItem even"I don't have the wordpress files with me to show you but hopefully this and the advice below get you sorted out.

    Also a suggestion is get firefox and download firebug so you can look at websites better. It will help you see what they are doing in the script, css, and html. Will help you more then you ever know.

  3. akoetsier
    Member
    Posted 3 years ago #

    A thank you Chewbears!

    I have downloaded firebug and i can see codes but i am not a php expert , so wp is still much hocus pocus for me :(

    So if i am correct the ".even" changes the background for the even post numbers ?
    If i put this in my .css , what should i modify in my index.php ?

    Anyway now i now what to look for , thanks a lot!

    Regards,
    Alvin
    The Netherlands

  4. chewbears
    Member
    Posted 3 years ago #

    Alvin without seeing your site I can not really tell you much more. But you need to find what I think is standard called "postwrap" and change that to one color and make a statement that adds a different color to the other background. Can you link your site?

  5. akoetsier
    Member
    Posted 3 years ago #

    Hi Chewbears!
    I have found a tutorial which explains the code
    See tutorial here clicky

    I have posted my code there , could you please look into it?

    My website is called http://www.luchthavenpersoneel.nl , its the same theme used as jobs.smashingmagazine.com

    Thank you so far!

    Regards,
    Alvin

  6. chewbears
    Member
    Posted 3 years ago #

    Alright here is how I would do it!

    Guide

    Follow that guide. It works for your site. you just have to rename the class in the loop and the style sheet. LMK if you have questions

  7. Tara
    Member
    Posted 3 years ago #

    I don't mean to highjack the thread.
    But can someone guide please how to accomplish this in Twenty Ten?

    Thanks.

  8. aubatt
    Member
    Posted 3 years ago #

    Very userful information! I am just google it on the internet. Thank you,my dear friend!

  9. akoetsier
    Member
    Posted 3 years ago #

    Yes chewbears , that is the guide i pointed you to haha :)
    I have read it and tried it but i get errors constantly.

    Here's the php ;

    <div class="content">
    
    			<?php
    			global $post;
    
    			$myposts= array();
    			$args = array(
    			'showposts' => 20,
    			'meta_key' => "active",
    			'meta_value' => "false",
    			'meta_compare' => "!="
    			);
    
    			query_posts($args);
    
    			if (have_posts())
    			{
    				while ( have_posts() )
    				{
    					the_post ();
    					if( (get_post_meta($post->ID, "featuredjob", true)=="1" && get_post_meta($post->ID, "payfeaturedjob", true)=="Yes") )
    					{
    						$post = get_post($post->ID);
    
    						$posttime = $post->post_date;
    
    						$posttime = explode(" ", $posttime);
    
    						$currenttime = current_time(mysql);
    
    						$currenttime = explode(" ", $currenttime);
    
    						$inposttime = $posttime[0];
    
    						$inposttime = explode("-", $inposttime);
    
    						$incurrenttime = $currenttime[0];
    
    						$incurrenttime = explode("-", $incurrenttime);
    
    						///////////////////////////////////////////////////////////////////////////
    
    						$jobrenew= get_post_meta($post->ID, 'jobrenew', true);
    						$a  = mktime(0, 0, 0, $inposttime[1]+$jobrenew,   $inposttime[2],   $inposttime[0]);
    
    						$b  = mktime(0, 0, 0, $incurrenttime[1],   $incurrenttime[2],   $incurrenttime[0]);
    
    						$show="not";
    						$id_old="";
    						if ( ($b-$a) > (30*24*3600)  ) {
    							$id_old = " id=\"old\"";
    						}	
    
    						if($id_old=="")
    						{
    							$jobtype = $_GET['jobtype'];
    							if($jobtype!="")
    							{
    								if(get_post_meta($post->ID, "jobtype", true)==$jobtype)
    								$show= "";
    							}
    							else
    								$show= "";
    						}
    
    						if($show=="")
    							$myposts[]= $post->ID;
    					}
    				}
    			}
    
    			$alt = 0;
    
    			if(count($myposts)>0)
    			{
    			?>
    
    			<h2>Featured Jobs</h2>
    
    			<ul class="listing" id="featured">
    			<?php
    			foreach($myposts as $postid) :
    			{
    			$alt++;
    
    			?>
    
    				<?php
    
    				$post = get_post($postid);
    
    				$id_old="";
    
    				if(1):
    				?>
    
    			<?php
    
    			$jobtype = $_GET['jobtype'];
    
    			if ($jobtype == "freelance") {
    
    			?>
    
    				<?php $key="jobtype"; $jobtyped = get_post_meta($post->ID, $key, true); if($jobtyped == "freelance") { ?>
    
    					<li class="item <?php echo $altec; ?>" <?=$id_old;?>>
    						<h3><a href="<?php the_permalink(); ?>"><?php $key="jobtitle"; echo get_post_meta($post->ID, $key, true); ?></a></h3>
    						<small>
    
    						<?php $key="companylink"; if(!(get_post_meta($post->ID, $key, true)=="http://" || get_post_meta($post->ID, $key, true)=="")): ?>
    						<a target="_blank" href="<?php $key="companylink"; echo get_post_meta($post->ID, $key, true); ?>"><?php $key="company"; echo get_post_meta($post->ID, $key, true); ?></a>
    						<?php else: ?>
    						<?php $key="company"; echo get_post_meta($post->ID, $key, true); ?>
    						<?php endif; ?>
    
    						in <?php $key="location"; echo get_post_meta($post->ID, $key, true); ?> <?php $key="jobtype"; $jobtype = get_post_meta($post->ID, $key, true); if($jobtype == "freelance") { echo "<span class=\"fl\">Freelance</span>"; } else { if($jobtype == "parttime") { echo "<span class=\"pt\">Part Time</span>"; } else { if($jobtype == "fulltime") { echo "<span class=\"ft\">Full Time</span>"; } } } ?> </small>
    						<em><strong><?php the_time('M'); ?></strong><?php the_time('j'); ?></em>
    						<div class="cl"></div>
    					</li>
    
    				<?php } ?>
    
    			<?php } ?>
    
    			<?php
    
    			$jobtype = $_GET['jobtype'];
    
    			if ($jobtype == "parttime") {
    
    			?>
    
    				<?php $key="jobtype"; $jobtyped = get_post_meta($post->ID, $key, true); if($jobtyped == "parttime") { ?>
    
    					<li class="item <?php echo $altec; ?>" <?=$id_old;?>>
    						<h3><a href="<?php the_permalink(); ?>"><?php $key="jobtitle"; echo get_post_meta($post->ID, $key, true); ?></a></h3>
    						<small>
    
    						<?php $key="companylink"; if(!(get_post_meta($post->ID, $key, true)=="http://" || get_post_meta($post->ID, $key, true)=="")): ?>
    						<a target="_blank" href="<?php $key="companylink"; echo get_post_meta($post->ID, $key, true); ?>"><?php $key="company"; echo get_post_meta($post->ID, $key, true); ?></a>
    						<?php else: ?>
    						<?php $key="company"; echo get_post_meta($post->ID, $key, true); ?>
    						<?php endif; ?>
    
    						in <?php $key="location"; echo get_post_meta($post->ID, $key, true); ?> <?php $key="jobtype"; $jobtype = get_post_meta($post->ID, $key, true); if($jobtype == "freelance") { echo "<span class=\"fl\">Freelance</span>"; } else { if($jobtype == "parttime") { echo "<span class=\"pt\">Part Time</span>"; } else { if($jobtype == "fulltime") { echo "<span class=\"ft\">Full Time</span>"; } } } ?> </small>
    						<em><strong><?php the_time('M'); ?></strong><?php the_time('j'); ?></em>
    						<div class="cl"></div>
    					</li>
    
    				<?php } ?>
    
    			<?php } ?>
    
    			<?php
    
    			$jobtype = $_GET['jobtype'];
    
    			if ($jobtype == "fulltime") {
    
    			?>
    
    				<?php $key="jobtype"; $jobtyped = get_post_meta($post->ID, $key, true); if($jobtyped == "fulltime") { ?>
    
    					<li class="item <?php echo $altec; ?>" <?=$id_old;?>>
    						<h3><a href="<?php the_permalink(); ?>"><?php $key="jobtitle"; echo get_post_meta($post->ID, $key, true); ?></a></h3>
    						<small>
    
    						<?php $key="companylink"; if(!(get_post_meta($post->ID, $key, true)=="http://" || get_post_meta($post->ID, $key, true)=="")): ?>
    						<a target="_blank" href="<?php $key="companylink"; echo get_post_meta($post->ID, $key, true); ?>"><?php $key="company"; echo get_post_meta($post->ID, $key, true); ?></a>
    						<?php else: ?>
    						<?php $key="company"; echo get_post_meta($post->ID, $key, true); ?>
    						<?php endif; ?>
    
    						in <?php $key="location"; echo get_post_meta($post->ID, $key, true); ?> <?php $key="jobtype"; $jobtype = get_post_meta($post->ID, $key, true); if($jobtype == "freelance") { echo "<span class=\"fl\">Freelance</span>"; } else { if($jobtype == "parttime") { echo "<span class=\"pt\">Part Time</span>"; } else { if($jobtype == "fulltime") { echo "<span class=\"ft\">Full Time</span>"; } } } ?> </small>
    						<em><strong><?php the_time('M'); ?></strong><?php the_time('j'); ?></em>
    						<div class="cl"></div>
    					</li>
    
    				<?php } ?>
    
    			<?php } ?>
    
    			<?php 
    
    			$jobtype = $_GET['jobtype'];
    
    			if($jobtype !== "fulltime" && $jobtype !== "parttime" && $jobtype !=="freelance") { 
    
    			?>
    
    					<li class="item <?php echo $altec; ?>" <?=$id_old;?>>
    						<h3><a href="<?php the_permalink(); ?>"><?php $key="jobtitle"; echo get_post_meta($post->ID, $key, true); ?></a></h3>
    						<small>
    
    						<?php $key="companylink"; if(!(get_post_meta($post->ID, $key, true)=="http://" || get_post_meta($post->ID, $key, true)=="")): ?>
    						<a target="_blank" href="<?php $key="companylink"; echo get_post_meta($post->ID, $key, true); ?>"><?php $key="company"; echo get_post_meta($post->ID, $key, true); ?></a>
    						<?php else: ?>
    						<?php $key="company"; echo get_post_meta($post->ID, $key, true); ?>
    						<?php endif; ?>
    
    						in <?php $key="location"; echo get_post_meta($post->ID, $key, true); ?> <?php $key="jobtype"; $jobtype = get_post_meta($post->ID, $key, true); if($jobtype == "freelance") { echo "<span class=\"fl\">Freelance</span>"; } else { if($jobtype == "parttime") { echo "<span class=\"pt\">Part Time</span>"; } else { if($jobtype == "fulltime") { echo "<span class=\"ft\">Full Time</span>"; } } } ?> </small>
    						<em><strong><?php the_time('M'); ?></strong><?php the_time('j'); ?></em>
    						<div class="cl"></div>
    					</li>
    
    			<?php } ?>
    
    			<?php endif; ?>
    
    			<?php }endforeach;
    			?>
    			</ul>
    			<?php
    			}
    			?>
    
    		<h2>Latest jobs</h2>
    
    		<ul class="listing">
    
    			<?php
    			global $post;
    			$myposts= array();
    
    			$args = array(
    			'showposts' => 200,
    			'meta_key' => "active",
    			'meta_value' => "false",
    			'meta_compare' => "!="
    			);
    
    			query_posts($args);
    
    			if (have_posts())
    			{
    				while ( have_posts() )
    				{
    					the_post ();
    					if( !(get_post_meta($post->ID, "featuredjob", true)=="1" && get_post_meta($post->ID, "payfeaturedjob", true)=="Yes") )
    					{
    						$post = get_post($post->ID);
    
    						$posttime = $post->post_date;
    
    						$posttime = explode(" ", $posttime);
    
    						$currenttime = current_time(mysql);
    
    						$currenttime = explode(" ", $currenttime);
    
    						$inposttime = $posttime[0];
    
    						$inposttime = explode("-", $inposttime);
    
    						$incurrenttime = $currenttime[0];
    
    						$incurrenttime = explode("-", $incurrenttime);
    
    						///////////////////////////////////////////////////////////////////////////
    
    						$jobrenew= get_post_meta($post->ID, 'jobrenew', true);
    						$a  = mktime(0, 0, 0, $inposttime[1]+$jobrenew,   $inposttime[2],   $inposttime[0]);
    
    						$b  = mktime(0, 0, 0, $incurrenttime[1],   $incurrenttime[2],   $incurrenttime[0]);
    
    						$show="not";
    						$id_old="";
    						if ( ($b-$a) > (30*24*3600)  ) {
    							$id_old = " id=\"old\"";
    						}	
    
    						if($id_old=="")
    						{
    							$jobtype = $_GET['jobtype'];
    							if($jobtype!="")
    							{
    								if(get_post_meta($post->ID, "jobtype", true)==$jobtype)
    								$show= "";
    							}
    							else
    								$show= "";
    						}
    
    						if($show=="")
    							$myposts[]= $post->ID;
    
    					}
    				}
    			}
    
    			$items_per_page= get_option("itemsperpage");
    			$items_per_page= is_numeric($items_per_page)?$items_per_page:4;
    
    			global $wp_rewrite;
    			$catlink = $wp_rewrite->get_category_permastruct();
    			if ( empty( $catlink ) )
    			{
    				if($_GET['paged']!="")
    					$page_num= is_numeric($_GET['paged'])?$_GET['paged']:0;
    				else
    					$page_num= 0;
    			}
    			else
    			{
    				if((string)strpos($_SERVER["REQUEST_URI"],"page")!="")
    				{
    				$url_arr= explode("/", $_SERVER["REQUEST_URI"]);
    				$page_num= $url_arr[count($url_arr)-2];
    				}
    				else
    				$page_num= 0;
    			}
    
    			if($page_num==0)
    				$start= 0;
    			else
    				$start= ($page_num-1)*$items_per_page;
    
    			$alt = 0;
    			if(count($myposts)>0)
    			{
    			for($n=$start; ($n<count($myposts) && $n<$start+$items_per_page) ; $n++ ):
    
    			$postid= $myposts[$n];
    			$alt++;
    
    			?>
    
    				<?php
    
    				$post = get_post($postid);
    				$id_old="";
    
    				if(1):
    				?>
    
    			<?php
    
    			$jobtype = $_GET['jobtype'];
    
    			if ($jobtype == "freelance") {
    
    			?>
    
    				<?php $key="jobtype"; $jobtyped = get_post_meta($post->ID, $key, true); if($jobtyped == "freelance") { ?>
    
    					<li class="item <?php echo $altec; ?>" <?=$id_old;?>>
    						<h3><a href="<?php the_permalink(); ?>"><?php $key="jobtitle"; echo get_post_meta($post->ID, $key, true); ?></a></h3>
    						<small>
    
    						<?php $key="companylink"; if(!(get_post_meta($post->ID, $key, true)=="http://" || get_post_meta($post->ID, $key, true)=="")): ?>
    						<a target="_blank" href="<?php $key="companylink"; echo get_post_meta($post->ID, $key, true); ?>"><?php $key="company"; echo get_post_meta($post->ID, $key, true); ?></a>
    						<?php else: ?>
    						<?php $key="company"; echo get_post_meta($post->ID, $key, true); ?>
    						<?php endif; ?>
    
    						in <?php $key="location"; echo get_post_meta($post->ID, $key, true); ?> <?php $key="jobtype"; $jobtype = get_post_meta($post->ID, $key, true); if($jobtype == "freelance") { echo "<span class=\"fl\">Freelance</span>"; } else { if($jobtype == "parttime") { echo "<span class=\"pt\">Part Time</span>"; } else { if($jobtype == "fulltime") { echo "<span class=\"ft\">Full Time</span>"; } } } ?> </small>
    						<em><strong><?php the_time('M'); ?></strong><?php the_time('j'); ?></em>
    						<div class="cl"></div>
    					</li>
    
    				<?php } ?>
    
    			<?php } ?>
    
    			<?php
    
    			$jobtype = $_GET['jobtype'];
    
    			if ($jobtype == "parttime") {
    
    			?>
    
    				<?php $key="jobtype"; $jobtyped = get_post_meta($post->ID, $key, true); if($jobtyped == "parttime") { ?>
    
    					<li class="item <?php echo $altec; ?>" <?=$id_old;?>>
    						<h3><a href="<?php the_permalink(); ?>"><?php $key="jobtitle"; echo get_post_meta($post->ID, $key, true); ?></a></h3>
    						<small>
    
    						<?php $key="companylink"; if(!(get_post_meta($post->ID, $key, true)=="http://" || get_post_meta($post->ID, $key, true)=="")): ?>
    						<a target="_blank" href="<?php $key="companylink"; echo get_post_meta($post->ID, $key, true); ?>"><?php $key="company"; echo get_post_meta($post->ID, $key, true); ?></a>
    						<?php else: ?>
    						<?php $key="company"; echo get_post_meta($post->ID, $key, true); ?>
    						<?php endif; ?>
    
    						in <?php $key="location"; echo get_post_meta($post->ID, $key, true); ?> <?php $key="jobtype"; $jobtype = get_post_meta($post->ID, $key, true); if($jobtype == "freelance") { echo "<span class=\"fl\">Freelance</span>"; } else { if($jobtype == "parttime") { echo "<span class=\"pt\">Part Time</span>"; } else { if($jobtype == "fulltime") { echo "<span class=\"ft\">Full Time</span>"; } } } ?> </small>
    						<em><strong><?php the_time('M'); ?></strong><?php the_time('j'); ?></em>
    						<div class="cl"></div>
    					</li>
    
    				<?php } ?>
    
    			<?php } ?>
    
    			<?php
    
    			$jobtype = $_GET['jobtype'];
    
    			if ($jobtype == "fulltime") {
    
    			?>
    
    				<?php $key="jobtype"; $jobtyped = get_post_meta($post->ID, $key, true); if($jobtyped == "fulltime") { ?>
    
    					<li class="item <?php echo $altec; ?>" <?=$id_old;?>>
    						<h3><a href="<?php the_permalink(); ?>"><?php $key="jobtitle"; echo get_post_meta($post->ID, $key, true); ?></a></h3>
    						<small>
    
    						<?php $key="companylink"; if(!(get_post_meta($post->ID, $key, true)=="http://" || get_post_meta($post->ID, $key, true)=="")): ?>
    						<a target="_blank" href="<?php $key="companylink"; echo get_post_meta($post->ID, $key, true); ?>"><?php $key="company"; echo get_post_meta($post->ID, $key, true); ?></a>
    						<?php else: ?>
    						<?php $key="company"; echo get_post_meta($post->ID, $key, true); ?>
    						<?php endif; ?>
    
    						in <?php $key="location"; echo get_post_meta($post->ID, $key, true); ?> <?php $key="jobtype"; $jobtype = get_post_meta($post->ID, $key, true); if($jobtype == "freelance") { echo "<span class=\"fl\">Freelance</span>"; } else { if($jobtype == "parttime") { echo "<span class=\"pt\">Part Time</span>"; } else { if($jobtype == "fulltime") { echo "<span class=\"ft\">Full Time</span>"; } } } ?> </small>
    						<em><strong><?php the_time('M'); ?></strong><?php the_time('j'); ?></em>
    						<div class="cl"></div>
    					</li>
    
    				<?php } ?>
    
    			<?php } ?>
    
    			<?php 
    
    			$jobtype = $_GET['jobtype'];
    
    			if($jobtype !== "fulltime" && $jobtype !== "parttime" && $jobtype !=="freelance") { 
    
    			?>
    
    					<li class="item <?php echo $altec; ?>" <?=$id_old;?>>
    						<h3><a href="<?php the_permalink(); ?>"><?php $key="jobtitle"; echo get_post_meta($post->ID, $key, true); ?></a></h3>
    						<small>
    
    						<?php $key="companylink"; if(!(get_post_meta($post->ID, $key, true)=="http://" || get_post_meta($post->ID, $key, true)=="")): ?>
    						<a target="_blank" href="<?php $key="companylink"; echo get_post_meta($post->ID, $key, true); ?>"><?php $key="company"; echo get_post_meta($post->ID, $key, true); ?></a>
    						<?php else: ?>
    						<?php $key="company"; echo get_post_meta($post->ID, $key, true); ?>
    						<?php endif; ?>
    
    						in <?php $key="location"; echo get_post_meta($post->ID, $key, true); ?> <?php $key="jobtype"; $jobtype = get_post_meta($post->ID, $key, true); if($jobtype == "freelance") { echo "<span class=\"fl\">Freelance</span>"; } else { if($jobtype == "parttime") { echo "<span class=\"pt\">Part Time</span>"; } else { if($jobtype == "fulltime") { echo "<span class=\"ft\">Full Time</span>"; } } } ?> </small>
    						<em><strong><?php the_time('M'); ?></strong><?php the_time('j'); ?></em>
    						<div class="cl"></div>
    					</li>
    
    			<?php } ?>
    
    			<?php endif; ?>			
    
    			<?php endfor;
    			}
    			?>
    
    		</ul>
    
    <?php
    
    global $wp_rewrite;
    $catlink = $wp_rewrite->get_category_permastruct();
    if ( empty( $catlink ) )
    {
    	$link= get_bloginfo('url')."/?paged=";
    }
    else
    {
    	$link= get_bloginfo('url')."/page/";
    }
    
    $numrows= count($myposts);
    $rowsPerPage= $items_per_page;
    $pageNum= ($page_num==0)?1:$page_num;
    
    $maxPage = ceil($numrows/$rowsPerPage); 
    
    $nav = '';
    for($page = 1; $page <= $maxPage; $page++)
    {
    	if ($page == $pageNum)
    	{
    		$nav .= '<span style="font-size:14px; color:#284A70; font-weight:bold;">' . $page . '</span>';
    	}
    	else
    	{
    		$nav .= ' <a class="link" style="font-size:13px;" href="'.$link.$page.(empty( $catlink )?"":"/").'" >'.$page.'</a> ';
    	}
    } 
    
    if ($pageNum > 1)
    {
    	$page = $pageNum - 1;
    	$prev = ' <a class="link" style="font-size:13px;" href="'.$link.$page.(empty( $catlink )?"":"/").'" >&laquo; previous</a> ';
    }
    else
    {
    	$prev  = '&nbsp;';
    	$first = '&nbsp;';
    } 
    
    if ($pageNum < $maxPage)
    {
    	$page = $pageNum + 1;
    	$next = ' <a class="link" style="font-size:13px;" href="'.$link.$page.(empty( $catlink )?"":"/").'" >next &raquo;</a> ';
    }
    else
    {
    	$next = '&nbsp;'; // we're on the last page, don't print next link
    	$last = '&nbsp;'; // nor the last page link
    } 
    
    if($rowsPerPage< $numrows)
    	echo $first . $prev . $nav . $next . $last;
    ?>
    
    	</div>
    
    	<?php get_sidebar(); ?>
    	<?php get_footer(); ?>

    I posted the whole php code , because i really dont understand where the post ends.

    Could you or somebody help me out here ?
    I am almost crying here.... :)

  10. Kesha32
    Member
    Posted 3 years ago #

    Thank you all....

  11. chewbears
    Member
    Posted 3 years ago #

    Wow I have to blame drinking to much wine last night on my reposting the guide you already linked. Oh well : P

    You have 2 content sections as you know. Each section of the post begins with

    if (have_posts()){
    while ( have_posts() )
    {
    the_post ();

    and ends with

    <?php endif; ?>
    <?php endfor;
    }
    ?>

    Within these posts your if statements allow you to make that little changes to the look based on full time part time etc.

    <li class="item <?php echo $altec; ?>" <?=$id_old;?>>

    I do not know what $altec is calling. The variable doesn't exist on that page.
    <li class="item <?php echo $odd_or_even; ?>" <?=$id_old;?>>
    <?php $odd_or_even = ('odd'==$odd_or_even) ? 'even' : 'odd'; ?>

    You will have to find and replace that.
    Try that?

    and make css classes for .even .odd

    PS is your code the same as http://jobs.smashingmagazine.com/ ???

  12. chewbears
    Member
    Posted 3 years ago #

    t-p

    In twenty ten you need to open loop.php

    Find

    <div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

    change <?php post_class(); ?> to class="<?php echo $odd_or_even; ?>
    after that line add

    <?php $odd_or_even = ('odd'==$odd_or_even) ? 'even' : 'odd'; ?>

    then make your classes in your style sheet .even and .odd

    You will have to find the old post_class style sheet and copy and paste that into your .even and .odd in addition to changing the background. I don't know what yours is called. In my twenty ten the style is .hentry

  13. Tara
    Member
    Posted 3 years ago #

    thanks chewbears,

    I mod the loop.php.

    and then I added this to my twentyten child style.css

    .hentry .odd{background:#f00;}
    .hentry .even{background:#0f0;}

    But nothing.

    I,am sure making mistake in Moding Style.css
    Can you please tell me where my mistake is?
    Thanks

  14. Tara
    Member
    Posted 3 years ago #

    Hi chewbears,

    your suggestion works in comments (it displays different color in comments).

    But it does not work in posts, does matter what I do.

    any suggestions?

  15. dinabelz
    Member
    Posted 3 years ago #

    thank you all. . .

    [url=http://www.strenuapt.com.au/]Personal Training[/url]

  16. akoetsier
    Member
    Posted 3 years ago #

    Hi chewbears!

    Dont mind the link post haha

    But yes , the theme i use is the same as jobs.smashingmagazine.com
    Sorry if thought i had already said this... my bad.

    I am gonna try the code you gave , ill be back!

    Thanks

  17. akoetsier
    Member
    Posted 3 years ago #

    Hi Chewbears , im sorry it doesnt work.
    If you like i can send you the themefiles?
    If so please send an email to info@luchthavenpersoneel.nl and i will reply to that.

  18. chewbears
    Member
    Posted 3 years ago #

    akoetsier,

    did you add:

    class="<?php echo $odd_or_even; ?>"

  19. chewbears
    Member
    Posted 3 years ago #

    t-p

    Link to your page.

    I am working with the default twentyten theme on a test box. Try to mod those lines in page.php

    Also

    class="<?php echo $odd_or_even; ?>"

    I didn't post the closing quotes.

  20. Tara
    Member
    Posted 3 years ago #

    I didn't post the closing quotes.

    in actual code (in loop.php) i don't have those quotes. By mistake I added here. sorry.

    Try to mod those lines in page.php

    I tried. No color in posts. but as I mentioned before, I see different colors (odd and even) in comments on the comment page.

    I am working with the default twentyten theme

    After done, please share your solution. I am new to all this. step by step instructions will be appreciated.

    Thanks again chewbears:

  21. chewbears
    Member
    Posted 3 years ago #

    No idea why it is doing it to the comments. Let me try something else for you : P!!!

    in loop.php

    try

    <?php while (have posts()): the_post(); ?>

    change to

    <?php while $x=0; (have posts()): the_post(); ?>

    Then add this

    <?php if ($odd = $x%2){?>
    <div style=”background-color:#404040;padding:10px 0px 10px 10px;”>
    <?php }?>

    change teh style to your liking.

    close teh above with

    <?php if( $odd = $x%2 ){?>
    </div>
    <?php }?>

    finally close the while loop with

    yours will look like

    <?php endhile; ?>
    replace with

    <?php
    $x++;
    endwhile; ?>

  22. Tara
    Member
    Posted 3 years ago #

    nothing.

    thanks chewbears for your patient and help.

    Lots of this stuff is above my head. so I am going to give up.

    However, after you are done working this out with Twenty Ten, please let's know the link. thanks.

  23. chewbears
    Member
    Posted 3 years ago #

    Least I solved the comment alternating color question I see on these boards LOL.

    I am going to get twentyten up on my local and try out some things. I will get back if I get an answer.

  24. chewbears
    Member
    Posted 3 years ago #

    t-p

    FIXED!!!

    I dl'd the theme and got it all working. If you need I can e-mail you the working php files.

    go to loop.php

    FIND:

    <?php while ( have_posts() ) : the_post(); ?>

    change to:

    <?php $x=0; while ( have_posts() ) : the_post(); ?>

    FIND:

    <?php else : ?>
    
            <div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
                <h2 class="entry-title"><a>" title="<?php printf( esc_attr__( 'Permalink to %s', 'twentyten' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"><?php the_title(); ?></a></h2>

    change to :

    <?php else : ?>
        <?php if ($odd = $x%2)
        { echo $odd;
    echo "<div style='background-color: #f2f7fc'>";
     }
    else
        echo "<div style='background-color: #ffffff'>";
    ?>
            <div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
                <h2 class="entry-title"><a>" title="<?php printf( esc_attr__( 'Permalink to %s', 'twentyten' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"><?php the_title(); ?></a></h2>
    </div>

    Then change the background to the colors you want and BINGO!

  25. Tara
    Member
    Posted 3 years ago #

    Thanks so much for your continue help.

    After making the two mods to the loop.php, I get this error message:

    Parse error:
    parse error, unexpected $ in /home/virtual/siteXXXXX/wp/wp-content/themes/mytwentyten/loop.php on line 218

    And line 218 is the last line in loop.php:

    <?php endif; ?>

  26. chewbears
    Member
    Posted 3 years ago #

    oh gosh I forgot to post the last piece!

    <?php
    $x++;
    endwhile; ?>

    you have to close the loop

    I don't have my code in front of me anymore to see, but you have to close the while loop.

  27. Tara
    Member
    Posted 3 years ago #

    Thanks chewbears! Great work!
    Appreciate your time and patient.

  28. jane2189
    Member
    Posted 3 years ago #

  29. chewbears
    Member
    Posted 3 years ago #

    THis post has been resolved, even though I doubt the OP will tag iT : P

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags