Sosyal düğme komut dosyası. Artı - sosyal medya düğmeleri. Hızlı bir şekilde nasıl kurulur ve yapılandırılır. Share42 kayan çubuğunu konumlandırma

Muhtemelen internette barındırılmayan site kalmamıştır. gönderme düğmeleri Sosyal ağlardaki materyaller. İkincisi, hayatımızda uzun ve sağlam bir yer edinmiştir. Orada iletişim kuruyoruz, birbirimizi tanıyoruz, iş tanıtımı yapıyoruz, haberleri okuyoruz vb. tam bir dizi. Web yöneticilerinin sitelerinin sosyal medyadaki varlıklarını mümkün olan her şekilde genişletmek istemeleri şaşırtıcı değil. Sonuçta, kesinlikle herkesin ihtiyaç duyduğu tonlarca potansiyel trafik var. Ziyaretçi akışı para, itibar, büyümedir. Her şey onun etrafında inşa edilmiştir. Tatlı parça.

Açıkçası, sosyal düğmeler çok önemlidir. Başka bir soru - hangilerini seçmeli? sizin için test ettik TOP 5 farklı hizmet sitelere düğme kodu eklemek için. Amaç, en uygun olanı belirlemek ve ayrıntılı olarak göstermektir. Eleme turundan başlayalım.

En İyi Sosyal Düğme Hizmetini Seçmek

Karşılaştırma için başvuranların seçimi banal çıktı - biz aldık en popüler hizmetler , web sitesi oluşturma konusuna bir şekilde aşina olan herhangi bir kişi tarafından duyulmuştur. Nadir değil, popülerlik kazanıyor, sadece deneyimli yaşlı adamlar.

Sertifikalı ekibin yapısı aşağıdaki gibidir:

Seçilen sosyal hizmetlerin test edilmesi sonucunda - uSocial liderdir . Şimdi seçimimizin gerekçesini öğrenmek istiyorsunuz. Elbette asılsız kalmayacağız.

uSocial Düğmelerinin Özellikleri

hadi getirelim bazı gerçekler , bu da bizi alınan kararın doğruluğuna ikna etti.

Sözlü karşılaştırma birçok kişi için yeterli olmayacaktır. Bu nedenle derledik karşılaştırma Tablosu uSocial ve diğer yeni katılanların düğmeleri (kullanılan derecelendirme ölçeği 1'den 5'e kadardır). Tüm bu veriler test sürecinde elde edilir.

Analizin, seçimimizin geçerliliği hakkındaki şüphelerinizi gidermeyi başardığını umuyoruz. İyi görünüme ek olarak, uSocial'ın sosyal düğmeleri derin uygulamalı bir yapıya sahiptir ve herhangi bir projeyi tanıtmak için oldukça güçlü bir araçtır.

Siteye sosyal ağ düğmelerinin nasıl kurulacağına ilişkin talimatlar

Sitenize uSocial'dan sosyal butonlar yerleştirmek için birkaç basit adımı uygulamanız gerekir:

Aşama 1

Adım 2

Bir dizi sosyal düğmenin montajı. Seçebilmek görüntülenen sosyal ağ hizmetleri, şekil ve stil düğmeleri.

Burada ayrıca "Yukarı" düğmesini etkinleştirebilir, mobil cihazlar için desteği etkinleştirebilir, Viber, WhatsApp, Telegram, SMS servislerini bağlayabilirsiniz.

Tüm işlemleri tamamladıktan sonra girin adres sitenizi ve düğmesine tıklayın "Kodu almak için".

Aşama 3

kopyala kodsenaryo görünen pencerede. Kodu, kaynağınızın sosyal düğmeler paneline ihtiyaç duyduğunuz sayfalarına eklemeniz gerekir. Örneğin, kapanış etiketinden önceki altbilgide.

Adım-4

Kişisel uSocial hesabınızdan sosyal çubuğu yükledikten sonra, beğeni ve yeniden gönderi istatistikleri seçilen dönem için, hem tüm sosyal ağlar için hem de seçilenler için. Veriler net grafikler veya tablolar şeklinde görüntülenir.

kişisel hesapta uSosyal hepsi yaratıldı setleri Ve İstatistik bağlı oldukları siteler için. Dilediğiniz zaman siteler arasında geçiş yapabilir ve sayaçlardan alınan verileri analiz edebilirsiniz.

Sosyal çubuğun verimliliği nasıl artırılır?

