Šablóny pre sociálne siete. HTML šablóny pre sociálne siete. Nové značky HTML5

Dobrý deň, milí čitatelia blogu. Na túto úlohu môžete samozrejme použiť plugin, ale Nie je to také ťažké urobiť sami, a bude ich menej, najmä preto, že ich už veľa funguje (pozri článok na uvedenom odkaze). Vzal som si ikony sociálnych sietí, o ktorých som už písal dosť podrobne (dúfam, že Dimox proti tomu nebude namietať).

A tiež som považoval za vhodné poslať email.

Z tlačidiel vytvoríme sprite a do stránky vložíme Html kód

Po vytvorení všetkých potrebných skupín a stránok na sociálnych sieťach, a teda získaní všetkých potrebných odkazov, môžete byť zmätení pridaním tlačidiel na stránku. Pre každú sociálnu sieť si samozrejme môžete v súlade s mojím príspevkom o vybrať vhodnú ikonu a prípadne zmenšiť jej veľkosť na požadovanú veľkosť v a.

Ale to nie je najlepšia možnosť. prečo? Pretože na načítanie každého obrázka sociálnej siete bude na váš server odoslaná samostatná požiadavka. Ak máte tucet ikon, znamená to desať požiadaviek, ktoré v každom prípade spôsobia dodatočné zaťaženie servera a . Takáto márnotratnosť nám nevyhovuje, o to viac, že ​​sa to deje už dlho.

Rozhodol som sa nevynájsť koleso (vytvoriť sprite), ale použil som to, ktoré vytvoril konštruktor Share42 (odkaz na popis práce s ním je uvedený vyššie). V ňom si vyberiete tie sociálne siete, ktorých ikony budete potrebovať a spolu s kódom dostanete CSS sprite, t.j. fyzicky jeden grafický súbor, na ktorom budú umiestnené všetky potrebné ikony sociálnych sietí a prihlásenia na odber RSS kanála (a e-mail, ak je to potrebné).

Vybral som štyri hlavné siete a pár ikon na odber noviniek s veľkosťou ikony 24 x 24, takže môj sprite vyzerá takto (aj keď je tam stále, ale na tom nezáleží):

Teraz máme všetky ingrediencie – odkazy na skupiny alebo stránky sociálnych sietí a ikony na ich zobrazenie na webe. Ostáva už len to všetko správne pripraviť, t.j. makeup. Môj blog beží na WordPresse, takže kód s tlačidlami vložím do jedného z . V mojom prípade sa volá sidebar.php. HTML kód toto sa ukazuje ako veľmi jednoduché:

No a to najzaujímavejšie. S našou pomocou určíme, ktorá oblasť nášho sprite sa na tomto konkrétnom mieste zobrazí ako pozadie (v našom prípade je toto pozadie umiestnené pod hypertextovým odkazom). Vysvetlenie, ako sa to deje, trvá veľmi dlho, preto si prečítajte článok prepojený s odkazom a všetko bude jasné (uvádza aj názorné príklady). Ak ste leniví, potom už len experimentujte s číslami, ktoré, ako ste si mohli všimnúť, nie sú deliteľné 24 nadarmo.

Áno, nahrajte súbor sprite cez FTP na vašu webovú stránku a uveďte cestu k nemu () na pozadí. To je všetko. Ak to nevyjde, prečítajte si pozornejšie materiály na vyššie uvedených odkazoch, dobre, a ak vôbec nič nefunguje, popíšte svoju situáciu v komentároch (podrobne - pre vloženie kódu ho nezabudnite priložiť do PHP značky s hranatými zátvorkami).

Veľa šťastia! Uvidíme sa čoskoro na stránkach blogu

Mohlo by vás to zaujímať


Myšlienka zorganizovať internetovú platformu na zjednotenie ľudí so spoločnými záujmami s cieľom následne získať dobrú návštevnosť a zaviesť systém plateného predplatného, ​​priťahuje mnohých. Na dosiahnutie tohto cieľa v krátkom čase je vhodná sociálna sieť postavená na šablóne WordPress kompatibilnej s pluginmi BuddyPress a bbPress. Poskytujú plnú funkčnosť sociálnej siete: vytváranie profilov, výmena správ, pridávanie priateľov, komunikácia na fóre, spolupráca na súboroch a ďalšie možnosti.

10 šablón pre stránku sociálnej siete na WordPress + BuddyPress

1. Sladké rande

Šablóna pre sociálnu sieť, ktorá ponúka 2 ukážky pre zoznamku a 1 pre stránku na hľadanie spoločníkov na cesty. Stránka na Sweet Date môže používať systém plateného predplatného a kontrolovať prístup k obsahu. Plne responzívny dizajn témy zabezpečuje, že pri návšteve stránky na akomkoľvek zariadení získajú návštevníci rovnakú používateľskú skúsenosť.


