Wordpress - Featured image on a custom post archive page - wordpress

i have created a custom post named Products.
register_post_type( 'products',
array(
'labels' => array(
'name' => __( 'Products' ),
'singular_name' => __( 'Product' )
),
'public' => true,
'has_archive' => true,
'supports' => array( 'title', 'editor', 'thumbnail' )
);
I have also created a php file named archive-products.php and made it into a template.
In Wordpress I have created a page named Products and selected the products template.
On that static page (that uses the archive template) I have uploaded a image into the Featured Image panel.
In my header I have the code:
echo get_the_post_thumbnail();
But this echos the Featured image of the last custom post in the list (all the products posts have a featured image as well), not the Featured image of the static/archive page, which is what i want. Is this possible to achieve?
Thanks!

I did the very same thing and came across the following answer that solved my problem: https://wordpress.stackexchange.com/a/175228
Save your custom post type archive template as a page.
For example, page-products.php
Backup locally and delete your custom post type archive template from your server.
Show the image with the_post_thumbnail(), put it in a variable with get_the_post_thumbnail(), or make it a background image with your page title over it:
$bg = wp_get_attachment_image_src( get_post_thumbnail_id( $page->ID ), 'full' );
if( is_page('products') ) : ?>
<div style="background: url('<?php echo $bg[0]; ?>') repeat center center #fbfbfb; background-size:cover;">
<?php the_title( '<h1 class="page-title">', '</h1>' ); ?>
</div>
<?php endif; ?>
Save your permalinks and refresh your page.
This is what worked for me. Hope it helps somebody. :)

Related

Why some of Wordpress theme doesn't have Header Image Section

I am new in Wordpress. I want to know. Why some of the Wordpress themes don't have header image section in Theme customize? How to add this section to the theme customizer? Is there any way to do it
And one question. How can I modify the upload file image in the theme customizer?
I want to add more field and change the crop size
this depends on the WordPress theme developer how they design and develop themes but you can achieve this by adding your own option like (image, textarea , input) fields in the customizer area.
Here is the example add this code in a function.php file
// Header Logo
function add_logo_customizer($wp_customize) {
$wp_customize->add_section(
'logo_image',
array(
'title' => 'Logo Image',
'priority' => 45,
)
);
$wp_customize->add_setting( 'Logo-upload' );
$wp_customize->add_control(
new WP_Customize_Image_Control(
$wp_customize,
'lp-image_selector',
array(
'label' => 'Logo Image',
'section' => 'logo_image',
'settings' => 'Logo-upload'
)
)
);
}
add_action('customize_register', 'add_logo_customizer');
and you can call it as <?php echo get_theme_mod( 'Logo-upload' ); ?>
The above code is tested and it works
For the first you need to add support to custom-header.
See the codex:
https://developer.wordpress.org/themes/functionality/custom-headers/
Obviously, you need to create a php file with the code and include in the functions.php or add the code directly to your functions.php file.
function themename_custom_header_setup() {
$defaults = array(
// Default Header Image to display
'default-image' => get_template_directory_uri() . '/images/headers/default.jpg',
// Display the header text along with the image
'header-text' => false,
// Header text color default
'default-text-color' => '000',
// Header image width (in pixels)
'width' => 1000,
// Header image height (in pixels)
'height' => 198,
// Header image random rotation default
'random-default' => false,
// Enable upload of image file in admin
'uploads' => false,
// function to be called in theme head section
'wp-head-callback' => 'wphead_cb',
// function to be called in preview page head section
'admin-head-callback' => 'adminhead_cb',
// function to produce preview markup in the admin screen
'admin-preview-callback' => 'adminpreview_cb',
);
}
add_action( 'after_setup_theme', 'themename_custom_header_setup' );
Then on your header.php get the image and put in where you want it.
<?php if ( get_header_image() ) : ?>
<div id="site-header">
<a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home">
<img src="<?php header_image(); ?>" width="<?php echo absint( get_custom_header()->width ); ?>" height="<?php echo absint( get_custom_header()->height ); ?>" alt="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>">
</a>
</div>
*functions.php is on the root of your theme folder, if your theme uses a "child-theme" please use this folder to do the changes.
And answering your question, when you upload the image you can crop and resize the image. Wordpress cannot edit photos as an editor, only resize and crop.

Wordpress Display Child page data: Title, featured image and custom field

