How to wrangle images for blog page in Eleven40

Community Forums Forums Design Tips and Tricks How to wrangle images for blog page in Eleven40

This topic is: not resolved

This topic contains 2 replies, has 2 voices, and was last updated by  worldviewpr 1 year, 2 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #58972

    worldviewpr
    Participant
    Post count: 48

    Eleven40 is a lot of fun and I am customizing away. But one niggling issue.

    I have always assumed that Post image is the large issue for the single page view and the thumbnail of that image would appear on the blog page with the excerpt as well as the archive (maybe).

    Currently I have archive image checked on as thumbnail.

    So how do I get the

    thumbnail to wrap left on front page (blog page)
    post image appear in its larger size on SIngle page
    and thumbnail again later in the archive view?

    “Tanks. Lots of tanks” ~ Warren Zevon

    http://www.halfwaytoconcord.com
    #59479

    Sridhar Katakam
    Participant
    Post count: 1068

    1) Add the following at the end of child theme’s style.css (WP dashboard -> Appearance -> Editor):

    .home img.grid-featured {
        float: left;
        margin-right: 1.5rem;
    }

    2) Add this in child theme’s functions.php:

    add_image_size( 'single-large', 0, 0 );
    
    add_action ('genesis_before_entry','sri_show_featured_image');
    function sri_show_featured_image () {
    	if ( is_single() && has_post_thumbnail()) { ?>
    		<div class="entry-image">
    			<?php the_post_thumbnail( 'single-large' ); ?>
    		</div>
    	<?php }
    }

    and use this CSS:

    .single .entry-image {
    	margin-bottom: 2rem;
    }

    3)

    and thumbnail again later in the archive view?

    I see the left floating thumbs with text wrapping around in archives like http://www.halfwaytoconcord.com/category/business-news/tech-news/ for example. Can you elaborate?


    #60465

    worldviewpr
    Participant
    Post count: 48

    That worked great, thank you.

    Now for the single page view. Can you help me do the same thing on the single view page? Currently the image appears above the headline (title). is there a function to move it to below headline and have content wrap around it, as well?

    with the code you already supplied (thanks again)


    .home img.grid-featured {
    float: left;
    margin-right: 1.5rem;
    }

    .single .entry-image {
    margin-bottom: 2rem;
    }

    would there be a change to the lower section for .single .entry-image? Not sure how to adjust the code in function.php file


    //* Reposition the secondary navigation menu
    remove_action( 'genesis_after_header', 'genesis_do_subnav' );
    add_action( 'genesis_before_content_sidebar_wrap', 'genesis_do_subnav' );

    //* Align post images on Front Page to the Left with wrap *//
    add_image_size( 'single-large', 0, 0 );

    add_action ('genesis_before_entry','sri_show_featured_image');
    function sri_show_featured_image () {
    if ( is_single() && has_post_thumbnail()) { ?>
    <div class="entry-image">
    <?php the_post_thumbnail( 'single-large' ); ?>
    </div>
    <?php }
    }

    Thanks in advance for any help. bgr

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.