Custom Theme basics: PHP???

• 

  chrisweiser · Member · Jul 28, 2009 at 4:12 am

  • Copy link
  • Add topic to favorites

  I am relatively new to WordPress and am probably missing the basics of styling with CSS under a PHP framework, so I’m asking for some clarification on why my CSS code isn’t working. What I want is to style each post to look like it’s contained within a box with a drop shadow. I’m trying to do it the tried-and-true CSS way of styling the “.post” class to have a background image slice with repeat-y turned on, and then a top div and a bottom div, each with a “beginning” and “ending” background image to complete the look of the box. However, at best I can sometimes get the “.post” repeat-y section to work, but my other two divs won’t show. I’ve run into this problem before with the Header, but this time I don’t know what PHP to add to make WordPress “see” it.

  This is my HTML section of “page.php”:

  <?php get_header(); ?>
  
  		<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
  
  <!-- This is where I'm having trouble... -->
  
  		<div class="post" id="post-<?php the_ID(); ?>">
  			<div class="post-top" id="post-<?php the_ID(); ?>"></div>
  
  				<h2><?php the_title(); ?></h2>
  					<?php the_content('<p class="serif">Read the rest of this page &raquo;</p>'); ?>
  					<?php wp_link_pages(array('before' => '<p><strong>Pages:</strong> ', 'after' => '</p>', 'next_or_number' => 'number')); ?>
  
  				<div class="post-bottom" id="post-<?php the_ID(); ?>"></div>
  		</div>
  		<?php endwhile; endif; ?>
  	<?php edit_post_link('Edit this entry.', '<p>', '</p>'); ?>
  
  <!-- End trouble -->
  
  <?php get_sidebar(); ?>
  
  <?php get_footer(); ?>

  So as you can see, I have three divs: post, post-top, and post-bottom, the latter two within post. They also all have their own classes (.post-top, etc), styled like so in CSS:

  .post {background-image: url(img/post.png)}
  .post-top { background-image: url(img/post-top.png);}
  .post-bottom { background-image: url(img/post-bottom.png);}

  I had CSS code to repeat-y on the .post background, but have since removed it all since little seems to be working. What I’m most concerned about is getting the top and bottom divs to show. I know there must be something I am fundamentally missing about coding for WordPress and PHP, so if someone could clue me in, that would be great.

  Thanks…

• 

  sambauers · Member · Jul 28, 2009 at 4:12 am

  • Copy link

  You did not specify a blog address or reason for posting when you created this topic.

  This support forum is for WordPress.com hosted blogs only. If you have a self-hosted WordPress blog you need to seek help at the WordPress.org forums, not here.

  If you don’t understand the difference, you may find this information helpful.