PHP Magento Tips

display special price countdown timer clock in magento

Rate this posting:
{[['']]}

Product list and detail pages are one of the most important pages to generate more revenue from your website. With this eye catching animated price countdown timer extension allows you to display real Time Deal feature and it also motivate your customers to buy now and buy more products before deal ends.

To create price countdown extension for your store follow below steps:

Step 1: Create file in app/etc/modules/Vijay_Pricecountdown.xml and add below code in it.

<?xml version="1.0"?>

<config>

    <modules>

        <Vijay_Pricecountdown>

            <active>true</active>

            <codePool>local</codePool>

        </Vijay_Pricecountdown>

    </modules>

</config>


Step 2: Create file in app/code/local/Vijay/Pricecountdown/etc/config.xml and add below code in it.

<?xml version="1.0" encoding="UTF-8"?>

<config>

    <modules>

        <Vijay_Pricecountdown>

            <version>1.0.0</version>

        </Vijay_Pricecountdown>

    </modules>

    <frontend>

        <routers>

            <vijay_pricecountdown>

                <use>standard</use>

                <args>

                    <module>Vijay_Pricecountdown</module>

                    <frontName>pricecountdown</frontName>

                </args>

            </vijay_pricecountdown>

        </routers>    

        <layout>

            <updates>

                <vijay_pricecountdown>

                    <file>vijay/pricecountdown.xml</file>

                </vijay_pricecountdown>

            </updates>

        </layout>

    </frontend>

    <global>

        <blocks>

            <pricecountdown>

                <class>Vijay_Pricecountdown_Block</class>

            </pricecountdown>

        </blocks>

        <helpers>

            <vijay_pricecountdown>

                <class>Vijay_Pricecountdown_Helper</class>

            </vijay_pricecountdown>

        </helpers>

        <models>

            <pricecountdown>

                <class>Vijay_Pricecountdown_Model</class>

            </pricecountdown>

        </models>

    </global>

    <default>

        <vijay_pricecountdown>

            <configurations>

                <enabled>1</enabled>

                <show_plp>1</show_plp>

                <show_plp_title>1</show_plp_title>

                <plp_title>Offers End On:</plp_title>

                <clock_style_plp>1</clock_style_plp>

                <show_pdp>1</show_pdp>

                <show_pdp_title>1</show_pdp_title>

                <pdp_title>Offers End On:</pdp_title>

                <clock_style_pdp>1</clock_style_pdp>

            </configurations>          

        </vijay_pricecountdown>

    </default>

</config>


Step 3: Create file in app/code/local/Vijay/Pricecountdown/etc/system.xml and add below code in it.

<?xml version="1.0" encoding="UTF-8"?>