Materyal yeniden yayınlanırken yanlış resim ve açıklama görüntülenirse, tüm sosyal ağların anlayabileceği özel meta etiketler kullanarak neyin, ne kadar ve nasıl gösterilmesi gerektiğini manuel olarak belirtebilirsiniz. Bu yapılmazsa, sosyal ağlarda rastgele resimler ve açıklamalar görüntülenebilir. Muhtemelen buna ihtiyacın yok.

Sosyal meta etiketleri doğru bir şekilde doldurulursa, gönderiler materyalin türünü, ilgili başlığı ve istenen görsele bir bağlantıyı belirttiği için sosyal hizmetler tarafından doğru algılanacaktır. Tüm bunlar, yeniden gönderme verimliliğini artırır: materyaliniz sosyal hizmetler tarafından doğru bir şekilde dizine eklenir.

örnekler biçimlendirme kodu popüler sosyal ağlar için (kod, etiketten önce yazılmalıdır)):

1. Facebook Ve Temas halinde Açık Grafik protokolünü kullanın:

3. için twitter kod şöyle görünür:

4. için Google artı Bu yüzden:

- yazarın Google+ profiline bağlantı
- Sitenin adı
- snippet metni (40 karaktere kadar)
- sitenin açıklaması
- resim dosyasının yolu

Aletler mikro verilerle çalışmak.

Artıları:

Artı X

Bunu ekle

iyi paylaşım

paylaşımkolik

Artık siteye sosyal ağ düğmeleri eklemenin epeyce yolu var, bir seçenek var ve memnun ediyor. Sosyal düğmeler sayfada önemli bir rol oynar, onların yardımıyla, birçok kişinin zaten bildiği gibi, seçilen sosyal ağlardan birinde herhangi bir girişi hızlı bir şekilde yeniden yayınlayabilirsiniz. Site için sosyal butonlar artık herhangi bir yere ve herhangi bir yere, ancak bazen yanlış yere yerleştirilmiştir.

Site için sosyal butonlar

Pek çok kişi, sosyal ağların artık ne kadar gelişmiş olduğunu ve sitenizde en sevdiğiniz gönderiyi veya bir gönderinin bir bölümünü duvarınıza ekleyebileceğiniz bu tür düğmelere sahip olmanın ne kadar harika olduğunu zaten biliyor. Bu işlem ile sadece mesajlara yorum veya repost yapmakla kalmaz, aynı zamanda arama motorlarına ek bir sinyal vermiş olursunuz.

Her site sahibinin hayali, eğer tüm gönderileri okuyucular tarafından sosyal ağlardan birindeki sayfalarında yeniden yayınlanırsa. Şimdi en çok Vkontakte, Facebook, Twitter ve Odnoklassniki'ye talep var. LiveJournal, liveinternet ve Blogger'ı da eklerdim. Kullanıcının tam rahatlığı için bu düğmelerin siteye eklenmesi arzu edilir.

Özellikle Twitter, yeni yayınlarınızın arama motoru dizininde daha hızlı görünmesi sayesinde bugün daha fazla ilgiyi hak ediyor.

Site sahibi iseniz, büyük olasılıkla bir canlı internet veya LiveJournal hesabınız olmalıdır. Bu servislere her seferinde yeni girişler eklememek için butonlarının varlığı zaman kazandırır. Ek olarak, birçok kişi bu hizmetleri kullanır ve girişinizi günlüklerinde yeniden yayınlamak isteyebilir.

Bir siteye hızlı bir şekilde sosyal düğmeler eklemenin en iyi birkaç yolu vardır. Bunu, bu konuda hızlı ve kolay bir şekilde yardımcı olacak çevrimiçi hizmetlerin yardımıyla yapabilirsiniz. Veya doğrudan her sosyal ağ üzerinden ayrı ayrı. Burada herkesin kendi seçimi var. Eskiden her sosyal ağ üzerinden ayrı ayrı butonlar eklerdim, şimdi servisi kullanarak kurdum.

Böyle bir hizmet var, buna denir paylaşım42. Onun hakkında, ne kadar iyi olduğu ve nasıl kullanılacağı hakkında birçok materyal yazıldı. İyi, ancak bu konuda hiçbir şey anlamayan ortalama bir kullanıcı için bununla başa çıkmak zor olacaktır.

