Қанша бөлісу түймелерін қосу керек? Әлеуметтік бөлісу түймелері – біз оны өзіміз жазамыз

Мен веб-сайтты жылжытуда SMO (әлеуметтік медианы оңтайландыру) маңыздылығын атап өттім. Енді веб-сайтыңызда әлеуметтік оңтайландыруды қалай жасауға болатыны туралы, дәлірек айтқанда, танымал желілердің әлеуметтік түймелерін веб-сайтыңызға қалай қосу керектігі туралы тікелей сөйлесейік.

Біріншіден, мен сізге оның сайтта қалай көрінетінін көрсетемін. Көптеген блогтар мен жаңалықтар сайттарында кез келген мақаланың төменгі жағында келесідей нәрсені көруге болады:

Бұл әлеуметтік түймелер, олардың арқасында SMO қол жеткізіледі, содан кейін әлеуметтік белсенділік. Бұл мақала осы әлеуметтік желілердің кодын қайдан алуға болады деген сұраққа арналған. түймелері және оларды веб-сайтыңызға қалай дұрыс орнату керек. Алдымен Google+ орнатуды қарастырайық.

1. Сайтқа Google+ түймешігін қосыңыз

2. Сайтқа ВКонтакте мен Facebook-тен «Ұнату» түймесін қосу 2.1. Маған бұл Facebook-тен ұнайды

Facebook түймешігінің кодын алудан бастайық. Ол үшін мына бетке кіріңіз: https://developers.facebook.com/docs/plugins/like-button. Сіз келесі суретті көруіңіз керек:

Жоғарғы оң жақта түйменің веб-сайтыңызда қандай болатынын көруге болады. Орнатуға болатын параметрлерді қарастырайық:

1. Ұнайтын URL мекенжайы
Бұл қосымша параметр. Егер сіз өрісті бос қалдырсаңыз, әр беттің жеке есептегіші болады. Ол жерге белгілі бір URL мекенжайын енгізсеңіз, есептегіш жалғыз болады (ұнатулар осы сайттың барлық беттерінен алынған).

2. Жіберу түймесі
Хабарларды жіберуге арналған түймені қосыңыз немесе жойыңыз. Мен бұл түймені алып тастауды ұсынамын, себебі... Біздің мақсатымыз жай ғана «ұнату» түймесін қою, бірақ сізде мүлде басқа мақсаттар болуы мүмкін.

3. Орналасу стилі
Түймелерді көрсету стилі. Өз басым маған стандарт ұнайды.

4. Ені
Түйменің пиксельдегі ені. Мен әдетте 100 пикселден аспайтын етіп орнатамын.

5. Көрсету етістігі
Түймеде не көрсетіледі: «Маған ұнайды» немесе «Мен ұсынамын». Мен әдетте бірінші опцияны (әдепкі) таңдаймын, себебі бұл пайдаланушыны ұнатуға ынталандырудың тиімді әдісі.

6. Түс схемасы
Түс диапазоны: ақ немесе қара.

7.Шрифт
«Маған ұнайды» жазуы үшін қаріпті орнату жеткілікті.

Параметрлерді орнатқаннан кейін «кодты алу» түймесін басып, оны сайтқа орналастырыңыз. Facebook үшін ортақ түйме коды:

