Ajax XML Ticker Yeni Görünüm

Ajax XML Ticker Secmece Tv Yayında yazısında txt dosyasından veri çekerek görüntüleyen bir script Ajax XML Ticker uygulamasının özelliklerinden ve görüntülemeyi görselleştirerek daha güzel hale getirmeyi anlatmaya çalışmıştım kodlama bilgim olmadığından kendimce çözümler getirerek istediğim görünümü elde ettim şuan sağ menüde kullanılmakta sadece isim değişti Rastgele Tv oldu Sağolsun Yakup Göveler Hocamız script üzerinde değişiklik yaptı rastgele gösterim yapılıbiliyor
Uzun süredir “Yazar Projeleri-Makaleleri” bölümü için bu uygulamayı kullanmayı düşümdüm fakat sadece resim görünsün istemiyordum resim yanında konu baÅŸlığı ve kısa açıklama yazısıda olsun dedim Ajax XML Ticker kullanarak istediÄŸimi yaptım bu sefer çok daha kolay oldu fazla karmaşık deÄŸil ÅŸuan ana sayfada Yazarlarımızın Proje ve Makaleleri baÅŸlığı altında nasıl çalıştığını görebilirsiniz wordpress temanızda nasıl kullanırsınız ve yeni yerleÅŸim ÅŸeklinden bahsedeyim
Öncelikle temanızın images klasörüne buradaki baloncuk.png resmini atın ajaxticker.js script ve verilerin bulunduğu tickercontent txt dosyasını direkt tema klasöründe diğer php dosyaların olduğu yere atın
header.php dosyasına title etiketinin üstüne aşağıdaki kodları ekleyin
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/ajaxticker.js"></script>
Temanızın style.css dosyasına eklenek olan kodlar
#baloncuk2{
clear: both;
margin-top: 0px;
margin-bottom: 10px;
padding: 10px;
height: 153px;
width:610px;
background: #eeeeee url(images/baloncuk.png) no-repeat top;
color:#666666;
}
#baloncuk2 a {
color: #4e79a2;
font-size: 120%;
border-bottom: 1px solid #dcdcdc;
}
#baloncuk2 img {
padding: 5px;
float:left;
}
Gürüntülemeyi yapacağınız yere aşağıdaki kodları ekleyin ben index.php dosyasında kullandım
<script type="text/javascript"> var xmlfile="http://site.com/wp-content/themes/tema/tickercontent.txt" //path to ticker txt file on your server. //ajax_ticker(xmlfile, divId, divClass, delay, optionalfadeornot) new ajax_ticker(xmlfile, "baloncuk2", "someclass", 15000, "fade") </script>
var xmlfile= buraya txt dosyasının bulunduğu adresi ekliyoruz 15000 değeri geçiş süresini belirler baloncuk2 css dosyasından yerleşim bilgilerini almak içindir css dosyasına eklediğiniz kodlarda başlığı değiştirirseniz baloncuk2 etiketinizde değiştirin ilk zamanlar fark etmemiştim meğer script virgül arasındaki bilgiden css dosyasına ulaşıyormuş
kullandığı resim boyutları 200×150 aÅŸağıdaki örnek kodlarda txt dosyasına bilgileri nasıl ekleyeceÄŸinizi daha iyi anlarsınız Notepad++ kullanmanızı öneririm ayrıca Türkçe karakter düzgün görüntülenmez ise kodlamayı UTF-8 olarak belirleyin
<div class="message"> <img class="alignnone size-full " title="resim" src="http://site.com/images/resim.jpg" width="200" height="150" /><a href="http://site.com/yazi-adresi" >Yazı Başlığı</a><br />Açıklama yazısı................................... </div> <div class="message"> <img class="alignnone size-full " title="resim" src="http://site.com/images/resim.jpg" width="200" height="150" /><a href="http://site.com/yazi-adresi" >Yazı Başlığı</a><br />Açıklama yazısı................................... </div> <div class="message"> <img class="alignnone size-full " title="resim" src="http://site.com/images/resim.jpg" width="200" height="150" /><a href="http://site.com/yazi-adresi" >Yazı Başlığı</a><br />Açıklama yazısı................................... </div>
css dosyasında height: width: deÄŸerlerini deÄŸiÅŸtirerek boyutları ayarlaya bilirsiniz baloncuk.png resmi yerine farklı resimler kullanarak deÄŸiÅŸik görünümler elde edebilirsiniz sadece yazı görüntülemek isterseniz html resim kodlarını eklemeyin ben 200×150 olarak belirledim resim boyutlerini daha küçük ya da büyük olabilir bence fazla büyük boyutlarda resim kullanmaya gerek yok ayrıca resimleri optize etmeyi unutmayın malum trafik limiti
Script görüntülemeyi rastgele yapar ve sayfa her yenilemede farklı bir yerden başlar en güzeli database üzerinden bilgi çekmediği için sunucu üzerinde ek bir yük getirmez
1/10/2008 11:24 pm
[...] 2 ekim 2008 Yeni Yazı Ajax XML Ticker Yeni Görünüm [...]