Böylesine küçük bir meslek için, klasörleri barındırmaya kopyalamak ve ardından stillerle banyo yapmak artık artık sürmüyor. Bitmiş kodu herhangi bir ek klasör olmadan kopyalayıp yapıştırmanız gereken başka seçenekler de vardır. Öyleyse bu hizmeti unutun.

Yalnızca çoğunluğun kullandığı en temel sosyal ağ düğmelerini ekleyin, onlarca gereksiz unutulmuş düğmeyi şekillendirmeyin.

Bugün siteye sosyal düğmeler eklemek için kullanabilecekleriniz:

1. Uptolike hizmet.
2. Yandex sosyal düğmeleri.
3. Her sosyal ağı ayrı ayrı manuel olarak ekleme.
4. Artı hizmet.
5. WordPress için eklentileri kullanma (tembeller için).

Muhtemelen başka bir yere karışmanıza gerek yok, daha iyi yollar bulamazsınız. Bu seçeneklerin her biri kendi yolunda iyidir. Daha uygun veya çekici bir yol biliyorsanız, lütfen yorumlara yazın.

Sosyal ağ düğmeleri, okuduktan sonra site ziyaretçisinin girişinizi isteğe bağlı olarak yeniden gönderebilmesi için her makalenin sonuna eklenmelidir. Onları sayfanın sonunda bir yerde aramamalı. Bence bu tür düğmelerin yerleştirilmesi gereken en uygun yerler, kenar çubuğunda ve her girişin hemen sonundadır.

kadar

Şu anda bu hizmeti kendim kullanıyorum, hoşuma gitti. Kolaylığa ek olarak, uptolike hizmetinin kendi türünden diğer hizmetlere göre çeşitli ayrıcalıkları vardır.

• Sosyal medya butonları arasında geniş seçenek;
• Mobil cihazlar için uyarlanmış düğmeler;
• Metnin herhangi bir bölümünü sosyal ağda alıntılama yeteneği;
• En üste bir düğme ekleyebilirsiniz;
• Vkontakte grubuna abonelik için bir açılır pencere ekleme yeteneği;
• Simgelerin boyutunu seçme;
• site için simgelerin stilini seçme;
• Fareyle üzerine gelme efekti ekleyin;
• Düğme arka planını, metin rengini, sayaç arka planını değiştirin;
• Sayaçtaki metni artırın veya azaltın.

Bu tür diğer hizmetlere göre ayrıcalıklar, onu kullanmak için yeterlidir. Bu durumda, komut dosyası biçiminde yalnızca küçük bir kod ve stiller içeren birkaç satır eklenir. Aynı zamanda harici link yok, giden linkler servisi üzerinden kontrol ettim. Eğer yanılıyorsam, beni düzeltebilirsin.

Bunun dışında uptolike hizmeti ne yapabilir.

En önemli ayarlar Görmek istediğiniz site için hangi sosyal düğmeleri seçin. Gerekirse listeyi açabilir ve çoğunluktan birkaç tane daha seçebilirsiniz. Destek için kutuyu işaretleyin. Bundan sonra cep telefonlarında sosyal ağ düğmeleri her zaman ekranın alt kısmında görüntülenecektir.

Düğmelerin yatay konumunu, boyutunu ve stilini seçin. İstediğiniz gibi dekore edin ve üzerine gelme efekti ekleyin. Daha fazla bir şey yapılmasına gerek yok. Bir sayaç kodu oluşturmak için web sitesi adresini ve posta kutusunu belirtmeniz gerekir. Bundan hemen sonra, siteye sosyal düğmeler eklemek için bir kod görünecektir.

Bir WordPress siteniz varsa, single.php dosyasını açın ve sayfa içeriğinin bitiminden hemen sonra biten kodu yapıştırın. Sayfayı yenileyin ve ne olduğunu görün. Zor bir şey yok.

Yandex

İstediğiniz servis simgelerini seçin. Twitter, sayaçlar olmadan yalnızca simgeler biçimindedir. Blokların görünümünü seçiyoruz ve aşağıda ekleme için hazır bir kod olacak. Daha önce de belirtildiği gibi Yandex başka bir şey eklemiyor, her şey mütevazı ve zevkli.

Manuel Ekleme Yöntemi

Bu yöntemde her bir sosyal ağı ayrı ayrı açmanız ve her repost butonunu ayrı ayrı yapılandırmanız gerekiyor. Bir Facebook düğmesi eklemek için gitmeniz gerekir Burada. Sınıf arkadaşları ve benim dünyam için veri eklemeniz gerekiyor. Twitter için her şey . Bir Vkontakte düğmesi eklemek için şu adrese gidin: bu sayfa .

