WP Date Image Hack

Listen to article

Nag-post ko sa yano nga hack nga akong gibuhat gamit ang dynamic nga mga hulagway aron ilisan ang mga petsa sa akong blog. Sundoga lang ang mubo nga tutorial dinhi aron ipatuman ang parehas sa imong Wordpress nga blog:

  • Paghimo og imong kaugalingong template sa hulagway sa petsa gamit ang Photoshop. Siguroha nga imong ibutang ang layout aron ang bulan, adlaw ug tuig magkalain‑lain ug dili magtapok. Tan-awa ang akong pananglitan dinhi:
  • Paggamit sa ruler guide sa Photoshop, putla ang template ngadto sa tulo ka bahin.
  • Kinahanglan nimo tukion ang pormat sa petsa nga gigamit nimo sa imong blog. Ang akong gigamit kay adlaw sa semana, adlaw ug bulan. Karon, paghimo og tagsa‑tagsa ka mga hulagway gamit ang giputol nga template ug ngalanan kini sumala. Alang sa adlaw sa semana, ang naming convention kay mon.gif, tue.gif, … sun.gif; alang sa adlaw — 1.gif,… 30.gif; alang sa bulan — jan.gif, feb.gif,… dec.gif.


  • (Nota: Kung mogamit ka og kompleto nga mga ngalan sa petsa, kinahanglan nimo ngalanan ang imong mga GIF file sa parehas nga paagi (pananglitan, Friday, February 22, 2005 maggamit og "friday.gif", "february.gif", "22.gif" ug "2005.gif").
  • Karon, andam na ta nga i‑hack ang WP date function aron ilisan ang teksto nga petsa og mga hulagway. Adto sa imong WP theme folder ug pangitaa ang post.php nga file ug ablihi kini para i‑edit. Nota: depende sa WP theme nga imong gigamit, ang file mahimo usab nga index.php.
  • Pangitaa ang date function ingon niini:

    Kinahanglan nimo kini buwagon ngadto sa 3 ka bahin sama niini:



    Karon i‑edit nato kini aron ang code mag‑echo sa ekwivalente nga hulagway:

    "); ?>
    "); ?>
    "); ?>
  • Kinahanglan nimo susihon ang string sa date format parameter kung lahi ang imong pormat sa petsa.

Nanghinaut ko nga sayon ra sabton kana. :D Wala ko kasiguro kung mahimo kining hack nga plugin.

Frequently Asked Questions

How do I create the date images for this hack?
Create a date image template in Photoshop with distinct month, day, and year sections. Slice it into three parts and save each as a GIF file with specific naming conventions.
What naming convention should I use for the date images?
For day of week, use mon.gif, tue.gif, etc. For day, use 1.gif, 2.gif, etc. For month, use jan.gif, feb.gif, etc.
Which file do I edit to replace text dates with images?
Edit the post.php file in your WordPress theme folder. Depending on the theme, it could also be index.php.
React to this article:
Written by
Abe Olandres

Abe Olandres

Editor-in-chief

Abe is the founder and Editor-in-Chief of YugaTech with over 20 years of experience in the technology industry. He is one of the pioneers of blogging in the country and is considered by many as the Father of Tech Blogging in the Philippines.

View all posts by Abe Olandres →

53 Comments

BI
Big Willy · 20 years ago

Finally found some good infomation on the subject.

Reply
AB
Abe Olandres Editor-in-chief · 21 years ago

Hi John,

Did you try and just break the date function ito 3 parts, without the image substitution first? That way, we can see if the function really works just fine with your template.

If you can leave a link to your blog as well too.

Reply
JO
John · 21 years ago

Hi,

Its a great hack you have made. I have spent more than half a day with it and for some reason I can only make the current date display.

Im using WP 1.51.2 and on the template is uses:

‘,”); ?>

the date from this is correct.

‘; ?>
‘; ?>
‘; ?>

‘; ?>
‘; ?>
‘; ?>

Do you have any idea what i need to change to make the post date show and not the current date.

Many Thanks

Reply
TO
Tomjack · 21 years ago

hello, nice blog

Reply
AB
Abe Olandres Editor-in-chief · 21 years ago

Hi Sarah!

Sorry di ko mashado ma remember eh. bago na rin site mo kaya di ko ma familiarize. Good thing ako hindi mo nakalimutan! ;)

Glad to be able to help you as well. :)

Reply
SA
sarah · 21 years ago