(функция(d, s, id) ( var js, fjs = d.getElementsByTagName(s); егер (d.getElementById(id)) қайтарылады; js = d.createElement(s); js.id = id; js. src = "//connect.facebook.net/ru_RU/all.js#xfbml=1"; fjs.parentNode.insertBefore(js, fjs )(құжат, "скрипт", "facebook-jssdk") );

2.2. Маған ВКонтактедегі ұнайды Енді ВКонтакте-ден «ұнату» түймесін қалай алуға болатынын қарастырайық. Ол үшін келесі бетке өтіңіз: https://vk.com/dev

. Сіз келесі бетті көруіңіз керек:

Алдымен сізге жаңа сайт қосу керек. Ол үшін «сайт/бағдарлама» ашылмалы мәзірінен жаңа сайтты қосу опциясын таңдаңыз:

Жаңа сайт қосқаннан кейін оны сақтаңыз. Енді ашылмалы мәзірден қажетті сайтты таңдаңыз. Осыдан кейін параметрлердің аз саны: «түйме опциясы», «биіктігі», «түйменің аты» - мұның барлығы сіздің талғамыңызға сәйкес реттеледі. Соңында түйменің коды болады:

VK.init ((apiId: 2872188, onlyWidgets: true ));

VK.Widgets.Like («vk_like», (түрі: «түйме») );

3. Сайтқа твит түймешігін қосыңыз

Алдыңғы жағдайлардағыдай, алдымен түймені қабылдаған және конфигурациялаған орынға өтіңіз.

Friendfeed – нақты уақыт режимінде жұмыс істейтін әлеуметтік желілерден, блогтардан, микроблогтардан жиналған ақпарат агрегаторы. Friendfeed көмегімен сіз достарыңыздың Интернеттен табатын қызықты материалдарын тауып, талқылай аласыз!

Surfingbird - Интернеттегі ең қызықты мазмұнды ұсынатын қызмет. Ол үшін тіркеліп, қызығушылықтарыңызды көрсетуіңіз керек және өз кезегінде бұл қызмет көрсетілген қызығушылықтарға байланысты қызықты фотосуреттер, бейнелер, жазбалар ұсынады. Қызықты қызмет, мен оны мұқият қарауым керек!


Құрметті менің блогымның оқырмандары, ұсынылған соңғы төрт қызметте тіркелгі бар ма? Мені соңғысы қызықтырады, міндетті түрде тіркелемін!

Өз басым бірінші нұсқаны таңдадым, ол есептегіштер деп аталады. Ол жазбаның ұсыныстарының санын, басқаша айтқанда, постқа сілтеме қанша рет бөлісілгенін көрсетеді. Көрсету опциясын таңдағаннан кейін төмендегі кодты көшіру керек, ол блогта жариялануы керек.

Менің жағдайда («есептегіштер» дисплейін таңдағаныма байланысты) код келесідей болды:
Мазмұн - бұл хабарламаның мәтіні.
Бірақ егер сіз ұсынылған кодты жай реттесеңіз, сіз келесі дисплейді аласыз:
}

Мұндағы yashare-auto-init - кодпен бірге қосылған сынып. Margin:10px auto — сәйкесінше көлденең және тік жиек, ал text-align:center — нысанның ортаға қойылған орны.

Блогтың дамуы қарқын алуда, сыртқы түрі өзгеріп, жақсарып келеді, блог бірте-бірте қызықты мазмұнмен толығуда, блогтағы барлық өзгерістер мен жаңартулардан хабардар болу үшін блогқа жазылуға кеңес беремін.

Автордан: Сәлем. Бүгінде әлеуметтік желілердің дамығаны сонша, оларда барлығы 3 миллиардтан астам адам тіркелген. Бұл әлеуетті өте қуатты аудитория, сондықтан бүгін мен сізге веб-сайтыңызға әлеуметтік медиа түймелерін қалай қосу керектігін айтамын.

WordPress сайтына қосу

Егер сізде WordPress болса, ең оңай жолы осы мәселеге арналған кейбір плагинді орнату екенін айтудан бастайық. Қайсысы? Мысалы, мен Juiz Social Post Sharer қолданбасын қолдандым. Жалпы, плагин іздеуде әлеуметтік сөзді енгізіп, онда не бар екенін көріңіз. Мұндағы жалғыз артықшылық - сізге ештеңе конфигурациялаудың қажеті жоқ.

Яндекс сонымен қатар түймелерді өзіңіз баптауға және орнатуға болатын бетті әзірледі. Бұл бетте сіз өзіңізге қажетті қызметтерді таңдай аласыз (және олардың шамамен 25-і бар). Оң жақта блоктың сыртқы түрін таңдауға болады. Бұл пайдаланушылардың түймелерді қанша рет басқанын көрсететін есептегіштер болуы мүмкін. Бұл, өз кезегінде, материалдың оқырмандар үшін пайдалы екенін бақылауға көмектеседі.

JavaScript. Жылдам бастау

Әрине, үш опцияны пайдаланудың қажеті жоқ; Мен блоктың беттің басында да, соңында да болған сайттарды көрдім.

Енді мақалаларды көрсететін кодты файлды табу керек. Мысалы, wordpress-те ол әдетте single.php немесе ұқсас деп аталады. Сонымен, мақаладан кейін түймелері бар блок қою керек болса, the_content жолын іздеңіз. Бұл жерде кодты қоюға болады. Үлгіңізді әзірлеуші ​​кодқа түсініктемелер жасаған болса, бұл сізге көп көмектеседі.

Сайт файлдарын бірнеше жолмен өңдеуге болады. Мысалы, мұны қозғалтқыштың басқару тақтасы (сыртқы түрі - редактор) арқылы тікелей орындаңыз. Бұл жағдайда код ерекшеленбейді, сондықтан оны шарлау соншалықты ыңғайлы емес. Басқа әдіс - ftp арқылы. FTP клиенті арқылы сайтқа қосылыңыз, wp-content – ​​тақырыптарға өтіңіз. Мұнда қазір сіз үшін белсенді үлгіні табу керек. Біз оған кіріп, сол single.php файлын табамыз немесе атауында ұқсас нәрсені іздейміз.