Fazladan komut dosyası olmadan yalnızca sosyal ağlardan hazır kodunuz olacak. Muhtemelen bir web sitesine sosyal medya düğmeleri eklemenin en iyi yolu. Zorluk, her düğmeyi ayrı ayrı kesmeniz, ardından her şeyi tek bir yere yapıştırmanız ve onu tek bir sütunda hizalamak için css stillerini kullanmanız gerektiğinde ortaya çıkar. Bu konuda bir sorununuz yoksa deneyebilirsiniz.

Temas halinde

Bir Vkontakte düğmesi eklemek için Siteleri ve widget'ları bağla'yı tıklayın, aşağıda olası tüm eklemelerin tam bir listesi olacaktır. Ayrıca sayfaya yorum ekleme, duvara yazma, grubunuzu ekleme, tavsiyeler, anketler, yazara abone olma ve bağlantı yayınlama olanağı da vardır. Bizim durumumuzda, Bağlantıları Yayınla'yı seçin.

Karmaşık bir şey yok, düğmenin stilini (sayaçlı veya sayaçsız) seçiyoruz, düğmenin üzerindeki metni, logo seçeneğini yazıyoruz ve altta hazır bir yerleştirme kodu olacak. Bu manuel ekleme yöntemini kendim kullandım, ancak şu anda üçüncü taraf bir hizmeti deniyorum. Bakalım ne olacak. Bana uymuyorsa, hemen manuel yönteme geri döneceğim.

artı

Bir siteye düğme eklemenin başka bir yolu da artı hizmet. Hizmet de fena değil, birçok düğme ondan fark edildi. Tasarım seçeneklerinin seçimi büyüktür, amatörlere ek olarak büyük görüntü boyutları vardır. Ağ ekleme yeteneği, diğer benzer hizmetlere kıyasla hiçbir şekilde daha düşük değildir. Kurulum herhangi bir dosya gerektirmez, sadece kod gerektirir.

Herhangi bir tasarım stili seçin ve gerekli hizmetleri ekleyin. Biraz daha aşağıda, tüm bunların sayfada nasıl görüneceğine dair hazır bir örnek gösterilecektir. Simgeler büyük, orta veya küçük olarak ayarlanabilir. Ayrıca site için kare simgeler veya yuvarlak, bir satırda veya iki satırda, yatay veya dikey. Sayaçlı veya sayaçsız, arka plansız veya arka planı web sitenizin tasarımına uyacak şekilde ayarlayın.

Tüm bu adımlardan sonra, aşağıda sayfaya eklemek için hazır bir kod olacaktır. Ana sayfaya eklemeniz gerekirse index.php dosyasının içini karıştırıyoruz, tüm gönderilerinizde ise kodu yazının bitiminden hemen sonra single.php dosyasına ekliyoruz.

wordpress

Bu kodda neyin kopyalanması gerektiğini, nerede ve nasıl çalıştığını anlamadıysanız, bir çıkış yolu vardır. Bir WordPress motorunuz varsa, size sosyal medya düğmeleri verecek bir eklenti kurabilirsiniz. Bugün sadece çok sayıda bu tür eklenti var. Yönetici paneline gidin - Eklentiler. Eklenti aramasına hemen "sosyal düğmeler", "sosyal" veya "VKontakte" yazabilirsiniz. Eminim bir şeyler bulursun.

Derecelendirmeye bakıldığında, WordPress için bu tür benzer eklentilerin çoğu arasında en çok öne çıkanlar:

1. WordPress için Sosyal Paylaşım Düğmeleri.
2. sosyal.
3. Social Media Feather - hafif sosyal medya paylaşımı ve takip düğmeleri.

Aslında, bu tür pek çok eklenti var, en çok hangisini beğendiğinizi, doğru çalıştığını, neyi gösterdiğini ve kendiniz için nasıl özelleştirebileceğinizi yüklemeniz ve çözmeniz gerekiyor. WordPress için Sosyal Paylaşım Düğmeleri gibi ilk eklenti örneğine bakalım.

Eklentinin kendisi Rusça, bununla ilgili herhangi bir sorun olmayacak. Kurulumdan sonra, soldaki menüde yeni bir "Paylaş Düğmeleri" düğmesi görünecektir. Ana ayarlarda site logosunu koyuyoruz ve sosyal butonların önüne yazıyı yazıyoruz.

