Kompüterlər və müasir qurğular

Salam, blog saytının əziz oxucuları. Əlbəttə ki, bu tapşırıq üçün bir plagin istifadə edə bilərsiniz, lakin bunu özünüz etmək o qədər də çətin deyil, və daha az olacaq, xüsusən də onların çoxunu işlədiyim üçün (təqdim olunan linkdəki məqaləyə baxın). Artıq bir qədər ətraflı yazdığım sosial şəbəkələrin nişanlarını götürdüm (ümid edirəm ki, Dimox buna etiraz etməyəcək).

Mən də bunu E-poçt üçün uyğun hesab etdim.

Düymələrdən sprayt yaradın və Html kodunu sayta daxil edin

Sosial şəbəkələrdə bütün lazımi qrupları və səhifələri yaratdıqdan sonra, yəni bütün lazımi bağlantıları almısınız, sayta düymələr əlavə etməklə çaşıb qala bilərsiniz. Siz, əlbəttə ki, mənim haqqında yazıma uyğun olaraq, hər bir sosial şəbəkə üçün uyğun bir simvol seçə və lazım olduqda ölçüsünü və içərisində lazımi ölçüyə endirə bilərsiniz.

Ancaq bu ən yaxşı seçim deyil. Niyə? Yaxşı, çünki sosial şəbəkənin hər şəklini yükləmək üçün serverinizə ayrıca sorğu göndəriləcək. Bir çox nişanınız varsa, bu, hər hansı bir şəkildə serverdə əlavə yük yaradacaq on sorğu deməkdir və . Bu cür israfçılıq bizə yaraşmır, xüsusən də çoxdandır.

Çarxı yenidən ixtira etməməyə qərar verdim (sprite yaratmaq), ancaq Share42 konstruktorunu yaradandan istifadə etdim (onunla işləməyin təsvirinə keçid yuxarıda verilmişdir). Orada nişanlarına ehtiyacınız olan sosial şəbəkələri seçə bilərsiniz və kodla birlikdə bir CSS sprite alacaqsınız, yəni. fiziki olaraq bir qrafik faylı, sizə lazım olan bütün sosial şəbəkə nişanlarını və RSS lentinə abunəlikləri (və zəruri hallarda E-poçt) ehtiva edir.

24-dən 24-ə qədər nişan ölçüləri olan xəbər abunələri üçün dörd əsas şəbəkə və bir neçə ikona seçdim, buna görə də mənim spritim belə görünür ( , lakin o, hələ də ora getdi, amma fərqi yoxdur):

İndi bizdə bütün maddələr var - qruplara və ya sosial şəbəkələrin səhifələrinə keçidlər və onları saytda göstərmək üçün nişanlar. Yalnız bütün bunları düzgün hazırlamaq qalır, yəni. makiyaj etmək. Mənim bloqum WordPress tərəfindən dəstəklənir, ona görə də düymə kodunu birinə yapışdıracağam. Mənim vəziyyətimdə o, sidebar.php adlanır. html kodu bu, çox sadə bir nəticə ilə nəticələnir:

Yaxşı, ən maraqlısı. Köməyimizlə, spritemizin hansı sahəsinin bu xüsusi yerdə fon kimi göstəriləcəyini müəyyən edirik (bizim vəziyyətimizdə bu fon hiperlink altında yerləşdirilib). Bunun necə baş verdiyini izah etmək çox uzun vaxt tələb edir, ona görə də linkdəki məqaləni oxuyun və hər şey aydın olacaq (illüstrativ nümunələr də var). Əgər siz çox tənbəlsinizsə, onda sadəcə 24-ə çoxlu sayda olan rəqəmlərlə təcrübə edin.

Bəli, sprite faylını FTP vasitəsilə saytınıza yükləyin və arxa planda ona gedən yolu göstərin (). Hamısı budur. Əgər alınmırsa, yuxarıdakı linklərdəki materialları daha diqqətlə oxuyun və heç nə alınmırsa, şərhlərdə vəziyyətinizi təsvir edin (ətraflı - kodu daxil etmək üçün onu əlavə etməyi unutmayın. kvadrat mötərizə ilə PHP teqləri).

Sənə uğurlar! Tezliklə blog səhifələri saytında görüşənədək

Sizi maraqlandıra bilər

Son vaxtlar, hər ikinci (birinci deyilsə) müştəri saytın inkişafı üçün tələblər onu sosial şəbəkələrlə əlaqələndirməyi xahiş edir. Saytdakı “Sosial” düymələr hədəf auditoriyanı cəlb etmək, məzmunun yayılması və ümumilikdə PR üçün 1 nömrəli vasitədir. Və tamamilə pulsuzdur!

Sosial şəbəkələr saytda yerləşdirmək üçün öz düymələri və vidjetləri üçün kodlar təqdim edir və onların məzmunun idarə edilməsi sistemində quraşdırılması üçün təlimatlar əlavə edir. İstənilən CMS (əməliyyat sistemləri) onları quraşdırmağa imkan verir, əsas odur ki, onları saytınızın dizaynına ahəngdar şəkildə uyğunlaşdırın.

Xüsusiyyətləri və funksiyaları hansılardır?

Saytınız populyar sosial şəbəkələrlə ünsiyyət quran insanlara yönəlibsə. şəbəkələri, məsələn, Vkontakte, Twitter, Instagramm, Facebook, Google+, Pinterest və s. dizayn üçün toplama xidmətlərindən istifadə etməyi tövsiyə edirik. Bunlar hansı sosial şəbəkədən istifadə etmələrindən asılı olmayaraq sayt ziyarətçilərinə məlumatı dostları ilə tez paylaşmağa imkan verəcək sadə və rahat alətlərdir. Aşağıda ən populyar xidmətləri təhlil edəcəyik.

Pluso Sosial Media Düymələrini paylaşın

İndi sayta sosial şəbəkə düymələri əlavə etməyin bir neçə yolu var, seçim var və bu, xoşdur. Sosial düymələr səhifədə mühüm rol oynayır, onların köməyi ilə çoxlarının artıq bildiyi kimi, seçilmiş sosial şəbəkələrdən birində istənilən girişi tez bir zamanda təkrar yerləşdirə bilərsiniz. Sayt üçün sosial düymələr indi hər yerdə və hər yerdə yerləşdirilir, lakin bəzən yanlış yerdədir.

Sayt üçün sosial düymələr

Artıq bir çox insanlar sosial şəbəkələrin indi necə inkişaf etdiyini və saytınızda sevimli yazınızı və ya yazının bir hissəsini divarınıza əlavə edə biləcəyiniz düymələrin olmasının nə qədər böyük olduğunu bilirlər. Bu hərəkətlə siz yalnız mesajları şərh və ya repost etmirsiniz, həm də axtarış sistemlərinə əlavə siqnal verirsiniz.

Hər bir sayt sahibinin arzusu, əgər onun bütün yazıları oxucular tərəfindən sosial şəbəkələrdən birində öz səhifələrində təkrar dərc edilərsə. İndi ən çox Vkontakte, Facebook, Twitter və Odnoklassniki-yə tələbat var. Mən həmçinin LiveJournal, liveinternet və Blogger əlavə edərdim. İstifadəçinin tam rahatlığı üçün bu düymələrin sayta əlavə edilməsi arzuolunandır.

Xüsusilə Twitter bu gün getdikcə daha çox diqqətə layiqdir, onun köməyi ilə yeni nəşrləriniz axtarış motoru indeksində daha sürətli görünür.

Saytın sahibisinizsə, çox güman ki, canlı internet və ya LiveJournal hesabınız olmalıdır. Bu xidmətlərə hər dəfə yeni girişlər əlavə etməmək üçün onların düymələrinin olması vaxta qənaət edir. Bundan əlavə, bir çox insan bu xidmətlərdən istifadə edir və sizin qeydinizi öz gündəliyinə yenidən yerləşdirmək istəyə bilər.

Sayta sosial düymələri tez əlavə etməyin bir neçə ən yaxşı yolu var. Bu işdə tez və asanlıqla kömək edəcək onlayn xidmətlərin köməyi ilə bunu edə bilərsiniz. Və ya birbaşa hər bir sosial şəbəkə vasitəsilə ayrı-ayrılıqda. Burada hər kəsin öz seçimi var. Əvvəllər hər bir sosial şəbəkə vasitəsilə ayrı-ayrılıqda düymələr əlavə olunurdu, indi xidmətdən istifadə edərək onları quraşdırdım.

Belə bir xidmət var, adlanır pay 42. Haqqında çoxlu materiallar yazılıb, nə qədər yaxşıdır və ondan necə istifadə etmək lazımdır. Yaxşı, amma bu barədə heç nə başa düşməyən orta istifadəçi üçün onu idarə etmək çətin olacaq.