Код файлының өзінде іздеу арқылы the_content жолын табыңыз (Ctrl + F). Осы кодты одан кейін бір жерге қойыңыз.

Түсініктемелер жоғарыдағы осы скриншотта жасыл түспен белгіленген. Көріп отырғаныңыздай, әзірлеуші ​​​​бұл жерде мақала мәтінінің өзі көрсетілетінін нақты көрсетті. Бұл тамаша, мақаладан кейін бірден кодты қойып, қажетті нәтижеге қол жеткізіңіз.

Pluso түймелері

JavaScript. Жылдам бастау

Веб-қосымшаны жасаудың практикалық мысалы арқылы JavaScript негіздерін үйреніңіз.

Сіз түймелердің стилін таңдай аласыз, олардың фонын, орнын және өлшемін реттей аласыз. Сондай-ақ кірістірілген есептегіші бар белгішелерді таңдауға болады. Pluso түймелерінің тағы бір артықшылығы - олардың керемет көрінісі және оларды кез келген дерлік дизайнға біріктіру мүмкіндігі.

Барлығы конфигурацияланған кезде, біз жай ғана кодты көшіріп, оны сәйкес блокты көргіміз келетін жерге қоямыз.

Басқа опция - Share42

Алдыңғы опциялар сізге ұнамаса, сайтқа әлеуметтік желі түймелерін қосудың тағы бір жолы бар. Бұл share42.com қызметі. Ол осылай аталды, себебі ол құрылған кезде 42 әлеуметтік қызмет түймесі болғанымен, қазіргі уақытта олардың саны 43.

Мен процесті егжей-тегжейлі сипаттамаймын, өйткені бәрі веб-сайтта қадамдық нұсқаулар түрінде ұсынылған. Бұл белгішелердің дизайнын өзгерту мүмкін емес, тек өлшемі. Дегенмен, олар жаман емес көрінеді.

Қажетті белгішелерді тінтуірдің көмегімен басу арқылы таңдау керек. Браузердің таңдаулыларына қосу, RSS сілтемесі және «Басына оралу» түймесі сияқты қызықты мүмкіндіктердің болуын бөлек атап өткім келеді.

Әрі қарай, панельдің түрін таңдауға болады: көлденең немесе тік пе? Ал екіншісі таңдалса, түймелердің санын шектеуге болады. Мен кодтауды UTF-8 ретінде қалдыруды ұсынамын. Сондай-ақ, сіздің бетіңіздегі пайдаланушылар оған өтіп, осы түймелерді өздері орната алатындай етіп түймелер жинағына қызметтің белгішесін қосуға болады.

Сондай-ақ, rss белгішесін қосуды жоспарласаңыз, арнаңыздың мекенжайын көрсетуіңіз керек, ал түймені басу санын көрсеткіңіз келсе, соңғы екі құсбелгіні қою керек.

Төменде 2 түйме бар. Біріншісі конфигурацияланған әлеуметтік түймелердің қандай болатынын көруге мүмкіндік береді. Екіншісін пайдаланып, сценарий жүктеледі. Сіз оны ftp арқылы веб-сайтыңызға түбірлік қалтаға жүктеп салуыңыз керек.

Келесі қадам қызмет бетінде осы қалтаға жолды көрсету болып табылады. Көбінесе site.com сайтын домендік атпен ауыстыру жеткілікті. Мұның бәрі кодты енгізу, алдымен ресурс жұмыс істейтін cms-ті таңдау ғана қалады. Сіз кодты қайда енгізу керектігін түсінуіңіз керек, деп үміттенемін.

Әлеуметтік түймелерді жасауға болатын бірнеше қалыпты қызметтердің бар екеніне күмәнім жоқ, сонымен қатар оларды қосатын көптеген сценарийлер мен плагиндер бар. Бүгін мен сіз үшін ең жақсы нұсқаларды тізімдедім, менің ойымша.

Бүгін біз Интернет-жобаңызға әлеуметтік желілер мен қызметтерге арналған түймелерді қалай қосу керектігін білдік. Енді сіздің пайдалы материалдарыңызды риза оқырмандарыңыз әлеуметтік желілерде автоматты түрде тарата алады. Мұның бәрі мен үшін.

JavaScript. Жылдам бастау

Веб-қосымшаны жасаудың практикалық мысалы арқылы JavaScript негіздерін үйреніңіз.

Мұнда «Кім науқанға 8% жеңілдікпен бағдарламалық құралды сатып алғысы келеді?» деген сөйлем бар. қолданушының өзі жазған және төменде сайтқа сілтеме әлеуметтік желіде қалай көрінетіні көрсетілген. Өте әдемі емес, иә?


содан кейін әлеуметтік желідегі сілтеме келесідей болады:

Мұнда «Бүгін allsoft.ru-ның туған күні - 8 жыл :)» - бұл пайдаланушы жазған мәтін, қалғаны мета тегтердегі ақпарат. Сіз бұл метатегтер туралы көбірек Facebook парақшасында developers.facebook.com/docs/share оқи аласыз, басқа әлеуметтік желілер де оларды жақсы түсінеді.

Бұл механизм жалпы қалай жұмыс істейді:
1. Пайдаланушы түймені басқанда, виджет бетке сілтемені әлеуметтік желі серверіне жібереді.
2. Әлеуметтік сервер Желінің өзі осы сілтемеге кіріп, бет туралы ақпаратты оқиды - тақырып, сипаттама, сурет.
3. Әлеуметтік сервер желі бет ақпаратын өз жағында кэштейді және оны әлеуметтік желі беттерінде көрсетеді

Бір бетке әртүрлі сипаттамаларды қалай жіберуге болады.
Мысалы, allsoft.ru сайтында күлкілі тесті бар жарнамалық бетті жасаған кезде, тестте пайдаланушы жинаған ұпайлардың әртүрлі саны үшін әлеуметтік желіге әртүрлі сипаттамаларды жіберу қажет болды. Әлеуметтік желі сілтемені басу арқылы беттің сипаттамасын алатындықтан, әртүрлі сипаттамалар үшін әртүрлі сілтемелер қажет. Сонымен қатар, Twitter тек 140 таңбаға рұқсат береді, сондықтан оған бөлек, қысқарақ сипаттама қажет.

New Ya.share(( элемент: "ya_share_normal", elementStyle: ( "түрі": "жоқ", "quickServices": ["facebook","twitter","odnoklassniki","vkontakte","moimir"] ), сілтеме: "http://allsoft.ru/promo/allsoft8let/?share=normal", serviceSpecific: ( twitter: ( тақырыбы: "Тест нәтижесі: Айдаһар сіздің күшті тұсыңыз дерлік! Сіз әлі драгонологияны үйрете алмайсыз, бірақ дұрыс жолда!")))
1. Мұнда ya_share_normal - беттегі элементтің идентификаторы (), онда әлеуметтік түймелері бар блок пайда болады, сілтеме - сілтеме, сонымен қатар Twitter үшін арнайы қызметте біз тақырыпты көрсетеміз, ол og-тағыдан ерекшеленеді: тақырып мета тегі.

Осылайша, «3 түрлі сынақ нәтижесі және сынақтан тыс бетке ортақ сілтеме» тапсырмасы үшін бізде 4 тег болады:

және жоғарыдағыдай JavaScript кодының 4 блогы.

Әлеуметтік желі кэштелген тақырып пен сипаттаманы қалай өзгертуге болады.
1. Facebook үшін ең жақсы әдіс бар: олардың отладкасына өтіңіз

Мәселе біреуге беруге болатын нәрселердің тізімін кеңейтуде емес. Қазіргі уақытта ол орташа iPhone немесе iPad иелерін қызықтыратын деректердің барлық дерлік түрлерін қамтиды. Яғни, электрондық поштаға, суреттерге, бейнелерге және музыкаға қосымша, сіз навигациялық координаттарды, контактілер мен мекенжайлар тізімдерін, тақырыптық ресурстарға және «бұлттардағы» нақты файлдарға сілтемелерді, жедел хабаршылар көмегімен жасалған қысқа мультимедиялық жазбаларды және т.б. жіберуге болады. Идеяны былай тұжырымдау дұрысырақ болар еді: өзінің деректер пішімін пайдаланатын жаңа қызмет пайда болғанда, оған жүйеде орын бөлу керек, бірақ әзірге бәрі теңдестірілген.

Дегенмен, Apple iOS қолданбаларының әлемі міндетті түрде дамитынын түсінеді, сондықтан мұндай стандартты емес жаңадан келгендердің пайда болуы уақыт мәселесі. Бәлкім, Купертино қосымша ауыртпалықтан арылуға және қосымша авторларына «бөлісу» функцияларын өздері енгізуге нұсқау беруді шешті. Apple-мен келісімге отырудың қатаң талабы өткеннің еншісінде қалды, API интерфейстері ашылды - оған барыңыз, ынталы инноваторлар. Бұл әлеуметтiк бағдарланған бағдарламаларды жасаушылар үшiн әлеуеттi ең перспективалы жұмыс саласы, бiрақ нәтиже үшiн жауапкершiлiк те оларды алаңдатады.

Пошта, Хабарламалар, Фото бөлісу сияқты компанияның жеке өнімдері үшін ғана ерекшелік жасалады - олар әрқашан белсенді болып қалады. Дегенмен, біз әлі бета нұсқасы туралы айтып жатқандықтан, бұл және басқа да жаңалықтар қыркүйекке дейін өзгеруі мүмкін.



Бөлісу