By ipwa on
I have a node type called eventos, which I have themed with a template file to display the date the node was created, in a nice calendar icon with CSS. I used this code:
<div class="content">
<div class="post-date"><span class="post-month"><?php print (format_date($node->created, 'custom', 'M')) ?></span> <span class="post-day"><?php print (format_date($node->created, 'custom', 'd')) ?></span></div>
<?php print $content; ?>
</div>
The node type has a CCK date field that the author of the node chooses from lists. I would like that date to be displayed in the calendar icon instead of the node created date. The field is called Fecha (field_time). Does anyone know how I could do this? Any help would be really really appreciated.
Comments
Finding the field
Add this to the top of your termplate file
This will show you the available fields and you should be able to determine what you need for your task.
Try this
I would do something like this:
Now the field is probably showing up as part of $content already. To fix that, go to admin/content/types/eventos/display and set the Fecha field display to
Anyone know of any examples
Anyone know of any examples or tutorials of CCK Fields being themed? I'm a visual learner and would love to see something like this done either in a tutorial or even see the results that someone else has done on their Drupal site.
example of themed date field
This site is still in development, the address is http://fluid.ipwa.net/. There you will see that the date for the events is themed. I did a content type called eventos that had a date CCK field. I themed that content type using a a template file called node-evento.tpl.php, this is my code for that file:
This is the CSS used for the dates :
Make a date icon in Photoshop that is 48 x 43 to use as the background for the date, you can use my icon as a base to make your own that suits you colour scheme, but please don't use mine in your site. I can send you the source Photoshop file if you want so you make your own but it is really simple to make it from scratch. Imro0k was the one that helped me to theme the CCK dates because before the date that was themed was the date when the node was created. I'm going to make a tutorial on how to make events for your site using this method for www.mulpo.com/, I'll post the link here when it's ready.
Nicolas
-------------------------
almost there, but last bit of your post is missing
Hey imrook, thanks a lot for the response this looks like its the way to do it. Unfortunately if I put that php code in my template file I get this error:
At the end of the post you tell me how I can display the date separate from the $content variable, but the part that exaplains how to fix that is missing, ;). I went to admin/content/types/eventos/display and the label is set to inline, and both the teaser and the full node are set to short time format. What should I set them to???
Thanks for answering, it looks like soon I'll get them to display the went I want to...
Nicolas
-------------------------
I fixed it
Thank you so much imrook, your code was missing a simple ")". I feel like I have learned something really cool today, it will help me for many other projects. Thanks man you really sorted me out!
so the code that works is:
Nicolas
-------------------------
N00bie tutorial needed please
could some kind person lay this out for me step by step please, what to click, where to add code etc???
if you'd like to post it or drop me a line at mouse77e {at} gmail {dot} com, that would be most cool!
Many thanks
Getting there... ish! - help needed, please
So, i think i figured most of this out but as a n00bie there are a couple of bits I need to sort out, any help would be appriciated.
have a look at http://farm2.static.flickr.com/1250/1385598072_b50330c70d_o.jpg
you'll see a couple of things [i was still using the date-bg from the demo site... that has now changed!]
1: there is a date field in the top left of the screen... hmmmm why? and how do i get rid of that?
2: i want the date to reflect the date the page node was created... how do i do that?
FYI: i added the code for the .tpl.php into the theme, copied the CSS into style.css and added the code into the template.tpl.php
many thanks...
Without the actual html/css that would be a challange
I wonder why there are two copies, but I am guessing you are positioning the one in the top left and are either using the wrong position type or the parent element lacks a 'position: relative' css rule. The other approach is to float the element.
The date the node was created is available as $node->created, so the snippet would become
warning: Cannot modify
warning: Cannot modify header information - headers already sent by (output started at /home/afterthe/public_html/themes/garland/template.php:174) in /home/afterthe/public_html/includes/common.inc on line 309.new error message.... hmmmm
http://farm2.static.flickr.com/1015/1387402373_2235e0023b_o.jpg
Nevets, thanks for the interest. all the code is as per the tutorial... to the letter! hmmmm weird huh?
It would help to see your code
The error often comes from having an error in the code or a file that was originally utf8 and edited and saved with a ascii editor (it leaves a marker before the <?php). Since that was a three line change from the earlier version it is hard to see what may be the problem.
might be the problem
Take the code you put into the template.tpl.php and erase it, I guess that is why you are getting two date fields. For this example I only modified the node.tpl.php and the CSS. If you still have problems let me know (ipwa[at]ipwa[dot]com) and I'll mail you the files I use.
Nicolas
-------------------------
Sorted!
Mr IPWA your the man! Many thanks
http://afterthemouse.com it works!
thanks!!
Hey you are too kind mouse77e. I am glad you got your problem sorted out. I was going to upload the source Photoshop files to my server and give a link in this post so anyone could modify the date icon I made to suit their theme, but unfortunately my precious laptop got stolen from my house a few days ago. I'll try to get my uni to send me a copy of the source files I submitted to them, if I ever get the files back I'll post the source files for all my icons I used @ www.mulpo.com
Nicolas
-------------------------
Date Field
i am using this code a second time... first time out was for the posting date on a content type.... now i want to use it as intended for upcomming events. how do i set up the date field so it dosen't always show Jan 1st???
many thanks
Mouse
maybe some of this can help
I don't know why it would do that, I don't remember that happening to me. I use the themed date field as you want to in this site: http://fluidperu.com/
I use the JS calendar from jtools (http://drupal.org/project/jstools), this gives your users the ability to select the date from a cool little pop up calendar, like in airline sites. On the date filed from your Custom Content Type, select text field with javascript pop up calendar for the widget. In the input options use it a year, month, and day granularity, and make sure To Date is set to never. I also have no time zone conversion. This worked for me, let me know if you still have a problem.
Use the code in a node-(Custom Content Type name).tpl.php
Nicolas
-------------------------
I thought I would chime in
I thought I would chime in here and provide you guys with some cool and different date background images! Enjoy! http://www.euphorish.com/2007/05/web-20-date-icons-for-your-blog/
Worked great for me - thanks
I was trying to do this exact thing so this was very helpful.
I was doing this inside a views 2 block view as unformatted inside the views-view-fields--visit-event-all--block.tpl.php file
CSS
Result: http://www.tyndale.ca/events
Thanks again!