Belə kiçik bir məşğuliyyət üçün, qovluqları hostingə köçürmək və sonra üslublarla çimmək, indi artıq sürmür. Artıq bitmiş kodu heç bir əlavə qovluq olmadan kopyalayıb yapışdırmağınız lazım olan başqa seçimlər də var. Ona görə də bu xidməti unut.

Əksəriyyətin istifadə etdiyi yalnız ən sadə sosial şəbəkə düymələrini əlavə edin, onlarla lazımsız unudulmuş düymələri heykəlləndirməyin.

Sayt üçün sosial düymələr əlavə etmək üçün bu gün nədən istifadə edə bilərsiniz:

  1. Uptolike xidmət.
  2. Yandex sosial düymələri.
  3. Hər bir sosial şəbəkənin ayrıca əl ilə əlavə edilməsi.
  4. Əlavə xidmət.
  5. WordPress üçün plaginlərdən istifadə (tənbəllər üçün).

Yəqin ki, başqa bir yerə müdaxilə etmək lazım deyil, daha yaxşı yollar tapa bilməzsiniz. Bu seçimlərin hər biri öz yolunda yaxşıdır. Daha rahat və ya cəlbedici bir yol bilirsinizsə, şərhlərdə yazın.

Sosial şəbəkə düymələri hər məqalənin sonuna daxil edilməlidir ki, oxuduqdan sonra saytın ziyarətçisi istəyə görə sizin girişinizi təkrar yerləşdirə bilsin. Onları səhifənin sonunda hardasa axtarmamalıdır. Ən optimal yerlər, fikrimcə, bu cür düymələrin yerləşdirilməli olduğu yerlər yan paneldə və dərhal hər girişin sonundadır.

Uptolike

Hazırda mən özüm bu xidmətdən istifadə edirəm, xoşuma gəldi. Rahatlıqdan əlavə, uptolike xidmətin digər növlərə nisbətən bir sıra imtiyazları var.

  • Sosial media düymələri arasında geniş seçim;
  • Mobil cihazlar üçün uyğunlaşdırılmış düymələr;
  • Sosial şəbəkədə mətnin istənilən hissəsindən sitat gətirmək imkanı;
  • Üstə bir düymə əlavə edə bilərsiniz;
  • Vkontakte qrupuna abunə olmaq üçün pop-up pəncərəsi əlavə etmək imkanı;
  • Nişanların ölçüsünü seçmək;
  • Sayt üçün nişanlar üslubunun seçilməsi;
  • Hover effekti əlavə edin;
  • Düymə fonunu, mətn rəngini, əks fonu dəyişdirin;
  • Sayğacdakı mətni artırın və ya azaldın.

Ondan istifadə etmək üçün digər bu cür xidmətlər üzərində imtiyazlar kifayətdir. Bu halda, skript şəklində yalnız kiçik bir kod və üslubları olan bir neçə sətir əlavə olunur. Eyni zamanda, kənar keçid yoxdur, mən onu gedən bağlantılar xidməti vasitəsilə yoxladım. Səhv edirəmsə, məni düzəldə bilərsiniz.

Bundan başqa, uptolike xidməti başqa nə edə bilər.

Ən vacib parametrlər Sayt üçün hansı sosial düymələri görmək istədiyinizi seçin. Lazım gələrsə, siyahını aça və çoxluqdan daha bir neçəsini seçə bilərsiniz. Dəstək üçün qutuyu yoxlayın. Bundan sonra mobil telefonlarda sosial şəbəkə düymələri həmişə ekranın aşağı hissəsində göstəriləcək.

Düymələrin üfüqi mövqeyini, ölçüsünü və üslubunu seçin. İstədiyiniz kimi bəzəyin və hover effekti əlavə edin. Daha heç nə etmək lazım deyil. Əks kodu yaratmaq üçün veb saytın ünvanını və poçt qutusunu göstərməlisiniz. Bundan dərhal sonra sayta sosial düymələrin daxil edilməsi üçün kod görünəcək.

WordPress saytınız varsa, single.php faylını açın və bitmiş kodu səhifə məzmununun bitməsindən dərhal sonra yapışdırın. Səhifəni yeniləyin və nə baş verdiyinə baxın. Çətin bir şey yoxdur.

