GraFiker
OpenCart-TR
- Katılım
- 3 Mar 2011
- Mesajlar
- 87
- Tepkime puanı
- 0
- Puanları
- 0
- Yaş
- 53
- Konum
- Ankara
- Web sitesi
- www.ucretsiztemalar.com
DERS 1 Giriş.
Tema kelimesinin aslında Türkçemizdeki karşılığı biraz farklıdır, bizim kullandığımız tema kelimesine en yakın anlamı Temel Motif olarak kullanılan hali gibi geldi bana, en azından TEM bölümü aynı
, oysa şablon kelimesine karşılık gelen template kelimesinin zamanla kısaltılmış halidir. Yani 21.YY Türkçesinden.
Neyse sözü uzatmayalım, arkadaşlar öncelikle gerçekten hoşgörünen bir arayüz yani bir tema yapmak istiyorsanız, işin en temelinde 2 program yatıyor, bunlardan sonra da kesinlikle css, ama öncelikle en basit haliyle başlamak istiyorum ben, yani aşağıdaki iki mükemmel programla,
1. Adobe PhotoShop,
2. Mozilla Firefoxun eklentisi Firebug.
Neden diyecekseniz çünkü hiç kodlarla oynamadan sadece PS (Photoshop) kullanarak bile temanızın arayüz görüntüsünü değiştirebilir, oynama yapabilirsiniz. yapmanız gereken tek şey arayüzde kullanılan zemin, buton, bazı çerçeve resimleri gibi dosyaları PS de açıp renklerini çerçevelerini yada zemin renklerini değiştirip tekrar sunucuya yüklemek.
Şimdi coder arkadaşlar ya kodlara dokunmadan olur mu diyebilirler, o arkadaşların affına sığınarak bu düşüncemin nedenini açıklayım; hiç kod bilmeden, daha önce hiç site kurmamış, Kodlarla v.s. internet teknolojilerine hiç bulaşmamış, OpenCart ile tanışan dünya kadar arkadaş var aramızda, bu arkadaşlara sitenizde düzenleme yapmak için gidin sırasıyla html, css, php, javascript öğrenin gelin, sonra sitenizde değişiklik ya da düzenleme yapabilirsiniz demek yerine bence işin en kolay tarafından yani görsel yönünden başlamak daha doğru olur diye düşündüğüm için bu kadar basite indirgedim. Ayrıca sonucu en çabuk ve net olarak alınan web teknolojisi bana göre sadece görsel olan kısmı, yani “yap uygula gör zevke gel ve yapmaya ve gelişmeye devam et” prensibi weble uğraşacak arkadaşlar için başlangıç noktası olmalıdır derim ben. (Bu prensip nerden çıktı derseniz yazarken çıktı birden) Bu işe yeni başlayan arkadaşlar bir an önce bir şeyler yapıp sonucu görmek isterler, ve bunu başardıklarında başka bir şey daha yapmak için sabırsızlanırlar ve derken kod dünyasına girerler, işte bu teşvik ne kadar hızlı olursa o kadar yapan arkadaşa keyif verir.
Mesela en basit kullanımıyla 1.4.X default temada küçük bir değişiklik yapalım
1. Öncelikle bilgisayarınızda Firefox ve Photoshop olduğunu varsayıyorum, sitenizi açın ve firebug kullanarak değiştirmek istediğiniz yeri tespit edin
2. Ekran görüntüsünde yer alan 4 numaralı adımda css bilgilerinde istediğimiz resim adına ve yoluna ulaşıyoruz.
3. Sonraki adımda ftp ye bağlanıyoruz ve az önce aldığımız yol ve resim adı bilgileri ile istediğimiz resim dosyasına ulaşarak bilgisayarımıza indiriyoruz. Ekran görüntüsü benim kullandığım FileZilla programına aittir farklı bir program kullanıyorsanız burada önemli olan işin mantığını görebilmektir.
4. İndirdiğimiz resim dosyasını PS ile açıyoruz ve resim üzerinde yer alan adımları uyguluyoruz. Resimde yer alan 1 numaralı adım PNG uzantılı dosyalar içindir, diğer uzantılarda seçim işlemini yapabilmeniz için farklı bir seçim aracı kullanmanız gerekir. Photoshop fotoğraf ve diğer görsel düzenlemeler için benim vazgeçilmezimdir, bir arkadaş Hediye 01 adlı temam için yaptığı yorumda şöyle demişti “sadece header e bir resim eklemiş güzel ama daha iyisi olabilir” sonra ben üşenmedim saydım. O temada o bir resim için oluşturulmuş layer sayısı tam 850 Adet :shy: yani aslında o bir resim 850 adet resimden oluşuyor :shy: belki de bu derse başlamamın nedeni de o arkadaş olabilir, buradan teşekkür ediyorum böyle bir işe vesile olduğu için.
5. Kaydettiğiniz dosyayı tekrar ftp ye yükleyin ve sayfanızı refresh (F5) leyerek sonucu görün
Yeni başlayan arkadaşlar için umarım faydalı olur, eğer yazım hatası varsa kusuruma bakmayın, takıldığınız yerlerde konu altına yazabilir ya da pm atabilirsiniz elimden geldiğince yardımcı olmaya çalışırım, Ayrıca aşağıdaki yorumlarınız ve teşekkürleriniz devamı için beni gaza getirecektir şimdilik bu kadar. Vakit ayırıp okuduğunuz için teşekkür ederim.
Tema kelimesinin aslında Türkçemizdeki karşılığı biraz farklıdır, bizim kullandığımız tema kelimesine en yakın anlamı Temel Motif olarak kullanılan hali gibi geldi bana, en azından TEM bölümü aynı
, oysa şablon kelimesine karşılık gelen template kelimesinin zamanla kısaltılmış halidir. Yani 21.YY Türkçesinden.Neyse sözü uzatmayalım, arkadaşlar öncelikle gerçekten hoşgörünen bir arayüz yani bir tema yapmak istiyorsanız, işin en temelinde 2 program yatıyor, bunlardan sonra da kesinlikle css, ama öncelikle en basit haliyle başlamak istiyorum ben, yani aşağıdaki iki mükemmel programla,
1. Adobe PhotoShop,
2. Mozilla Firefoxun eklentisi Firebug.
Neden diyecekseniz çünkü hiç kodlarla oynamadan sadece PS (Photoshop) kullanarak bile temanızın arayüz görüntüsünü değiştirebilir, oynama yapabilirsiniz. yapmanız gereken tek şey arayüzde kullanılan zemin, buton, bazı çerçeve resimleri gibi dosyaları PS de açıp renklerini çerçevelerini yada zemin renklerini değiştirip tekrar sunucuya yüklemek.
Şimdi coder arkadaşlar ya kodlara dokunmadan olur mu diyebilirler, o arkadaşların affına sığınarak bu düşüncemin nedenini açıklayım; hiç kod bilmeden, daha önce hiç site kurmamış, Kodlarla v.s. internet teknolojilerine hiç bulaşmamış, OpenCart ile tanışan dünya kadar arkadaş var aramızda, bu arkadaşlara sitenizde düzenleme yapmak için gidin sırasıyla html, css, php, javascript öğrenin gelin, sonra sitenizde değişiklik ya da düzenleme yapabilirsiniz demek yerine bence işin en kolay tarafından yani görsel yönünden başlamak daha doğru olur diye düşündüğüm için bu kadar basite indirgedim. Ayrıca sonucu en çabuk ve net olarak alınan web teknolojisi bana göre sadece görsel olan kısmı, yani “yap uygula gör zevke gel ve yapmaya ve gelişmeye devam et” prensibi weble uğraşacak arkadaşlar için başlangıç noktası olmalıdır derim ben. (Bu prensip nerden çıktı derseniz yazarken çıktı birden
) Bu işe yeni başlayan arkadaşlar bir an önce bir şeyler yapıp sonucu görmek isterler, ve bunu başardıklarında başka bir şey daha yapmak için sabırsızlanırlar ve derken kod dünyasına girerler, işte bu teşvik ne kadar hızlı olursa o kadar yapan arkadaşa keyif verir. Mesela en basit kullanımıyla 1.4.X default temada küçük bir değişiklik yapalım
1. Öncelikle bilgisayarınızda Firefox ve Photoshop olduğunu varsayıyorum, sitenizi açın ve firebug kullanarak değiştirmek istediğiniz yeri tespit edin
2. Ekran görüntüsünde yer alan 4 numaralı adımda css bilgilerinde istediğimiz resim adına ve yoluna ulaşıyoruz.
3. Sonraki adımda ftp ye bağlanıyoruz ve az önce aldığımız yol ve resim adı bilgileri ile istediğimiz resim dosyasına ulaşarak bilgisayarımıza indiriyoruz. Ekran görüntüsü benim kullandığım FileZilla programına aittir farklı bir program kullanıyorsanız burada önemli olan işin mantığını görebilmektir.
4. İndirdiğimiz resim dosyasını PS ile açıyoruz ve resim üzerinde yer alan adımları uyguluyoruz. Resimde yer alan 1 numaralı adım PNG uzantılı dosyalar içindir, diğer uzantılarda seçim işlemini yapabilmeniz için farklı bir seçim aracı kullanmanız gerekir. Photoshop fotoğraf ve diğer görsel düzenlemeler için benim vazgeçilmezimdir, bir arkadaş Hediye 01 adlı temam için yaptığı yorumda şöyle demişti “sadece header e bir resim eklemiş güzel ama daha iyisi olabilir” sonra ben üşenmedim saydım. O temada o bir resim için oluşturulmuş layer sayısı tam 850 Adet :shy: yani aslında o bir resim 850 adet resimden oluşuyor :shy: belki de bu derse başlamamın nedeni de o arkadaş olabilir, buradan teşekkür ediyorum böyle bir işe vesile olduğu için.
5. Kaydettiğiniz dosyayı tekrar ftp ye yükleyin ve sayfanızı refresh (F5) leyerek sonucu görün
Yeni başlayan arkadaşlar için umarım faydalı olur, eğer yazım hatası varsa kusuruma bakmayın, takıldığınız yerlerde konu altına yazabilir ya da pm atabilirsiniz elimden geldiğince yardımcı olmaya çalışırım, Ayrıca aşağıdaki yorumlarınız ve teşekkürleriniz devamı için beni gaza getirecektir
şimdilik bu kadar. Vakit ayırıp okuduğunuz için teşekkür ederim.
