Support » Fixing WordPress » resizing images

  • Resolved Fatwallet

    (@fatwallet)


    Hi all.
    I’m using theme Twenty Ten and I’m struggling with the images that I’m posting. I don’t know how to resize them. If I post landscape images, they appear fine on the home page news slide, but when opening the news item page the image is stretched. How do I resize pictures so that the slide is a different size to the article?
    Thanks for your help.
    Pete

Viewing 13 replies - 1 through 13 (of 13 total)
  • Moderator keesiemeijer

    (@keesiemeijer)

    moderator

    Url to your website please.

    Moderator keesiemeijer

    (@keesiemeijer)

    moderator

    The image is streched because you give it a height of 150px as in this html:

    <img width="384" height="150" class="post_thumbnail full aligncenter" alt="Results service will be launched shortly ......" src="http://www.clifferoyalsfc.globeeffects.co.uk/wp-content/uploads/2010/07/Ball-in-net.jpg">

    If you leave out the height the image will show normal.

    Sorry, but where did you get the height setting from?

    Moderator keesiemeijer

    (@keesiemeijer)

    moderator

    It is in the html source code. Can you show the code you use to show these images? I think you use the post thumbnail to show your image. If you want full images on a single post (single.php) you can find the answer here.
    look for this:

    What if you want to use a small 50×50 hard-cropped image for the home page, but want to use a 400 pixel-wide (unlimited height) image on the post’s permalink page? You’re in luck. You can specify additional custom sizes!

    I have no idea how to access the html source code either! Sorry, but I am totally new to this.
    Basically what I need to do is amend the size of the image that appears on my page. If you look at the Committee page and then the treasurer page, the image is stretched across the page, distorting it. Can this be done within WordPress or do I have to resize the image BEFORE I add it to the library, as someone has told me?
    I’m a real novice, sorry. Thank you for your help though, it’s invaluable.
    Regards

    Moderator keesiemeijer

    (@keesiemeijer)

    moderator

    You can’t alter the html code. Can you show us your single.php loop. the loop starts with this:
    <?php if ( have_posts() ) while ( have_posts() ) : the_post(); ?>
    and ends with this:
    <?php endwhile; // end of the loop. ?>

    I don’t want to alter the html code! Where do I find all of these codes? I can’t find anything that looks even vaguely like this!

    Moderator keesiemeijer

    (@keesiemeijer)

    moderator

    In the wp-admin go to “Appearance” > “Editor” and click “Single Post” under “Templates”.

    ah, ok.
    <?php get_header(); ?>

    <?php if (get_option(‘swt_fcats’) == ‘Hide’) { ?>
    <?php { echo ‘<div id=”contentwrap1″>’; } ?>
    <?php } else { include(TEMPLATEPATH . ‘/includes/featured-cats.php’); echo ‘<div id=”contentwrap”>’; include(TEMPLATEPATH .’/includes/slide.php’); } ?>
    <div class=”inside”>

    <?php if (have_posts()) : ?>

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

    <div <?php post_class() ?> id=”post-<?php the_ID(); ?>”>
    <h2>” rel=”bookmark” title=”Permanent Link to <?php the_title_attribute(); ?>”><?php the_title(); ?></h2>
    <div class=”meta”>
    <span class=”author”>Posted by <?php the_author(); ?></span><span class=”comm”><?php comments_popup_link(‘No Comments’, ‘1 Comment’, ‘% Comments’); ?></span><span class=”date”><?php the_time(‘M d, Y’); ?></span>
    </div>

    <div class=”entry”>
    <?php if ( function_exists( ‘get_the_image’ ) ) {
    get_the_image( array( ‘custom_key’ => array( ‘post_thumbnail’ ), ‘default_size’ => ‘full’, ‘image_class’ => ‘aligncenter’, ‘width’ => ‘384’, ‘height’ => ‘150’ ) ); }
    ?>
    <?php the_content(”); ?>
    </div>
    <p class=”postmetadata”><?php the_tags(‘Tags: ‘, ‘, ‘, ‘
    ‘); ?> Posted in <?php the_category(‘, ‘) ?> | <?php edit_post_link(‘Edit’, ”, ‘ | ‘); ?> </p>
    </div>
    <?php comments_template(”, ‘true’); ?>
    <?php endwhile; ?>

    <div class=”navigation”>
    <?php
    include(‘includes/wp-pagenavi.php’);
    if(function_exists(‘wp_pagenavi’)) { wp_pagenavi(); }
    ?>
    </div>

    <?php else : ?>

    <h2 class=”center”>Not Found</h2>
    <p class=”center”>Sorry, but you are looking for something that isn’t here.</p>
    <?php get_search_form(); ?>

    <?php endif; ?>
    </div>
    </div>
    <?php get_sidebar(); ?>
    <?php get_footer(); ?>

    Moderator keesiemeijer

    (@keesiemeijer)

    moderator

    Aha, you are using a plugin for that image. try changing this (in single.php):

    <?php if ( function_exists( 'get_the_image' ) ) {
    get_the_image( array( 'custom_key' => array( 'post_thumbnail' ), 'default_size' => 'full', 'image_class' => 'aligncenter', 'width' => '384', 'height' => '150' ) ); }
    ?>

    to this:

    <?php if ( function_exists( 'get_the_image' ) ) {
    get_the_image( array( 'custom_key' => array( 'post_thumbnail' ), 'default_size' => 'full', 'image_class' => 'aligncenter', 'width' => '384', 'height' => '9999' ) ); }
    ?>

    And see what happens.

    Ah, this is what I want. Excellent. Many thanks.
    The image i nneded to amend isn’t in a post though, it’s on a page. But I assume I just change the sizes in page.php template instead of single.php?
    Thanks for your help

    Moderator keesiemeijer

    (@keesiemeijer)

    moderator

    Yes if that code is also on your page.php you can change it there. Can you make this topic resolved please. Glad to be of help

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘resizing images’ is closed to new replies.