Temanın Görünümünü Nasıl Değiştirebilirim?

tema düzenleme eğitimi web sitesi şablonu

Kendi Tasarımımı Yapabilir Miyim?

Evet. Tüm bulutpress özelliklerinden, modüllerinden faydalanırken kendi tasarımınızı da hazırlayabilirsiniz. Tamamı yazılım ekibimiz tarafından geliştirilen HTML5, JavaScript ve Css3 kodlarına ek olarak görünümü dilediğiniz gibi değiştirebilmeniz için yönetim panelinin içinde CSS düzenleme konsolu bulunmaktadır.

Tasarımcıların işini kolaylaştırmak için daha az CSS kodları yazmasına imkân veren LESS düzenleyici sistemde bulunmaktadır. Tek yapmanız gereken kendi arkaplan resimlerinizi yüklemek, uygun kodları yazmak ve kaydet tuşuna basmak. Tüm tasarım süreci online işlemektedir. Tasarım yaparken kaydet tuşuna bastığınız anda sonucu canlı olarak görebilirsiniz.

LESS Editörü İleTemanın Görünümünü Nasıl Değiştirebilirim?

LESS, web tasarım için için stil sayfalarını özelleştirmenizi, yönetmenizi ve yeniden kullanmanızı kolaylaştıran bir CSS ön işlemcisidir. Less, bir CSS uzantısı ve istemci tarafında veya sunucu tarafında çalıştırılabilen dinamik bir stil sayfası dilidir. Less, açık kaynaklı bir dildir.

Leaner Style Sheets olarak da bilinen LESS, sunucu veya istemci tarafında çalışma zamanı sırasında CSS'yi derleyen ve oluşturan dinamik bir CSS ön işlemcisidir. LESS, bir mizanpajı daha akıllı bir şekilde tasarlamaya yardımcı olan ve minimal ancak esnek kod kullanımını destekleyen değişken ikameleri, karışımlar, işlemler, birleştirme işlevleri gibi gelişmiş özelliklere sahiptir.

Kod boyunca tanımlanan stilleri bile yeniden kullanabilirsiniz. Ayrıca, farklı tarayıcılarla geniş ölçüde uyumludur.

CSS Ön İşlemcisi Nedir?

CSS ön işlemcisi, CSS'nin bir uzantısı olan bir betik dilidir. Normal CSS sözdiziminde derlenir ve ardından CSS web tarayıcısı tarafından okunur. Less, CSS'ye çok benziyor ama dinamik CSS oluşturmanızı kolaylaştıran değişkenler, işlevler, karışımlar ve işlemler gibi işlevler sağlıyor.

Less ve SASS, CSS ön işlemcisinin örnekleridir çünkü her ikisi de derlenir ve web tarayıcısı tarafından okunan CSS sözdizimleri üretir.

CSS

Yeni bir ön uç geliştiriciyseniz, önişlemcinin kendisi son aşamasında CSS'yi derleyip oluşturacağından, bir önişlemcinin işleyişini daha iyi anlamak için önce temel CSS'yi nasıl yazacağınızı bilmelisiniz.

Yeni başlayanlar, basitliği ve temel stil söz dizimi nedeniyle HTML ögelerinin görünümünü özelleştirmek için CSS'yi seçer. CSS, web sayfalarının üstbilgiler, altbilgiler, içerik gibi çeşitli bölümlerini kolayca anlaşılabilecek şekilde kolayca kontrol etmenize olanak tanır.

Statik CSS stillerini bir ögenin nitelikleri olarak ayarlayarak satır içinde tanımlayabilir veya bunları ayrı bir CSS dosyasında tutabilir ve HTML ögelerine uygulanmaları gerektiğinde bunlara özellikle başvurabilirsiniz.

LESS'i CSS'den nispeten daha iyi yapan birçok faydası vardır. Size bazı önemli özelliklerinden bahsedeceğim: değişkenler, karışımlar, işlemler, iç içe yerleştirme ve işlevler.

Değişkenler

Diğer programlama dillerinde değişkenleri nasıl tanımladığınıza benzer şekilde, LESS'te bir değişken ayarlayabilir ve ona programınız boyunca erişebilirsiniz. Tüm değişkenlerin önüne @ simgesi konulmalıdır. Seçiciler, özellik adları, renkler, boyutlar, URL'ler, yazı tipi adları vb. gibi her türlü değeri saklayabilirler.

Burada @bg-color olarak bir değişken tanımladım ve bunu arka plan rengini ayarlamak için iki HTML ögesinde yeniden kullandım. Hatta bu tür değişkenleri ortak bir yerde tanımlayabilir ve tüm uygulamanızda istediğiniz yerde yeniden kullanabilirsiniz.

LESS Kodu

@bg-color: #3FFD45; div { background-color: @bg-color; } P { background-color: @bg-color; }

Derlenmiş Eşdeğer CSS Kodu

div { background-color: #3FFD45; } P { background-color: #3FFD45; }

LESS'te değişken kullanımı hakkında daha fazla bilgiyi LESSCSS.org'daki Değişkenler bölümünden öğrenebilirsiniz .

Karışımlar

Bir karışım, bir değişken gibidir, ancak tek fark, tüm bir sınıfı temsil etmesidir. Bir özellik kümesini belirli bir sınıf adına gruplandırabilir ve tekrarlanan kod tanımlarını önlemek için bunları gerekli yerlerde arayabilirsiniz.

Ayrıca bir işlev olarak işlev görür ve bağımsız değişkenleri kabul eder. Bu, bu bağımsız değişken değerlerini kural kümesinde tanımlanan özellikler grubuna atayarak çalışır.

 

LESS'teki karışımlar hakkında daha fazla bilgi için, LESSCSS.org'daki Karışımlar bölümüne bakın.

Operasyonlar

LESS'te sayısal değerler, renkler ve değişkenler üzerinde toplama, çıkarma, bölme ve çarpma gibi temel aritmetik işlemleri de gerçekleştirebilirsiniz.

 

Yuvalama

Daha büyük bir CSS hacmiyle uğraşırken kodunuzu daha net hale getirmek için LESS iç içe yerleştirme özelliğini kullanın. Bir seçiciyi başka bir seçicinin içine yerleştirerek stil sayfasını hiyerarşik bir yapıda tanımlayabilirsiniz.

 

Fonksiyonlar

LESS'te önceden tanımlanmış işlevler de vardır ve bu işlevler, JavaScript kodunu değerleri değiştirmek, renkleri dönüştürmek ve çok daha fazlası için eşlemenize olanak tanır.

 

Bu önceden tanımlanmış işlevleri kullanarak renkleri bir temel renkten kolayca türetebilir ve web sayfasında aynı renk ailesini koruyabilirsiniz. JavaScript'e benzer olduğu için bu yöntem, stil bölümünde mantıksal işlevlerin tanımlanmasını kolaylaştırır.

Paylaş Facebook Twitter E-Mail Whatsapp