hey yuga naalala mo pa kaya ako.. dati pa ako nakapunta dito kaso strawberryshake.net yung domain ko that time.. ayhoo.. ikaw lang pala makakasagot sa hinahanap kong image date hack hahah!! wala naman kasi sa support ng WP.. buti nalang ginoogle kita! hahahah!!! heheheh!!!!

Reply
AB
Abe Olandres Editor-in-chief · 21 years ago

@ Jose

Welcome! And nice implementation fo the hack on your blog!

@ markku

The copycat claimed he got it from File Me Away, but he failed to notice Josh’s hack was for MT. I actually posted a comment on Josh’s blog about our hacks similarities.

@ mr. nice ash

Yes, as I posted in my entry, Josh of File Me Away made the same tute for MovableType almost the same day I did mine. Though due to time zone differences, he actually did his a day later.

Reply
MR
mr nice ash · 21 years ago

master, i found a site wherein same hack is posted the same date that you posted this one. June 28, Tuesday. But i think the other one was a moveable type. Yeah.

Reply
MA
markku · 21 years ago

Yuga, just a clarification. Similar hacks like this was used before in greymatter, that was years ago. I think Derek Powazek even used it in Fray, if my memory is not failing me. ;)

But for WP, I think you’re the first who shared something about this. To hell with those who take and claim it as their own. ;)

I suggest you stick a CC or any specific license for anything you share, so they think twice about stealing. ;)

Reply
JO
Jose · 21 years ago

YAY!!!!! Thnks you SO MUCH!!!!

Reply
AB
Abe Olandres Editor-in-chief · 21 years ago

@ Paul

Hi! As fleeb mentioned, that used to be the case here, text over image bg. I got a little bored and wanted to customize the theme a bit different so I made the hack.

@ Jose

Please check on the codes. The one I posted above has lots of spaces in between tags esp. between the “

Reply
JO
Jose · 21 years ago

I need a little bit of help!!! I was looking for a hack like this so long and I finally founded. I try to use it but seems it’s not even been read. What can be wrong???? I use a different date format but I have checked the strings and they are all right. Please Help me. This hack is awesome!!

Reply
FL
Fleeb · 21 years ago

@Paul

Well maybe…

For one, he may be using a font he really like to use but many don’t have (although this can be compensated with the use of the GD image library, and well, by the use of font-family). Another is the anti-aliased text making it look smoother. And finally, before switching to the use of this images, the “text over background image” was employed before (as it is by default).

Reply
PA
Paul Armstrong · 21 years ago

Why don’t you just output the text in different spans over a single background image? It really isn’t *standard* anymore to use images for anything that could be displayed with text (like the “Too Cool for IE” badge)

Reply
MR
mr nice ash · 21 years ago

and the wordpress hacks… sikat na talaga master ko.

Reply
AB
Abe Olandres Editor-in-chief · 21 years ago

Kates, taga diin ka? Ilongga ka man?

Thanks markku, darksparrow… will look into it. ;)

Reply
DA
darksparrow · 21 years ago

i agree with markku

Reply
KA
Kates · 21 years ago

Damo gali sagad sa guam bah. Labay lang ko ah.

Reply
MA
markku · 21 years ago

Yuga, you can actually do it without hacking the date functions. You just make do with:

.gif’ >

and the others in similar ways. That way, upgrading WP won’t kill your nice hack. :)

Reply
AB
Abe Olandres Editor-in-chief · 21 years ago

@mr. nice ash

tehehe… madali lang yan actually. Konting kalikot lang. ;)

@AnP

Thanks! Hindi po, late na ako dun tsaka di ko ata kaya yun!

@Fleeb

Will look into it, but this one is pretty simple. Yung magiging problem mo dito cguro yung management ng Options as WP-Admin.

Reply
FL
Fleeb · 21 years ago

Yup it can be made into a plug-in, I think that add_action function in WP…

Reply
AN
AnP · 21 years ago

cool plug-in!!! did you join Alex King’s contest? :)

Will install it this week! Great one, Yuga!!! You really deserve all the accolades you have been getting.

Reply
MR
mr nice ash · 21 years ago

wow. just as i thought. yeah. im a newbie but i almost exactly figured out what you have done to came up with your wp-image-date Plugins. You really are a PHP guru. Why not submit your plugin?? and share your package to others… ;)

master i know how to make some tweaks on wordpress but i dont know php itself. :(

Reply

Leave a Reply

Loading next article...