I'm displaying the child pages of the current page. With the featured image, title pulling through. I also want to pull through a custom field I've added. I'm outputting this at html so it looks like each child page has its own box, with the featured image filling the box, the title on top of the image and the the custom field value sitting under the title.
But I can't get the custom field to display properly, I just get the value 1, not sure if I've converted the array properly?
Could you help me out to output the custom field 'PageTag'
https://i.stack.imgur.com/vzCBU.png
https://i.stack.imgur.com/BwfuV.png
Wordpress template code
<div class="childPages">
<?php
$subs = new WP_Query(
array(
'post_parent' => $post->ID,
'post_type' => 'page',
'meta_key' => '_thumbnail_id'
)
);
if( $subs->have_posts() ) :
while( $subs->have_posts() ) :
$subs->the_post();
$pageTag = get_post_meta($post->ID, '_PageTag' , true);
echo '<div class="childPageBlock"> '.get_the_post_thumbnail().'<div class="childPageBlockText"><h3>'.get_the_title().'</h3><span>'.print_r( $pageTag ).'</span></div></div>';
endwhile;
endif;
wp_reset_postdata(); ?>
</div>
Removing the print_r() and leaving its as
'.$pageTag.'
Worked!

wordpress custom post type template file loop 404

I am working with a homemade theme, trying to keep it light weight, for a specific site. So far in development i am just using the index.php file to view pages and posts, both working smoothly and simple. I have a custom post type added, though, and when i try to open a single custom post, the index.php file loads, but nothing loads in the loop inside it. I guess that loops dont find any post at tall. My guess is something in the index.php or the register_post_type is going bananas. What do you think?
My index.php (slimmed):
<?php get_header(); ?>
<div class="hero-unit">
<?php get_template_part('hero'); ?>
</div>
<?php
// Start the loop.
while ( have_posts() ) : the_post();
the_content(); //disconnected the content just to see if i get response, but nothing appears
/*get_template_part( 'content', get_post_format() ); */
// End the loop.
endwhile;
?>
<?php get_template_part('featured'); ?>
</div><!-- /.container -->
My register_post_type in functions:
/* Custom Post Types */
add_action( 'init', 'create_post_type' );
function create_post_type() {
register_post_type( 'kalender',
array(
'labels' => array(
'name' => __( 'Kalender' ),
'singular_name' => __( 'Kalenderpost' )
),
'supports' => array(
'title',
'editor',
'custom-fields',
'thumbnail'
),
'public' => true,
'has_archive' => true,
)
);
}
Any idea of what goes wrong? When i open a (WP-domain)/kalender/postname URL from the said single post in WP, it shows the full theme, except the content that should be found in the loop. If i try a trouble-shooting-loop with a 404 respons, it activates, like there are no matching post at all.
If you're using Apache server?
Make sure that rewrite module is enabled.
Also, check and see if .htaccess file has any issues or not.

Custom single-post pulling from wrong custom post type

So I am setting up a custom WordPress theme using two custom post types Articles and News. Each one is also using a custom single-post.php page single-articles.php and single-news.php. But after pulling the article posts on the main page and inserting their permalink into a 'Read more' link when I click on one of the article's links it takes me to their permalink URL but instead of displaying the article post it displays the News post content. Both single-articles.php and single-news.php are in the themes folder, not in a subfolder.
Here is an example of how I'm setting up the custom posts...
add_action( 'init', 'articles_custom_postypes' );
function articles_custom_postypes() {
$args = array (
'label' => $labels,
'public' => true,
'menu_position' => 100,
'menu_icon' => 'dashicons-format-aside',
'label' => 'Articles',
'has_archive' => false,
'supports' => array( 'title','editor', 'thumbnail'),
);
register_post_type( 'articles', $args);
}
On the custom single post pages I am just calling the_title(), the_content, etc. Should I be using a while loop or something? Any advice would be awesome. Thanks!
For this you have to have two files in your theme folder. One is single-articles.php and other is content-articles.php. If the files are created add the following code to single-articles.php.
<?php
while ( have_posts() ) : the_post();
get_template_part( 'content-articles', get_post_format() );
endwhile;
?>
Also add the following to content-articles.php.
<?php
the_title();
the_content();
?>

Display the content and title of a specific page on Homepage

I want the title and content of a specific page to show in my Homepage and footer area.
It will be something like this.
This is the Title of the page
This is the content of the page, etc....blahh blah..
readmore...
I know that there is no excerpt in the page post. But i want to limit the characters of the content that will show in the footer area.
Can you give me a code/link/tutorial that will show me how to do this?
Thanks,
First there is excerpt avaIlable in the page posts. Just set it in the Screen Options.
About the code try this one which I use on my projects.
It will show excerpt of those pages, which have custom field named showOnHomePage and the value of this field determines the order in the list.
$pages=get_posts( array( 'meta_key' => 'showOnHomePage', 'post_type' => 'page', 'orderby' => 'meta_value', 'order' => 'ASC'));
foreach( $pages as $page )
{
echo '<h2 class="entry-title"><a href="'.get_permalink( $page->ID ).'" >'.get_the_title( $page->ID ).'</a></h2>';
echo $page->post_excerpt;
echo '<a class="read-more" href="'. get_permalink( $page->ID ) . '">Read More</a>';
}

Resources