header-logo
Wix ile sitenizi ve işinizi nasıl kuracağınızı öğrenin.
Kullanışlı Wix özellikleri ile sitenizi tasarlayın ve yönetin.
Abonelikleri, planları ve faturaları yönetin.
İşinizi yönetin ve üyelerle bağlantı kurun.
Domain satın alma, bağlama ve transfer işlemlerini öğrenin.
İşinizi ve web varlığınızı büyütmek için araçlar edinin.
SEO ve pazarlama araçlarıyla görünürlüğünüzü artırın.
Verimliliği artıracak yardımcı gelişmiş özellikler edinin.
Çözüm bulun, bilinen sorunları öğrenin veya iletişime geçin.
placeholder-preview-image
Kurslarımız ve eğitimlerimizle becerilerinizi geliştirin.
Web tasarımı, pazarlama ve daha fazlası için ipuçları alın.
Arama motorlarından organik site trafiğini artırmayı öğrenin.
Tam kapsamlı platformumuzu kullanarak özel site oluşturun.
Hedeflerinize ulaşmanıza yardımcı olacak bir uzmanla eşleşin.
placeholder-preview-image
Bu makalede
  • Kesme noktası ve görüntü alanı boyutlarını eşleştirin
  • Aynı kenar boşluğu birimlerini kullanın
  • Duyarlı davranışları uyumlu hale getirin
  • Öge görünürlüğünü kontrol edin

Studio Editor: Editör ile Canlı Site Arasındaki Farklılıkları Giderme

4 dk.
Bu makalede
  • Kesme noktası ve görüntü alanı boyutlarını eşleştirin
  • Aynı kenar boşluğu birimlerini kullanın
  • Duyarlı davranışları uyumlu hale getirin
  • Öge görünürlüğünü kontrol edin
Yayınlanmış Studio Editor sitenizi açtığınızda editördekinden daha farklı göründüğünü fark edebilirsiniz. Genellikle minimal olan bu farklılıklar bazı durumlarda ögelerin yanlış hizalanması veya hiç görünmemesi gibi ciddi boyutlara ulaşabilir. 
Bu farklılıklar çoğunlukla ögelerin boyutlandırması, konumu ve farklı görüntü alanlarındaki davranışları ile ilgili yapılandırma sorunlarından kaynaklanır. Bu makaledeki önerilerden yararlanarak sorunları giderebilir ve tüm ekran boyutlarında tutarlı bir görünüm sağlayabilirsiniz.
Sitenizde yakın zamanda bir düzenleme mi yaptınız?
Tüm değişiklikleri yayınladığınızdan ve sitenin en güncel sürümünü görüntülediğinizden emin olmanızı öneririz. Ayrıca sitenizin farklı ekran boyutlarındaki görünümünü tek bir cihaz üzerinden kontrol etmek için tarayıcı araçlarını kullanabilirsiniz.

Kesme noktası ve görüntü alanı boyutlarını eşleştirin

Kesme noktaları farklı cihazlara hitap eden bir site tasarlarken temel aldığınız ekran boyutu aralıklarıdır. Bu aralık içinde belirli bir düzenleme boyutu (ör. 320 - 750 piksellik bir kesme noktasında 500 piksellik bir düzenleme boyutu) ayarlayabilirsiniz.
Görüntü alanları ziyaretçinin ekran boyutunu ifade eder. Canlı siteniz belirli bir görüntü alanında farklı görünüyorsa, düzenleme boyutunuzu görüntü alanına uyacak şekilde ayarlayabilir ve düzeltmeler yapabilirsiniz.

Düzenleme boyutunu ayarlamak için:

  1. Editörde ilgili sayfaya ve kesme noktasına gidin. 
  2. En üstteki mevcut düzenleme boyutuna tıklayın.
  3. Düzenleme Boyutu alanına yeni değeri girin.
  4. Uygula'ya tıklayın. 
  5. Studio Editor araçlarını kullanarak düzeltmeler yapın.
Mobil kesme noktasına uygulanan bir düzenleme boyutunun gösterildiği kırpılmış bir görünüm.

Aynı kenar boşluğu birimlerini kullanın