<config>

    <tabs>

        <vijay translate="label">

            <label>Vijay Pricecountdown</label>

            <sort_order>150</sort_order>

        </vijay>

    </tabs>

    <sections>

        <vijay_pricecountdown translate="label">

            <label>Special Price Countdown</label>

            <tab>vijay</tab>

            <frontend_type>text</frontend_type>

            <sort_order>20</sort_order>

            <show_in_default>1</show_in_default>

            <show_in_website>1</show_in_website>

            <show_in_store>1</show_in_store>

            <groups>



                <configurations translate="label">

                    <label>Configuration</label>

                    <frontend_type>text</frontend_type>

                    <sort_order>1</sort_order>

                    <show_in_default>1</show_in_default>

                    <show_in_website>1</show_in_website>

                    <show_in_store>1</show_in_store>

                    <fields>

                        <enabled translate="label">

                            <label>Enable</label>

                            <frontend_type>select</frontend_type>

                            <source_model>adminhtml/system_config_source_yesno</source_model>

                            <sort_order>1</sort_order>

                            <show_in_default>1</show_in_default>

                            <show_in_website>1</show_in_website>

                            <show_in_store>1</show_in_store>

                        </enabled>

                        <show_plp translate="label">

                            <label>Show Clock in Product List Page</label>

                            <frontend_type>select</frontend_type>

                            <source_model>adminhtml/system_config_source_yesno</source_model>

                            <sort_order>2</sort_order>

                            <show_in_default>1</show_in_default>

                            <show_in_website>1</show_in_website>

                            <show_in_store>1</show_in_store>

                            <depends>

                                <enabled>1</enabled>

                            </depends>

                            <validate>required-entry</validate>

                        </show_plp>



                        <show_plp_title translate="label">

                            <label>Show Clock Title</label>

                            <frontend_type>select</frontend_type>

                            <source_model>adminhtml/system_config_source_yesno</source_model>

                            <sort_order>3</sort_order>

                            <comment>Show Clock Title in Product List Page</comment>

                            <show_in_default>1</show_in_default>

                            <show_in_website>1</show_in_website>

                            <show_in_store>1</show_in_store>

                            <depends>

                                <enabled>1</enabled>

                                <show_plp>1</show_plp>

                            </depends>

                            <validate>required-entry</validate>

                        </show_plp_title>



                        <plp_title translate="label">

                            <label>Title</label>

                            <frontend_type>text</frontend_type>

                            <sort_order>4</sort_order>

                            <comment>Title will be displayed in Product List Page</comment>

                            <show_in_default>1</show_in_default>

                            <show_in_website>1</show_in_website>

                            <show_in_store>1</show_in_store>

                            <depends>

                                <enabled>1</enabled>

                                <show_plp>1</show_plp>

                                <show_plp_title>1</show_plp_title>

                            </depends>

                            <validate>required-entry</validate>

                        </plp_title>



                        <clock_style_plp translate="label">

                            <label>Clock Style</label>

                            <frontend_type>select</frontend_type>

                            <source_model>pricecountdown/style</source_model>

                            <sort_order>5</sort_order>

                            <comment>Clock Style for Product List Page</comment>

                            <show_in_default>1</show_in_default>

                            <show_in_website>1</show_in_website>

                            <show_in_store>1</show_in_store>

                            <depends>

                                <enabled>1</enabled>

                                <show_plp>1</show_plp>

                            </depends>

                            <validate>required-entry</validate>

                        </clock_style_plp>



                        <show_pdp translate="label">

                            <label>Show Clock in Product View Page</label>

                            <frontend_type>select</frontend_type>

                            <source_model>adminhtml/system_config_source_yesno</source_model>

                            <sort_order>6</sort_order>

                            <show_in_default>1</show_in_default>

                            <show_in_website>1</show_in_website>

                            <show_in_store>1</show_in_store>

                            <depends>

                                <enabled>1</enabled>

                            </depends>

                            <validate>required-entry</validate>

                        </show_pdp>



                        <show_pdp_title translate="label">

                            <label>Show Clock Title</label>

                            <frontend_type>select</frontend_type>

                            <source_model>adminhtml/system_config_source_yesno</source_model>

                            <sort_order>7</sort_order>

                            <comment>Show Clock Title in Product View Page</comment>

                            <show_in_default>1</show_in_default>

                            <show_in_website>1</show_in_website>

                            <show_in_store>1</show_in_store>

                            <depends>

                                <enabled>1</enabled>

                                <show_pdp>1</show_pdp>

                            </depends>

                            <validate>required-entry</validate>

                        </show_pdp_title>



                        <pdp_title translate="label">

                            <label>Title</label>

                            <frontend_type>text</frontend_type>

                            <sort_order>8</sort_order>

                            <comment>Title will be displayed in Product View Page</comment>

                            <show_in_default>1</show_in_default>

                            <show_in_website>1</show_in_website>

                            <show_in_store>1</show_in_store>

                            <depends>

                                <enabled>1</enabled>

                                <show_pdp>1</show_pdp>

                                <show_pdp_title>1</show_pdp_title>

                            </depends>

                            <validate>required-entry</validate>

                        </pdp_title>



                        <clock_style_pdp translate="label">

                            <label>Clock Style</label>

                            <frontend_type>select</frontend_type>

                            <source_model>pricecountdown/style</source_model>

                            <sort_order>9</sort_order>

                            <comment>Clock Style for Product View Page</comment>

                            <show_in_default>1</show_in_default>

                            <show_in_website>1</show_in_website>

                            <show_in_store>1</show_in_store>

                            <depends>

                                <enabled>1</enabled>

                                <show_pdp>1</show_pdp>

                            </depends>

                            <validate>required-entry</validate>

                        </clock_style_pdp>

                    </fields>

                </configurations>



            </groups>

        </vijay_pricecountdown>

    </sections>

</config>


Step 4: Create file in app/code/local/Vijay/Pricecountdown/etc/adminhtml.xml and add below code in it.

<?xml version="1.0" encoding="UTF-8"?>

<config>

    <menu>

        <system>

            <children>

                <vijay>

                    <title>Vijay Extensions</title>

                    <sort_order>10</sort_order>

                    <children>

                        <vijay_pricecountdown>

                            <title>Special Price Countdown</title>

                            <action>adminhtml/system_config/edit/section/vijay_pricecountdown</action>

                            <sort_order>20</sort_order>

                        </vijay_pricecountdown>

                    </children>

                </vijay>

            </children>

        </system>

    </menu>

    <acl>

        <resources>

            <all>

                <title>Allow Everything</title>

            </all>

            <admin>

                <children>

                    <system>

                        <children>

                            <config>

                                <children>

                                    <vijay_pricecountdown>

                                        <title>Vijay - Special Price Countdown</title>

                                    </vijay_pricecountdown>

                                </children>

                            </config>

                        </children>

                    </system>

                </children>

            </admin>

        </resources>

    </acl>

</config>


Step 5: Create file in app/code/local/Vijay/Pricecountdown/Helper/Data.php and add below code in it.

<?php

class Vijay_Pricecountdown_Helper_Data extends Mage_Core_Helper_Abstract {



    const XML_PATH_ENABLED = 'vijay_pricecountdown/configurations/enabled';

    const XML_PATH_SHOW_PLP = 'vijay_pricecountdown/configurations/show_plp';

    const XML_PATH_SHOW_PLP_TITLE = 'vijay_pricecountdown/configurations/show_plp_title';

    const XML_PATH_PLP_TITLE = 'vijay_pricecountdown/configurations/plp_title';

    const XML_PATH_CLOCK_STYLE_PLP = 'vijay_pricecountdown/configurations/clock_style_plp';

    const XML_PATH_SHOW_PDP = 'vijay_pricecountdown/configurations/show_pdp';

    const XML_PATH_SHOW_PDP_TITLE = 'vijay_pricecountdown/configurations/show_pdp_title';

    const XML_PATH_PDP_TITLE = 'vijay_pricecountdown/configurations/pdp_title';

    const XML_PATH_CLOCK_STYLE_PDP = 'vijay_pricecountdown/configurations/clock_style_pdp';