2. Prospievať

Šablóna pre intranet a online komunity. Ide o univerzálnu platformu, ktorá kombinuje funkčnosť sociálnej siete, fóra, messagingových systémov, organizácie podujatí, projektového manažmentu a zdieľania súborov, e-commerce a e-learningu (ak si zakúpite plugin Learndash).


3. Kamarát

Téma vyvinutá pre Buddypress a bbPress vám pomôže vytvoriť sociálnu sieť s moderným dizajnom. Buddy používa responzívne rozloženie Retina Ready a knižnicu fontov ikon Font Awesome. Šablóna vám umožňuje jednoducho pridať widgety na vašu stránku, ako napríklad: „Noví/populárni/aktívni používatelia“, „Nové/populárne skupiny“, „Kalendár“, „Najnovšie témy na fóre“, „Štatistika“, „Online používatelia“ .


4. Socializujte sa

Šablóna maximálne využíva možnosti Buddypress, vďaka čomu je dobrým základom pre komunitu alebo sociálnu sieť. Socialize úplne zmenil dizajn bbPress a priblížil ho klasickému štýlu fóra. Aby správca webu dosiahol požadovaný typ zobrazenia obsahu, šablóna obsahuje 4 možnosti rozloženia pre hlavnú stránku, 9 pre kategórie, 6 pre príspevky.


5. Klein

Inovatívna téma navrhnutá pre prácu s BuddyPress a bbPress, vyrobená s osobitným dôrazom na detail. Vhodné pre tých, ktorí potrebujú online komunitu alebo sociálnu sieť poháňanú WordPress. Ideálne pre stránky s veľkým počtom registrovaných užívateľov. Spojením sa s členmi komunity.


6. KLEO

KLEO si vyslúžilo titul tohtoročnej najpredávanejšej témy BuddyPress, pretože skutočne napĺňa očakávania. Šablóna ponúka jednoduchú s overenými sekundárnymi prvkami. Téma využíva vstavané vyhľadávanie, ktoré nie je zahrnuté v žiadnej inej šablóne a umožňuje vyhnúť sa inštalácii špeciálnych pluginov, čo má priaznivý vplyv na rýchlosť stránky.


7. Monstroid2

Univerzálna šablóna, nasledovník legendárnej Monstroidovej témy, úplne prepísaná od základov. Šablóna vďaka svojej kompatibilite s doplnkom BuddyPress umožňuje webmasterom vytvoriť stránku sociálnej siete alebo tematickú online komunitu bez akéhokoľvek ďalšieho úsilia. Šablóna poskytuje 7 vlastných štýlov hlavičky a podporuje mega ponuky. Kupujúci môže použiť obrázky z ukážky na svojej webovej stránke.


Prvá najobľúbenejšia téma WordPress pre intranetové/extranetové komunity. Woffice je možné použiť pre firemné a vládne intranetové/extranetové siete, bežné internetové komunity a sociálne siete, školské či iné súkromné ​​sociálne siete.


Poďme sa pozrieť na niektoré WordPress témy vytvorené špeciálne pre sociálne médiá.

1. Mingle – viacúčelová téma WordPress

Ak budujete svoju sociálnu sieť pomocou BuddyPress, potrebujete Mingle s jeho funkciami a dizajnom. Mingle, vyvinutý elitným tímom Parallelus, je ušitý na mieru pre platformu BuddyPress a prichádza s množstvom skvelých funkcií.

Vlastnosti tejto témy:

  • editor poľa kontaktu
  • generátor bočného panela
  • Podpora HTML5 + CSS3
  • SEO priateľský kód
  • blogy
  • portfólio
  • prezentáciu
  • skrátené kódy
  • mnoho ďalších funkcií.

2. Responzívny pozdrav WordPress + téma BuddyPress

S vydaním Salutation možno s istotou povedať, že Parallelus rozumie tomu, čo je potrebné na vytvorenie dobrého dizajnu. V prvom rade stojí za zmienku, že Salutation je 100% responzívny produkt – vaša sociálna sieť bude perfektne fungovať na rôznych mobilných zariadeniach s akoukoľvek veľkosťou obrazovky.

Pozdrav má navyše niekoľko skvelých funkcií:

  • Posuvník revolúcie
  • schopnosť drag and drop
  • neobmedzený výber farieb
  • vyskakovacie prihlasovacie polia
  • jednoduché nastavenia
  • blogy
  • miniaplikácie
  • intuitívny administračný panel
  • generátor bočného panela
  • portfólio
  • Kompatibilné s BuddyPress
  • skrátené kódy
  • oveľa viac.