Aynı üst bölümü/kapsayıcıyı paylaşan kardeş ögelerde farklı kenar boşluğu birimleri kullanmak içeriğin yanlış hizalanmasına veya çarpık görünmesine neden olabilir. Tek bir kapsayıcı veya bölümdeki tüm kardeş ögelerde aynı kenar boşluğu birimlerini kullanmanızı öneririz.

Bir ögenin kenar boşluğu birimlerini değiştirmek için:

  1. İlgili ögeyi seçin.
  2. Editörün sağ üstündeki Denetçiyi Aç simgesine  tıklayın.
  3. Ekranı kaydırarak alttaki Konum bölümüne gelin.
  4. Kenar boşlukları yanındaki açılır menüye tıklayın.
  5. İlgili birimi seçin.
Editörde bir metin maskesi seçilmiş. Denetçide kenar boşlukları ve kenar boşluğu birimleri açılır menüsü vurgulanıyor.

Duyarlı davranışları uyumlu hale getirin

Üst ve alt ögelerin birbiriyle çelişen duyarlı davranışlara sahip olması canlı site içeriğinde bazı sorunlara neden olabilir.
Bir kapsayıcıya iliştirilmiş bir düğme olduğunu varsayalım. Düğmenin duyarlı davranışı Sabit iken kapsayıcının duyarlı davranışı Orantılı ölçek olarak ayarlanmış. Düğme sabit olduğu için üst kapsayıcıyla birlikte yeniden boyutlandırılmaz. Bu durum canlı sitede boşluklara, ögelerin üst üste binmesine ve kesilmiş görünmelerine yol açar. Ögelerden birinde Karma duyarlı davranış söz konusu olduğunda da bu durum yaşanabilir.
Bu sorunu gidermek için ögelerin duyarlı davranışlarını uyumlu hale getirmenizi öneririz.

Bir ögenin duyarlı davranışını değiştirmek için:

  1. İlgili kesme noktasını seçin.
  2. Ögeyi seçin. 
  3. Editörün sağ üstündeki Denetçiyi Aç simgesine  tıklayın. 
  4. Duyarlı davranış açılır menüsünden üst veya alt ögeyle uyumlu bir seçenek belirleyin.
Bir düğme için denetçi paneli açılmış. Duyarlı davranış açılır menüsünde orantılı ölçek seçeneğine tıklanıyor.
Notlar:
Bu farklılıklar ögelerin yüksekliğini de etkileyerek sitede istenmeyen boşlukların oluşmasına neden olabilir. Boşlukları giderme hakkında daha fazla bilgi edinin.

Öge görünürlüğünü kontrol edin

Bir ögeyi bazı ekran boyutlarında görürken bazılarında göremediğinizi fark edebilirsiniz. Bunun nedeni genellikle ögenin belirli kesme noktalarından gizlenmiş olmasıdır. Katmanlar panelini kullanarak ögeyi bulabilir ve istediğiniz görüntü alanlarında gösterebilirsiniz.

Bir ögenin görünürlüğünü kontrol etmek için:

  1. Editörünüze gidin ve ilgili sayfayı açın.
  2. Editörünüzün üst kısmından bir kesme noktası seçin.
  3. Sol çubuktaki Katmanlar simgesine  tıklayın.
  4. Göstermek istediğiniz gizli ögenin üzerine gelin.
  5. (İsteğe bağlı) Göster simgesine  tıklayın.
Studio editöründe katmanlar paneli açık. Bir metin maskesinde Göster simgesine tıklanıyor.
Not:
Bir ögeyi silme veya farklı bir bölüme/kapsayıcıya taşıma gibi değişiklikler, hangisi üzerinde çalışmakta olduğunuzdan bağımsız olarak tüm kesme noktalarına uygulanır. Bir ögeyi yalnızca belirli kesme noktalarında göstermek istiyorsanız, sağ tıklama menüsünü kullanarak gizleyebilirsiniz.

Helpmate

Merhaba

Daha fazla yardıma mı ihtiyacınız var?
Bu makalenin özeti
Unlock personalized helpLog in to get the most out of Helpmate.