    public function getStatus() {

     $isConfigEnabled = Mage::getStoreConfigFlag(self::XML_PATH_ENABLED, Mage::app()->getStore());

        $isModuleEnabled = $this->isModuleEnabled();

        $isModuleOutputEnabled = $this->isModuleOutputEnabled();

        return $isConfigEnabled && $isModuleEnabled && $isModuleOutputEnabled;

    }



    public function getProductListPageStatus() {

     return Mage::getStoreConfigFlag(self::XML_PATH_SHOW_PLP,Mage::app()->getStore());

    }



    public function getPlpTitle() {

        if(Mage::getStoreConfigFlag(self::XML_PATH_SHOW_PLP_TITLE,Mage::app()->getStore())) {

            return Mage::getStoreConfig(self::XML_PATH_PLP_TITLE);

        }

        return false;

    }



    public function getProductListPageClockStyle() {

        return (int) Mage::getStoreConfig(self::XML_PATH_CLOCK_STYLE_PLP);

    }



    public function getProductViewPageStatus() {

        return Mage::getStoreConfigFlag(self::XML_PATH_SHOW_PDP,Mage::app()->getStore());

    }



    public function getPdpTitle() {

        if(Mage::getStoreConfigFlag(self::XML_PATH_SHOW_PDP_TITLE,Mage::app()->getStore())) {

            return Mage::getStoreConfig(self::XML_PATH_PDP_TITLE);

        }

        return false;

    }



    public function getProductViewPageClockStyle() {

     return (int) Mage::getStoreConfig(self::XML_PATH_CLOCK_STYLE_PDP);

    }



    public function validatePriceCountDown($fromdate, $todate, $specialPrice){



     $currentDate = Mage::getModel('core/date')->date('Y-m-d h:i:s A');

     if($specialPrice != 0 || $specialPrice) {

      if($todate != null) {

       if(strtotime($todate) >= strtotime($currentDate) && strtotime($fromdate) <= strtotime($currentDate)){

        return true;

       }

      }

     }

     return false;

     

    }

}


Step 6: Create file in app/code/local/Vijay/Pricecountdown/Model/Style.php and add below code in it.

<?php

class Vijay_Pricecountdown_Model_Style

{



    /**

     * Options getter

     *

     * @return array

     */

    public function toOptionArray()

    {

        return array(

            array('value' => 1, 'label' => Mage::helper('adminhtml')->__('Style - 1')),

            array('value' => 2, 'label' => Mage::helper('adminhtml')->__('Style - 2')),

            array('value' => 3, 'label' => Mage::helper('adminhtml')->__('Style - 3')),

            array('value' => 4, 'label' => Mage::helper('adminhtml')->__('Style - 4'))

        );

    }



    /**

     * Get options in "key-value" format

     *

     * @return array

     */

    public function toArray()

    {

        return array(

            1 => Mage::helper('adminhtml')->__('Style - 1'),

            2 => Mage::helper('adminhtml')->__('Style - 2'),

            3 => Mage::helper('adminhtml')->__('Style - 3'),

            4 => Mage::helper('adminhtml')->__('Style - 4')

        );

    }



}


Step 7: Create file in app/design/frontend/rwd/default/layout/vijay/pricecountdown.xml and add below code in it.

<?xml version="1.0"?>

<layout version="1.0.0">

    <catalog_category_default translate="label">

        <label>Catalog Product List</label>

        <reference name="head">

            <action method="addItem"><type>skin_css</type><name>vijay/pricecountdown/css/style.css</name></action>

        </reference>

        <reference name="product_list">

           <action method="setTemplate" ifconfig="vijay_pricecountdown/configurations/enabled">

             <template>vijay/pricecountdown/catalog/product/list.phtml</template>

           </action>    

        </reference>

    </catalog_category_default>



    <catalog_category_layered translate="label">

        <label>Catalog Product List</label>

        <reference name="head">

            <action method="addItem"><type>skin_css</type><name>vijay/pricecountdown/css/style.css</name></action>

        </reference>

        <reference name="product_list">

           <action method="setTemplate" ifconfig="vijay_pricecountdown/configurations/enabled">

             <template>vijay/pricecountdown/catalog/product/list.phtml</template>

           </action>    

        </reference>

    </catalog_category_layered>



    <catalogsearch_advanced_result translate="label">

        <label>Catalog Product List</label>

        <reference name="head">

            <action method="addItem"><type>skin_css</type><name>vijay/pricecountdown/css/style.css</name></action>

        </reference>

        <reference name="search_result_list">

           <action method="setTemplate" ifconfig="vijay_pricecountdown/configurations/enabled">

             <template>vijay/pricecountdown/catalog/product/list.phtml</template>

           </action>    

        </reference>

    </catalogsearch_advanced_result>



    <catalogsearch_result_index translate="label">

        <label>Catalog Product List</label>

        <reference name="head">

            <action method="addItem"><type>skin_css</type><name>vijay/pricecountdown/css/style.css</name></action>

        </reference>

        <reference name="search_result_list">

           <action method="setTemplate" ifconfig="vijay_pricecountdown/configurations/enabled">

             <template>vijay/pricecountdown/catalog/product/list.phtml</template>

           </action>    

        </reference>

    </catalogsearch_result_index>



    <catalog_product_view translate="label">

        <label>Catalog Product View</label>

        <reference name="head">

            <action method="addItem"><type>skin_css</type><name>vijay/pricecountdown/css/style.css</name></action>

        </reference>

        <reference name="product.info.addto">

            <action method="setTemplate" ifconfig="vijay_pricecountdown/configurations/enabled">

                <template>vijay/pricecountdown/catalog/product/view.phtml</template>

            </action>

        </reference>

    </catalog_product_view>

