Tema düzenleyici

Yardım Header Ve footer daraltma

  • Konuyu başlatan Konuyu başlatan Alpagu
  • Başlangıç tarihi Başlangıç tarihi
CevaplarYardım Header Ve footer daraltma
Konuyu başlatanAlpagu
Cevaplar3
Görüntüleme2K

Alpagu

SMS Confirmed
Katılım
31 Ara 2019
Mesajlar
30
Çözümler
2
Tepki puanı
8
Puanları
8
Merhabalar default forumda Header kısmı ve Footer kısmını daraltmak istiyorum bazı kodlarla denedim lakin mobilde sag sola kayma yapıyor. en sağlıklı şekilde nasıl daraltma yapabilirim
 
Eğer default olarak kullanıyorsanız zaten olması gereken değerlerde bırakmanız yerinde olacaktır. Default header alanı içerisine yüklemiş olduğunuz logo değerlerine göre şekil alacaktır. Yok logoyu navigasyon linklerinin soluna almışsanız o zaman önce uygun boyutlarda logonuzu hazırlayın.

Logoyu navigasyona taşıdığınızda müdahale etmeniz gereken alan kullanmış olduğunuz temanın stil özellikleri sayfasından Header and navigation stil seçeneği grubu içerisine girerek Navigation padding vertical seçeneğinde yer alan değeri isteğinize bağlı olarak değiştirmek yeterli olacaktır.

Tavsiyem standart tema için kendi değerleri dışında harici bir kodlama yapmamanız yönünde olacaktır. Sadece renk değerlerini değiştirmeniz tüm tarayıcı ve mobil cihazlarda sorunsuz kullanmanızı sağlayacaktır.
 
Dear Guests, welcome! Please, Giriş Yap or Kayıt Ol to view hide content!
Genişlikten kastınızı sanırım ben yanlış anlamış olabilirim.. Siz header ve footer alanını boxed yapmak istiyorsunuz anladığım kadarı ile...

Bunun için doğru yaklaşım tüm sayfayı saracak olan bir div yapısına almak daha doğru olacaktır. Ancak daha fazla işlem gerektirebilir. Dikkat ederseniz her geniş alanın altında ...-inner değerleri vardır. Bunlar sayfanın genişlik değerlerini belirler.

Örneğin aşağıdaki resme bakabilirsiniz

Dear Guests, welcome! Please, Giriş Yap or Kayıt Ol to view hide content!


Gördüğünüz gibi p-header-inner değeri header alanında yer alan içeriklerin genişlik değerlerini belirlemektedir. Bu yapıları navigation ve footer için de görebilirsiniz. Ancak aşağıdaki kodu basit bir şekilde test edebilirsiniz.

extra.less dosyanıza şu şekilde ekleyiniz.

CSS:
Dear Guests, welcome! Please, Giriş Yap or Kayıt Ol to view hide content!

Burada max-width: alanı için verilmiş olan değer sizin temanızın sayfa genişlik değerine göre şekillenecektir. Bilerek normal max-width değerinin altında bir değer belirledim. Bu sayfanın sağından solundan 10px bir çıkıntının önüne geçmek için belirlenmiştir. Yöntem olarak en basit hali ile bu şekilde uygulayabilirsiniz.

Umarım işinizi görecektir.
 
Son düzenleme:
Quick Jump
Geri
Üst