Creating sidebar under featured image in WordPress post

[Reed]

I would like to add a sidebar to the posts, however, it appear on the right side of the featured image. How can we set it to appear under the featured image?

[David]

Hi there,

would require a bit of code and a header element. Give this a shot.

1. Add this PHP snippet to your site:

function db_feat_img_shortcode() {
    $img_src = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'large', false );
	return '<img src="' . $img_src[0] . '"/>';
}
add_shortcode( 'db_feat_img', 'db_feat_img_shortcode' );

https://docs.generatepress.com/article/adding-php/

This will create a new shortcode called [db_feat_img] for displaying the featured image.

2. Create a new Header Element:

https://docs.generatepress.com/article/header-element-overview/

Then add this to the content:

{{post_title}}
[db_feat_img]

And set the Display Rules to Posts > All Posts

This should place the Title and the featured image above the post content / sidebar.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Reed]

May I know which kind of hook element should i use?

wp_head?

[Leo]

Try the header element (not hook element):
https://docs.generatepress.com/article/header-element-overview/

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Reed]

Thanks for helping, but the alignment was all messed up, do you think I can send u the login so you can have a look? thanks.

[David]

Can you add the Header Element and Sidebar layout to a post? And then point us to where we can see it and we can advise.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts