Siteyi responsive yapma

[minteger]

Nasıl anlatsam nerden başlasam bilmiyorum.

Bootstrap 3 hazır tema kullundım. Yarıdan fazlası değişti zaten temanın. Bi dünya css ve HTML kodu çıkarıp ekledim. Ancak site responsive değil.

Firefox ta kullandığım bir eklenti var mesela "Mobile View  Switcher " .  Hepsi buradaya giriyorum ona tıklıyorum mobile haliyle görünüyor site başka bir yere giriyorum aynı şekilde sonuç alıyorum. Sahibinden.com aynı şekilde mesela. Bilindik sitelerin hepsinde mobile görünüme geçiyor. Ancak benim sitede olmuyor. Bootstrap da çözünürlük 768px in altına inmeden menu hamburger e  dönüşmüyor. Mesela sahibinden com da  1240px width olmasına rağmen mobilde görünüme geçince mobile haline bürünüyor site bunu nasıl sağlayabileceğime kafa yoruyorum iki gündür. Ama bir sonuca varamadım.

Fotoğra galerisi large da 4 grid ve mobile görünüme geçiyorum yine 4 grid oysaki ikiye inmesi lazım.  Acaba bootstrap 3 kullanmakla hata mı yaptım ?

Bunu gerçek manada responsive nasıl yapabilirim kafamdaki soru bu ?

Site Şu :

musaakay.com

[member=5202]Gokhankrll[/member]

[member=1]Danny[/member]
[member=4367]dokmeefrail[/member]


Sizleride çağırıp rahatsız ediyorum kusura bakmayın. Herkesin iyi kötü bir akıl hocası oluyor danışabileceğim. Benim danışıp sorabileceğim kimsem yok.

[dokmeefrail]

Lg değilde MD veya sm denesen çözülebilir belki

[minteger]

Lg değilde MD veya sm denesen çözülebilir belki

Hmm. Lg yaptığım yerleri Md olarak değiştirsem mi acaba ?

Ama buda hamburger menunu 767px altında gözükmesine engel olmaz sanırım. Benim amacım 1080px altında hamburger menu gözüksün yada en azından 992 px altına inince. 

Çünkü iphon 8 de 1080px kısa kenar çözünürlüğü var. bu hepsiburada ve sahibinden gibi siteler sanırım çözünürlüğe göre değil cihaza göre görünümü ayarlıyorlar nasıl yapıyorlarsa.

[Danny]

Şimdi geldim işe, ayılmaya çalışıyorum. Konuyu doğru mu anladım bilmiyorum. mobil cihazlarda direkt olarak hamburger menunun görünmesini mi istiyorsunuz, eğer öyleyse zaten hamburger menu görünüyor. sadece sosyal medya kısmında bir kayma söz konusu. fotoğraf galerisi de 4 değil 2 grid görünüyor.

[minteger]

[member=1]Danny[/member]

Çok teşekkür ederim.

Evet doğru anlamışsın. Ancak iphone 8 plus un dikeyde çözünürlüğü 1080px(oha yani. ne gerek varsa el kadar ekranda) Yani burada her nekadar hamburger menu gözüküyor olsada cihaz çözünürlüğü dikey tutulduğunda 767 px i geçtiği zaman hamburger menu kayboluyor. En azından 992px de bunun görünmesini sağlasak yada. Diğer siteler nasıl oluyorda çözünürlükten bağımsız görüntüyü değiştiriyorsa öyle yapsak diye düşünüyorum. 

şimdi baktım j7 pro da bile 1920 * 1080 p imiş.  Yuh artık. Telefonların yarısı böyleyse işimiz zor..

[Danny]

Örneğin 4 kademeli bir responsive tasarım ölçüsü ayarlanıyorsa, çözünürlük ayarları aşağıdaki gibi olmalıdır.

Mobil Ekranlar : 0 – 767px
Dikey Tabletler : 768px – 991px
Yatay Tablet + Minibook Laptoplar :  992px – 1199px
Notebook + Desktop : 1200px ve Yukarısı

CSS yapısı yukarıdaki gibi hazırlanırsa her aralıkta farklı bir ekran ve menü yapısı kullanıcı karşısına gelecektir. Temanın CSS dosyalarından bu düzenlemeyi kolaylıkla yapabilirsin. Temayla çok fazla oynadığını yazmışsın, umarım responsive tasarımı bozacak olan satırları silmemişsindir

[minteger]

Örneğin 4 kademeli bir responsive tasarım ölçüsü ayarlanıyorsa, çözünürlük ayarları aşağıdaki gibi olmalıdır.

Mobil Ekranlar : 0 – 767px
Dikey Tabletler : 768px – 991px
Yatay Tablet + Minibook Laptoplar :  992px – 1199px
Notebook + Desktop : 1200px ve Yukarısı

CSS yapısı yukarıdaki gibi hazırlanırsa her aralıkta farklı bir ekran ve menü yapısı kullanıcı karşısına gelecektir. Temanın CSS dosyalarından bu düzenlemeyi kolaylıkla yapabilirsin. Temayla çok fazla oynadığını yazmışsın, umarım responsive tasarımı bozacak olan satırları silmemişsindir

Şu cevabı hemen o gün yazmıştım : Ama saat gece 12 den sonra dsl bir gitti pir gitti. 2 gün sonra girebildim net. e :

Yok zannetmiyorum. Zaten bootstrap3 de bu şekilde ayarlı. Ve bootstrap da fazla oynama yapmadım. bootstrap.css le oynama taraftarı değilim bir iki küçük değişikilik yaptım. onun dışında style.css var. Çoğu düzenlemeyi orda yaptım. Zaten istediğim yeni şeyler için yeni class ve id ler yazıyorum css de. değiştirmektense ekliyorum yani.
 Şuan bilgisayarımda yeni hali duruyor çalışmanın. Ancak 0 - 767 px ayarlasakta artık yen telefonların mesela vestelin kıytırık modellerinin bile çözünürlüğü 1920 x 1080 bu durumda 0-767 px geçerli olmaz. Aygıtın ne olduğunu php de bir hazır sınıf varsa bununla kontrol edip ona göre kullanıcıya istediğimiz görüntüyü vermemiz gerek aslında. Böylece çözünürlük yerine aygıtı esas almış oluruz. Pfff oda uzun iş şimdi. Son güncellenmiş haliyle kullansın biraz. Sonra yeniden düzenleriz.
Siz siz olun fotoğrafçıya site yapmadan önce iki kere düşünün.  :