Templates for social network. HTML templates for social networks. New HTML5 tags

Hello, dear readers of the blog site. You can, of course, use a plugin for this task, but It's not that hard to do it yourself, and there will be fewer of them, especially since I already have a lot of them working (see the article at the link provided). I took the social network icons from, which I already wrote about in some detail (I hope that Dimox will not object to this).

And I also considered it appropriate to send an email.

We create a sprite from buttons and insert the Html code into the site

After you have created all the necessary groups and pages on social networks, and therefore received all the necessary links, you can be puzzled by adding buttons to the site. You can, of course, in accordance with my post about, select a suitable icon for each social network and, if necessary, reduce its size to the required size in and.

But this is not the best option. Why? Well, because to load each social network image, a separate request will be made to your server. If you have a dozen icons, that means ten requests, which in any case will create additional load on the server and . Such wastefulness does not suit us, especially since it has been happening for a long time.

I decided not to reinvent the wheel (create a sprite), but used the one created by the Share42 constructor (a link to a description of working with it is given just above). In it you can select those social networks whose icons you will need, and along with the code you will receive a CSS sprite, i.e. physically one graphic file on which all the social network icons you need and subscriptions to the RSS feed (and Email, if required) will be placed.

I chose four main networks and a couple of icons for subscribing to news with an icon size of 24 by 24, so my sprite looks like this (though it’s still got in there, but it doesn’t matter):

Now we have all the ingredients - links to groups or social network pages and icons for displaying them on the site. All that remains is to prepare it all correctly, i.e. make up. My blog runs on WordPress, so I will paste the code with the buttons into one of the . In my case it is called sidebar.php. HTML code this turns out to be extremely simple:

Well, and the most interesting thing. With our help, we determine which area of ​​our sprite will be displayed at this specific location as a background (in our case, this background is placed under the hyperlink). It takes a very long time to explain how this happens, so read the article linked to the link and everything will become clear (it also provides illustrative examples). If you are lazy, then just experiment with the numbers, which, as you may have noticed, are not divisible by 24 for nothing.

Yes, upload the sprite file via FTP to your website and indicate the path to it () in the background. That's all. If it doesn’t work out, read more carefully the materials on the links above, well, and if nothing works out at all, then describe your situation in the comments (in detail - to insert the code, remember to enclose it in PHP tags with square brackets).

Good luck to you! See you soon on the pages of the blog site

You might be interested


 The idea of ​​organizing an Internet platform to unite people with common interests, in order to subsequently receive good traffic and introduce a paid subscription system, attracts many. To achieve this goal in a short time, a social network built on a WordPress template compatible with the BuddyPress and bbPress plugins is suitable. They provide the full functionality of the social network: creating profiles, exchanging messages, adding friends, communicating on the forum, collaborating on files and other options.

10 templates for a social network site on WordPress + BuddyPress

1.Sweet Date

A template for a social network, offering 2 demos for a dating site and 1 for a site for finding travel companions. The site on Sweet Date may use a paid subscription system and control access to content. The theme's fully responsive design ensures that when visiting the site on any device, visitors receive the same user experience.


2. Thrive

Template for intranet and online communities. It is a universal platform that combines the functionality of a social network, forum, messaging systems, event organization, project management and file sharing, e-commerce and e-learning (if you purchase the Learndash plugin).


3. Buddy

The theme, developed for Buddypress and bbPress, helps you create a social network with a modern design. Buddy uses responsive Retina Ready layout and Font Awesome icon font library. The template allows you to easily add widgets to your site such as: “New/popular/active users”, “New/popular groups”, “Calendar”, “Latest topics on the forum”, “Statistics”, “Online users”.


4. Socialize

The template makes the most of Buddypress's capabilities, making it a good basis for a community or social network. Socialize has completely changed the design of bbPress, bringing it closer to the classic forum style. So that the webmaster can achieve the desired type of content display, the template includes 4 layout options for the main page, 9 for categories, 6 for posts.


5. Klein

