Mobil Temada Whatsapp Ve Diğer Sosyal Butonlar

Konuyu değerlendir: Geçerli Reyting :

Görüntüleme : 2418

Yorumlar : 3

Bilgilendirme : Bu konuya son mesaj 544 gün önce yazıldı . Eğer yazınız doğrudan bu konu ile ilgili değil ise yeni bir konu başlatmanızı tavsiye ederiz.
  1. offline
    alemextra - ait Kullanıcı Resmi (Avatar)

    Exclamation Mobil Temada Whatsapp Ve Diğer Sosyal Butonlar

    Merhabalar..

    Uzun zamandır Araştırıyorum bazı sitelerde mobil temalarında aşağıdaki örnekte Oldugu gibi sayfa kaydırılsa bile alt barda sabit duran sosyal butonlar var .. özellikle mobil temalarda whatsapp paylaş özelliği çok moda oldu.. mobil tema ma farklı versiyonda paylaş butonu koydum.. ama asıl istediğim şey örnekteki gibi... webmaster sitesinin birtanesinde bu anlatılmış.. yapmaya çalıştım ama başarılı olamadım.. kolay bişey sanırım ama bişeyleri atlıyorum galiba...

    Ustalardan istedğim bu özelliğin bir eklenti olarak ve bulletin 4 e uyarlanabilirmi acaba ?? böyle birşey mümkün ise harika olur..
    Sözkonusu olay sadece mobil tema için önem arzediyor.. ve hitlerimizin %70 ini mobil den alıyoruz..
    Şimdi Konunun Linkini Atıyorum...

    Şayet eklentisi yapılamaz ise birisi bu olayı vbulletine nasıl uyarlanacagını lütfen yazsın..

    Özellikle En Son Belirtilen Kodların Nasıl Ve Nereye Eklenecegini Bulamadım....

    Mobil Sitenize WhatsApp ve Diğer Sosyal Paylaşım Linkleri EkleyinResmi gerçek boyutunda görmek için tıklayın.

Resmin ismi:  mmm.jpg
Görüntüleme: 2
Büyüklüğü:  27.0 KB (Kilobyte)
  2. #1
    Merhabalar..

    Uzun zamandır Araştırıyorum bazı sitelerde mobil temalarında aşağıdaki örnekte Oldugu gibi sayfa kaydırılsa bile alt barda sabit duran sosyal butonlar var .. özellikle mobil temalarda whatsapp paylaş özelliği çok moda oldu.. mobil tema ma farklı versiyonda paylaş butonu koydum.. ama asıl istediğim şey örnekteki gibi... webmaster sitesinin birtanesinde bu anlatılmış.. yapmaya çalıştım ama başarılı olamadım.. kolay bişey sanırım ama bişeyleri atlıyorum galiba...

    Ustalardan istedğim bu özelliğin bir eklenti olarak ve bulletin 4 e uyarlanabilirmi acaba ?? böyle birşey mümkün ise harika olur..
    Sözkonusu olay sadece mobil tema için önem arzediyor.. ve hitlerimizin %70 ini mobil den alıyoruz..
    Şimdi Konunun Linkini Atıyorum...

    Şayet eklentisi yapılamaz ise birisi bu olayı vbulletine nasıl uyarlanacagını lütfen yazsın..

    Özellikle En Son Belirtilen Kodların Nasıl Ve Nereye Eklenecegini Bulamadım....

    Mobil Sitenize WhatsApp ve Diğer Sosyal Paylaşım Linkleri EkleyinResmi gerçek boyutunda görmek için tıklayın.