</layout>


Step 8: Create file in app/design/frontend/rwd/default/template/vijay/pricecountdown/catalog/product/list.phtml and add below code in it.

<?php

/**

 * Magento

 *

 * NOTICE OF LICENSE

 *

 * This source file is subject to the Academic Free License (AFL 3.0)

 * that is bundled with this package in the file LICENSE_AFL.txt.

 * It is also available through the world-wide-web at this URL:

 * http://opensource.org/licenses/afl-3.0.php

 * If you did not receive a copy of the license and are unable to

 * obtain it through the world-wide-web, please send an email

 * to license@magento.com so we can send you a copy immediately.

 *

 * DISCLAIMER

 *

 * Do not edit or add to this file if you wish to upgrade Magento to newer

 * versions in the future. If you wish to customize Magento for your

 * needs please refer to http://www.magento.com for more information.

 *

 * @category    design

 * @package     rwd_default

 * @copyright   Copyright (c) 2006-2016 X.commerce, Inc. and affiliates (http://www.magento.com)

 * @license     http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)

 */

?>

<?php

/**

 * Product list template

 *

 * @see Mage_Catalog_Block_Product_List

 */

/* @var $this Mage_Catalog_Block_Product_List */

?>

<?php

    $_productCollection=$this->getLoadedProductCollection();

    $_helper = $this->helper('catalog/output');

    $priceCountdownHelper = $this->helper('vijay_pricecountdown');

?>

<?php if(!$_productCollection->count()): ?>

<p class="note-msg"><?php echo $this->__('There are no products matching the selection.') ?></p>

<?php else: ?>



    <?php if($priceCountdownHelper->getProductListPageClockStyle() == 1

            || $priceCountdownHelper->getProductListPageClockStyle() == 2

            || $priceCountdownHelper->getProductListPageClockStyle() == 3

            || $priceCountdownHelper->getProductListPageClockStyle() == 4) { ?>

            <script type="text/javascript" src="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-1/js/jquery.3.3.1.min.js');?>"></script>

    <?php } ?>



    <?php if($priceCountdownHelper->getProductListPageClockStyle() == 1) { ?>

        <link rel="stylesheet" href="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-1/css/jquery.countdown.css');?>">

        <script type="text/javascript" src="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-1/js/jquery.plugin.js');?>"></script>

        <script type="text/javascript" src="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-1/js/jquery.countdown.js');?>"></script>



    <?php } else if($priceCountdownHelper->getProductListPageClockStyle() == 2

                    || $priceCountdownHelper->getProductListPageClockStyle() == 3 ) { ?>

        <link rel="stylesheet" href="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-2/css/timeTo.css');?>">

        <script type="text/javascript" src="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-2/js/jquery.time-to.js');?>"></script>

      

    <?php } else if($priceCountdownHelper->getProductListPageClockStyle() == 4) { ?>

        <link rel="stylesheet" href="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-4/css/flipclock_for_plp.css');?>">

        <script type="text/javascript" src="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-4/js/flipclock.js');?>"></script>

    <?php } ?>



    <?php if($priceCountdownHelper->getProductListPageClockStyle() == 1

            || $priceCountdownHelper->getProductListPageClockStyle() == 2

            || $priceCountdownHelper->getProductListPageClockStyle() == 3

            || $priceCountdownHelper->getProductListPageClockStyle() == 4) { ?>

            <script type="text/javascript">

                jQuery.noConflict();

                function setCountdown(endTime, no, type) {

                    if(type == 1) {



                        jQuery(function($) {

                            $('#countdown_'+no).countdown({until: endTime});

                        });



                    } else if(type == 2) {



                        jQuery(function($) {

                            $('#countdown_'+no).timeTo({

                                timeTo: endTime,

                                displayDays: 2,

                                theme: "white",

                                displayCaptions: true,

                                fontSize: 17,

                                captionSize: 9

                            });

                        });



                    } else if(type == 3) {



                        jQuery(function($) {

                            $('#countdown_'+no).timeTo({

                                timeTo: endTime,

                                displayDays: 2,

                                theme: "black",

                                displayCaptions: true,

                                fontSize: 17,

                                captionSize: 9

                            });

                        });



                    } else if(type == 4) {



                        jQuery(function($) {

                            var clock;

                            clock = $('#countdown_'+no).FlipClock({

                                clockFace: 'DailyCounter',

                                autoStart: false

                            });

                            clock.setTime(endTime);

                            clock.setCountdown(true);

                            clock.start();

                        });



                    }

                }

            </script>

    <?php } ?>



