Single post template for oversized images

Is there a way to create a single post template (no sidebar) so it will have oversized images if requested?

I am using the theme in the 1400 wide format.

I would like my featured image or video to be full size, 1400 wide, then the text area below this to be 1000 pixels wide. Any images I add to this post, I’d like full size, 1400 wide as well, so there is a contrast between the post with words and the image. it really adds PUNCH to the images.

I have seen this implemented on another theme by another company, but I love your theme so I am staying here.

I can create a single post template, that’s great. I searched your template area, i was not able to find something close to what I explained up at the top. I won’t post the other theme’s example here unless you ask me for it. (thus you see what I am after)

Thank you

————

Side note – I tried using Elementor, even Elementor Pro but it was throwing errors. I could not even load the option to do it, so perhaps your theme is not compatible with Elementor

error throw when I tried to use Elementor:

ErrorException thrown
td_js_buffer::add_to_footer - the header JS was already rendered when you called td_js_buffer::add_to_footer() (ex: was called to late)

Hey guys, still waiting for a response… I know it’s the weekend and toy’re not there, hopefully you see this on Monday.

not to the bottom part of my ticket/question, no biggie the theme doesn’t work with the elementor.

I am curious about the first part, I tried some templates from tagdiv’s cloud template area for single post templates, like single post template 40, or 49 where they have wide images and the text is supposed to be skinnier in the middle.. like, container is 1200px or 1400px for images and text is 800 or 1000 wide so i ages POP and text is still great size.

I saved the templates, I applied no changes to them… I tried a post using them, and in both, text was just as wide as container, it was not indented. Is that literally what you do for the text? Manually indent the text?

Thanks

I think what I was saying somehow didn’t come across. I must have not explained it properly. I’ll try again.

Many of your cloud templates, at least 5 or 6 of these feature a look where photos in the post are wider than the text column. It gives the illusion the image is breaking the container, but of course it is not, the text is merely indented I think.

Example..

Single Post Template 35, seen here – https://cloud.tagdiv.com/celebrity-fashion-week-trends-you-need-now/ has images that are wider than the text column, giving the illusion the images are breaking out of the column for a more impactful look.

If I create the template based on this exact post template (35), the area with the images/text is the element “Single Post Content”. The post created of course, shows the element as so – https://www.screencast.com/t/wWb80WrUg1a

Row setting is “stretch row and 1400px content
extra class is td-article-content

Perhaps this is the issue because my css file would not refeeence this class so it would know to indent the text… if this is the case do you have the code so I can add it under extra css in the theme panel?

Without this css reference to make the text thinner so the images POP, when I publish a page using this template, the text is the same width as the images, defined by the width of the container, in this case, 1400.

Thank you

More examples of the wider images/thinner text..

Single Post Template 41, seen here – https://cloud.tagdiv.com/entertainment-buzz-taylor-swift-gets-an-emmy-award-on-her-25-year-old-birthday/ – same thing as all others mentioned. Wider images, skinnier text area.

Single Post Template 49, seen here – https://cloud.tagdiv.com/bold-colors-and-the-expressive-brushwork-of-vincent-van-gogh/ – same thing as all others mentioned. Wider images, skinnier text area.

Single post template 23, seen here – https://cloud.tagdiv.com/how-to-create-the-most-natural-looking-veneers/ – same thing as all others mentioned. Wider images, skinnier text area.

Single Post Template 18, seen here – https://cloud.tagdiv.com/game-of-cooking-see-how-good-you-are/ – same thing as all others mentioned. Wider images, skinnier text area.

Single Post Template 25, seen here – https://cloud.tagdiv.com/spa-and-wellness-resorts-are-amazing-for-your-health/ – same thing as all others mentioned. Wider images, skinnier text area.

Thank you. So it’s not actually your theme or template that makles the images stretch outside of content, it’s a built in wordpress option?

I have a plugin installed to use the classic editor instead because I’m not a fan of Glutenberg. To be fair I have not tried it much. Perhaps it’s time I do.

thank you

Hey guys, okay.. so I decided to use a site wide background. I know that boxes the theme. I am fine with this.

I tried to have a single post page, no sidebar. I used your suggestion about using the gutenberg wordpress editor to make images full size.

I changed the theme so it is ‘default’ size, I suspect 1166px

My goal, on a single post is to be able to have my text area indented so it is 900 px, maybe even 800px but the images, stretch from side to side, not going over into the background.