Meta veri oluşturmayı açtığınızdan emin olun, sayfanın başlığı ve açıklaması dahil edilecektir. Düğmeleri yatay olarak hizalayın ve nerede olacaklarını seçin. Sadece gönderilerde seçiyoruz. İsteğe bağlı olarak, gerekli sayfaları hariç tutabilirsiniz. En altta, tritter'da takma adı belirtmeniz gerekir.

Bir sonraki sekme olan Paylaşım ayarları'nda düğmelerin stilini seçin. Aşağıda, gereksiz sosyal ağları açıp kapatabilir ve yukarıya veya aşağıya tüm blok için girintiler ekleyebilirsiniz. Herhangi bir yere ekstra kod koymanıza gerek yok, eklenti sizin için her şeyi yapacak.

Hangi yöntemi kullanacağınız konusunda seçim sizin. Uptolike, Pluso veya Yandex aracılığıyla sosyal medya simgeleri ekleyin. Eklentiyi hemen WordPress'e yüklememeli, her şeyi manuel olarak veya bir hizmet yardımıyla yapmaya çalışmamalısınız.

Başka bir iyi hizmet veya site için sosyal düğmeler eklemenin bir yolunu biliyorsanız, yorum için minnettar olacağım.

Bu kısa öğreticide, sosyal ağlarda paylaşmak için basit ve özel düğmeler oluşturacağız.

Önerdiğim seçenek bu eksikliklerden yoksundur - tüm dosyalar dışarıdan hiçbir şey yüklemeden sunucunuzda olacaktır (yani siteyle birlikte düşeceklerdir) ve ayrıca çok iyi özelleştirilmiştir. Ek olarak, küçük bir artımız olacak - genellikle büyük üçü sosyal düğmelere (VKontakte, Facebook ve Twitter) dahil edilir. Bizim durumumuzda, kimsenin sitemizi paylaşmadan bırakmaması için klipte Mail.Ru, Odnoklassniki ve Telegram var.

Tek önemli dezavantajı: tıklama sayısı dikkate alınması gereken düğmelerde olmayacak. Sadelik ve esnekliğin ötesine geçiyoruz.

İlk defa sitedeki bir sayfa için sosyal paylaşıma çok ihtiyaç varken tüm kaynakların tasarıma uymadığı bir dönemde kendi sosyal ağ butonlarım sorusu aklıma geldi. Ve sadece ben değil - özel düğmeler fikri yeni olmaktan çok uzak. Bence en ilginç çözüm Habré'de benim tarafımdan keşfedildi.ve GitHub'a getirilen kısa bir aramadan sonra. Bu tür paylaşım butonlarının mantığını esas aldım ve yaratıcı bir şekilde son haline getirdim.

Çözüm, keçe botlar kadar basit - sosyal ağlar için, kendileri için anlaşılabilir parametrelerin iletildiği bağlantılar yapılır. etiketi kullandığı için , o zaman içine hemen hemen her şeyi sarabilirsiniz - özelleştirme kapsamı (tüm bunların uğruna yapıldığı) çok büyük.

Temas halinde Facebook Posta.Ru sınıf arkadaşları twitter Telgraf

Hazır. Kod zaten çalışıyor ve kullanılabilir - bağlantıya tıkladığınızda yeni bir sosyal ağ sekmesi açılır. Ve şimdi sekme oluşturmayacak, tarayıcının üstünde küçük bir pencere açacak şekilde yapalım. Hemen altına aşağıdaki kodu ekleyin:

Ne olur - komut dosyası tüm tıklamaları izler rel=”nofollow” özniteliğine sahip. Herhangi birini koyabilirsiniz, ancak bu aynı zamanda robotlara bu bağlantıları takip etmenize gerek olmadığını söyler - tek seferde bir kombo yaparız. Tıklandığında, beğeninize göre değiştirebileceğiniz 626'ya 436 piksellik bir pencere (parametreler genişlik=626,yükseklik=436) açılır.

Tabii ki, bu betiğin önemli bir dezavantajı var - tıklama sayısını nasıl sayacağını bilmiyor. Ancak hafif, hızlı ve kolayca özelleştirilebilir bir çözüm olarak, kesinlikle yeri doldurulamaz. etiketlemek için her şeyi doldurabilirsiniz - metin, resimler, svg grafikleri - başka hiçbir şey sizi sınırlamaz (elbette fantezi dışında).