<div class="category-products">

    <?php echo $this->getToolbarHtml() ?>

    <?php // List mode ?>

    <?php if($this->getMode()!='grid'): ?>

    <?php $_iterator = 0; ?>

    <ol class="products-list" id="products-list">

    <?php $c = 1; $i = 0; foreach ($_productCollection as $_product): ?>

        <li class="item<?php if( ++$_iterator == sizeof($_productCollection) ): ?> last<?php endif; ?>">

            <?php // Product Image ?>

            <a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" class="product-image">

                <?php /* Based on the native RWD styling, product images are displayed at a max of ~400px wide when viewed on a

                        one column page layout with four product columns from a 1280px viewport. For bandwidth reasons,

                        we are going to serve a 300px image, as it will look fine at 400px and most of the times, the image

                        will be displayed at a smaller size (eg, if two column are being used or viewport is smaller than 1280px).

                        This $_imgSize value could even be decreased further, based on the page layout

                        (one column, two column, three column) and number of product columns. */ ?>

                <?php $_imgSize = 300; ?>

                <img id="product-collection-image-<?php echo $_product->getId(); ?>"

                     src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->keepFrame(false)->resize($_imgSize); ?>"

                     alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" />

            </a>

            <?php // Product description ?>

            <div class="product-shop">

                <div class="f-fix">

                    <div class="product-primary">

                        <?php $_productNameStripped = $this->stripTags($_product->getName(), null, true); ?>

                        <h2 class="product-name"><a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $_productNameStripped; ?>"><?php echo $_helper->productAttribute($_product, $_product->getName() , 'name'); ?></a></h2>

                        <?php if($_product->getRatingSummary()): ?>

                        <?php echo $this->getReviewsSummaryHtml($_product) ?>

                        <?php endif; ?>

                        <?php

                        // Provides extra blocks on which to hang some features for products in the list

                        // Features providing UI elements targeting this block will display directly below the product name

                        if ($this->getChild('name.after')) {

                            $_nameAfterChildren = $this->getChild('name.after')->getSortedChildren();

                            foreach ($_nameAfterChildren as $_nameAfterChildName) {

                                $_nameAfterChild = $this->getChild('name.after')->getChild($_nameAfterChildName);

                                $_nameAfterChild->setProduct($_product);

                                echo $_nameAfterChild->toHtml();

                            }

                        }

                        ?>

                    </div>

                    <div class="product-secondary">

                        <?php echo $this->getPriceHtml($_product, true) ?>

                    </div>



                    <!-- Price countdown start-->

                    <?php

                        if($priceCountdownHelper->getStatus()

                            && $priceCountdownHelper->getProductListPageStatus()) {



                            $fromDate = date("Y-m-d", strtotime($_product->getSpecialFromDate())).' 00:00:00 AM';

                            $toDate = date("Y-m-d", strtotime($_product->getSpecialToDate())).' 11:59:59 PM';

                            if($priceCountdownHelper->validatePriceCountDown($fromDate, $toDate, $_product->getSpecialPrice())) {

                                ?>

                                <?php

                                if($priceCountdownHelper->getPlpTitle()) {

                                    ?>

                                    <h5 class="plp-clock-title" style="clear: both;"><?php echo $priceCountdownHelper->getPlpTitle();?></h5>

                                    <?php

                                }

                                ?>

                                <div id="countdown_<?php echo $c;?>" class="plp-countdown" style="clear: both;"></div>



                                <?php if($priceCountdownHelper->getProductListPageClockStyle() == 1) { ?>

                                    <script script="text/javascript">

                                        jQuery(function($) {

                                            var currentTime = Date.parse(new Date());

                                            var serverTime = Date.parse(new Date("<?php echo Date("m/d/y h:i:s A", strtotime(Mage_Core_Model_Locale::date(null, null, "en_US", true))); ?>"));

                                            var diff = currentTime - serverTime;

                                            var endDate = new Date('<?php echo $toDate;?>');

                                            endDate = Date.parse(endDate)+diff;

                                            endDate = new Date(endDate);

                                            setCountdown(endDate, <?php echo $c;?>, 1)

                                        });

                                    </script>

                                <?php } else if($priceCountdownHelper->getProductListPageClockStyle() == 2) { ?>

                                    <script script="text/javascript">

                                        jQuery(function($) {

                                            var currentTime = Date.parse(new Date());

                                            var serverTime = Date.parse(new Date("<?php echo Date("m/d/y h:i:s A", strtotime(Mage_Core_Model_Locale::date(null, null, "en_US", true))); ?>"));

                                            var diff = currentTime - serverTime;

                                            var endDate = new Date('<?php echo $toDate;?>');

                                            endDate = Date.parse(endDate)+diff;

                                            endDate = new Date(endDate);

                                            setCountdown(endDate, <?php echo $c;?>, 2);

                                        });

                                    </script>

                                <?php } else if($priceCountdownHelper->getProductListPageClockStyle() == 3) { ?>

                                    <script script="text/javascript">

                                        jQuery(function($) {

                                            var currentTime = Date.parse(new Date());

                                            var serverTime = Date.parse(new Date("<?php echo Date("m/d/y h:i:s A", strtotime(Mage_Core_Model_Locale::date(null, null, "en_US", true))); ?>"));

                                            var diff = currentTime - serverTime;

                                            var endDate = new Date('<?php echo $toDate;?>');

                                            endDate = Date.parse(endDate)+diff;

                                            endDate = new Date(endDate);

                                            setCountdown(endDate, <?php echo $c;?>, 3);

                                        });

                                    </script>

                                <?php } else if($priceCountdownHelper->getProductListPageClockStyle() == 4) { ?>

                                    <?php

                                        $currentTime = strtotime(Mage_Core_Model_Locale::date(null, null, "en_US", true));

                                        $diff = strtotime($toDate) - $currentTime;

                                        if($diff > 0) {

                                            ?>

                                            <script script="text/javascript">

                                                setCountdown(<?php echo $diff;?>, <?php echo $c;?>, 4);

                                            </script>

                                            <?php

                                        }

                                        ?>

                                <?php } ?>



                                <?php

                                $c++;

                            }

                        }

                    ?>

                    <!-- Price countdown end-->



                    <div class="product-secondary">

                        <?php if(!$_product->canConfigure() && $_product->isSaleable()): ?>

                            <p class="action"><button type="button" title="<?php echo $this->quoteEscape($this->__('Add to Cart')) ?>" class="button btn-cart" onclick="setLocation('<?php echo $this->getAddToCartUrl($_product) ?>')"><span><span><?php echo $this->__('Add to Cart') ?></span></span></button></p>

                        <?php elseif($_product->getStockItem() && $_product->getStockItem()->getIsInStock()): ?>

                            <p class="action"><a title="<?php echo $this->quoteEscape($this->__('View Details')) ?>" class="button" href="<?php echo $_product->getProductUrl() ?>"><?php echo $this->__('View Details') ?></a></p>

                        <?php else: ?>

                            <p class="action availability out-of-stock"><span><?php echo $this->__('Out of stock') ?></span></p>

                        <?php endif; ?>

                        <ul class="add-to-links">

                            <?php if ($this->helper('wishlist')->isAllow()) : ?>

                                <li><a href="<?php echo $this->helper('wishlist')->getAddUrl($_product) ?>" class="link-wishlist"><?php echo $this->__('Add to Wishlist') ?></a></li>

                            <?php endif; ?>

                            <?php if($_compareUrl=$this->getAddToCompareUrl($_product)): ?>

                                <li><span class="separator">|</span> <a href="<?php echo $_compareUrl ?>" class="link-compare"><?php echo $this->__('Add to Compare') ?></a></li>

                            <?php endif; ?>

                        </ul>

                    </div>

                    <div class="desc std">

                        <?php echo $_helper->productAttribute($_product, $_product->getShortDescription(), 'short_description') ?>

                        <a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $_productNameStripped ?>" class="link-learn"><?php echo $this->__('Learn More') ?></a>

                    </div>

                </div>

            </div>

        </li>

    <?php endforeach; ?>

    </ol>

    <script type="text/javascript">decorateList('products-list', 'none-recursive')</script>



    <?php else: ?>



    <?php // Grid Mode ?>



    <?php $_collectionSize = $_productCollection->count() ?>

    <?php $_columnCount = $this->getColumnCount(); ?>

    <ul class="products-grid products-grid--max-<?php echo $_columnCount; ?>-col">

        <?php  $c = 1; $i = 0; foreach ($_productCollection as $_product): ?>

            <?php /*if ($i++%$_columnCount==0): ?>

            <?php endif*/ ?>

            <li class="item<?php if(($i-1)%$_columnCount==0): ?> first<?php elseif($i%$_columnCount==0): ?> last<?php endif; ?>">

                <a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" class="product-image">

                    <?php $_imgSize = 210; ?>

                    <img id="product-collection-image-<?php echo $_product->getId(); ?>"

                         src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->resize($_imgSize); ?>"

                         alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" />

                </a>

                <div class="product-info">

                    <h2 class="product-name"><a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->stripTags($_product->getName(), null, true) ?>"><?php echo $_helper->productAttribute($_product, $_product->getName(), 'name') ?></a></h2>

                    <?php

                    // Provides extra blocks on which to hang some features for products in the list

                    // Features providing UI elements targeting this block will display directly below the product name

                    if ($this->getChild('name.after')) {

                        $_nameAfterChildren = $this->getChild('name.after')->getSortedChildren();

                        foreach ($_nameAfterChildren as $_nameAfterChildName) {

                            $_nameAfterChild = $this->getChild('name.after')->getChild($_nameAfterChildName);

                            $_nameAfterChild->setProduct($_product);

                            echo $_nameAfterChild->toHtml();

                        }

                    }

                    ?>

                    <?php echo $this->getPriceHtml($_product, true) ?>



                    <!-- Price countdown start-->

                    <?php

                        if($priceCountdownHelper->getStatus()

                            && $priceCountdownHelper->getProductListPageStatus()) {



                            $fromDate = date("Y-m-d", strtotime($_product->getSpecialFromDate())).' 00:00:00 AM';

                            $toDate = date("Y-m-d", strtotime($_product->getSpecialToDate())).' 11:59:59 PM';

                            if($priceCountdownHelper->validatePriceCountDown($fromDate, $toDate, $_product->getSpecialPrice())) {

                                ?>

                                <?php

                                if($priceCountdownHelper->getPlpTitle()) {

                                    ?>

                                    <h5 class="plp-clock-title"><?php echo $priceCountdownHelper->getPlpTitle();?></h5>

                                    <?php

                                }

                                ?>

                                <div id="countdown_<?php echo $c;?>" class="plp-countdown"></div>



                                <?php if($priceCountdownHelper->getProductListPageClockStyle() == 1) { ?>

                                    <script script="text/javascript">

                                        jQuery(function($) {

                                            var currentTime = Date.parse(new Date());

                                            var serverTime = Date.parse(new Date("<?php echo Date("m/d/y h:i:s A", strtotime(Mage_Core_Model_Locale::date(null, null, "en_US", true))); ?>"));

                                            var diff = currentTime - serverTime;

                                            var endDate = new Date('<?php echo $toDate;?>');

                                            endDate = Date.parse(endDate)+diff;

                                            endDate = new Date(endDate);

                                            setCountdown(endDate, <?php echo $c;?>, 1)

                                        });

                                    </script>

                                <?php } else if($priceCountdownHelper->getProductListPageClockStyle() == 2) { ?>

                                    <script script="text/javascript">

                                        jQuery(function($) {

                                            var currentTime = Date.parse(new Date());

                                            var serverTime = Date.parse(new Date("<?php echo Date("m/d/y h:i:s A", strtotime(Mage_Core_Model_Locale::date(null, null, "en_US", true))); ?>"));

                                            var diff = currentTime - serverTime;

                                            var endDate = new Date('<?php echo $toDate;?>');

                                            endDate = Date.parse(endDate)+diff;

                                            endDate = new Date(endDate);

                                            setCountdown(endDate, <?php echo $c;?>, 2);

                                        });

                                    </script>

                                <?php } else if($priceCountdownHelper->getProductListPageClockStyle() == 3) { ?>

                                    <script script="text/javascript">

                                        jQuery(function($) {

                                            var currentTime = Date.parse(new Date());

                                            var serverTime = Date.parse(new Date("<?php echo Date("m/d/y h:i:s A", strtotime(Mage_Core_Model_Locale::date(null, null, "en_US", true))); ?>"));

                                            var diff = currentTime - serverTime;

                                            var endDate = new Date('<?php echo $toDate;?>');

                                            endDate = Date.parse(endDate)+diff;

                                            endDate = new Date(endDate);

                                            setCountdown(endDate, <?php echo $c;?>, 3);

                                        });

                                    </script>

                                <?php } else if($priceCountdownHelper->getProductListPageClockStyle() == 4) { ?>

                                    <?php

                                        $currentTime = strtotime(Mage_Core_Model_Locale::date(null, null, "en_US", true));

                                        $diff = strtotime($toDate) - $currentTime;

                                        if($diff > 0) {

                                            ?>

                                            <script script="text/javascript">

                                                setCountdown(<?php echo $diff;?>, <?php echo $c;?>, 4);

                                            </script>

                                            <?php

                                        }

                                        ?>

                                <?php } ?>



                                <?php

                                $c++;

                            }

                        }

                    ?>

                    <!-- Price countdown end-->



                    <?php if($_product->getRatingSummary()): ?>

                    <?php echo $this->getReviewsSummaryHtml($_product, 'short') ?>

                    <?php endif; ?>

                    <div class="actions">

                        <?php if(!$_product->canConfigure() && $_product->isSaleable()): ?>

                            <button type="button" title="<?php echo $this->quoteEscape($this->__('Add to Cart')) ?>" class="button btn-cart" onclick="setLocation('<?php echo $this->getAddToCartUrl($_product) ?>')"><span><span><?php echo $this->__('Add to Cart') ?></span></span></button>

                        <?php elseif($_product->getStockItem() && $_product->getStockItem()->getIsInStock()): ?>

                            <a title="<?php echo $this->quoteEscape($this->__('View Details')) ?>" class="button" href="<?php echo $_product->getProductUrl() ?>"><?php echo $this->__('View Details') ?></a>

                        <?php else: ?>

                            <p class="availability out-of-stock"><span><?php echo $this->__('Out of stock') ?></span></p>

                        <?php endif; ?>

                        <ul class="add-to-links">

                            <?php if ($this->helper('wishlist')->isAllow()) : ?>

                                <li><a href="<?php echo $this->helper('wishlist')->getAddUrl($_product) ?>" class="link-wishlist"><?php echo $this->__('Add to Wishlist') ?></a></li>

                            <?php endif; ?>

                            <?php if($_compareUrl=$this->getAddToCompareUrl($_product)): ?>

                                <li><span class="separator">|</span> <a href="<?php echo $_compareUrl ?>" class="link-compare"><?php echo $this->__('Add to Compare') ?></a></li>

                            <?php endif; ?>

                        </ul>

                    </div>

                </div>

            </li>

            <?php /*if ($i%$_columnCount==0 || $i==$_collectionSize): ?>

            <?php endif*/ ?>

        <?php endforeach ?>

    </ul>

    <script type="text/javascript">decorateGeneric($$('ul.products-grid'), ['odd','even','first','last'])</script>



    <?php endif; ?>



    <div class="toolbar-bottom">

        <?php echo $this->getToolbarHtml() ?>

    </div>

