Share42.com - Social Sharing Buttons Script

1. Choose a size and select icons which you want to use on your website:

You can save the current configuration (marked icons, order of icons and selected options) for future use. You can create any number of configurations.

Save the configuration

2. Select desired options:

Type of panel with icons: horizontal vertical "sticky"
Limit the number of visible icons: → pcs. (total selected icons: )
You can only specify a number
Website charset: UTF-8 Windows-1252 ISO-8859-1
Add Share42.com icon: !
RSS link of your website:
Incorrect link
jQuery is already connected: ?
Show share counters: !

3. See how it will look and/or download the script
You did not select any icon

4. Install the script on your website:

Unpack the archive.
Upload the "share42" folder to your website via FTP or via web hosting control panel (if desired, you can rename the folder).
Specify the path to this folder: , for example, http://site.name/share42/.
Click here to check: .
If you see the contents of the script, then the path is correct.
Select the most appropriate type of website:
- Any website
- WordPress
- Drupal
- Other CMS

Insert into the template of your website the following code (just before or just after the main text of the page):

<div class="share42init" data-url="<?php the_permalink() ?>" data-title="<?php the_title() ?>" data-url="<?php print $node_url ?>" data-title="<?php print $title ?>" data-url="[url]" data-title="[title]" data-top1="150" data-top2="20" data-margin="0"></div> <script type="text/javascript" src="http://site.name/share42/share42.js"></script>

The parameters you can specify

Parameter	Description	Example of usage
`data-url`	link to a page	`<div class="share42init" data-url="http://site.name/page-title/">`
`data-title`	title of a page	`<div class="share42init" data-title="Заголовок страницы">`
`data-image`	link to an image	`<div class="share42init" data-image="http://site.name/image.jpg">`
`data-description`	description of a page	`<div class="share42init" data-description="Описание страницы">`
`data-path`	path to a folder containing icons.png file	`<div class="share42init" data-path="http://site.name/share42/">`
The parameters for the vertical panel
`data-top1`	distance from the top of the page to the panel, in pixels	`<div class="share42init" data-top1="150">`
`data-top2`	distance from the top of the visible area of the page to the panel, in pixels	`<div class="share42init" data-top2="20">`
`data-margin`	horizontal displacement of the panel, in pixels (negative value - to the left, positive value - to the right)	`<div class="share42init" data-margin="-70">`

For styling the panel you can add the following code into a CSS file of your website (optional):

#share42 {display: inline-block; padding: 6px 0 0 6px; background: #FFF; border: 1px solid #E9E9E9; border-radius: 4px;} #share42:hover {background: #F6F6F6; border: 1px solid #D4D4D4; box-shadow: 0 0 5px #DDD;} #share42 a {opacity: 0.5} #share42:hover a {opacity: 0.7} #share42 a:hover {opacity: 1}

#share42 {padding: 6px 6px 0; background: #FFF; border: 1px solid #E9E9E9; border-radius: 4px;} #share42:hover {background: #F6F6F6; border: 1px solid #D4D4D4; box-shadow: 0 0 5px #DDD;} #share42 a {opacity: 0.5} #share42:hover a {opacity: 0.7} #share42 a:hover {opacity: 1}

For styling the counter add the following CSS code:

#share42 a {position:relative;} #share42 a span {display: none; position: absolute; z-index: 10; top: 0; left: 100%; height: 19px; margin-left: 5px; padding: 0 5px; background: #FFF; border-radius: 4px; border: 1px solid #AAA; box-shadow: 0 0 5px rgba(0,0,0,0.25); text-align: center; color: #666; font: 12px/20px Arial, sans-serif;} #share42 a:hover span {display: block} #share42 a span:before {content: ''; position: absolute; top: 50%; left: -5px; margin-top: -3px; width: 5px; height: 7px; background: url(data:image/gif;base64,R0lGODlhBQAHAJEDAKqqqsnJyf///////yH5BAEAAAMALAAAAAAFAAcAAAIMnBEXMijiXlts1lkAADs=) no-repeat;}
Done.

About

Share42.com - is a free service that generates a script that allows your visitors to post links to your articles in social media (bookmarks, social networks).

You can read about the advantages of using this script in the appropriate tab.

Script allow to:

Specify custom link, title, description and image for a page.
Show share counters for the following services:
- Facebook
- Twitter
- Pinterest
- Delicious
- Linkedin
- VK
- Odnoklassniki
- Ya.ru

Advantages of the script:

– Beautiful icons.: All icons are made in the same style and look beautiful.
– The small size.: The code of the script is perfectly optimized. In addition, it will be cached by the browser.
– Easy to install.: Download the script, upload it to your website, connect it to the website.
– No extra links.: All links are made via JavaScript, so when you install the script the number of outbound links on your website will not increase.
– No extra HTML code.: You add just two lines of the code in the template of your website, and all the HTML code of the buttons is generated with JavaScript.
– Without requests to third-party sites (exception - if the "Show share counters" option is active, script sends requests to the sharing services).: There are many situations when the website opens too slowly, because the script is loaded from another website. Installation of the script on your website will allow to avoid this problem.
– Can be added to almost any website.: The script is universal, it will work on any type of a website which has a FTP access.
– Uses only one image (sprite).: It will reduce the number of requests to the server that hosts your website.
– You choose the icons of social media that will be displayed on your website.

Donate to the author

If this site is useful to you, then you can thank the author with a small donation through PayPal.

Social Sharing Buttons Script