October 26th

Calendar icons not only for your blog

Submitted by sign on Fri, 10/26/2007 - 11:00.

Read the update blog post here

I have found a little bit of time last night to create few calendar icons.
You can now download the source file of icons for gimp (http://gimp.org).
calendar-icons-overview

How to implement them

HTML Code for one icon

<div class="calendar calendar-icon-10">
  <div class="calendar-day">26</div>
</div>

I have 12 classes, calendar-icon-X where X is the number of the month. In each calendar-icon-X is background image of the month.

Main Calendar CSS Code

.calendar {
  float: left;
  margin-right: 6px;
  width: 42px;
  height: 42px;
}

CSS Code for one icon

#content .calendar-icon-10 {
  background: url('calendar/10.gif');
}

CSS Code for day

.calendar-day {
  font-weight: bold;
  font-size: 1.3em;
  color: #000;
  width: 42px;
  text-align:center;
  padding-top: 14px;
}

How to use it in Drupal theme

Insert all css classes (above) to your style.css file. Open up your node.tpl.php file and add there:

<div class="calendar calendar-icon-<?php print Date("m", $node->created) ?>">
  <div class="calendar-day"><?php print Date("j", $node->created) ?></div>
</div>

Icons Licence

Icons are FREE! Enjoy and post some comments where you are using them if so. ;)

Suggestions and comments welcome.

Attachment	Size
calendar-icons.tar.gz	14.73 KB
calendar-icon-src.xcf	20.63 KB

60482 reads
Delicious
Technorati

Comments

Tue, 01/22/2008 - 21:28 — themegarden.org (not verified)

Can those icons be used in

Can those icons be used in Drupal GPL licensed Themes?

Wed, 01/23/2008 - 08:34 — sign

Yes, you can use them

Yes, you can use them wherever you want and do whatever you want with them. ;)

Thu, 01/31/2008 - 01:13 — Anonymous (not verified)

can someone tell me how can

can someone tell me how can add these icons to my webpages, I am using Frontpage

Mon, 02/25/2008 - 07:11 — Anonymous (not verified)

Epic FAIL.

Mon, 02/25/2008 - 11:20 — Maxi (not verified)

Very nice! thanks

Very nice!
thanks

Wed, 02/27/2008 - 06:14 — umesh karade (not verified)

using in HTML

can i use the following css in plane HTML

Wed, 02/27/2008 - 09:52 — sign

Yes you can, just copy the

Yes you can,
just copy the html and css.
That will do it. :)

Thu, 02/28/2008 - 22:57 — Anonymous (not verified)

FAIL

Hilarious.

Thu, 03/20/2008 - 04:13 — Anonymous (not verified)

thanks, i was looking for this

I just wanted to say thanks, i was looking for exactly this.

Mon, 03/24/2008 - 13:06 — Anonymous (not verified)

icons

Very nice icons. Are they free to use?

Tue, 03/25/2008 - 11:19 — sign

Yes, they are!

Tue, 04/15/2008 - 11:28 — Haggis (not verified)

Thanks

I have been coding my own CMS/blog/galery/news system for a few weeks now and this will make it look so much better

thanks

Mon, 06/02/2008 - 03:02 — Free Icons (not verified)

Can u showcase your icons to our site?

I must say your this Calendar icons is very nice icons,
Can u showcase your icons to
http://www.freeiconsdownload.com

Thanks

Wed, 06/18/2008 - 07:09 — Alvaro (not verified)

Great work. I've implemented

Great work. I've implemented your calendar icons into my WP Blog and now it looks great.

Thu, 07/17/2008 - 22:22 — Anthony (not verified)

Thanks

Thanks for the post, I just got it hooked up on my site theadsenseway.com

Thu, 07/24/2008 - 02:31 — Rapunzl (not verified)

Great work... exactly what I needed!

I looked for these for ages, and these are perfect! Thanks for your generosity.

Mon, 07/28/2008 - 02:43 — Anonymous (not verified)

You're an idiot. These are

You're an idiot. These are great, I was looking for somehting like this for my new blog.

Mon, 08/18/2008 - 12:45 — Anonymous (not verified)

using this with CCK

how can i use this with CCK's and VIEW's? i have a custom content type 'event date' and i want to use this style in my VIEW, is this possible?

Tue, 08/19/2008 - 07:43 — sign

Yes you can, you have to

Yes you can, you have to theme your view or if your view is a node view then theme a node

Tue, 08/26/2008 - 16:56 — Francesco (not verified)

very very nice effects

very very nice effects :)

thank you for the post!!!

Fri, 08/29/2008 - 13:48 — Howard Lake (not verified)

Good stuff, used in on fundraising.co.uk

Thanks for sharing that Marek. Have now implemented it on the blogs at

http://www.fundraising.co.uk/latest-blogs

One suggestion/request: can you add an alt tag for the calendar image that would explain what it was for someone with images switched off?

Something like: alt="Calendar - 30 August 2008".

Thanks.

Thu, 09/11/2008 - 08:25 — Satish Talim (not verified)

Using the icons

Thanks for the wonderful icons. I am using the same on my blog at http://rubylearning.com/blog/

Tue, 09/30/2008 - 00:14 — Chenliang (not verified)

thank you, i was looking for

thank you, i was looking for this

Wed, 10/01/2008 - 07:05 — war gold (not verified)

Thanks

Very nice comment.Like your article very much. Enjoy it to read such a informative view.

Thanks for sharing with us.Greatly done.

Mon, 12/22/2008 - 07:43 — Online Gambling (not verified)

Hi, i've just joined a

Hi, i've just joined a company and working there as a we designer, i have now got the calender codes as well, my boss will be very happy for this, that i have got something new :)

Mon, 12/22/2008 - 07:46 — communication skills (not verified)

I would like to thank you

I would like to thank you for the efforts you have made in writing this post.

Thu, 12/25/2008 - 04:05 — Brian James (not verified)

Can I implement this in WordPress?

Hello all:

Brian here. I'm working on the redesign of my site, and will be using WordPress for my blogging system. I am working on a theme for WordPress too, and wanted to know if I could use these icons in the blog?

Please e-mail me back. thanks.

Fri, 12/26/2008 - 15:27 — swg credits (not verified)

Sun, 02/15/2009 - 11:03 — Visitor (not verified)

Sat, 04/18/2009 - 18:10 — studenti macerata (not verified)

Thank u, we used it on our

Thank u, we used it on our website studenti macerata social network.
We improved also putting the cloud and it appers only if there are comments, avoiding in this way the "0" displaying ;-)

Wed, 05/20/2009 - 02:48 — Free Vector (not verified)

Many thanks

Thank's for share this icon, i like it, if you have vector format, can u showecase them on our site

Thanks

Popular content

London Drupal Developer

Calendar icons not only for your blog

How to implement them

How to use it in Drupal theme

Icons Licence

Comments

Post new comment