Yandex

İstədiyiniz xidmət nişanlarını seçin. Twitter yalnız ikona şəklindədir, sayğacları yoxdur. Blokların görünüşünü seçirik və aşağıda daxil etmək üçün hazır kod olacaq. Daha əvvəl qeyd edildiyi kimi, Yandex başqa bir şey əlavə etmir, hər şey təvazökar və zövqlüdür.

Əl ilə əlavə etmə üsulu

Bu üsulda hər bir sosial şəbəkəni ayrıca açmalı və hər bir repost düyməsini ayrıca konfiqurasiya etməlisiniz. Facebook düyməsini əlavə etmək üçün getmək lazımdır burada. Sinif yoldaşlarım və dünyam üçün məlumat əlavə etməlisiniz. Twitter üçün hər şey . Vkontakte düyməsini əlavə etmək üçün bura keçin bu səhifə .

Heç bir əlavə skript olmadan yalnız sosial şəbəkələrdən hazır kodunuz olacaq. Yəqin ki, veb-sayta sosial media düymələri əlavə etməyin ən yaxşı yoludur. Çətinlik ondan ibarətdir ki, hər bir düyməni ayrıca kəsməli, sonra hər şeyi bir yerə yapışdırmalı və onu bir sütunda hizalamaq üçün css üslublarından istifadə etməlisiniz. Bununla bağlı heç bir probleminiz yoxdursa, cəhd edə bilərsiniz.

ilə təmasda

Vkontakte düyməsini əlavə etmək üçün Saytları və vidjetləri birləşdirin klikləyin, aşağıda bütün mümkün əlavələrin tam siyahısı olacaq. Səhifəyə şərh əlavə etmək, divara yazmaq, qrupunuzu, tövsiyələrinizi, sorğularınızı əlavə etmək, müəllifə abunə olmaq və linkləri dərc etmək imkanı da var. Bizim vəziyyətimizdə, Bağlantıları dərc et seçin.

Mürəkkəb bir şey yoxdur, biz düymənin üslubunu seçirik (sayğaclı və ya sayğacsız), mətni düyməyə yazın, loqo seçimi və altındakı hazır yerləşdirmə kodu olacaq. Mən özüm əlavə etmək üçün bu əl üsulundan istifadə etdim, lakin hazırda üçüncü tərəf xidmətini sınayıram. Gəlin görək nə baş verir. Mənə uyğun gəlmirsə, dərhal əl üsuluna qayıdacağam.

üstəlik

Sayta düymələr əlavə etməyin başqa bir yolu ilə Pluso xidməti. Xidmət də pis deyil, ondan bir çox düymələr diqqət çəkdi. Dizayn variantlarının seçimi böyükdür, həvəskarlara əlavə olaraq böyük şəkil ölçüləri var. Şəbəkə əlavə etmək qabiliyyəti digər oxşar xidmətlərlə müqayisədə heç bir şəkildə aşağı deyil. Quraşdırma heç bir fayl tələb etmir, yalnız kod.

İstənilən dizayn tərzini seçin və lazımi xidmətləri əlavə edin. Bir az aşağı, bütün bunların səhifədə necə görünəcəyinə dair hazır nümunə göstəriləcək. Nişanlar böyük, orta və ya kiçik olaraq təyin edilə bilər. Həmçinin sayt və ya dairə üçün kvadrat nişanlar, bir sətirdə və ya iki sətirdə, üfüqi və ya şaquli. Sayğaclı və ya sayğacsız, fonsuz və ya veb saytınızın dizaynına uyğun olaraq fon qurun.

Bütün bu addımlardan sonra aşağıda səhifəyə daxil etmək üçün hazır kod olacaq. Əgər əsas səhifəyə daxil etmək lazımdırsa, biz index.php faylında gəzirik, əgər bütün yazılarınızdadırsa, yazı bitdikdən dərhal sonra kodu single.php faylına əlavə edirik.

WordPress

Bu kodda heç nə başa düşmürsənsə, nəyin harada və necə işlədiyini kopyalamaq lazımdır, bir çıxış yolu var. Bir WordPress mühərrikiniz varsa, sizə sosial media düymələri verəcək bir plagin quraşdıra bilərsiniz. Bu gün çox sayda belə plagin var. İdarəetmə panelinə keçin - Plugins. Siz dərhal "sosial düymələr", "sosial" və ya "VKontakte" plaginləri axtarışında yaza bilərsiniz. Əminəm ki, nəsə tapacaqsınız.

WordPress üçün bu cür oxşar plaginlərin əksəriyyəti arasında reytinqə baxsaq, bunlar ən çox qoyulanlardır:

  1. WordPress üçün Sosial Paylaşım Düymələri.
  2. sosial.
  3. Social Media Feather - yüngül sosial media paylaşma və izləmə düymələri.

Əslində, belə plaginlər çoxdur, hansını daha çox bəyəndiyinizi, düzgün işlədiyini, nəyi göstərdiyini və onu özünüz üçün necə fərdiləşdirə biləcəyinizi quraşdırmalı və çeşidləməlisiniz. WordPress üçün sosial paylaşma düymələri kimi ilk belə plagin nümunəsinə baxaq.

Pluginin özü rus dilindədir, bununla bağlı heç bir problem olmayacaq. Quraşdırıldıqdan sonra sol tərəfdəki menyuda yeni "Share Buttons" düyməsi görünəcək. Əsas parametrlərdə saytın loqosunu qoyub sosial düymələrin qarşısına mətn yazırıq.

Meta məlumatların yaradılmasını yandırdığınızdan əmin olun, səhifənin başlığı və təsviri daxil ediləcək. Düymələri üfüqi olaraq hizalayın və onların harada olacağını seçin. Yalnız postlarda seçirik. İsteğe bağlı olaraq, lazımi səhifələri istisna edə bilərsiniz. Ən aşağıda, tritterdə ləqəbi göstərməlisiniz.

Növbəti tabda, Paylaşım parametrləri, düymələrin üslubunu seçin. Aşağıda siz lazımsız sosial şəbəkələri yandıra və ya söndürə və yuxarıda və ya aşağıda bütün blok üçün abzaslar əlavə edə bilərsiniz. Heç bir yerə əlavə kod qoymağa ehtiyac yoxdur, plagin sizin üçün hər şeyi edəcək.

Hansı üsuldan istifadə edəcəyiniz seçim sizin ixtiyarınızdadır. Uptolike, Pluso və ya Yandex vasitəsilə sosial media nişanları əlavə edin. WordPress-də plagini dərhal quraşdırmamalı, hər şeyi əl ilə və ya xidmətin köməyi ilə etməyə çalışmalısınız.

Başqa yaxşı xidmət və ya sayt üçün sosial düymələr əlavə etmək üçün bir yol bilirsinizsə, şərhə görə minnətdar olacağam.

Yerli dizaynerlərin icmalı və veb-saytlar üçün sosial şəbəkə düymələri üçün skriptlər, eləcə də xarici analoqlar. Qısa, aydın və aydın şəkildə.

Veb sayt sosial media düymələri konstruktorları

2. Sayta keçid əldə etməyin asan yolu - QIP.RU
Saytınızda bir düymə yerləşdirin və ziyarətçilərə bəyəndikləri saytın məzmununu əlfəcinlərə, bloqlara və sosial şəbəkələrə əlavə etmək imkanı verin. Üç addım: düyməni harada yerləşdirmək (veb-sayt, Blogger və ya WordPress), düymə tərzi (hazır seçimlər) və düyməni əldə etmək.

3. Sosial şəbəkələrə məzmun əlavə etmək üçün düymələr - Pluso
Düymələri yerləşdirin və ziyarətçilərə öz sevimli səhifələrini sosial şəbəkələrdə paylaşmağa, həmçinin çap etmək, e-poçt göndərmək və əlfəcinlər əlavə etmək imkanı verin.

4. Sosial fəaliyyət xidməti - UpToLike
Rəng, forma, ölçü və xüsusi effektləri təyin etmək imkanı ilə fərdiləşdirilmiş sosial media düymələri. Əlavə xüsusiyyətlər PicShare şəkil paylaşma vidceti, "Sitat" funksiyası və fərdiləşdirilmiş İzləmə funksiyasıdır.

5. Bir düymə! - bütün əlfəcin xidmətləri və sosial şəbəkələr üçün
Baxış düyməsini seçin. Düymə harada quraşdırılacaq: vebsayt, Blogger və ya WordPress. Düymə əlavə edin.

Sayt üçün sosial şəbəkə düymələrinin skriptləri

1. Sayt üçün gözəl sosial düymələr - goodshare.js
Demək olar ki, hər hansı bir cihazda düymələri göstərin. Təmiz kod. Qısa sənədlər. SEO dostu.

2. Sosial əlfəcinlər və şəbəkələr üçün skript düymələri - Share42
Saytda istifadə etmək istədiyiniz xidmətlərin ölçüsünü seçin və nişanlarını qeyd edin. İstədiyiniz variantları seçin. Bunun necə görünəcəyinə baxın və / və ya hazır skripti endirin. Skripti WordPress saytında, Drupal və s.-də quraşdırın.

3. jQuery-dən istifadə edən Gözəl Sosial Bəyənmə Düymələri - Sosial Bəyənmələr
Facebook, Twitter, VKontakte, Odnoklassniki, My world, Google+ və Pinterest sosial şəbəkələr üçün eyni üslubda sayğacları olan düymə skriptini bəyənin.

Sayt üçün sosial şəbəkə düymələrinin xarici analoqları

1. Paylaş düymələri - AddThis
Paylaşma düymələri paylanmış məzmun vasitəsilə digər resurslardan və sosial şəbəkələrdən ziyarətçiləri cəlb etməklə saytın auditoriyasını artırmağa kömək edəcək.

4. Sosial Paylaşım - Po.st
Sosial media paylaşımlarından daha çox yararlanın. Xidmət ziyarətçilər üçün sosial şəbəkələrdə paylaşım prosesini asanlaşdıracaq ki, bu da saytın üzvi trafikini artıracaq.

5. İstənilən Vebsayt üçün Paylaşma Düymələri - AddToAny
İstənilən veb sayt üçün sosial media düymələri kodunu əldə edin. Düymələrin növünü və üslubunu seçin, e-poçt ünvanını və digər seçimləri göstərin və ya platformalardan birini seçin: WordPress, Drupal, Tumblr, Joomla, Elgg, WordPress.com, Blogger, TypePad və ya FeedFlare. Düymə kodunu alın.

saat 8:00 Mesajı redaktə edin 6 şərh

Salam əziz dostlar. Bugünkü məqalə xidmətlər və plaginlər olmadan sosial düymələr blokunun yaradılmasına həsr olunacaq. Və bu blokda həmçinin saytın ziyarətçilərinə səhifəni çap etməyə, məqalənin linkini elektron poçtla göndərməyə və məqalənizi işarələməyə imkan verən düymələr də olacaq. Belə düymələrə bu gün demək olar ki, hər bir saytda rast gəlmək olar. Yalnız indi onlar xidmətlər və ya plaginlərdən istifadə etməklə həyata keçirilir. Və bunu özünüz necə edəcəyinizi sizə göstərəcəyəm.

Müştəri saytlarında və bloqumda istifadə etdiyim xidmətlər - və . Bu xidmətlər tapşırığın həyata keçirilməsini olduqca asanlaşdırır.

Öz sosial düymələrinizin xidmətlər və plaginlərdən üstünlüyü nədir

  1. Təbii ki, mübahisəsiz amil saytın yüklənmə sürətidir. Beləliklə, məsələn, bloqda istifadə etdiyim PLUSO xidməti, ən yaxşı halda, yükə 633 millisaniyə əlavə edir.

Və bu blokda yalnız sosial düymələrin zəruri şəkilləri istifadə olunur, birləşdirilmişdir. Bütün üslublar minimum səviyyədə saxlanılır. Üstəlik sadə html çərçivəsi.

  1. Təklif etdiyim üsulda heç bir xarici keçid yoxdur. Xeyr, bağlantılar var, lakin hamısı daxili keçidlər kimi olacaq. İstəyirsinizsə, həmişə onlara sahib ola bilərsiniz. Və sonra onları heç görməyəcəksiniz.

  1. Çox asan quraşdırma. Blokun html kodunu sayt səhifəsinin mənbə koduna daxil etmək, sprite yükləmək, css üslublarını əlavə etmək kifayətdir və quraşdırma tamamlandı. Siz sadəcə düymənin şəkil faylının yolunu düzəltmək lazımdır.
  2. Bu element öz sosial düymələr bloku üçün nə müsbət, nə də mənfi deyil. Hiylə odur ki, öz blokunda düyməni basmaq sayğacı yoxdur. Və bunu mənfi hesab etmək olar. Amma, digər tərəfdən, hər düyməni taxmaq mümkündür və siz ziyarətçilərinizin neçə dəfə düymələrə basdığını və məqalələrinizi sosial şəbəkələrdə paylaşdığını dəqiq biləcəksiniz.
  3. Saytınızdakı xidmətlər tərəfindən toplanan statistika artıq üçüncü tərəflərə ötürülməyəcək.

