-
Notifications
You must be signed in to change notification settings - Fork 0
/
technical.html
158 lines (118 loc) · 8.45 KB
/
technical.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="shareNice - unintrusive social sharing">
<meta name="author" content="Mischa Tuffield">
<link rel="icon" href="assets/favicon.png">
<title>shareNice</title>
<!-- Bootstrap core CSS -->
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" integrity="sha512-dTfge/zgoMYpP7QbHy4gWMEGsbsdZeCXz7irItjcC3sPUFtf0kuFbDz/ixG7ArTxmDjLXDmezHubeNikyKGVyQ==" crossorigin="anonymous">
<!-- Pretty font -->
<link href='https://fonts.googleapis.com/css?family=Quattrocento+Sans' rel='stylesheet' type='text/css'>
<!-- Hand rolled CSS -->
<link rel="stylesheet" href="styles/style.css">
</head>
<body>
<div class="container">
<nav class="navbar-default clearfix">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<span class="topMargin" id="shareNice" data-share-label="" data-icon-size="32" data-share-zindex="2147483647"/>
</div>
<div id="navbar" class="collapse navbar-collapse navbar-right">
<ul class="nav navbar-nav">
<li role="presentation"><a href="/index">home</a></li>
<li role="presentation" class="active"><a href="/technical">technical info</a></li>
<li role="presentation"><a href="/demo">demo</a></li>
<li role="presentation"><a target="_blank" href="http://github.com/mischat/shareNice">source-code</a></li>
<li role="presentation"><a href="/privacy">privacy policy</a></li>
</ul>
</div>
</nav>
<div class="page-header">
<img class="img-responsive center-block" src="assets/original_image_flipped.png" />
<h1 class="text-center">uninstrusive social sharing</h1>
<p class="lead">shareNice provides website owners with a social sharing widget that does NOT track their
users. shareNice is an open-source sharing library that enables your users to share your content with their
friends without being tracking by another party.</p>
</div>
<div class="containter">
<div class="row">
<div class="col-lg-12">
<h2>Technical Information</h2>
<h3>Using shareNice on your website</h3>
<p>To add our uninstrusive social sharing feature, see the <a href="/demo">demo</a>, to your website all you need to do is include the following javascript code on your webpage:</p>
<pre>
<script src="/code.js" type="text/javascript"></script>
</pre>
<p>and add the following div element to your page source:</p>
<pre>
<div id="shareNice"></div>
</pre>
<h3>Configuring the shareNice lightbox</h3>
<p>One can now reconfigure shareNice, using the following five attributes</p>
<ul>
<li><code>data-services</code>: Takes a comma separate list of domain's which you are interested in including in your shareNice lightbox.</li>
<br/>
<li><code>data-share-label</code>: Allows a website owner to config the text "Share" as they please.</li>
<li><code>data-color-scheme</code>: You can choose one of "black", "blue", "green", "orange", "pink", "red" to customise.</li>
<li><code>data-icon-size</code>: either "16" or "32", this defines the size of the shareNice icon.</li>
<li><code>data-panel-bottom</code>: either "default" or "plain". Where: "plain" gives a non-branded lightbox.</li>
<li><code>data-share-zindex</code>: you can provide a z-index number here, if your website CSS uses z-index, you can add an optional z-index.</li>
</ul>
<h3>Example config</h3>
<p>If you want to config the text to say "shareNice this page" and only have icons for the following sites: <code>facebook.com,digg.com,email,delicious.com,twitter.com</code>, use the following HTML on your page:</p>
<pre>
<div id="shareNice" data-services="facebook.com,digg.com,email,delicious.com,twitter.com"
data-share-label="shareNice this page"></div>
</pre>
<p>See <a href="http://mmt.me.uk/">mmt.me.uk</a> for an example of this configuration setup in action.</p>
<h3>Our setup on sharenice.org</h3>
<p>We are hosting sharenice as a virtual host on <a href="http://httpd.apache.org/">an Apache Server</a>, using the following httpd.conf file</p>
<pre>
<VirtualHost *:80>
DocumentRoot /var/www/vhosts/sharenice.org/httpdocs
ServerName www.sharenice.org
ServerAlias sharenice.org
UseCanonicalName Off
CustomLog /dev/null combined
RewriteEngine on
RewriteCond %{HTTP_HOST} ^www.sharenice.org [NC]
RewriteRule ^(.*)$ http://sharenice.org/$1 [L,R=301]
</VirtualHost>
</pre>
<p>As you can see, we are redirect ALL logs to <em>/dev/null</em> and as a result we are not collecting ANY information about users of sharenice.org.</p>
<h3>You can host your own version of shareNice</h3>
<p>If you would like to host your version of the shareNice tool, you can download and follow the provided instructions in <a href="http://github.com/mischat/shareNice">shareNice's repository on github</a>. shareNice is <a href="http://www.gnu.org/licenses/license-list.html#GPLCompatibleLicenses">free software</a> please see our <a href="https://github.com/mischat/shareNice/blob/master/LICENSE.txt">license</a> for more information.</p>
<h3>Questions, Comments, and Feedback</h3>
<p>If you have any questions regarding shareNice please either pop into #shareNice on irc.freenode.net, or email [shareNice at mmt me uk]. All comments and feedback are welcome. shareNice is an <a href="http://github.com/mischat/shareNice">open-source project</a> if you feel like something can be done better feel free to hack away yourself or submit a bug-report on the <a href="http://github.com/mischat/shareNice/issues/">shareNice git repository's issue tracker</a>.</p>
</div>
</div>
</div>
<footer class="footer">
<div class="container text-center">
Hand-rolled in <a href="http://www.vim.org/">vi</a> 2015
</div>
</footer>
</div>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js" integrity="sha512-K1qjQ+NcF2TYO/eI3M6v8EiNYZfA95pQumfvcVrTHtwQVDG+aHRqLi/ETn2uB+1JqwYqVG3LIvdm9lj6imS/pQ==" crossorigin="anonymous"></script>
<!-- The sharenice script -->
<script type="text/javascript" src="//sharenice.org/code.js"></script>
</body>
</html>