Posted by firstamendrulez on November 28, 2010 at 12:51pm
I'm making an article/story content type with CCK and I have it looking the way I want it to but a dilemma has arisen: how do you hide fields that are styled with CSS when no data is entered. In my specific situation, an article contains all the fields needed (headline, byline, text) but no image is imputed.
I have images styled so that they float to the left and the text will wrap around (similar to the way it would in usatoday.com). But if no image is uploaded, the styling is still visible and leaves an awkward space where it would have been. See the screen shots below.
My article architecture is similar to New York Observer's case study but I just don't know who to get rid of that empty space.
Any solutions or alternatives?
| Attachment | Size |
|---|---|
| 1.jpg | 118.21 KB |
| 2.jpg | 137.54 KB |
Comments
What's in your html?
What's in your html and /or your css that's setting dimensions for a nonexistent item?
Here's how it looks
The HTML isn't showing properly but basically I used div IDs to wrap the lead photo and article text.
And here's what I have for the CSS:
lead_photo {
border: 1px solid #c4c4c4;
padding: 4px 5px;
margin-left: 0;
-moz-border-radius-bottomleft: 3px;
-moz-border-radius-bottomright: 3px;
-moz-border-radius-topleft: 0;
-moz-border-radius-topright: 0;
color: #444444;
float: left;
width: 310px;
text-align: center;
clear: left;
margin-right: 20px;
margin-bottom: 12px;
}
I'm not so worried about the CSS but so much more in finding a way to make the div ID that styles the lead photo to somehow disappear when no data in entered. Is there some kind of PHP if and then statement that will do this?
Here are two different articles I found from New York Oberver:
http://www.observer.com/2010/steve-eismans-7-billion-hedge-fund-front-po... (contains a lead image)
http://www.observer.com/2010/politics/morning-read-international-landsca... (no image)
If you look at the code source for these two pages, the first link has the div ID "lead_photo" but in the second link, it's not there. I would like to do something similar. In my set-up, regardless of whether there is data or not for a lead photo, the div ID still appears.
Is that possible with CCK?
Checking for Null content!
It's a good idea to check for null content and then print the content. You should not have to print the html around the image when there is no image. Alternately you can have a different HTML if there is no content.
This is similar to the way in a standard drupal theme, there is a check if there is any content in a specific region before the region is printed.
Shyamala
Unimity Solutions
Thank you
Thanks for your response and sorry for the late reply. I'll be playing around more with other ways to display/not display article images.