Resmin ismi:  mmm.jpg
Görüntüleme: 2
Büyüklüğü:  27.0 KB (Kilobyte)

  3. offline
    netr0n - ait Kullanıcı Resmi (Avatar)

    Cevap: Mobil Temada Whatsapp Ve Diğer Sosyal Butonlar

    Linkteki içeriği olduğu gibi burada paylaşırsanız (düzenli bir şekilde) müsait bir zamanda ilgilenebilirim.
  4. #2
    Linkteki içeriği olduğu gibi burada paylaşırsanız (düzenli bir şekilde) müsait bir zamanda ilgilenebilirim.

  5. offline
    alemextra - ait Kullanıcı Resmi (Avatar)

    Post Cevap: Mobil Temada Whatsapp Ve Diğer Sosyal Butonlar

    Mobil Sitenize WhatsApp ve Diğer Sosyal Paylaşım Linkleri Ekleyin


    Birçok popüler web sayfasının mobil versiyonunda karşımıza çıkan sosyal ağ paylaşım linklerini hatırlar mısınız? Özellikle Facebook, Twitter, LinkedIn gibi ağlar dışında mobil cihazlara özel WhatsApp‘ı da destekleyen bu yapılar sitenizin trafiğini ve bilinirliğini büyük bir hızla arttıracaktır.

    Bugün sizlerle sadece HTML, CSS ve JavaScript yazarak sadece mobil cihazlarda gözüken şık bir sosyal ağ paylaşım barı oluşturacağız.

    Hem de 1 satır programlama yazmadan!



    ÖRNEĞİ GÖRÜNTÜLE



    Adobewordpress Facebook sayfamızda sizlerden gelen bir soruda takipçimiz şu soruyu soruyor : “9GAG’de beğendiğimiz görselleri WhatsApp üzerinden arkadaşlarımızla paylaşabiliyoruz. Ve bu özellik sadece mobil cihazımda gözüküyor. Aynı yapıyı kendi siteme en kolay yoldan nasıl uygularım?”

    Merak etmeyin. Bu işi sandığınızdan da kısa sürede halledeceğiz. En sonunda da aşağıdakine benzeyecek.

    Codepen Linki : http://codepen.io/adobewordpress/full/XdNWpo

    Beğendiniz değil mi? Hazırsanız başlayalım.

    HTML Kodları

    Şaşıracak bir şey yok. Bu işlemleri yapmamız için bir HTML koduna ihtiyacımız yok. İlgili kodları JavaScript ile çağırıp web sitemizin belirli bölgelerine yerleştireceğiz.

    Not : Oluşturacağımız JavaScript HTML append işlemleri SEO kaygısı ile hazırlanmış, sitenizin iskeletine uyumlu olarak çalışmaktadır.

    CSS Kodları

    Web sitemizin tüm öğelerinin üstünde, sitenin en altında gözükmesini istediğimiz socialShare classına sahip barımızın temelini oluşturalım.
    PHP- Kodu:

    Bu alandaki kodları görebilmek için üye olmanız gereklidir.Üye Olmak İçin Tiklayın...

    socialShare isimli barımızın içerisindeki tüm linklerde olmasını istediğimiz özellikleri belirtelim. 5 tane sosyal ağ linki paylaşacağımız için 100%’ü yakalamak için öğe başı %20’lik bir değer kullanıyoruz.

    PHP- Kodu:

    Bu alandaki kodları görebilmek için üye olmanız gereklidir.Üye Olmak İçin Tiklayın...

    Şimdi de sosyal ağlarımızın renklerini ekleyelim.

    PHP- Kodu:

    Bu alandaki kodları görebilmek için üye olmanız gereklidir.Üye Olmak İçin Tiklayın...



    Diğer sosyal ağların renklerini öğrenmek istiyorsanız : Sosyal Paylaşım Sitelerinin Renk Kodları

    Son olarak sosyal ağ linklerimizin bağlantı stillerini düzenleyelim.

    PHP- Kodu:

    Bu alandaki kodları görebilmek için üye olmanız gereklidir.Üye Olmak İçin Tiklayın...

    JavaScript Kodları

    Öncelikle sayfanızda jQuery tanımlı olup olmadığına bakın. Eğer yoksa body‘nin bittiği yere, tanımının hemen öncesine jQuery’i ekleyerek devam edelim.

    PHP- Kodu:

    Bu alandaki kodları görebilmek için üye olmanız gereklidir.Üye Olmak İçin Tiklayın...

    Aşağıdaki kod kalıbını hiç bölmeden, sizlerin de işini zorlaştırmadan satır yanlarına yorumlar ekleyerek paylaşıyoruz.

    (Anlayamadığım Nokta Bu AşAGIDAKİ kODLAR)

    PHP- Kodu:

    Bu alandaki kodları görebilmek için üye olmanız gereklidir.Üye Olmak İçin Tiklayın...

    Böylece işlemi tamamlamış oluyoruz. Artık sadece akıllı cihazlarda görünen bir sosyal paylaşım barına sahipsiniz.

    Bitirmeden Önce

    Yaşadığınız problemleri yorum alanında bizlerle paylaşarak bu tasarımı güçlendirmemize yardımcı olabilirsiniz.

    İyi çalışmalar.

    KAYNAK : http://www.adobewordpress.com/mobil-...nkleri-ekleyin
    mehmetuzn Bunu beğendi.
  6. #3
    Mobil Sitenize WhatsApp ve Diğer Sosyal Paylaşım Linkleri Ekleyin


    Birçok popüler web sayfasının mobil versiyonunda karşımıza çıkan sosyal ağ paylaşım linklerini hatırlar mısınız? Özellikle Facebook, Twitter, LinkedIn gibi ağlar dışında mobil cihazlara özel WhatsApp‘ı da destekleyen bu yapılar sitenizin trafiğini ve bilinirliğini büyük bir hızla arttıracaktır.

    Bugün sizlerle sadece HTML, CSS ve JavaScript yazarak sadece mobil cihazlarda gözüken şık bir sosyal ağ paylaşım barı oluşturacağız.

    Hem de 1 satır programlama yazmadan!



    ÖRNEĞİ GÖRÜNTÜLE



    Adobewordpress Facebook sayfamızda sizlerden gelen bir soruda takipçimiz şu soruyu soruyor : “9GAG’de beğendiğimiz görselleri WhatsApp üzerinden arkadaşlarımızla paylaşabiliyoruz. Ve bu özellik sadece mobil cihazımda gözüküyor. Aynı yapıyı kendi siteme en kolay yoldan nasıl uygularım?”

    Merak etmeyin. Bu işi sandığınızdan da kısa sürede halledeceğiz. En sonunda da aşağıdakine benzeyecek.

    Codepen Linki : http://codepen.io/adobewordpress/full/XdNWpo

    Beğendiniz değil mi? Hazırsanız başlayalım.

    HTML Kodları

    Şaşıracak bir şey yok. Bu işlemleri yapmamız için bir HTML koduna ihtiyacımız yok. İlgili kodları JavaScript ile çağırıp web sitemizin belirli bölgelerine yerleştireceğiz.

    Not : Oluşturacağımız JavaScript HTML append işlemleri SEO kaygısı ile hazırlanmış, sitenizin iskeletine uyumlu olarak çalışmaktadır.

    CSS Kodları

    Web sitemizin tüm öğelerinin üstünde, sitenin en altında gözükmesini istediğimiz socialShare classına sahip barımızın temelini oluşturalım.
    PHP- Kodu:

    Bu alandaki kodları görebilmek için üye olmanız gereklidir.Üye Olmak İçin Tiklayın...

    socialShare isimli barımızın içerisindeki tüm linklerde olmasını istediğimiz özellikleri belirtelim. 5 tane sosyal ağ linki paylaşacağımız için 100%’ü yakalamak için öğe başı %20’lik bir değer kullanıyoruz.

    PHP- Kodu:

    Bu alandaki kodları görebilmek için üye olmanız gereklidir.Üye Olmak İçin Tiklayın...

    Şimdi de sosyal ağlarımızın renklerini ekleyelim.

    PHP- Kodu:

    Bu alandaki kodları görebilmek için üye olmanız gereklidir.Üye Olmak İçin Tiklayın...



    Diğer sosyal ağların renklerini öğrenmek istiyorsanız : Sosyal Paylaşım Sitelerinin Renk Kodları

    Son olarak sosyal ağ linklerimizin bağlantı stillerini düzenleyelim.

    PHP- Kodu:

    Bu alandaki kodları görebilmek için üye olmanız gereklidir.Üye Olmak İçin Tiklayın...

    JavaScript Kodları

    Öncelikle sayfanızda jQuery tanımlı olup olmadığına bakın. Eğer yoksa body‘nin bittiği yere, tanımının hemen öncesine jQuery’i ekleyerek devam edelim.

    PHP- Kodu:

    Bu alandaki kodları görebilmek için üye olmanız gereklidir.Üye Olmak İçin Tiklayın...

    Aşağıdaki kod kalıbını hiç bölmeden, sizlerin de işini zorlaştırmadan satır yanlarına yorumlar ekleyerek paylaşıyoruz.

    (Anlayamadığım Nokta Bu AşAGIDAKİ kODLAR)

    PHP- Kodu:

    Bu alandaki kodları görebilmek için üye olmanız gereklidir.Üye Olmak İçin Tiklayın...

    Böylece işlemi tamamlamış oluyoruz. Artık sadece akıllı cihazlarda görünen bir sosyal paylaşım barına sahipsiniz.

    Bitirmeden Önce

    Yaşadığınız problemleri yorum alanında bizlerle paylaşarak bu tasarımı güçlendirmemize yardımcı olabilirsiniz.

    İyi çalışmalar.

    KAYNAK : http://www.adobewordpress.com/mobil-...nkleri-ekleyin
    mehmetuzn Bunu beğendi.

  7. offline
    alemextra - ait Kullanıcı Resmi (Avatar)

    Cevap: Mobil Temada Whatsapp Ve Diğer Sosyal Butonlar

    Konu İçeriğin Aynen Oldugu Gibi Paylaştım Ustam...
  8. #4
    Konu İçeriğin Aynen Oldugu Gibi Paylaştım Ustam...

Benzer Konular
  1. [HIDE] tagı ile gizli içerik mobil temada gözükmüyor
    Konu Sahibi safakozt Forum vBulletin Sorunlarınız
    Cevap: 3
    Son Mesaj : 19.Ağustos.2017, 05:40
  2. Cevap: 1
    Son Mesaj : 19.Ocak.2016, 23:27
  3. Cevap: 4
    Son Mesaj : 25.Temmuz.2015, 14:39
  4. Mobil temada içerik açılmıyor
    Konu Sahibi safakozt Forum vBulletin Sorunlarınız
    Cevap: 5
    Son Mesaj : 25.Mart.2015, 16:56
  5. vB 4.X.X vb.web.tr Tarzı logo yanına sosyal butonlar
    Konu Sahibi eTiKeT™ Forum vBulletin 4.x Şablon Değişiklikleri
    Cevap: 5
    Son Mesaj : 07.Mart.2014, 20:40