Need help? Check out our Support site, then


Custom Theme basics: PHP???

  1. 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 »</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...

  2. 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.

Topic Closed

This topic has been closed to new replies.

About this Topic