Countdown timer in php and javascript, for the world cup 2018

Are your counting the days too? Now this is an extremely easy solution to count down to the FIFA world cup 2018 with php or javascript.

Lets see how to do this in two ways.

First we get the exact date from the Official website. In numeric format the date will be 6.14.2018.

It is starting on June 14 2018. WOW!!!


Now we will place the date month and year in the mktime section of the php code below:

$fifa_wc = mktime(0, 0, 0, 6, 14, 2018) ;
$now = time () ;
$result =($fifa_wc-$now) ;
$daystoGO =(int) ($result/86400) ;
print "World Cup 2018 - $daystoGO days to go!";

We have written “World Cup 2018 – ” before $daystoGO in the code, you can write some more text or change it as you like.

For php only code just add this code to your wordpress blog sidebar or posts if your blog is php-code enabled, or add this code directly to a page or post or sidebar template. If php is not working for your html only pages then the javascript code can come to your rescue.


If you are not aware of php or it is not working on your html only page, just copy and paste the javascript code below to your page, see how we have added the occasion date in the “target” variable.

You can also add this section to your page before the end tag, to keep the page content clean!

<script language="javascript" type="text/javascript">
today  = new Date();
todayE  = today.getTime();
target = new Date("14 June, 2018");
targetE = target.getTime();
daystoGO = Math.floor(((targetE - todayE) / (60*60*24)) / 1000);

And add the following section to the area where you want the countdown output.

World Cup 2018 - <script>document.write(daystoGO);</script> days to go!

RESULT: World Cup 2018 – -1216 days to go!

You can add this same code for Durgapuja, Diwali, Christmas, or New Year countdown too!

Last modified on September 15th, 2015 at 8:07 pm.
Share this post:

Priyanka Naskar Majumder - the Owner, Eyedea LAB. Graphic & Web Design Studio, lives in Kolkata, India. Interested in: Usability research, Graphic Design, Web Design & Development.

One Comment

Leave a Reply

Your email address will not be published. Required fields are marked *


Allowed HTML tags: <strong> <em> <pre> <code> <a href="" title="">