Displaying specific thumbnail size in single.php - wordpress

Currently I'm building a Wordpress theme and I'm trying to display a specific image size, which is cropped in my single.php, and thus on individual post pages and not having any luck.
Here's my functions.php:
add_theme_support( 'post-thumbnails' );
add_image_size('new-thumbnail-size',600,340, true);
Here's my single.php:
<?php if( get_the_post_thumbnail() ) : ?>
<div class = 'postImgCon'>
<div class="feat-img">
<?php the_post_thumbnail('new-thumbnail-size'); ?>
</div>
</div>
<?php endif; ?>
Any ideas?

You're using the correct functions to declare support for post thumbnails and add an image size but you need to do so inside the after_setup_theme hook.
Inside functions.php change:
add_theme_support( 'post-thumbnails' );
add_image_size('new-thumbnail-size',600,340, true);
To:
function wpse_setup_theme() {
add_theme_support( 'post-thumbnails' );
add_image_size( 'new-thumbnail-size', 600, 340, true );
}
add_action( 'after_setup_theme', 'wpse_setup_theme' );
Also you're using the wrong function to check if a post has a thumbnail. It should still work but here's the correct approach.
Inside single.php change:
<?php if( get_the_post_thumbnail() ) : ?>
To:
<?php if ( has_post_thumbnail() ) : ?>
Finally you need to be aware that any images you've already uploaded won't have been cropped to 600 x 340 so you won't get the output you're expecting. You need to regenerate your existing images. Take a look at the following plugin for that: https://wordpress.org/plugins/regenerate-thumbnails/