Mənbə koduna sosial düymələr blokunun daxil edilməsi

Düymələr məqalədən sonra yerləşdikdə klassik versiyanı nəzərdən keçirəcəyik.

Bunu ya məqalələrin nümayişinə cavabdeh olan faylı (single.php) açmaq və mənbə koduna sosial düymələr bloku əlavə etməklə edə bilərsiniz. Alternativ olaraq, bu mövzunun funksiya faylı (functions.php) vasitəsilə edilə bilər.

Mən hər iki variantı göstərəcəyəm, siz özünüzə uyğun olanı seçin.

single.php mənbə koduna blokun daxil edilməsi

Xəbərdarlıq: Davam etməzdən əvvəl single.php faylının ehtiyat nüsxəsini çıxarın!

WordPress admin panelinin açılması "Görünüş""Redaktor""Tək giriş (single.php)".

Mənbə kodunda məqalənin çıxışının bitdiyi və şərhlərin və ya səhifələşdirmənin başladığı yeri axtarın. Məhz bu yerə sosial düymələr blokunun html kodunu daxil etməlisiniz.

Ekran görüntüsünə diqqətlə baxın, məqalənin çıxışından məsul olan kodlara diqqət yetirinvə şərhlər. Və aşağıdakı kodu yapışdırın.

Təbii ki, şablonlarınızda müəyyən fərqlər olacaq, amma əminəm ki, bunu başa düşəcəksiniz, burada mürəkkəb bir şey yoxdur. Bundan əlavə, ehtiyat nüsxəniz var, qorxmaq üçün heç bir şey yoxdur.

Sosial düymələr blokunun html kodu budur:

Kod izahatları: sosial şəbəkələrə keçidləri ehtiva edən .paylaşım sinfinə malik tək divdir. Link ayrıca açılan pəncərədə açılır, bu funksiya onClick=window.open buna cavabdehdir. Məqaləyə keçidin dəyişdirilməsi bu kodla həyata keçirilir. Hər bir keçidin öz sinfi var, onun vasitəsilə düymənin şəkli təyin olunur.

Bu, mənbə kodu vasitəsilə daxil etməyi tamamlayır. Və sonra css üslublarını əlavə etməlisiniz.

Mövzu funksiyaları vasitəsilə blokun single.php mənbə koduna daxil edilməsi

Xəbərdarlıq: başlamazdan əvvəl functions.php faylınızın ehtiyat nüsxəsini çıxarın!

Bu seçimdən istifadə etmək üçün siz functions.php faylını açmalı və bu kodu ən sonunda əlavə etməlisiniz:

/* Sosial düymələri daxil edin */əlavə_fəaliyyət("şərhlər_şablon","soc_button"); funksiya soc_button() ( ?> Və kodu daxil etdikdən sonra diqqətli olun, boşluqlar və ya digər simvollar olmamalıdır. Və ya sadəcə php kodunu bağlamaq?>. Əks halda sayt fəaliyyətini dayandıracaq.

Kod izahatları: sosial media düymələrinin yerləşdiriləcəyi yer API açarı comments_template ilə müəyyən edilir. Bu açar şərhlərdən əvvəlki yeri müəyyənləşdirir. Sosial düymə kodunun özü php-ni açmaq və bağlamaq üçün arxa etiketlərə əlavə edilmişdir. Kodda onları qırmızı ilə qeyd etdim. Bu, mövzu funksiyaları vasitəsilə php-yə html kodu daxil etməyin bütün hiyləsidir.

Bu və bu üsul bitdi, sayta şəkillər yükləməyə keçək.

Düymə şəkillərinin serverə yüklənməsi

Məsələn, sosial düymələrin təsvirləri olan bir neçə sprit hazırladım. Siz onları yükləyə bilərsiniz.

Nümunə kimi istifadə etdiyim sprite cəmi 3,97 kb-dır və yalnız lazımi düymələri ehtiva edir. Və bu bir sprite olduğundan, verilənlər bazasına yalnız bir sorğu var və hər bir düymə üçün ayrıca deyil.

Şəkilləri yükləyin və ya özünüz hazırlayın və saytınıza yükləyin. Məncə bu problem olmamalıdır. Bundan əlavə, css üslubları vasitəsilə düymələri dizayn etmək üçün bu sprite keçidi tələb olunacaq.

CSS üslubları daxil olmaqla

Əlbəttə ki, bu addımı çox əvvəl etmək olar, amma mən əvvəlcə bütün mürəkkəb texniki işləri görməyə, sonra isə css üslubları ilə gözəl kiçik şeylərə keçməyə üstünlük verirəm.

Beləliklə, saytınızın dizaynına cavabdeh olan style.css faylını açın. Və bu üslubları yapışdırın:

Paylaş a ( displey: inline-block; vertical-align: inherit; margin: 5px 0 0 2px; padding: 0px; font-size: 0px; en: 40px; hündürlük: 40px; fon: url("http://test" ..png ") təkrarsız sürüşdürmə 0px 0px şəffaf;) .paylaş a.vkontakte ( fon: url("http://test..png ") təkrarsız sürüşdürmə -168px 0px şəffaf; ) .paylaş a.google ( fon: url("http://test..png ") təkrarsız sürüşdürmə -252px 0px şəffaf; ) .livejournal paylaşın ( fon: url("http://test..png ") təkrarsız sürüşdürün -336px 0px şəffaf; ) .twitter a.paylaşın ( fon: url("http://test..png ") təkrarsız sürüşdürün -42px 0px şəffaf; ) .a.maili paylaşın ( fon: url("http ://test..png ") təkrarsız sürüşdürmə -294px 0px şəffaf; ) .odnoklassniki-ni paylaş ( fon: url("http://test..png ") təkrarsız sürüşdürmə -126px 0px şəffaf; ) .paylaşın a.pinterest ( fon: url("http://test..png ") təkrarsız sürüşdürün -210px 0px şəffaf; ) .a.liveinterneti paylaşın ( fon: url("http://test..png" ") təkrarsız sürüşdürmə -378px 0px şəffaf; ) .paylaşın a.evernote ( fon: url("http://test..png ") təkrarsız sürüşdürün -420px 0px şəffaf; ) .paylaşın a.bookmark ( fon: url("http://test.. png ") təkrarsız sürüşdürün -462px 0px şəffaf; ) .e-poçtu paylaşın (fon: url("http://test..png") təkrarsız sürüşdürün -504px 0px şəffaf; ) .paylaşın a.print ( fon: url("http://test..png") təkrarsız sürüşdürmə -546px 0px şəffaf; ) .paylaşın a.digg ( fon: url("http://test..png ") təkrarsız sürüşdürmə -588px 0px şəffaf; ) .paylaşın a.spring ( fon: url("http://test..png ") təkrarsız sürüşdürmə -630px 0px şəffaf; )

Kod izahatları:.share sinfi blokun ümumi görünüşünü, hər bir düymənin ölçüsünü, doldurulmasını müəyyən edir və vahid fon təyin edir. Və sonra hər bir keçidin öz sinfi var və hər bir belə linkə arxa fon xüsusiyyəti vasitəsilə düymənin görünüşü verilir. Düymələr css sprite kimi göstərilir və hər düymənin eni 40 piksel və hündürlüyü 40 pikseldir, onların arasında 2 piksel dolğunluq var ki, bu da hər düymə üçün təsviri dəqiq müəyyən etməyə imkan verir. Yəni birinci düymə 0, ikincisi isə 42 və s. Kodda bu dəyərlər narıncı rənglə göstərilmişdir. Sprite keçidi də narıncı rənglə vurğulanır, siz onu spritinizə gedən yola dəyişirsiniz.

Bu, sosial düymələr blokunuzun yaradılması prosesini tamamlayır. Yoxlamağa etibarlı şəkildə davam edə bilərsiniz.

Həm də mənim bütün prosesin vizual olaraq göstərildiyi bir video dərsliyim var, dirək düymələrin öz işini göstərir. Veb saytlarınızda və bloqlarınızda izləyin və tətbiq edin.


İndi hamısı budur. Tapşırığın öhdəsindən gəldi. Hamınıza uğurlar arzulayıram və yeni məqalələrdə və video dərslərdə görüşərik.

Səhv görsəniz, mətn parçasını seçin və Ctrl + Enter düyməsini basın
PAYLAŞ:
Kompüterlər və müasir qurğular