Şimdi Ara

Worldprees Mobil'de farklı görsel

Daha Fazla
Bu Konudaki Kullanıcılar: Daha Az
1 Misafir - 1 Masaüstü
5 sn
10
Cevap
0
Favori
574
Tıklama
Daha Fazla
İstatistik
  • Konu İstatistikleri Yükleniyor
0 oy
Öne Çıkar
Sayfa: 1
Giriş
Mesaj
  • Arkadaşlar merhaba,

    Düğün fotoğrafçılığı ile uğraşmaktayım ek iş olarak. Bir internet sitesi hazırlattım arkadaşıma. Ancak şöyle bir sıkıntım var, mesela desktop için yatay görüntü var anasayfa slider olarak ancak bu yatay görüntü Mobile geçince saçma bir hal alıyor ve görselin tamamı gözükmüyor. Bende anasayfa slider da koyduğum görsellerin mobilde farklı (dikey görsel) Desktop'da farklı (yatay görüntü) eklemek istiyorum bunun için yapabileceğimiz bir şey var mı? Aşağıya desktop ve Mobile görüntüsü ekliyorum.

    Sitem :https://www.1kare2alyans.com/

    Worldprees Mobil'de farklı görselWorldprees Mobil'de farklı görsel







  • Mobil ve desktop için iki ayrı görsel hazırlayın.Desktop için kısa ve geniş,mobil için uzun ve dar olsun.Ardından resmin olduğu css sınıfına arka plan olarak eklemek yeterli olur.
  • BiletlerBiletxD kullanıcısına yanıt
    Peki bu görsellerin mobilde görünsün yada desktop da görünsün diye ayırma şansımız oluyor mu. Siteyi yapan arkadaşım öyle birşey yok dedi :D Yada görseli mobil ve dekstopa yada ekrana göre otomatik ayarlayamaz mı kendisi.



    < Bu mesaj bu kişi tarafından değiştirildi crackzz -- 24 Mayıs 2020; 17:24:4 >
  • crackzz C kullanıcısına yanıt
    Responsive tasarımın mantığı zaten mobil veya desktopa yönelik farklı tasarımlar yapmak.İki farklı resim kullanabilirsiniz.Arkadaşınız belki bunu bilmiyordur veya kullandığı temada farklılık vardır.Fakat istediğiniz şekilde çalışma yapılabilir.Otomatik ayarlama konusunda da şöyle bir durum var.Resmi sayfaya gömersiniz mobilde de desktoptada tamamı görünür.Ama şekli bozulur.Benim tavsiyem ve kullandığım yöntem platformlara uygun olarak farklı resimler kullanmak.
  • BiletlerBiletxD kullanıcısına yanıt
    Mobile ve Desktop için 2 farklı görsel hazırlayabilirim. Bunu nasıl yapacağım hakkında bilgi verebilir misin?
  • Resmin olduğu alandaki class'ın ismini bulup css dosyasına aşağıdaki kodu ekleyin.Resmin class'ı ile yeni yazacağınız class aynı olmak zorunda.Buna dikkat edin.


    @media only screen and (max-width: 600px) {
    .class ismi{
    background-image: url("mobil resim link");
    }
    }
  • BiletlerBiletxD kullanıcısına yanıt
    Siteyi yapan arkadaş ile konuştum kullandığımız tema da slider tam ekran olduğu için mobile göre küçülmüyor muş.
  • Tam olarak doğru mu anladım bilmiyorum ama sitenizin html kodlarıyla çok basit oynayarak şöyle bir tasarım ortaya çıkardım.Biri desktop sürümünün biri mobil sürümün ana ekranı.Stiller düzgün olsun diye uğraşmadım sadece size yol göstersin diye uğraştım.Gördüğünüz gibi desktop versiyonda kullandığım resim küçük geliyor.Fakat mobil versiyonda tam uyuyor.Eğer desktop versiyondaki resmin genişliğini sol tarafa doğru arttırırsanız o da tam oturacak.Bu sayede hem mobilde hem desktop versiyonda aynı görüntü elde edilecek.İstediğiniz bu tarz bir şeyse basit olarak böyle bir çözüm getirdim.

    Worldprees Mobil'de farklı görsel
    Worldprees Mobil'de farklı görsel




  • WordPress ile bir blog, magazin, e-ticaret sitesi ya da kurumsal bir Web sitesi yönetmeniz mümkün. Dünya çapında birçok kullanıcı ve kurum tarafından kullanılan WordPress, yüz binlerce tema, eklenti ve destek sunuyor. Günümüzde bir Web sitesinin sadece bilgisayarlarla ziyaret edilmediğini, aksine daha çok mobil cihazlarla ziyaret edildiğini söyleyebiliriz. Bu açıdan WordPress sitenizin mobil uyumlu olması büyük önem taşıyor. Bu yazımızda bir WordPress sitesini mobil uyumlu hale getirebilen birbirinden başarılı 5 WordPress eklentisini sizler için analiz ettik.
  • 
Sayfa: 1
- x
Bildirim
mesajınız kopyalandı (ctrl+v) yapıştırmak istediğiniz yere yapıştırabilirsiniz.