3. Woffice – Intranet/Extranet WordPress Téma

Táto téma má veľa funkcií, širokú škálu funkcií vrátane vysokých štandardov kódovania, pravidelných aktualizácií a vynikajúcej podpory. Woffice môžete použiť na vytváranie sociálnych sietí, interných a externých sietí alebo komunít pre školy, pracoviská, podniky a vládne agentúry.

Vlastnosti tejto témy:

  • Podpora funkcií BuddyPress
  • Správca súborov
  • ikony
  • chat a správy
  • fóra
  • Písma Google
  • responzívny dizajn
  • demo verzia
  • dokumentáciu
  • video lekcie
  • kalendár
  • skrátené kódy
  • bbPress
  • podpora WMPL
  • čistý kód
  • neobmedzený počet bočných panelov
  • vlastné widgety
  • prihlasovacie stránky používateľov
  • internetový obchod.

4. Had – Responzívna téma sociálnej siete

Táto téma má toľko funkcií, že niektoré z nich pravdepodobne nikdy nebudete potrebovať. Had je jedinečná téma WordPress, ktorá môže posunúť váš web na ďalšiu úroveň. Je jednoducho nemožné s ňou niečo pokaziť.

Vývojármi tejto témy je úctyhodný tím Cosmothemes.

Hlavné charakteristiky témy:

Cena zahŕňa budúce aktualizácie a 6-mesačnú podporu.

5. UnitedCommunity – BuddyPress Theme

UnitedCommunity je multifunkčná téma WordPress pre sociálne siete od seriózneho tímu Diabolique. Toto je nová téma zverejnená 2. septembra 2015.

Jeho pozoruhodné vlastnosti:

  • pútavý, jedinečný a citlivý dizajn
  • viac ako 40 interných strán
  • widgety na domovskej stránke
  • jednoduchosť inštalácie a konfigurácie
  • Kompatibilné s WooCommerce
  • vlastné widgety
  • vyskakovacie upozornenia
  • podpora WPML
  • Písma Google
  • rozbaľovacie ponuky
  • oveľa viac.

6. Klein – Nitty Gritty Community Theme

Ak hľadáte perfektnú tému WordPress pre svoju sociálnu sieť, nehľadajte ďalej ako Klein. Používateľom poskytuje možnosť pracovať s plne funkčnou sociálnou sieťou a má široké možnosti.

Vaši používatelia môžu posielať neobmedzené množstvo správ, zdieľať udalosti, pridávať kontakty, diskutovať o nápadoch na fórach a vytvárať krásne používateľské profily. Môžete využiť kompatibilitu Klein's WooCommerce a predávať produkty členom vašej siete. Klein navyše podporuje WordPress 4.4, bbPress a BuddyPress, čo vám dáva možnosť premeniť váš web WordPress na populárnu sociálnu sieť.

Medzi ďalšie funkcie patrí:

  • vizuálny editor
  • vlastné farby
  • Posuvník revolúcie
  • Kompatibilné s WPML
  • responzívny dizajn
  • intuitívny administračný panel
  • SEO priateľský kód
  • 6 rôznych hlavičiek + rozloženia
  • podpora sociálnych médií
  • 1000+ ikon písma
  • upozornenia
  • mnoho ďalších funkcií.

Ak chcete vytvoriť výkonnú sociálnu sieť s WordPress, musíte myslieť na viac ako len na výber pluginu a témy. Postarať sa budete musieť aj o výber kvalitného hostingu, ako aj propagáciu vašej stránky vo vyhľadávačoch. Pokiaľ ide o prácu s doplnkami, najprv vyskúšajte rôzne možnosti a potom urobte konečný výber.

Poznámka

Vytvorenie sociálnej siete založenej na WordPress je jednoduchý proces. Všetko, čo potrebujete, je podnikateľský plán, doplnok sociálnych médií a kompatibilná téma. Pamätajte, že si môžete vybrať ľubovoľnú tému a prispôsobiť ju podľa svojich predstáv, ale témy sociálnych médií vám ušetria čas tým, že ponúkajú veľa možností.

Za posledných pár rokov popularita sociálnych sietí vystrelila na nebývalú úroveň. Uznávaným lídrom v tejto oblasti je samozrejme Facebook. Bolo vyvinutých obrovské množstvo rôznych aplikácií, ktoré túto technológiu široko využívajú.

Ak však vaše plány nezahŕňajú predbiehanie Facebooku alebo VKontakte v popularite a vy len chcete vytvorte si vlastnú sociálnu sieť alebo komunitu, podobne ako Facebook, Vkontakte, Twitter alebo Google Plus - potom je táto recenzia pre vás.

