diff --git a/ShareButtons/README.md b/ShareButtons/README.md
new file mode 100644
index 0000000..e899c79
--- /dev/null
+++ b/ShareButtons/README.md
@@ -0,0 +1,77 @@
+# Share buttons
+
+[![NPM](https://img.shields.io/npm/v/@dbmdz/mirador-sharebuttons.svg)](https://www.npmjs.com/package/@dbmdz/mirador-sharebuttons)
+[![Maven Central](https://img.shields.io/maven-central/v/org.webjars.npm/dbmdz__mirador-sharebuttons.svg?maxAge=2592000)](http://search.maven.org/#search%7Cga%7C1%7Ca%3A%22dbmdz__mirador-sharebuttons%22)
+
+Provides functions for adding additional buttons that allow sharing content across different social media platforms.
+
+**NOTE:** This plugin is just a library, it does nothing by just including it.
+
+## Installation
+
+You can find production-ready build artifacts in the [releases section](https://github.com/dbmdz/mirador-plugins/releases).
+
+Alternatively, you can use `npm` to install the artifacts:
+
+```sh
+$ npm install @dbmdz/mirador-sharebuttons
+```
+
+If you have a Java Web-Application managed with `mvn`, there is also a WebJar, which can be included as follows:
+
+```xml
+
+ org.webjars.npm
+ dbmdz__mirador-sharebuttons
+ 1.0.0
+
+```
+
+## Usage
+
+### Including
+
+Enable the plugin by including the CSS and the JavaScript (**after** loading Mirador):
+
+```html
+
+...
+
+```
+
+### Provided functions
+
+#### init(showExternalLinkInfo) → {void}
+
+Registers some needed `Handlebars` helpers and sets a variable.
+
+Parameters:
+
+| Name | Type | Description | Default |
+|----------------------|---------|-----------------------------------------------------------------------------------------------------------|---------|
+| showExternalLinkInfo | Boolean | Display an info that the website containing the Mirador instance is left by clicking on the share buttons | false |
+
+#### injectButtonsToDom(targetSelector, position) → {void}
+
+Injects the buttons to the target selector element in the given position.
+
+Parameters:
+
+| Name | Type | Description | Default |
+|----------------|--------|--------------------------------------------------------------|--------------|
+| targetSelector | String | The selector for the element that should contain the buttons | |
+| position | String | The position of the buttons within the containing element | "afterbegin" |
+
+#### updateButtonLinks(data) → {void}
+
+Injects the buttons to the target selector element in the given position.
+
+Parameters:
+
+| Name | Type | Description |
+|-------------------|--------|----------------------------------------|
+| data | Object | The data for the links |
+| data.attribution | String | The attribution of the link to share |
+| data.label | String | The label of the link to share |
+| data.link | String | The link itself |
+| data.thumbnailUrl | String | The thumbnail url of the link to share |
diff --git a/ShareButtons/gulpfile.js b/ShareButtons/gulpfile.js
new file mode 100644
index 0000000..788521b
--- /dev/null
+++ b/ShareButtons/gulpfile.js
@@ -0,0 +1,46 @@
+var gulp = require('gulp');
+var clean = require('gulp-clean');
+var linter = require('gulp-jshint');
+var minifyCSS = require('gulp-clean-css');
+var minifyJS = require('gulp-minify');
+var rename = require('gulp-rename');
+
+gulp.task('clean', function(){
+ return gulp.src(
+ ['*.min.css', '*.min.js'], {read: false}
+ ).pipe(clean());
+});
+
+gulp.task('lint', function(){
+ return gulp.src(['*.js', '!*.min.js', '!gulpfile.js']).pipe(
+ linter()
+ ).pipe(
+ linter.reporter('default')
+ );
+});
+
+gulp.task('minify-css', ['clean'], function(){
+ return gulp.src('*.css').pipe(
+ minifyCSS()
+ ).pipe(
+ rename({ suffix: '.min' })
+ ).pipe(
+ gulp.dest('.')
+ );
+});
+
+gulp.task('minify-js', ['clean'], function(){
+ return gulp.src(['*.js', '!gulpfile.js']).pipe(
+ minifyJS({
+ exclude: ['dist'],
+ ext:{
+ min:'.min.js'
+ },
+ noSource: true
+ })
+ ).pipe(
+ gulp.dest('.')
+ );
+});
+
+gulp.task('minify', ['clean', 'minify-css', 'minify-js']);
diff --git a/ShareButtons/package.json b/ShareButtons/package.json
new file mode 100644
index 0000000..e22d817
--- /dev/null
+++ b/ShareButtons/package.json
@@ -0,0 +1,24 @@
+{
+ "name": "@dbmdz/mirador-sharebuttons",
+ "version": "0.0.0",
+ "description": "Adds extra buttons for sharing things on different social media platforms.",
+ "keywords": [
+ "iiif",
+ "mirador"
+ ],
+ "license": "MIT",
+ "author": "Matthias Lindinger",
+ "main": "shareButtons.js",
+ "repository": {
+ "type": "git",
+ "url": "https://github.com/dbmdz/mirador-plugins.git"
+ },
+ "scripts": {
+ "lint": "gulp lint",
+ "minify": "gulp minify",
+ "prepublishOnly": "npm run minify"
+ },
+ "publishConfig": {
+ "access": "public"
+ }
+}
diff --git a/ShareButtons/shareButtons.css b/ShareButtons/shareButtons.css
new file mode 100644
index 0000000..7acef02
--- /dev/null
+++ b/ShareButtons/shareButtons.css
@@ -0,0 +1,32 @@
+#share-buttons-info {
+ margin-bottom: 5px;
+ text-align: left;
+}
+
+#share-buttons > .share-button {
+ color: white;
+}
+
+#share-buttons > #share-on-envelope .fa-circle {
+ color: #7d7d7d;
+}
+
+#share-buttons > #share-on-facebook .fa-circle {
+ color: #3B5998;
+}
+
+#share-buttons > #share-on-pinterest .fa-circle {
+ color: #CB2027;
+}
+
+#share-buttons > #share-on-tumblr .fa-circle {
+ color: #32506d;
+}
+
+#share-buttons > #share-on-twitter .fa-circle {
+ color: #55acee;
+}
+
+#share-buttons > #share-on-whatsapp .fa-circle {
+ color: #25d366;
+}
diff --git a/ShareButtons/shareButtons.js b/ShareButtons/shareButtons.js
new file mode 100644
index 0000000..c183d87
--- /dev/null
+++ b/ShareButtons/shareButtons.js
@@ -0,0 +1,108 @@
+var ShareButtons = {
+ /* all of the needed locales */
+ locales: {
+ 'de': {
+ 'share-buttons-info': 'Beim Klick auf einen der Teilen-Buttons verlassen Sie diese Webseite.',
+ 'share-on-envelope': 'Per Mail teilen',
+ 'share-on-facebook': 'Auf Facebook teilen',
+ 'share-on-pinterest': 'Auf Pinterest teilen',
+ 'share-on-tumblr': 'Auf Tumblr teilen',
+ 'share-on-twitter': 'Auf Twitter teilen',
+ 'share-on-whatsapp': 'Per Whatsapp teilen'
+ },
+ 'en': {
+ 'share-buttons-info': 'By clicking on one of the share buttons, you will leave this website.',
+ 'share-on-envelope': 'Share via mail',
+ 'share-on-facebook': 'Share on Facebook',
+ 'share-on-pinterest': 'Share on Pinterest',
+ 'share-on-tumblr': 'Share on Tumblr',
+ 'share-on-twitter': 'Share on Twitter',
+ 'share-on-whatsapp': 'Share via Whatsapp'
+ }
+ },
+
+ /* options of the plugin */
+ showExternalLinkInfo: false,
+
+ /* the template for the buttons */
+ buttonsTemplate: Mirador.Handlebars.compile([
+ '{{#if showExternalLinkInfo}}',
+ '
{{t "share-buttons-info"}}
',
+ '{{/if}}',
+ ''
+ ].join('')),
+
+ /* the templates for the different links */
+ linkTemplates: {
+ 'envelope': Mirador.Handlebars.compile(
+ 'mailto:?subject={{{label}}}{{#if attribution}} ({{attribution}}){{/if}}&body={{{label}}}{{#if attribution}} ({{{attribution}}}){{/if}}: {{link}}'
+ ),
+ 'facebook': Mirador.Handlebars.compile(
+ 'https://www.facebook.com/sharer/sharer.php?title={{{label}}} {{#if attribution}} ({{attribution}}){{/if}}&u={{link}}'
+ ),
+ 'pinterest': Mirador.Handlebars.compile(
+ 'http://pinterest.com/pin/create/bookmarklet/?url={{link}}&description={{{label}}}%20{{#if attribution}}%20({{attribution}}){{/if}}&media={{{thumbnailUrl}}}'
+ ),
+ 'tumblr': Mirador.Handlebars.compile(
+ 'http://www.tumblr.com/share/link?url={{link}}&name={{{label}}} {{#if attribution}} ({{attribution}}){{/if}}&tags=iiif'
+ ),
+ 'twitter': Mirador.Handlebars.compile(
+ 'https://twitter.com/intent/tweet?text={{{truncate label attribution}}}&url={{link}}&hashtags=iiif'
+ ),
+ 'whatsapp': Mirador.Handlebars.compile(
+ 'whatsapp://send?text={{{label}}} {{#if attribution}} ({{attribution}}){{/if}}: {{link}}'
+ )
+ },
+
+ /* initializes the plugin */
+ init: function(showExternalLinkInfo){
+ Mirador.Handlebars.registerHelper('concat', function(target){
+ return 'share-on-' + target;
+ });
+ Mirador.Handlebars.registerHelper('truncate', function(label, attribution){
+ var text = label + (attribution ? ' (' + attribution + ')' : '');
+ if(text.length > 60){
+ text = text.substring(0, 60) + '...';
+ }
+ return text;
+ });
+ this.showExternalLinkInfo = showExternalLinkInfo || false;
+ },
+
+ /* injects the buttons to the target selector element */
+ injectButtonsToDom: function(targetSelector, position){
+ var shareButtons = ['facebook', 'twitter', 'pinterest', 'tumblr', 'envelope'];
+ if('ontouchstart' in window || navigator.maxTouchPoints){
+ shareButtons.push('whatsapp');
+ }
+ if(position === undefined || ['beforebegin', 'afterbegin', 'beforeend', 'afterend'].indexOf(position) === -1){
+ position = 'afterbegin';
+ }
+ document.querySelector(targetSelector).insertAdjacentHTML(position, this.buttonsTemplate({
+ 'shareButtons': shareButtons,
+ 'showExternalLinkInfo': this.showExternalLinkInfo
+ }));
+ },
+
+ /* updates the button links with the given parameters */
+ updateButtonLinks: function(data){
+ var this_ = this;
+ $('#share-buttons > .share-button').attr('href', function(){
+ return this_.linkTemplates[$(this).data('target')]({
+ 'label': data.label,
+ 'attribution': data.attribution,
+ 'link': data.link,
+ 'thumbnailUrl': data.thumbnailUrl
+ });
+ });
+ }
+};
diff --git a/lerna.json b/lerna.json
index d43b76f..a069cb9 100644
--- a/lerna.json
+++ b/lerna.json
@@ -8,6 +8,7 @@
"MultiPageNavigation",
"PhysicalRuler",
"PiwikTracking",
+ "ShareButtons",
"ViewFromUrl"
],
"version": "independent"