A great way to help spread the Christmas cheer during the festive season is to give your website a lick of paint with some nice Christmas decorations and perhaps a little santa hat sat on your logo. It shows that you’re a friendly, welcoming business and it’s a great way to refresh your website’s look and keep it up-to-date. It all helps create a good, positive perception of your brand and as I always say, in business perception is everything!
One question I get asked a lot is once you’ve had the Christmas graphics designed and the additional CSS styles sorted, how can you go about automating their appearance and disappearance at the right time?
JavaScript should generally be avoided for things like this as it runs on the client-side, so therefore if the person visiting your website has the date and/or time set wrong on their computer then the Christmas decorations will either display or not display, when they should or shouldn’t! The best way, if your website uses a server-side scripting language such as PHP, is to display the extra Christmas details depending on the time and date of the web server hosting your website, which is much more likely to be correct.
The way it works is by having some extra lines of code which only run in the if.. else statement, the if being “if it’s Christmas time”. You ensure that these lines of code go after your main CSS file so that they override anything which is displayed on your website the rest of the year.
Now, I always run off the rule that Christmas decorations can go up on 1st December at the earliest, and should come down on 6th January. So, with that in mind we use PHP’s date() function to establish where we are, like so:
if( (date("m") == "12") OR ( (date("m") == "01") AND (intval(date("j")) <= 6) ) ) { // add your extra lines of markup here for extra Christmassy graphics, CSS etc. }
What that basically does is looks if the current month is month 12 (ie. December), or if it’s month 1 (ie. January) and the day is up to and including the 6th. If it is, it executes the code to add Christmas decorations into your pages’ headers, otherwise we carry on as normal. Simple really!
Recent Comments