An innovative theme designed to work with BuddyPress and bbPress, made with special attention to detail. Suitable for those who need an online community or social network powered by WordPress. Ideal for sites with a large number of registered users. By connecting to community members.


6. KLEO

KLEO has earned the title of this year's best-selling BuddyPress theme because it truly lives up to expectations. The template offers a simple one with verified secondary elements. The theme uses built-in search, which is not included in any other template, and allows you to avoid installing special plugins, which has a beneficial effect on the speed of the site.


7. Monstroid2

A universal template, a follower of the legendary Monstroid theme, completely rewritten from scratch. Thanks to its compatibility with the BuddyPress plugin, the template allows webmasters to create a social network site or a thematic online community without any extra effort. The template provides 7 custom header styles and supports mega menus. The buyer can use pictures from the demo on his website.


The first most popular WordPress theme for intranet/extranet communities. Woffice can be used for corporate and government intranet/extranet networks, regular Internet communities and social networks, school or other private social networks.


Let's take a look at some WordPress themes made specifically for social media.

1. Mingle – Multi-Purpose WordPress Theme

If you are building your social network using BuddyPress, you need Mingle with its features and design. Developed by the elite team at Parallelus, Mingle is tailor-made for the BuddyPress platform and comes with a ton of great features.

Features of this theme:

  • contact field editor
  • sidebar generator
  • HTML5 + CSS3 support
  • SEO-friendly code
  • blogs
  • portfolio
  • slide show
  • shortcodes
  • many other features.

2. Salutation Responsive WordPress + BuddyPress Theme

With the release of Salutation, it's safe to say that Parallelus understands what it takes to create good design. First of all, it is worth noting that Salutation is a 100% responsive product - your social network will work perfectly on various mobile devices with any screen size.

Additionally, Salutation has some cool features:

  • Revolution slider
  • drag and drop capability
  • unlimited choice of colors
  • popup login fields
  • easy settings
  • blogs
  • widgets
  • intuitive admin panel
  • sidebar generator
  • portfolio
  • BuddyPress compatible
  • shortcodes
  • much more.

3. Woffice – Intranet/Extranet WordPress Theme

This theme has many features, a wide range of features, including high coding standards, regular updates and excellent support. You can use Woffice to create social networks, internal and external networks, or communities for schools, workplaces, businesses, and government agencies.

Features of this theme:

  • BuddyPress feature support
  • file manager
  • icons
  • chat and messaging
  • forums
  • Google fonts
  • responsive design
  • demo version
  • documentation
  • video lessons
  • calendar
  • shortcodes
  • bbPress
  • WMPL support
  • clean code
  • unlimited number of sidebars
  • custom widgets
  • user login pages
  • online store.

4. Serpent – ​​Responsive Social Network Theme

This theme has so many features that you will probably never need some of them. Serpent is a one of a kind WordPress theme that can take your website to the next level. It's simply impossible to do anything wrong with her.

The developers of this theme are the respectable Cosmothemes team.

Main characteristics of the theme:

Price includes future updates and 6 months of support.

5. UnitedCommunity – BuddyPress Theme

UnitedCommunity is a multifunctional WordPress theme for social networks from the respectable team at Diabolique. This is a new topic released on September 2, 2015.

Its notable features:

  • eye-catching, unique and responsive design
  • more than 40 internal pages
  • widgets on the home page
  • ease of installation and configuration
  • WooCommerce compatible
  • custom widgets
  • pop-up notifications
  • WPML support
  • Google fonts
  • drop down menus
  • much more.

6. Klein – A Nitty Gritty Community Theme

If you're looking for the perfect WordPress theme for your social network, look no further than Klein. It provides users with the opportunity to work with a fully functional social network and has a wide range of capabilities.

Your users can send unlimited messages, share events, add contacts, discuss ideas on forums, and create beautiful user profiles. You can take advantage of Klein's WooCommerce compatibility and sell products to members of your network. Additionally, Klein supports WordPress 4.4, bbPress and BuddyPress, giving you the ability to turn your WordPress site into a popular social network.