I measured the container, it is 1166. I add an image, I set the properties.

Image size: full

Image dimensions: 100%

Custom max width: 1166

I save, I open.. I see it almost exact how I want it, except.. oddly there is a 1 or 2 pixel padding on the left side. The right side is perfectly flush with container, as it should be. The left side.. off by 1 or 2 px like I said.

https://i.imgur.com/F0VuJgJ.jpg

Seems no matter what I do, that small left side padding is there. Also there on youtube videos when i want them to be side to side (but not going into the background)

Any ideas how to remove the left side padding in this container? images, video.. both have the border if set the custom max width to 1166. I I try making the custom max width number larger – example.. 1168 or 1170px, it does not work, it remains same size as the container is 1166, constrained by background.

All I want is for the image or video to go side to side, clean with no side padding.

thank you

I think I figured it out myself, although on the single post with sidebar… it’d be great to be able to get the featured image (or video if a youtube post) to be 100% wide as well with no padding. When i go into muy cloud template, and click the “Single Post Featured Image” area, try and set width to 1166… thinking it’ll now be 100% wide, it for some reason has a left padding again, and is well over the right side.

example..

https://i.imgur.com/u2ryJ1I.png

ok.. got the featured image 100% . – not sure how to get featured video 100% if the single post has video type selected and youtube url entered in the right spot when creating the post (right side, small box, featured video)

I am back to square on now :/

Yes, I figured out how to make images 100% wide in my post so they align properly etc, but it’s not responsive of course so on smaller browsers ie: mobile.. it’s not working, it look terrible.

So my new question..

You know what I was trying to do above, how can I do this, but also have it responsive so if window is smaller or resized, the content adjusts appropriately?

Sorry to bring this question back from the dead =)

I’m trying to create a post template that I can use in some posts, not all.. The basic outline is simple, it’d match my site as per all other things (header/footer etc) but the images or video I add to the middle of a post or throughout the post are wider.

I know you can achieve this in WordPress by itself using Gutenberg, but if I was doing that I wouldn’t be using your theme of course. =)

Inside your own blog..

https://tagdiv.com/customize-articles-with-single-post-templates/

This I believe is using the Newspaper theme.

Seems to be stretched to 1400px

inner column is 700px but the media seems to be 1200 or something, breaking outside of the column

This post shows video or animation + images being wider than the column in the middle with text.

Ultimately I’d rather have the option to have the media images extend either outside like iny our blog post or even better, to the browser end as seen in the example below but I have been unable to do that with your theme.

Not your theme but it outlines perfectly what I wish you had a template of in the cloud

https://renchlist.com/honda-cb750-cafe-racer-fastec-racing-custom/

This is an example (see how images when you scroll down are the width of the browser.. if you’re viewing on a phone this won’t make sense. I have seen this before and love it as an option, you’ll see how the images break the columns.

This theme is an older theme (15zine by cubellthemes) which is why I’m even more confused, ha, if old themes can do this, newer bigger themes I would think could as well, at very least from a template in the cloud you guys have for us.

I have been pondering switching to a different theme but I have faith in Tagdiv so I must be doing it wrong.

thanks guys

To be clear, I am not trying to do this for my featured image. I know how to do that, I am trying to do this for 1 or more images throughout my post.

I figured out how to do it in a single page template as your post showed.

https://i.imgur.com/JGd16Wg.png

‘Extend by’ allows me to enlarge the image which is great but at the limitation that I have to specify a pixel amount.

400 as I entered will expand my image 400 pixels per side which allows me to give the effect I am trying for, but I’d MUCH rather be able to have it simply fill the browser window.

If I enter in 100%, it expands the image to 100% of the uploaded image so if the uploaded image is 3000 pixels, it places a 3000 pixel image in frame, if the browser window is smaller than this you get a cut off image.

What is the text I enter in the ‘extend by’ box to have the image at 100% of the browser window, so larger window sees larger image, smaller window see smaller image but the entire image is shown.

I know it’s not 100%, as noted above. Is this possible in this section or i there a different way to do it?

The theme I showed you earlier, they can even apply the 100% outside column option to videos.. which is really cool.

https://renchlist.com/better-wind-film-scott-toepfer/

Thing is, I don’t want to use their theme. I have been with you guys for years, I even own Newsmag theme as well. ?

In the mean time… umm.. how can I do it to my image and maaaybe a video? 🙂

thx guys!

• This reply was modified 5 years by James David.