Using Featured Image in a Layout Cell?

This thread is resolved. Here is a description of the problem and solution.

Problem:
How can I use a Featured Image of a Post as the background of the header with Layouts?

Solution:
You can do it with a Visual Editor.

In the editor, use the Views ShortCode

[wpv-post-featured-image]

https://toolset.com/documentation/views-shortcodes/#wpv-post-featured-image.

Use CSS to customise the position of the other cells of your layouts and the Visual Editor Cell, give them proper z-index positions to not overlay the other cells.

Have a look at the "Header and Footer" Layout of the Reference Sites. They apply above solution.

Relevant Documentation:
http://discover-wp.com/site-templates/

This support ticket is created 8 years, 2 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

No supporters are available to work today on Toolset forum. Feel free to create tickets and we will handle it as soon as we are online. Thank you for your understanding.

Sun	Mon	Tue	Wed	Thu	Fri	Sat
-	-	14:00 – 20:00	14:00 – 20:00	14:00 – 20:00	14:00 – 20:00	14:00 – 20:00
-	-	-	-	-	-	-

Supporter timezone: Asia/Ho_Chi_Minh (GMT+07:00)

Tagged: Front-end display, Layouts plugin, Toolset Starter Theme

This topic contains 4 replies, has 2 voices.

Last updated by Ronald 8 years, 2 months ago.

Assisted by: Beda.

Author

Posts

July 25, 2016 at 9:00 pm #419457

Ronald

I am trying to: create a header image area that takes the featured image of that page to display

I visited this URL: hidden link

The image at the top of the page on this site is the featured image for that specific page, if you go to another location page, the image changes.

I am trying to replicate this functionality using Layouts and the Starter theme. There is an image block but that image doesnt change based on the featured image. I would love to be able to reproduce this.

Can anyone help?

July 26, 2016 at 8:48 am #419578

Beda

You can not do this with the Image Box Cell.

You can do it with a Visual Editor.

In the editor, use the Views ShortCode "[wpv-post-featured-image]:
https://toolset.com/documentation/views-shortcodes/#wpv-post-featured-image.

Let me know how that goes.

July 26, 2016 at 1:58 pm #419670

Ronald

Ok, but how would I use that shortcode if I wanted it in the background of the menu/header section like it is in the example I showed? I would need to set that as the background to an entire layouts row correct?

July 27, 2016 at 3:41 am #419826

Beda

You can not set a Cell to be background of a Row.

This can be done in CSS, but the Layouts Cells will display Content, and the background of the Row where they are in, must be styled in CSS. This is the same in pure HTML.

You can use may approach, and use CSS to customize the position of the Menu and the Visual Editor Cell, give them proper z-index positions to not overlay the menu.

I suggest you have a look at discover-wp.com reference Sites.

They use a menu, that is overlying a Image Box, but that Box can be replaced by anything.
You can then have a Look at the Custom CSS applyied there.

Classifieds with Layouts Reference Site would be a good example.
Look at the "Header and Footer" Layout.

This is (I think) exactly what you need.
http://discover-wp.com/site-templates/

You can also download those as Frameworks for local development and reference.

July 27, 2016 at 2:12 pm #420038

Ronald

Ah thank you! I think that would do what I need.

This ticket is now closed. If you're a Toolset client and need related help, please open a new support ticket.