Tell us what you are trying to do?
I am trying to fill the background of a column with a dynamic HEX value from a post type database
I am using the Total theme, and wondering if there's an easy responsive way to do this. E.g. this is a swatch color for a paint sample.
Is there any documentation that you are following?
Is there a similar example that we can see?
What is the link to your site?
hidden link
Hi, it sounds like you are storing a hex value in a custom field for some custom post type, and you would like to use that hex value to set the background color of an HTML element on the front-end of the site. I can't think of an easy way to do this other than to use HTML and inline CSS to set the background-color style using the raw field value. For example:
<div style="background-color:#[types field='your-hex-field-slug' output='raw'][/types];">
Your content would be here...
</div>
That assumes you do not store the # character in the custom field. If you do store it in the custom field, you can remove it from the markup example above. Let me know if I misunderstood what you're trying to accomplish.
Thanks, that's what I was thinking. I am able to set the height using CSS on the DIV ID. Now I'm trying to place an image in one of the boxes and can't seem to get it to "cover", so that upon resize it completely fills the area with the photo.
I've tried all types of this: with no values for height or width, resize set to crop, cover, etc. and the second image simply doesn't want to cooperate. The first image in the row is working how I would like. Any thoughts on how I might fix this?
Does the Total Theme Image module not able to read Toolset field values? I tried using that with no luck. Resorted to a text box with the following Toolset shortcode in place.
{!{types field='siding-lap-bb-vertical-image' size='full' width='285px' height='200px' resize='contain' }!}{!{/types}!}
I've tried all types of this: with no values for height or width, resize set to crop, cover, etc. and the second image simply doesn't want to cooperate. The first image in the row is working how I would like. Any thoughts on how I might fix this?
Based on what you described, it seems you need to explore setting the image as a CSS background image for some div with an explicit height and width, then utilize background-size, background-position, background-repeat, background-clip and so forth to manipulate the background image and achieve the effect you want: https://www.w3schools.com/cssref/pr_background-attachment.asp
I'm not sure I understand completely, but if you can show me how you would set this up using a static image - in other words, a working version using the image from the Types field but without any Toolset shortcodes - I can take a look and let you know how we could implement similar functionality using a Types custom field image.
Does the Total Theme Image module not able to read Toolset field values? I tried using that with no luck.
Hmm, I'm not familiar with that specific theme and module so I'm not sure. In general, a Toolset shortcode should work in any input field that accepts shortcodes - that is to say, if the theme expects to receive shortcodes in its input fields. That's more of a question for the theme authors or their support team, who would be able to tell you definitively. Most basic inputs aren't designed to accept shortcode input, just static text like a URL or hex value. If you find out from the theme authors that the inputs are designed to accept shortcodes, yet Toolset shortcodes are not working, then we could take a closer look at that as a compatibility issue.
My issue is resolved now. Thank you!
