Шаблони за социални мрежи. HTML шаблони за социални мрежи. Нови HTML5 тагове

Здравейте, скъпи читатели на сайта на блога. Можете, разбира се, да използвате плъгин за тази задача, но Не е толкова трудно да го направите сами, и ще има по-малко от тях, особено след като вече имам много от тях работещи (вижте статията на предоставената връзка). Взех иконите на социалните мрежи, за които вече писах по-подробно (надявам се, че Dimox няма да възрази срещу това).

И също сметнах за подходящо да изпратя имейл.

Създаваме спрайт от бутони и вмъкваме Html кода в сайта

След като сте създали всички необходими групи и страници в социалните мрежи и следователно сте получили всички необходими връзки, можете да бъдете озадачени, като добавите бутони към сайта. Можете, разбира се, в съответствие с публикацията ми за, да изберете подходяща икона за всяка социална мрежа и, ако е необходимо, да намалите размера й до необходимия размер в и.

Но това не е най-добрият вариант. Защо? Е, защото за зареждане на всяко изображение в социалната мрежа ще бъде направена отделна заявка към вашия сървър. Ако имате дузина икони, това означава десет заявки, което във всеки случай ще създаде допълнително натоварване на сървъра и . Такова прахосничество не ни устройва, още повече че се случва отдавна.

Реших да не преоткривам колелото (да създам спрайт), а използвах този, създаден от конструктора Share42 (връзка към описание на работата с него е дадена точно по-горе). В него можете да изберете онези социални мрежи, чиито икони ще ви трябват, като заедно с кода ще получите и CSS спрайт, т.е. физически един графичен файл, върху който ще бъдат поставени всички икони на социални мрежи, от които се нуждаете, и абонаменти за RSS емисия (и имейл, ако е необходимо).

Избрах четири основни мрежи и няколко икони за абониране за новини с размер на иконата 24 на 24, така че моят спрайт изглежда така (въпреки че все още е заседнал там, но няма значение):

Вече разполагаме с всички необходими съставки – връзки към групи или страници в социални мрежи и икони за показването им в сайта. Остава само да го подготвите правилно, т.е. грим. Моят блог работи на WordPress, така че ще поставя кода с бутоните в един от . В моя случай се нарича sidebar.php. HTML кодтова се оказва изключително просто:

Е, и най-интересното. С наша помощ ние определяме коя област от нашия спрайт ще бъде показана на това конкретно място като фон (в нашия случай този фон се поставя под хипервръзката). Отнема много време, за да се обясни как се случва това, така че прочетете статията, свързана с линка и всичко ще стане ясно (дава и илюстративни примери). Ако сте мързеливи, тогава просто експериментирайте с числата, които, както може би сте забелязали, не напразно се делят на 24.

Да, качете спрайт файла чрез FTP на вашия уебсайт и посочете пътя до него () във фонов режим. Това е всичко. Ако не се получи, прочетете по-внимателно материалите на връзките по-горе, добре, и ако изобщо нищо не се получи, опишете ситуацията си в коментарите (подробно - за да вмъкнете кода, не забравяйте да го поставите в PHP тагове с квадратни скоби).

Късмет! Ще се видим скоро на страниците на сайта на блога

Може да се интересувате


 Идеята за организиране на интернет платформа, която да обедини хора с общи интереси, за да получат впоследствие добър трафик и въвеждане на система за платен абонамент, привлича много. За постигане на тази цел за кратко време е подходяща социална мрежа, изградена върху шаблон на WordPress, съвместим с плъгините BuddyPress и bbPress. Те предоставят пълната функционалност на социалната мрежа: създаване на профили, обмен на съобщения, добавяне на приятели, общуване във форума, съвместна работа по файлове и други опции.

10 шаблона за сайт на социална мрежа на WordPress + BuddyPress

1.Сладка дата

Шаблон за социална мрежа, предлагащ 2 демонстрации за сайт за запознанства и 1 за сайт за намиране на спътници. Сайтът на Sweet Date може да използва система с платен абонамент и да контролира достъпа до съдържание. Напълно адаптивният дизайн на темата гарантира, че когато посещават сайта на всяко устройство, посетителите получават същото потребителско изживяване.


2. Процъфтявайте

Шаблон за интранет и онлайн общности. Това е универсална платформа, която съчетава функционалността на социална мрежа, форум, системи за съобщения, организация на събития, управление на проекти и споделяне на файлове, електронна търговия и електронно обучение (ако закупите плъгина Learndash).


3. Приятел

Темата, разработена за Buddypress и bbPress, ви помага да създадете социална мрежа с модерен дизайн. Бъди използва адаптивно оформление, готово за Retina, и библиотека с шрифтове на икони Font Awesome. Шаблонът ви позволява лесно да добавяте уиджети към вашия сайт като: „Нови/популярни/активни потребители“, „Нови/популярни групи“, „Календар“, „Последни теми във форума“, „Статистика“, „Онлайн потребители“ .


4. Социализирайте се

Шаблонът се възползва максимално от възможностите на Buddypress, което го прави добра основа за общност или социална мрежа. Socialize напълно промени дизайна на bbPress, доближавайки го до класическия стил на форума. За да може уеб администраторът да постигне желания тип показване на съдържание, шаблонът включва 4 опции за оформление за главната страница, 9 за категории, 6 за публикации.


5. Клайн

Иновативна тема, предназначена да работи с BuddyPress и bbPress, направена със специално внимание към детайла. Подходящо за тези, които се нуждаят от онлайн общност или социална мрежа, поддържана от WordPress. Идеален за сайтове с голям брой регистрирани потребители. Чрез свързване с членове на общността.


6. КЛЕО

KLEO спечели титлата на най-продаваната тема на BuddyPress тази година, защото наистина оправдава очакванията. Шаблонът предлага прост с проверени вторични елементи. Темата използва вградено търсене, което не е включено в нито един друг шаблон и ви позволява да избегнете инсталирането на специални плъгини, което има благоприятен ефект върху скоростта на сайта.


7. Monstroid2

Универсален шаблон, последовател на легендарната тема Monstroid, изцяло пренаписан от нулата. Благодарение на съвместимостта си с плъгина BuddyPress, шаблонът позволява на уебмастърите да създадат сайт за социална мрежа или тематична онлайн общност без допълнителни усилия. Шаблонът предоставя 7 персонализирани стила на заглавка и поддържа мега менюта. Купувачът може да използва снимки от демонстрацията на своя уебсайт.


Първата най-популярна WordPress тема за интранет/екстранет общности. Woffice може да се използва за корпоративни и правителствени интранет/екстранет мрежи, обикновени интернет общности и социални мрежи, училище или други частни социални мрежи.


Нека да разгледаме някои теми на WordPress, създадени специално за социални медии.

1. Mingle – Многоцелева WordPress тема

Ако изграждате своята социална мрежа с помощта на BuddyPress, имате нужда от Mingle с неговите функции и дизайн. Разработен от елитния екип на Parallelus, Mingle е направен специално за платформата BuddyPress и се предлага с много страхотни функции.

Характеристики на тази тема:

  • редактор на поле за контакт
  • генератор на странична лента
  • Поддръжка на HTML5 + CSS3
  • Удобен за SEO код
  • блогове
  • портфолио
  • слайд шоу
  • кратки кодове
  • много други функции.

2. Отзивчив WordPress + тема BuddyPress

С пускането на Salutation е безопасно да се каже, че Parallelus разбира какво е необходимо за създаване на добър дизайн. На първо място, заслужава да се отбележи, че Salutation е 100% отзивчив продукт - вашата социална мрежа ще работи перфектно на различни мобилни устройства с всякакъв размер на екрана.

Освен това, Salutation има някои страхотни функции:

  • Революционен плъзгач
  • възможност за плъзгане и пускане
  • неограничен избор на цветове
  • изскачащи полета за влизане
  • лесни настройки
  • блогове
  • джаджи
  • интуитивен административен панел
  • генератор на странична лента
  • портфолио
  • Съвместим с BuddyPress
  • кратки кодове
  • много повече.