zvážime 15 skriptov na vytvorenie sociálnej siete na so štandardnými funkciami pre takéto produkty, chaty, mikroblogy a la Twitter a ďalšie obľúbené funkcie, ktoré si nepochybne obľúbite. Výber zahŕňa platené aj bezplatné riešenia.

phpDolphin

Toto platforma na vytvorenie sociálnej siete poskytuje takmer rovnaké funkcie ako Facebook – live chat, posielanie súkromných správ, komentárov, zdieľanie fotografií a mnoho ďalšieho.
Cena: 43 dolárov

LiveStreet CMS

Blogosociálna platforma domácej produkcie. V RuNet sú pomerne často portály, ktoré boli postavené s jeho pomocou. Ak sa pokúsite opísať tento CMS v skratke, je to druh obdoba známeho Habrahabra. Zmysel systému je tento: každý používateľ sa môže stať autorom.
Cena: zadarmo

Delfín Boonex

Boonex Dolphin je silný CMS na vytvorenie sociálnej siete. Arzenál má obrovské množstvo rozšírení, ako sú: skupiny, oznámenia, audio a video katalóg, plagát, blogy, chat, katalóg súborov atď. Štandardnú sadu modulov môžete rozšíriť aj o platené, ktoré je možné zakúpiť oficiálnej webovej stránke. Je možné prispôsobiť štýl vašich stránok. Okrem toho vývojári poskytujú mobilné aplikácie, ktoré sa integrujú s vaším portálom. CMS je spoplatnený, ale existuje skúšobná verzia na testovanie.
Z mojej skúsenosti s prácou s týmto motorom môžem povedať, že systém je výkonný a relatívne stabilný, ale vyžaduje si dobrý server, keďže spotrebúva veľa zdrojov.
Cena: od 29 USD/mesiac alebo od 599 USD za jednorazový nákup (existuje skúšobná verzia).

Sociálne podnikanie

Sociálne podnikanie je skript sociálnej siete pre podnikateľov. Hlavným cieľom tohto skriptu je umožniť podnikateľom nájsť si partnerov. Niektorí podobne ako LinkedIn.
Cena: 32 dolárov

Sociálna sieť SocEuro

SocEuro je celkom funkčný skript sociálnej siete s typickou sadou modulov pre tento druh produktu. Jedzte zvukové nahrávky ako VKontakte, chaty, informačné kanály, hry...
Cena: 43 dolárov

Oxwall

Absolútne bezplatný skript sociálnej siete open source. Má obrovské množstvo rovnakých bezplatných a jedinečných doplnkov, ktoré nemožno nájsť ani v platených analógoch: fotogaléria, katalóg videí, blogy, fóra, wiki, skupiny, udalosti, priatelia, spolupráca, zdieľanie súborov, videokonferencie atď. .
Cena: zadarmo

Socialkit

Takmer všetky funkcie, ktoré sa stali štandardom pre sociálne siete, sú stelesnené v platforme ScialKit: live chat, osobné stránky, správy a odkazy, možnosť zanechať komentáre a lajky, upozornenia, hashtagy a zmienky.
Cena: 39 dolárov

Pligg

Pligg je zadarmo, jednoduché, ale výkonné riešenie pre vytvorenie blogu-sociálnej siete alebo komunity. Zvláštnosťou je, že dokážete vytvoriť samoregulačné spoločenstvo. Používatelia sami rozhodujú o tom, čo je zlé a čo je dobré. Tým odpadá potreba striedmosti. S podobnou filozofiou pracuje aj Habrahabr a systém LiveStreet CMS, ktorý je prítomný aj v tejto kolekcii.
Cena: zadarmo

SocioQuiz

SocioQuiz je skript, ktorý dokáže premeniť vašu webovú stránku na portál širokej škály testy, prieskumy a kvízy. Poskytuje plnú podporu pre obsah fotografií a videí, ako aj úplnú slobodu pri používaní vlastného obsahu. Má výrazne viac možností v porovnaní s podobnými stránkami, ako sú Playbuzz, Buzzfeed a ďalšie.
Cena: 44 dolárov

Priateľská sociálna sieť

Priateľská sociálna sieť je tá pravá sociálna sieť pre priateľov. Má kompletnú sadu funkcií potrebných v tomto prípade: osobné stránky, skupiny, live chat, komentáre, lajky, hashtagy, zmienky, upozornenia. Je možné vytvoriť samostatné profily pre priateľov a verejné. Môžete ovládať zobrazovanie príspevkov – viditeľné pre všetkých (verejné), alebo len pre priateľov. A to sú len niektoré z funkcií, vďaka ktorým je Friendly takmer ideálnou platformou na vytváranie vlastnej komunity.
Cena: 36 dolárov