</div>



<?php endif; ?>

<?php

// Provides a block where additional page components may be attached, primarily good for in-page JavaScript

if ($this->getChild('after')) {

    $_afterChildren = $this->getChild('after')->getSortedChildren();

    foreach ($_afterChildren as $_afterChildName) {

        $_afterChild = $this->getChild('after')->getChild($_afterChildName);

        //set product collection on after blocks

        $_afterChild->setProductCollection($_productCollection);

        echo $_afterChild->toHtml();

    }

}

?>


Step 9: Create file in app/design/frontend/rwd/default/template/vijay/pricecountdown/catalog/product/view.phtml and add below code in it.

<?php $_product = $this->getProduct(); ?>

<?php $_wishlistSubmitUrl = $this->helper('wishlist')->getAddUrl($_product); ?>



<ul class="add-to-links">

<?php if ($this->helper('wishlist')->isAllow()) : ?>

    <li><a href="<?php echo $_wishlistSubmitUrl ?>" onclick="productAddToCartForm.submitLight(this, this.href); return false;" class="link-wishlist"><?php echo $this->__('Add to Wishlist') ?></a></li>

<?php endif; ?>

<?php

    $_compareUrl = $this->helper('catalog/product_compare')->getAddUrl($_product);

?>

<?php if ($_compareUrl) : ?>

        <li><span class="separator">|</span> <a href="<?php echo $_compareUrl ?>" class="link-compare"><?php echo $this->__('Add to Compare') ?></a></li>