3. Woffice – Intranet/Extranet WordPress тема

Тази тема има много функции, широк набор от функции, включително високи стандарти за кодиране, редовни актуализации и отлична поддръжка. Можете да използвате Woffice за създаване на социални мрежи, вътрешни и външни мрежи или общности за училища, работни места, фирми и държавни агенции.

Характеристики на тази тема:

  • Поддръжка на функция BuddyPress
  • файлов мениджър
  • икони
  • чат и съобщения
  • форуми
  • Google шрифтове
  • адаптивен дизайн
  • демо версия
  • документация
  • видео уроци
  • календар
  • кратки кодове
  • bbPress
  • Поддръжка на WMPL
  • чист код
  • неограничен брой странични ленти
  • персонализирани джаджи
  • потребителски страници за вход
  • онлайн магазин.

4. Serpent – ​​​​Отзивчива тема за социална мрежа

Тази тема има толкова много функции, че вероятно никога няма да имате нужда от някои от тях. Serpent е единствена по рода си тема на WordPress, която може да изведе вашия уебсайт на следващото ниво. Просто е невъзможно да се направи нещо лошо с нея.

Разработчиците на тази тема са уважаваният екип на Cosmothemes.

Основни характеристики на темата:

Цената включва бъдещи актуализации и 6 месеца поддръжка.

5. UnitedCommunity – Тема на BuddyPress

UnitedCommunity е многофункционална WordPress тема за социални мрежи от уважавания екип на Diabolique. Това е нова тема, пусната на 2 септември 2015 г.

Неговите забележителни характеристики:

  • привличащ вниманието, уникален и отзивчив дизайн
  • повече от 40 вътрешни страници
  • джаджи на началната страница
  • лекота на инсталиране и конфигуриране
  • Съвместим с WooCommerce
  • персонализирани джаджи
  • изскачащи известия
  • Поддръжка на WPML
  • Google шрифтове
  • падащи менюта
  • много повече.

6. Klein – тема на общността Nitty Gritty

Ако търсите перфектната WordPress тема за вашата социална мрежа, не търсете повече от Klein. Предоставя на потребителите възможност да работят с напълно функционална социална мрежа и има широк набор от възможности.

Вашите потребители могат да изпращат неограничен брой съобщения, да споделят събития, да добавят контакти, да обсъждат идеи във форуми и да създават красиви потребителски профили. Можете да се възползвате от съвместимостта с WooCommerce на Klein и да продавате продукти на членовете на вашата мрежа. Освен това Klein поддържа WordPress 4.4, bbPress и BuddyPress, като ви дава възможност да превърнете своя WordPress сайт в популярна социална мрежа.

Други функции включват:

  • визуален редактор
  • персонализирани цветове
  • Революционен плъзгач
  • Съвместим с WPML
  • адаптивен дизайн
  • интуитивен административен панел
  • Удобен за SEO код
  • 6 различни заглавки + оформления
  • поддръжка на социални медии
  • 1000+ икони на шрифтове
  • известия
  • много други функции.

За да създадете мощна социална мрежа с WordPress, трябва да помислите за нещо повече от просто избор на плъгин и тема. Ще трябва да се погрижите и за избора на качествен хостинг, както и за популяризирането на вашия сайт в търсачките. Когато става въпрос за работа с добавки, първо опитайте различни опции и след това направете своя окончателен избор.

Забележка

Създаването на социална мрежа, базирана на WordPress, е лесен процес. Всичко, от което се нуждаете, е бизнес план, плъгин за социални медии и съвместима тема. Не забравяйте, че можете да изберете всяка тема и да я персонализирате по ваш вкус, но темите в социалните медии ще ви спестят време, като предлагат много опции.

През последните няколко години популярността на социалните мрежи скочи до безпрецедентни нива. Признатият лидер в тази област е, разбира се, Facebook. За него са разработени огромен брой различни приложения, които широко използват технологията.

Но ако вашите планове не включват изпреварване на Facebook или VKontakte по популярност, а вие просто искате създайте своя собствена социална мрежа или общност, подобно на Facebook, Vkontakte, Twitter или Google Plus - тогава този преглед е за вас.

Ще обмислим 15 скрипта за създаване на социална мрежа насъс стандартни функции за такива продукти, чатове, микроблогове а ла Twitter и други популярни функции, които несъмнено ще ви харесат. Изборът включва както платени, така и безплатни решения.

phpDolphin

Това платформа за създаване на социална мрежапредоставя почти същите функции като Facebook - чат на живо, изпращане на лични съобщения, коментари, споделяне на снимки и много други.
Цена: $43

LiveStreet CMS

Блогосоциална платформародно производство. В RuNet доста често има портали, изградени с негова помощ. Ако се опитате да опишете тази CMS накратко, това е един вид аналог на добре познатия Habrahabr. Смисълът на системата е следният: всеки потребител може да стане автор.
Цена: Безплатно

Boonex Dolphin

Boonex Dolphin е мощен CMS за създаване на социална мрежа. Арсеналът има огромен брой разширения, като: групи, съобщения, аудио и видео каталог, плакат, блогове, чат, файлов каталог и др. Можете също така да разширите стандартния набор от модули с платени, които могат да бъдат закупени на официалния сайт. Възможно е да персонализирате стила на вашите страници. Освен това разработчиците предоставят мобилни приложения, които се интегрират с вашия портал. CMS е платена, но има пробна версия за тестване.
От моя опит в работата с този двигател мога да кажа, че системата е мощна и относително стабилна, но изисква добър сървър, тъй като консумира много ресурси.
Цена: от $29/месец или от $599 за еднократна покупка (има пробна версия).

Социален бизнес

Социалният бизнес е Скрипт за социална мрежа за бизнесмени. Основната цел на този скрипт е да даде възможност на бизнесмените да намерят партньори. някои подобно на LinkedIn.
Цена: $32

Социална мрежа SocEuro

SocEuro е доста функционален скрипт за социална мрежас типичен набор от модули за този вид продукт. Яжте аудио записи като VKontakte, чатове, емисии, игри...
Цена: $43

Оксуол

Абсолютно безплатен скрипт за социални мрежиотворен код. Той има огромен брой същите безплатни и уникални добавки, които не могат да бъдат намерени дори в платени аналози: фотогалерия, видео каталог, блогове, форуми, уикита, групи, събития, приятели, сътрудничество, споделяне на файлове, видео конференции и т.н. .
Цена: Безплатно

Социален комплект

Почти всички функции, станали стандартни за социалните мрежи, са въплътени в платформата ScialKit: чат на живо, лични страници, съобщения и връзки, възможност за оставяне на коментари и харесвания, известия, хаштагове и споменавания.
Цена: $39

Pligg

Pligg е Безплатно, просто, но мощно решение за създаване на блог-социална мрежа или общност. Особеността е, че можете да създадете саморегулираща се общност. Потребителите сами решават кое е лошо и кое е добро. Това премахва нуждата от умереност. Habrahabr и LiveStreet CMS системата, която също присъства в тази колекция, работят с подобна философия.
Цена: Безплатно

Социовикторина

SocioQuiz е скрипт, който може да превърне вашия уебсайт в портал с голямо разнообразие от тестове, анкети и викторини. Осигурява пълна поддръжка за фото и видео съдържание, както и пълна свобода да използвате свое собствено. Има значително повече възможности в сравнение с подобни сайтове като Playbuzz, Buzzfeed и други.
Цена: $44

Приятелска социална мрежа

Приятелската социална мрежа е истинската социална мрежа за приятели. Има пълен набор от функции, необходими в този случай: лични страници, групи, чат на живо, коментари, харесвания, хаштагове, споменавания, известия. Има възможност за създаване на отделни профили за приятели и публични. Можете да контролирате показването на публикациите - видими за всички (обществени) или само за приятели. И това са само някои от функциите, които правят Friendly почти идеална платформа за създаване на ваша собствена общност.
Цена: $36