Okul Web Sitesi Şablonu
Kendi okuluma hazırladığım web sitesi için çok istek almamdan dolayı bir okul web sitesi şablonu oluşturuyorum.
Okulumun web sitesiyle hemen hemen aynı olan sitenin özellikleri şu şekilde:
- Flash menü.
- XML destekli Flash manşet haber akışı.
- Jquery ile hazırlanmış duyurular.
Site tam ekran bir arkaplana sahip.
Menülerin ve Okul Adının Değiştirilmesi:
Sitenin ana dizinindeki "bilgiler.txt" dosyasını açın. Okul adını ve menüleri ihtiyacınıza göre değiştirip dosyayı kaydedin.
okuladi=Örnek İlköğretim Okulu Şablonu
menu1=ANASAYFA
menu1tanim=Anasayfaya git.
menu1link=anasayfa.html
Manşet Haber Flash Kullanımı:
Yeni manşet haberler eklemek için öncelikle haberinizle ilgili bir resim dosyası oluşturun veya fotoğraflarınızdan birisini de kullanabilirsiniz. Bu resmi Galeri klasörüne kopyalayın ki sitenin ana dizininde karışıklık oluşturmasın.
Sitenin kök klasöründeki data.xml dosyasını bulun ve Not Defteri ile açın.Aşağıdaki kodu kullanarak ilgili yere yeni öğe <item> ekleyin.
<item image="Galeri/haberresmi.jpg" link="" target="_self" textBlend="no"><![CDATA[<font color='#EEC008'>Haber Başlığı<br /></font><font color='#FFFFFF'>Haber açıklaması.</font>]]></item>
Dosyayı kaydedin ve kapatın.
Manşet Haber Geçiş Efektlerini Değiştirmek:
Anasayfada vereceğiniz manşet haberlerin geçiş efektlerini değiştirmek için data.xml dosyasını Not Defteri benzeri bir uygulama ile açın ve aşağıdaki satırı bulun.
transitionType="1"
Buradaki 1 değerini 1-5 arasındaki bir değer ile değiştirerek farklı geçiş efektleri görebilirsiniz. Değeri değiştirdikten sonra dosyayı kaydedin ve kapatın. Manşet haber flash dosyasının tüm ayarlarını data.xml dosyası ile yapıldığını da hatırlatmakta fayda var. Örneğin, animasyon geçiş hızı, ileri-geri düğmeleri, otomatik geçiş gibi birçok ayarı bu dosyadan yapabilirsiniz.
Anasayfa Haberleri:
Sitenin kök dizininde index.html dosyasıı açın. İçerik bölümündeki Okulumuzdan Haberler başlığı altındaki "haber" sınıfına sahip aşağıdaki DIV elementini bulun.
<div class="haber">
<div class="haber_resim"><img src="Duyuru/okul.jpg" width="80" height="80" /></div>
<div class="haber_bilgi">
<div class="haber_baslik">Haber 1</div>
<div class="haber_metin" align="justify"> Haber metni.</div>
</div>
</div>
Bu elementi alt alta çoğalttınızda siteye yeni haber eklemiş olacaksınız. Haberleri artırdıkça başlığın hemen altında bulunan aşağıdaki DIV elementinin height (yükseklik) değerini de artırınız. Böylelikle kaydırma çubukları gözükmeyecektir.
<div style="overflow:auto; height:250px;">
Bu değer ekleyeceğiniz her yeni haber için 100 px artırın.
Duyurular:
Sitenin kök klasöründeki index.html dosyasını bulun ve görüntüleme açısından rahat olması için Dreamweaver benzeri bir uygulama ile açın.
Div kimliği newsticker-demo olan satırı bulun. Bu elementin altındaki her <li></li> etiketi bir duyuruyu ifade ediyor. Aşağıdaki satırı eklediğinizde yeni bir duyuru eklenmiş olacak.
<li>
<div class="thumbnail">
<img src="Resimler/duyuru.jpg">
</div>
<div class="info">
<span class="duyuru_baslik">Duyuru 1</span>
<div class="duyuru_metin">Duyuru metni.</div>
</div>
<div class="clear"></div>
</li>
Dosyayı kaydedin ve kapatın.
Yan Menü:
Yan menüdeki linklerde gezinmeyi JavaScript kodları ile yaptım. Yan menüye yeni bağlantı eklemek için <ul class="yanmenu"> öğesinin altına aşağıdaki kod satırın ekleyin.
<li class="menu_oge" onclick="golink(adres.html');">Link adı</li>
Kullanıcıya hangi sayfada olduğunu göstermek için bağlantıyı aşağıdaki gibi değiştirin.
<li class="menu_oge_aktif">Gösterilen Sayfa</li>
Bağlantıları belirli başlıklar altında toplamak için aşağıdaki stil sınıfını kullanın.
<li class="menu_oge_sabit">Faydalı Linkler</li>
Dosyayı kaydedin ve kapatın.
Sitenin önizlemesini buraya tıklayarak izleyebilirsiniz. Şablon çeşitli nedenlerden dolayı yayından kaldırılmıştır.
Bu şablon için fotoğraf galerisinin nasıl oluşturulduğunu öğrenmek için tıklayın.
Bu şablon için ziyaretçi defterinin nasıl oluşturulduğunu öğrenmek için tıklayın.
Bu şablon için nasıl anket hazırlanacağını öğrenmek için tıklayın.
Not: Şablon üzerinde geliştirmelere devam edeceğim, bu sayfadan kullanım bilgilerine ve güncel sürüme sahip olabilirsiniz. Görüş ve önerilerinizi yorum olarak ekleyebilirsiniz.
Web sitemi şu anda Masaüstü Görünümü'nde geziyorsunuz.
Mobil cihazınızdan geziniyorsanız Mobil Görünüm'e geçmek için 
En popüler kelime oyununda yarışmaya hazırsanız buraya 
Aradığınız ürünü akılınızdaki fiyata bulun. Hemen şimdi 
Mini blog sitesi 
Hocam Emeğinize sağlık çok güzel olmuş.
Sayfanın bannerindeki ilköğretim okulu yazan yere okulumuzun ismini nasıl yazacağız?
Allah Razı Olsun hocam ;)
target="_blank" yapmak istiyorum bazı linklerimi.fakat onu beceremedim? nasıl yerleştirebilirim bu tag'ı?
Yan menüdeki bağlantıları JavaScript ile yaptığımdan farklı sayfada açılmıyor. İlerde bu konuda bir güncelleme yaparak bağlantıları A etiketi ile vereceğim.
Hocam banner'daki çocukları sildim fakat kendi okulumun adını yazamadım?Nasıl yapabilirim bunu?
Library bölümünde "metin" ismli bir MovieClip var. Açıp CTRL-A yapınca okul yazısı gözükür. (CTRL-A yapmamızın nedeni yazı ve arkaplanın beyaz olmasından dolayı).
şablonu nasıl indireceğiz
Yukarda indirme bağlantısı var.
hocam sitede kadromuzda yaptığınız gibi menulerde geçiş için çapayı nasıl verdiniz.ben de misyon vizyon bölümünlerini işaretleyerek sayfa içine çapa verdim ama. sayfayı görüntülediğimde menü geçişlerinde tam yazının üstüne gelmediğimde menu bembeyaz cıkıyor ve yazı görünmüyor.(sitem yayında değil) teşekkür ederim
Hocam menü öğelerinde adresleri şu şekilde verin:
li class="menu_oge" onclick="golink('okulumuz.html#misyon');"
Çapaları da başlıkların yanına ekleyin.
hocam şablon okul sitenizi kullanıyorum ama iki sorum olacak. Birincisi Dreamweaver 8 kullanıyorum ve şablon sitedeki gri renkte olan kodları değiştiremiyorum. İkincisi google arama motorunda siteyi aratınca "bu siteyi ziyaret etmek bilgisayarınıza zarar verebilir!" diyor acaba sitedeki bazı adres içerikli kodlardan mı kaynaklanıyor. Bu durumu nasıl giderebilirim.
Gri renkte olması o bölgelerin şablonda değiştirilemez olarak işaretlemiş olmasından kaynaklanıyor. Değiştirirseniz şablon bozulabilir.
Diğer sorun ise sitenize virüs bulaşmış olabilir. Sitenizi sunucudan silip tekrar yüklemelisiniz.
merhabalar hocam bir sorum olacak.Sitede sona yaklaştım.Sitede okulumuz yan menusu oluşturdum.oluşturdum.vizyon misyon vesaire ekledim ve çapalarla sizin kadromuz menusunde yaptığınız gibi.mozillada sorun yok çapalara gidiyo tıklayınca .ancak o explorerde sayfa dışına atıyor.hazırlık aşaması sayfasına yönlendiriyor.adobe activex denetimine izin vermediğimde ise sorun yok.anlamadım.Teşekkür ederim.
Normalde "hazirlikasamasinda.html" dosyasına hiçbir şekilde yönlenmemesi gerekiyor. Çünkü sitede böyle bir kod yer almıyor. Bağlantıları tüm HTML dosyalarında değiştirdiğinizden emin olun. Şayet siteniz yayında ise link gönderebilirsiniz. (Okul siteleri açıldığında bakabilirim.)
Adobe ActiveX denetimi, Flash için gerekiyor.
Öğretmenim cevabınız için teşekkür ediyorum. Yazınızı merakla bekliyorum. Dosyayı yine de paylaşabilirseniz, oldukça sınırlı kod bilgimizle sitemize uyarlamak istiyoruz.
Saygılar...
Sayın Hocam,
Öncelikle öğretmneler gününüzü en içten dileklerimle kutlar, daha nice senelere dilerim.
Bilgi paylaşıldıkça kutsaldır ilkesiyle yola çıktığımız bu yolda sizin gibi değerli bir meslaktaşımın sahip olduğu becerileri karşılıksız eğitim ordumuzla paylaşmasından büyük memnuniyet duyuyoruz.
Gerek Bilişim.NET gerek fatihetsiz.COM ve ahmetsoyarslan.com sayesinde nice okulumuz web sayfalarına sahip olmakta kendilerini sanal dünyada tanıtabilmektedir.
Okulumuzun sitesinin oluşumunda sağladığınız yardımı borç bilir herşeyin gönlünüzce olmasını dilerim
Zafer BAYINDIR
Müdür Yardımcısı
SOLHAN MEHMET AKİF ERSOY İÖO
Düşünceleriniz için teşekkür ederim hocam. Ben de tüm öğretmen ailemizin gününü en içten dileklerimle kutluyor, görevlerinde başarılar diliyorum.