Try this
....
<div class="feat-img">
<?php echo the_post_thumbnail($page->ID, "new-thumbnail-size'); ?>
....

Related

Custom WordPress Image size not displaying

I am trying to add a custom image size in WordPress like so:
// Add custom image sizes
if ( function_exists( 'add_theme_support' ) ) {
add_theme_support( 'post-thumbnails' ); // The important part
}
if ( function_exists( 'add_image_size' ) ) {
add_image_size( 'home_portrait size', 1000, 1000, false );
}
/* Display Custom Image Sizes */
add_filter('image_size_names_choose','wpshout_custom_sizes');
function wpshout_custom_sizes($sizes){
return array_merge($sizes, array(
'home_portrait' => __('Home Portrait standard'),
));
}
I can see this extra size is generated when I upload an image to the media library as expected but it does not work when I try and implement it in PHP with advanced custom fields.
The custom image size is 1000px by 1000px.
In an attempt to trouble shoot and narrow down the issue, I amended the default WP size of 'medium' to also be 1000px by 1000px.
In the code below, the top image which uses this default 'medium' size renders perfectly on the website using the correct image but the second does not, it just displays the full size image.
I can't work out what is wrong with my custom image code given that it seemingly should be very straight forward.
<!-- THIS WORKS -->
<?php
$top_image = get_field('top_animated_image_1');
?>
<div class="upper-image">
<?php $top_animated_image_1 = get_field( 'top_animated_image_1' ); ?>
<?php $size = 'medium'; ?>
<?php if ( $top_animated_image_1 ) : ?>
<?php echo wp_get_attachment_image( $top_animated_image_1, $size ); ?>
<?php endif; ?>
</div>
<!-- THIS DOES NOT -->
<?php
$lower_image = get_field('lower_animated_image_2');
?>
<div class="lower-image">
<?php $lower_animated_image_2 = get_field( 'lower_animated_image_2' ); ?>
<?php $size = 'home_portrait'; ?>
<?php if ( $lower_animated_image_2 ) : ?>
<?php echo wp_get_attachment_image( $lower_animated_image_2, $size ); ?>
<?php endif; ?>
</div>
I got this working in the end by changing it to
// Make sure featured images are enabled
add_theme_support( 'post-thumbnails' );
// Add featured image sizes
add_image_size( 'home_portrait', 1000, 1000, false ); // width, height, crop
// Register the three useful image sizes for use in Add Media modal
add_filter( 'image_size_names_choose', 'wpshout_custom_sizes' );
function wpshout_custom_sizes( $sizes ) {
return array_merge( $sizes, array(
'home_portrait' => __( 'Home Portrait' ),
) );
though I am still not sure why the first did not work

Show featured image and excerpt of specific page on home page wordpress

I want to display featured image and excerpt of ie. ABOUT page on my home page. Is it possible to do this with pages not posts only?
found the answer in the meantime for the excerpt, now I need only featured image
add new function to functions.php:
//Display page excerpts
add_action( 'init', 'my_add_excerpts_to_pages' );
function my_add_excerpts_to_pages() {
add_post_type_support( 'page', 'excerpt' );
}
and call the function in front-page.php>
<?php echo get_the_excerpt(); ?>
<?php
query_posts("page_id=2");
while ( have_posts() ) : the_post()
?>
<h1>Why US?</h1>
<?php the_excerpt(); ?>
<?php
endwhile;
wp_reset_query();
?>
For the featured image, you need :
1 - to modify your function, to add also thumbnail support
add_action( 'init', 'my_extend-page_functions' );
function my_extend-page_functions() {
add_post_type_support( 'page', array('excerpt', 'thumbnail' );
}
(Have a look on the codex page of all you can add http://codex.wordpress.org/Function_Reference/add_post_type_support )
2- on the front-page, you can use the_post_thumbnail()
http://codex.wordpress.org/Function_Reference/the_post_thumbnail

Preventing Display of Post Gallery when on Homepage

I would like to prevent the post's gallery from displaying when the post is listed on the homepage.
I'm thinking it will utilize add_filter and apply_filter when post in on homepage.
You can add a gallery to posts by clicking the add media button. You can select existing images or upload additional images that will create a gallery within the post. This embeds a shortcode in $post['content'] that looks like [gallery ids="37,38,39,40,41,42].
The issue is that by default it displays when the post is included on homepage as well as the individual post itself.
Update: This is what I am doing right now to achieve the requirement. I suspect there will be a more elegant way.
<div class="entry-content">
<!-- Begin Post Content -->
<?php if ( is_single() ) : ?>
<?php the_content( __( 'Continue reading <span class="meta-nav">→</span>', 'faceboard' ) ); ?>
<?php else : // Filter Gallery ShortCode out ?>
<?php
$content = '';
$content = get_the_content();
$content = preg_replace('/\[gallery\sids="[0-9]+(,[0-9]+)*,?"\s?(royalslider="\d")?\]/s',"",$content);
echo wpautop( $content, 1);
?>
<?php endif; // is_single() ?>
<!-- End Post Content -->
<?php wp_link_pages( array( 'before' => '<div class="page-links">' . __( 'Pages:', 'faceboard' ), 'after' => '</div>' ) ); ?>
</div><!-- .entry-content -->
You can add the following to your theme's functions.php file or to a custom plugin (better, as you can disable it without touching the theme).
The filter post_gallery is used to create your own gallery, and the $content parameter comes empty by default. If it returns empty, the original [gallery] shortcode is processed.
Here, we are using a dummy empty value, so the filter is tricked into thinking that we are passing some actual gallery content, but it's just a white space.
add_filter( 'post_gallery', 'disable_home_galleries_so_17635042', 10, 2 );
function disable_home_galleries_so_17635042( $content, $atts )
{
// http://codex.wordpress.org/Conditional_Tags
if( is_home() )
return ' ';
return $content;
}

How to display page excerpt in Wordpress

I am new in using Wordpress, I created a page that contains a long list of items.
* Item 1
* Item 2
* Item 3
* Item 4 ... and so on
I am planning to embed this page with long list of items on a separate page. How am I going to do it?
I followed tutorials online and got the idea of putting this piece of code add_post_type_support( 'page', 'excerpt' ); on functions.php. After putting the code, an new option will be available when you create/edit pages. But after that, how can I display the my page excerpt?
First to put this code on your theme function.php file.
add_action( 'init', 'my_add_excerpts_to_pages' );
function my_add_excerpts_to_pages() {
add_post_type_support( 'page', 'excerpt' );
}
After that enable excerpt for page see below define image:
Using this code to get page excerpt:
<?php echo get_the_excerpt(); ?>
<?php
query_posts("page_id=36");
while ( have_posts() ) : the_post()
?>
<h1><?php echo get_the_title(); ?></h1>
<?php the_excerpt(); ?>
<?php
endwhile;
wp_reset_query();
?>

wordpress 3.5.1 Featured Image not showing up...?

This is what inside my function.php
<?php
if ( function_exists( 'add_theme_support' )){
add_theme_support( 'post-thumbnails' );
}
if ( function_exists( 'add_image_size' )){
add_image_size('featured', 400, 340, true);
add_image_size('post-thumb', 100, 140, true);
}
?>
This is what inside my index.php
<?php the_post_thumbnail('post-thumb'); ?>
Featured Image in Screen Options enabled.
Featured Image metabox displaying on Edit Post
Featured Image is set.
the problem is the thumbnail not showing in index.php(homepage). Am I missing something? Big thanks in advance.
Put below code just above: the_content();
<?php
if ( has_post_thumbnail() ) { // check if the post has a Post Thumbnail assigned to it.
the_post_thumbnail('post-thumb');
}
?>
See it for more information: http://codex.wordpress.org/Function_Reference/the_post_thumbnail and https://wordpress.stackexchange.com/questions/39798/thumbnail-cropping-with-add-image-size
Replace nonworking code
add_theme_support(‘post-thumbnails’);
with working variant:
add_theme_support( ‘post-thumbnails’, array( ‘post’, ‘page’, ‘player’ ) );

Resources