Neler yeni
Kaynak ikonu

XenForo 2 Sidebar Geri Sayım Sayacı Yapımı 2018-11-08

indirmek için izniniz yok
Uyumlu XF 2 Sürümleri
2.0.X
  1. Ekteki dosyayı indirip sunucuda gerekli yerlere yükleyin.
  2. Görünüm ve Diller altında Widget Yöneticisine girin.
  3. Widget Ekle tıklayın ve HTML şeklinde yeni bir widget ekleyin.
  4. Başlık, id ve pozisyon kısımlarını kendinize göre düzenleyin.
  5. Şablon kısmına aşağıdaki kodu yapıştırın.
  6. HTML:
    <div id="gerisay">
        <div class="dev_comment">
                Gelecek 19 Mayıs için kalan süre.
            </div>
            <div id="countdown_dashboard">
                <div class="dash weeks_dash">
                    <span class="dash_title">hafta</span>
                    <div class="digit">0</div>
                    <div class="digit">0</div>
                </div>
    
                <div class="dash days_dash">
                    <span class="dash_title">gün</span>
                    <div class="digit">0</div>
                    <div class="digit">0</div>
                </div>
    
                <div class="dash hours_dash">
                    <span class="dash_title">saat</span>
                    <div class="digit">0</div>
                    <div class="digit">0</div>
                </div>
    
                <div class="dash minutes_dash">
                    <span class="dash_title">dakika</span>
                    <div class="digit">0</div>
                    <div class="digit">0</div>
                </div>
    
                <div class="dash seconds_dash">
                    <span class="dash_title">saniye</span>
                    <div class="digit">0</div>
                    <div class="digit">0</div>
                </div>
            </div>
        </div>
  7. Yukarıdaki kodda yer alan
    Kod:
    <div class="dev_comment">
                Gelecek 19 Mayıs için kalan süre.
            </div>
    kısımda sayımı ne için yaptıracaksanız onun açıklamasını girin ve kaydedin. Bu kısımda işlemimiz bitti.
  8. Görünüm ve Diller altında Şablonlara tıklayın PAGE_CONTAINER şablonunu bulun ve düzenleyin, </body> tagının hemen üzerine aşağıdaki kodu yapıştırın.
  9. HTML:
    <!--Geri sayım sayacı-->
        <script src="{{ js_url('vendor/gerisay/jquery.Countdown-1.0.js') }}"></script>
        <link rel="stylesheet" href="{{ base_url('styles/gerisay/css/main.css?v=1122') }}" />
        <script language="javascript" type="text/javascript">
            jQuery(document).ready(function() {
                $('#countdown_dashboard').countDown({
                    targetDate: {
                        'day':         19,// hedef gün
                        'month':     05,// hedef ay
                        'year':     2019,// hedef yıl
                        'hour':     00,// hedef saat
                        'min':         0,// hedef dakika
                        'sec':         1//hedef saniye
                    }
                });         
            });
        </script>
        <!--Geri sayım sayacı bitiş-->
  10. Yukarıdaki kodda targetDate fonksiyonu içinde geriye saydırmak istediğiniz ileri tarih ayarını yapmalısınız. Ben 19 mayıs 2019 00:00.01 tarih ve saatine göre ayarlama yaptım.

Önizleme aşağıdaki gibidir.

Untitled Project.gif
Yazar
denizci-1
İndirilme
2
İlk yayınlama
Son güncelleme
Değerlendirme
0.00 yıldız(lar) 0 rating

denizci-1 ait diğer kaynakar