News:

Want to get involved in developing SMF, then why not lend a hand on our github!

Main Menu

jquery countdown

Started by Illori, November 03, 2013, 06:15:44 AM

Previous topic - Next topic

Illori

Download the files from http://keith-wood.name/countdown.html

put the css in your default themes css folder put the js file in your default themes scripts folder

the following edits are in the themes index.template.php file

Code (find) Select
<link rel="stylesheet" type="text/css" href="', $settings['theme_url'], '/css/index', $context['theme_variant'], '.css?fin20" />';

Code (replace) Select
<link rel="stylesheet" type="text/css" href="', $settings['theme_url'], '/css/index', $context['theme_variant'], '.css?fin20" />
<link rel="stylesheet" type="text/css" href="', $settings['default_theme_url'], '/css/jquery.countdown.css" /> ';


Code (find) Select
<script type="text/javascript" src="', $settings['theme_url'], '/scripts/theme.js?fin20"></script>

Code (add after) Select
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript"  src="', $settings['default_theme_url'], '/scripts/jquery.countdown.js"></script>


Code (find) Select
var ajax_notification_cancel_text = "', $txt['modify_cancel'], '";
// ]]></script>


Code (add after) Select
  <script type="text/javascript">
        $(function() {
            var chrisDay = new Date();
chrisDay = new Date(2013, 12 - 1, 25);
            $(\'#CountDown\').countdown({
until: chrisDay,
description: \'Until Christmas\',
expiryText: \'It is Christmas\',
});
        });
    </script>';


now in your board description add <div id="CountDown">

    </div>


the div to display the countdown time can be put in any location, not just in a board description.

If you are using mods that already load jquery you can leave out this<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

Shambles

Nice and tidy. Thanks.

Might be worth mentioning that the file that needs editing is index.template.php in the theme folder.

Illori

Quote from: Shambles on November 03, 2013, 01:06:57 PM
Nice and tidy. Thanks.

Might be worth mentioning that the file that needs editing is index.template.php in the theme folder.

done

Advertisement: