Hoşgeldiniz...

Murat by Güncelleme on Mayis 24, 2009 • Yorum (64)

Html Coderz World

Free CSS Uyarlama

FREE CSS TASARIMLARI SİTEMİZE NASIL UYGULARIZ
free tasarım veren sitelerdeki şablonları tr.gg siteme nasıl uyarlarım diyorsanız.

(Yakında hazırladığım free tasımları yani hazır tasarımları sitemizde bulacaksınız)

Sitenizi profesyonel bir tasarım şekline dönüştürebilirsiniz. Ben aşağıda örnek bir tasarımı indirip siteme göre uyarladım. Siz de aşağıdaki sitelerden böyle bir tasarıp indirip sitenize uyarlayabilirsiniz.

1-Önce aşağıdaki sitelere girip kendinize uygun tasarımı seçin

templates.arcsin.se/
oswd.org
freewpthemes.net
Free CSS.Com
Open Designs.Org
Open Web Design.Org
Metamorphozis.Com
Free CSS Templates.Com
Free CSS Templates.Org
Mantisatemplates.ComRamblingsoul.Com

2-Tasarımı indirip zipten çıkartın genelde üç dosya ile karşılaşacaksınız

3-Önce css kodunu açın kopyalayıp sitenizin css kodu bölümüne yapıştırın yalnız bu bölümün en başına aşağıdaki kodları mutlaka yapıştırmanız gerekir.

h1#title{display: none;}

h2#title span {display: none;}

div.header{display: none;}

li.nav_element{list-style-type: none;}

li.nav_element{display: none;}

4-Daha sonra index dosyasını açın yani tasarımın göründüğü şekildeki int sayfasını. Bu sayfanın kaynak kodunu alın.(ie:Görünüm-kaynak. Frefox:Görünüm-sayfa kaynagını göster)

5-Kaynak kodundaki baş taraftaki body yazan yeri body dahil yukarıya doğru silin. En alttaki body ve html yazan iki kelimeyi de silin.

6-<div id="page"> veya div id=main, post, page, isimleriyle adlandırılan yere kadar olanı tasarımın üstüne 

7-Div ile başlayıp genelde div ile biten bölümü de tasarımın altına adlı bölüme yapıştırın.

8-Burada önemli olan CONTENT yani içerik bölümünün silinmesidir. İçerik bölümünün üstü tasarımın üstüne içerik bölümünün altı ise tasarımın altına adlı bölüme yapıştırılacak. Yani çıkartacağımız bölüm div id content ile div bölümü arasındaki kısımdır.

9-Sitenizi oluşturduğunuzda orjinal sitenin resimlerini göremiyeceksiniz. Bunun için ya sitenize reimleri yüklemeniz ya da css kodunu açtığınızda sitenin orjinal resimlerinin url sini alıp tümünü değiştir yapabilirsiniz. Hiç bir şey yapmadan biraz uğraşarak başlık, arka plan ve diğer bölümleri renk ve kendi indirdiğiniz resimlerle de değiştirebilirsiniz.

10-Sitenin orjinal resimlerini yüklemek için tasarımın images dosyasını açın. Bu resimleri tek tek upload edip İlgili bölümlere yapıştırın. Ben öyle yapıyorum. Bu şekilde siteniz orjinal bir şekilde olacaktır. İçerik kısmındaki resimleri almanıza gerek yok zaten görünmeyecek.

11-Resimleri nasıl siteme uyarlarım: image dosyasından ilgili resimi sağ tıklayıp birlikte aç deyin. Paint veya diğer resim gösterici bir proğramla açın. Açılan resmi kaydedin. Sonra imageshack.us'dan resmi upload edin. URL yi ilgili bölüme yapıştırın. İlgili bölüm neresi derseniz şöyle: örnek url(images header1) diye tanımlanan yere images header1 adlı resmin upload ettiğiniz URL'sini yapıştıracaksınız.

12-Daha geniş ve örnekli anlatımlar ve hazır free css tasarımlar vereceğim.






TASARIMIN ÜSTÜNDEKİ YAZI BÖLÜMÜNE
KOD:


TASARIMIN ALTINDAKİ YAZI BÖLÜMÜNE
KOD:
 

CSS KODU BÖLÜMÜNE
KOD:






Bu sayfa hakkında yorum ekle:
İsminiz:
E-mail adresiniz:
Mesajın:
Bugün 34954 ziyaretçi (65522 klik) kişi burdaydı!
=> Sen de ücretsiz bir internet sitesi kurmak ister misin? O zaman burayı tıkla! <=