Support » Fixing WordPress » Trouble styling post title differently in archive versus single view

  • I have a test site running here

    On this archive page, I would like to make the size of the_title() smaller than on the single view page.

    I tried changing the class names in the entry header portion of the content-archive file: eg. entry-title to “entry-archive”, but my style sheet doesn’t recognize the new classes. What am I doing wrong?

    original code below

    <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    		<?php if ( is_sticky() && is_home() && ! is_paged() ) : ?>
    		<div class="featured-post">
    			<?php _e( 'Featured post', 'twentytwelve' ); ?>
    		<?php endif; ?>
    		<div class="entry-header">
    			<!-- <?php the_post_thumbnail(); ?> -->
    			<?php if ( is_single() ) : ?>
    			<h1 class="entry-title">
    			<a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'twentyeleven' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark">
    				<?php the_title(); ?>
    			<?php else : ?>
    			<h1 class="entry-title">
    				<a href="<?php the_permalink(); ?>" title="<?php echo esc_attr( sprintf( __( 'Permalink to %s', 'twentytwelve' ), the_title_attribute( 'echo=0' ) ) ); ?>" rel="bookmark"><?php the_title(); ?></a>
    			<?php endif;  is_single() ?>
    		<?php if ( is_search() ) : // Only display Excerpts for Search ?>
    		<div class="entry-summary">
    			<?php the_excerpt(); ?>
    		<?php else : ?>

Viewing 3 replies - 1 through 3 (of 3 total)
  • After looking at your site for a while:

    On the archive page the div that contains the title:

    <h1 class=”entry-title”>

    is inside:

    <header class=”page-header”>

    On the single post page, there is no div called:

    <header class=”page-header”>

    The css that styles this heading on both pages is:

    .entry-header .entry-title {
    font-size: 2rem;
    line-height: 2.5rem;

    so if you ADD some more css something like this:

    .page-header .entry-header .entry-title {
    font-size: 1rem;

    This should change the font size only on the archive page.

    I could not actually test this css in my browser on your site – please let me know if it works..

    THANK YOU!!! Can’t believe I missed that!

    You are welcome 🙂

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Trouble styling post title differently in archive versus single view’ is closed to new replies.