Layout assistance
I'm afraid that whatever I eventually come up with is going to be an ugly hack that will be back to haunt me. I don't know if the solution can be found via CSS, PHP, modules (CCK? Views?), etc. I have done a lot of searching!
I'm using Drupal 6.11 with the ATCK theme.
Here is what I want:
A simple little "infobox" that sits in the bottom right corner of each blog post. Right now, it consists of service_links, submitted date, and the "add comment" link. I want the bottom of the "infobox" aligned with the bottom of the blog content (second image). Right now, using floats, the best I've done is to have the top of the "infobox" aligned with the top of the last element of the blog content (first image).
I would really like the "infobox" to be its own block, but I don't know how to do that such that it will stay aligned with the bottom right of the blog post. Eventually, I would like to add in a teaser image.
Below are screenshots. Red and orange boxes added for clarity.
http://i609.photobucket.com/albums/tt177/seeclark/check-1.jpg
http://i609.photobucket.com/albums/tt177/seeclark/check-2.jpg
Below is the code for the node-blog.tpl.php, in which I try to get all of the elements of the infobox to fall within the infobox div. I don't quite know how to wrangle with the outputs to determine what is included in $content.
<div id="node-<?php echo $node->type .'-'. $node->nid; ?>" class="<?php print $node_class ?>">
<?php if ($page == 0): ?>
<h2 class="title"><a href="<?php print $node_url ?>"><?php print $title; ?></a></h2>
<?php endif; ?>
<div class="content">
<?php print $content; ?>
<div class="infobox">
<?php if ($picture): ?>
<?php print $picture; ?>
<?php endif; ?>
<?php if ($submitted): ?>
<div class="submitted">
<?php print format_date($node->created, 'custom', "F jS, Y") ?>
</div>
<?php endif; ?>
<?php if ($links): ?>
<?php print $links; ?>
<?php endif; ?>
<?php if (count($taxonomy)): ?>
<div class="taxonomy">
<?php print t('tags: ') . $terms; ?>
</div>
<?php endif; ?>
</div>
</div>
</div><!-- /#node-<?php print $node->nid; ?> -->I hope I've given enough information for someone to point me in the right direction : )
In your stylesheet, do
In your stylesheet, do something like this:
.node {
position: relative;
}
.node .infobox {
position: absolute;
right: 0;
bottom: 0;
}
That should position div.infobox it at the bottom right corner of div.node. I’m not sure if it will conflict with other styles from the theme you are using, though.
Thanks!
That works!
I'm still having trouble getting the service_links to print within the infobox div. I have a basic understanding of programming concepts, but have been trying to avoid getting too involved with PHP. I've played around a bit with service-links.module, and have managed to get "Array" to print out instead of the actual service-links image.
I've done some searching on that specific issue, but don't find the results useful.
Here is the output structure from my test page:
<div id="content"><div id="node-blog-10" class="node ntype-blog teaser promoted-to-front odd">
<h2 class="title"></h2>
<div class="content">
<div id="lipsum"></div>
<div class="service-links">
<div class="service-label"> </div>
<ul class="links"></ul>
</div>
<div class="infobox"></div>
</div>
</div>
I may just have to read up on PHP!
c
You just have to move and
You just have to move and place
<div class="service-links"><div class="service-label"> </div>
<ul class="links"></ul>
</div>
inside your
<div class="infobox"></div>love, light n laughter
gausarts