Other features include:

  • visual editor
  • custom colors
  • Revolution slider
  • WPML compatible
  • responsive design
  • intuitive admin panel
  • SEO-friendly code
  • 6 different headers + layouts
  • social media support
  • 1000+ font icons
  • notifications
  • many other functions.

To create a powerful social network with WordPress, you need to think about more than just choosing a plugin and theme. You will also need to take care of choosing quality hosting, as well as promoting your site in search engines. When it comes to working with plugins, try different options first and then make your final choice.

Note

Creating a social network based on WordPress is a simple process. All you need is a business plan, a social media plugin, and a compatible theme. Remember, you can choose any theme and customize it to your liking, but social media themes will save you time by offering many options.

Over the past few years, the popularity of social networks has skyrocketed to unprecedented levels. The recognized leader in this area is, of course, Facebook. A huge number of different applications have been developed for it, widely using the technology.

But if your plans do not include overtaking Facebook or VKontakte in popularity, and you just want create your own social network or community, similar to Facebook, Vkontakte, Twitter or Google Plus - then this review is for you.

We'll consider 15 scripts for creating a social network on with standard functions for such products, chats, microblogs a la Twitter and other popular functions that you will undoubtedly like. The selection includes both paid and free solutions.

phpDolphin

This platform for creating a social network provides almost the same features as Facebook - live chat, sending private messages, comments, photo sharing and much more.
Cost: $43

LiveStreet CMS

Blogosocial platform domestic production. In RuNet there are quite often portals that were built with its help. If you try to describe this CMS in a nutshell, it’s a kind of analogue of the well-known Habrahabr. The meaning of the system is this: every user can become an author.
Cost: Free

Boonex Dolphin

Boonex Dolphin is a powerful CMS for creating a social network. The arsenal has a huge number of extensions, such as: groups, announcements, audio and video catalog, poster, blogs, chat, file catalog, etc. You can also expand the standard set of paid modules, which can be purchased on the official website. It is possible to customize the style of your pages. In addition, developers provide mobile applications that integrate with your portal. The CMS is paid, but there is a trial version for testing.
From my experience working with this engine, I can say that the system is powerful and relatively stable, but it requires a good server, as it consumes a lot of resources.
Cost: from $29/month or from $599 for a one-time purchase (there is a trial version).

Social Business

Social Business is social network script for businessmen. The main goal of this script is to enable business people to find partners. Some similar to LinkedIn.
Cost: $32

SocEuro Social Network

SocEuro is quite functional social network script with a typical set of modules for this kind of product. Eat audio recordings as VKontakte, chats, feeds, games...
Cost: $43

Oxwall

Absolutely free social network script open source. It has a huge number of the same free and unique add-ons that cannot be found even in paid analogues: photo gallery, video catalog, blogs, forums, wikis, groups, events, friends, collaboration, file sharing, video conferences, etc.
Cost: Free

Socialkit

Almost all the functions that have become standard for social networks are embodied in the ScialKit platform: live chat, personal pages, messaging and links, the ability to leave comments and likes, notifications, hashtags and mentions.
Cost: $39

Pligg

Pligg is free, a simple yet powerful solution for creating a blog-social network or community. The peculiarity is that you can create a self-regulating community. Users themselves decide what is bad and what is good. This eliminates the need for moderation. Habrahabr and the LiveStreet CMS system, which is also present in this collection, work with a similar philosophy.
Cost: Free

SocioQuiz

SocioQuiz is a script that can turn your website into a portal of a wide variety of tests, surveys and quizzes. Provides full support for photo and video content, as well as complete freedom to use your own. It has significantly more capabilities compared to similar sites such as Playbuzz, Buzzfeed and others.
Cost: $44

Friendly Social Network

Friendly social network is the real one social network for friends. It has a full set of functions required in this case: personal pages, groups, live chat, comments, likes, hashtags, mentions, notifications. It is possible to create separate profiles for friends and public ones. You can control the display of posts - visible to everyone (public), or only to friends. And these are just some of the features that make Friendly an almost ideal platform for creating your own community.
Cost: $36