<?php endif; ?>

</ul>



<?php

$priceCountdownHelper = $this->helper('vijay_pricecountdown');



if($priceCountdownHelper->getStatus()

    && $priceCountdownHelper->getProductViewPageStatus()) {



 $fromDate = date("Y-m-d", strtotime($_product->getSpecialFromDate())).' 00:00:00 AM';

 $toDate = date("Y-m-d", strtotime($_product->getSpecialToDate())).' 11:59:59 PM';



 if($priceCountdownHelper->validatePriceCountDown($fromDate, $toDate, $_product->getSpecialPrice())) {



  if($priceCountdownHelper->getPdpTitle()) { ?>

   <h5 class="pdp-clock-title"><?php echo $priceCountdownHelper->getPdpTitle();?></h5>

   <?php

  }



  if($priceCountdownHelper->getProductViewPageClockStyle() == 1) {

   ?>

   <link rel="stylesheet" href="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-1/css/jquery.countdown.css');?>">

   <script type="text/javascript" src="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-1/js/jquery.3.3.1.min.js');?>"></script>

   <script type="text/javascript" src="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-1/js/jquery.plugin.js');?>"></script>

   <script type="text/javascript" src="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-1/js/jquery.countdown.js');?>"></script>

   <div id="countdown_1" class="pdp-clock-1"></div>

   <?php $strtotime = strtotime($toDate); ?>

   <script script="text/javascript">

    jQuery.noConflict();

    jQuery(function($) {

     var currentTime = Date.parse(new Date());

     var serverTime = Date.parse(new Date("<?php echo Date("m/d/y h:i:s A", strtotime(Mage_Core_Model_Locale::date(null, null, "en_US", true))); ?>"));

     var diff = currentTime - serverTime;

     var endDate = new Date('<?php echo $toDate;?>');

     endDate = Date.parse(endDate)+diff;

     endDate = new Date(endDate);

     $('#countdown_1').countdown({until: endDate});

    });

   </script>



   <?php

  } else if($priceCountdownHelper->getProductViewPageClockStyle() == 2) {

   ?>

   <link rel="stylesheet" href="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-2/css/timeTo.css');?>">

   <script type="text/javascript" src="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-2/js/jquery.3.3.1.min.js');?>"></script>

   <script type="text/javascript" src="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-2/js/jquery.time-to.js');?>"></script>

   <div id="countdown_2" class="pdp-clock-2"></div>

   <script script="text/javascript">

    jQuery.noConflict();

    jQuery(function($) {

     var currentTime = Date.parse(new Date());

     var serverTime = Date.parse(new Date("<?php echo Date("m/d/y h:i:s A", strtotime(Mage_Core_Model_Locale::date(null, null, "en_US", true))); ?>"));

     var diff = currentTime - serverTime;

     var endDate = new Date('<?php echo $toDate;?>');

     endDate = Date.parse(endDate)+diff;

     endDate = new Date(endDate);

     $('#countdown_2').timeTo({

      timeTo: endDate,

      displayDays: 2,

      theme: "white",

      displayCaptions: true,

      fontSize: 48,

      captionSize: 14

     });

    });

   </script>

   <?php

  } else if($priceCountdownHelper->getProductViewPageClockStyle() == 3) {

   ?>

   <link rel="stylesheet" href="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-2/css/timeTo.css');?>">

   <script type="text/javascript" src="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-2/js/jquery.3.3.1.min.js');?>"></script>

   <script type="text/javascript" src="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-2/js/jquery.time-to.js');?>"></script>

   <div id="countdown_3" class="pdp-clock-3"></div>

   <script script="text/javascript">

    jQuery.noConflict();

    jQuery(function($) {

     var currentTime = Date.parse(new Date());

     var serverTime = Date.parse(new Date("<?php echo Date("m/d/y h:i:s A", strtotime(Mage_Core_Model_Locale::date(null, null, "en_US", true))); ?>"));

     var diff = currentTime - serverTime;

     var endDate = new Date('<?php echo $toDate;?>');

     endDate = Date.parse(endDate)+diff;

     endDate = new Date(endDate);

     $('#countdown_3').timeTo({

      timeTo: endDate,

      displayDays: 2,

      theme: "black",

      displayCaptions: true,

      fontSize: 48,

      captionSize: 14

     });

    });

   </script>

   <?php

  } else if($priceCountdownHelper->getProductViewPageClockStyle() == 4) {

   $currentTime = strtotime(Mage_Core_Model_Locale::date(null, null, "en_US", true));

   $diff = strtotime($toDate) - $currentTime;

   if($diff > 0) {

   ?>

   <link rel="stylesheet" href="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-4/css/flipclock.css');?>">

   <script type="text/javascript" src="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-4/js/jquery.3.3.1.min.js');?>"></script>

   <script type="text/javascript" src="<?php echo $this->getSkinUrl('vijay/pricecountdown/type-4/js/flipclock.js');?>"></script>

   <div id="countdown_4" class="pdp-clock-4"></div>

   <script script="text/javascript">

    jQuery.noConflict();

    jQuery(function($) {

     var clock;

     clock = $('#countdown_4').FlipClock({

      clockFace: 'DailyCounter',

      autoStart: false

     });



     clock.setTime(<?php echo $diff;?>);

     clock.setCountdown(true);

     clock.start();

    });

   </script>

   <?php

   }

  }

 }

}
0 Comments On "display special price countdown timer clock in magento"

Back To Top