Hello,
I would like to use full-width images on my blog. I am setting up and was wondering if it’s possible. The look I’m going for is something like this for the single-post page: http://www.nytimes.com/2015/12/04/t-magazine/travel/tour-du-mont-blanc-cheese-hike.html?_r=0
I am using the Newspaper theme basing my changes on the Classic Blog demo. I’ve already been told reducing the text width is not possible, but was hoping full-width images (without changing the text width) might be.
Hello pritamps,
If you want to use a full-width image on your posts, you can use Visual Composer for posts -> http://screencast.com/t/ZvgzEFu0ent and then you have to use a single row with these changes -> http://screencast.com/t/ZTS9jwhj5zku -> http://screencast.com/t/FN17fY9gle Please notice that Visual Composer plugins is not tested for posts and is required to do some customization after changes. Another possibility for you would be to use Revolution Slider.
You can use Revolution Slider plugin, which it’s included in /plugins folder, to create a full-width slider: http://screencast.com/t/5KiwDmuQwj You can find the installation steps of the plugin in our documentation here: https://forum.tagdiv.com/how-to-install-revolution-slider-v5/ We have some demo sliders, in Newspaper-tf\demo_sliders folder, which you can use to became more familiar with plugins functionality: https://forum.tagdiv.com/import-revolution-sliders-on-demos/ and also you can check plugin’s official documentation for more details regarding the features available: http://www.themepunch.com/revslider-doc/welcome-slider-revolution/
Hope this helps and let us know how it goes!
Thank you for the message!
This is the same problem that I have but I can get either an image, or a revolution slider up above the title to fill out the top hero panel. Did anyone find a solution for this? You tell this person to use a single row, but it still doesnt get over the title of the post or above the sidebar.
Hi,
The height of the row cannot be changed from the settings, but it can be done with custom css. Please add an extra class to the row in visuak composer and then use the class to set the min-height like so:
.mycustomclass{
min-height: 73.1754vh!important;
}
The value from the code is the default value that visual composer sets to the row. Lower this value to reduce the height of the container
Thank you!
Hi, Ive enabled visual editor for posts and made the changes to the single row as necessary, Ive also added the custom CSS and named the class but still cannot achieve the desired effect…. any help would be appreciated
Hi infrastructureaustralia,
I added the row, then put a class name in the bottom of the rows settings with hyphens between words, then I took the piece of code that Bogdan gave me:
.mycustomclass{
min-height: 73.1754vh!important;
}
and changed the mycustomclass bit to the exact name my row class is called. I changed the number to between 50-55 and played around with it a bit. To enter the custom code I went back to the top of the visual composer for that page and clicked on the settings cog wheel and just pasted the custom code in there.
It worked very easily for me, I hope this helps and isnt painfully obvious.
Hi thoseconspiracyguys,
Thanks for your help but it still isnt happening for me, Ive added the row, added a class name copied in the code in the custom CSS and changed it to my class name and have the row settings as out lined above but im still not getting the image above the post as so… https://imgur.com/U24ELJ8
ive got the style set to 4 and turned of the sidebar but this really isnt working for me
Hi,
I couldn’t get it to over the post heading. I was trying to do that with the revolution slider so there was maybe a crossover with the TagDiv teams replies to me. It works on a plain page template and you have to do another little trick to close the white space between the Rev slider and the top menu. I couldn’t figure out how to change the style.php file to get the post above the post title but it does work on a plain page with no sidebar, like a home page for example. Please see http://www.thoseconspiracyguys.com on the home page for an example