iatek/jquery-share

A jquery social plugin that enables easy sharing to multple social networks. Share to many social networks (Facebook, Twitter, Tumblr, LinkedIn, Pinterest, Google+) from one toolbar.

jquery-share's Issues

Apache error with Internal Server Error: /file/pic/bookmark/delicious.gif

Apache error.log says:

Internal Server Error: /file/pic/bookmark/delicious.gif

The JS is loaded in Django webpage and Stack of error is:

<WSGIRequest
path:/file/pic/bookmark/delicious.gif,
GET:<QueryDict: {}>,
POST:<QueryDict: {}>,
COOKIES:{},
META:{u'CSRF_COOKIE': u'tNXYOaXoVETpWAzQrs6jacFmMIZNgTx8',
 'DOCUMENT_ROOT': '/var/www/django_queestapasandoen/',
 'GATEWAY_INTERFACE': 'CGI/1.1',
 'HTTP_ACCEPT_ENCODING': 'gzip',
 'HTTP_HOST': 'www.queestapasandoen.com',
 'HTTP_USER_AGENT': 'Go 1.1 package http',
 'PATH_INFO': u'/file/pic/bookmark/delicious.gif',
 'PATH_TRANSLATED': '/var/www/django_queestapasandoen/django_queestapasandoen/wsgi.py/file/pic/bookmark/delicious.gif',
 'QUERY_STRING': '',
 'REMOTE_ADDR': '76.164.199.157',
 'REMOTE_PORT': '49781',
 'REQUEST_METHOD': 'GET',
 'REQUEST_URI': '/file/pic/bookmark/delicious.gif',
 'SCRIPT_FILENAME': '/var/www/django_queestapasandoen/django_queestapasandoen/wsgi.py',
 'SCRIPT_NAME': u'',
 'SERVER_ADDR': '198.211.117.120',
 'SERVER_ADMIN': '[no address given]',
 'SERVER_NAME': 'www.queestapasandoen.com',
 'SERVER_PORT': '80',
 'SERVER_PROTOCOL': 'HTTP/1.1',
 'SERVER_SIGNATURE': '<address>Apache/2.2.22 (Ubuntu) Server at www.queestapasandoen.com Port 80</address>\n',
 'SERVER_SOFTWARE': 'Apache/2.2.22 (Ubuntu)',
 'mod_wsgi.application_group': 'queestapasandoen.com|',
 'mod_wsgi.callable_object': 'application',
 'mod_wsgi.handler_script': '',
 'mod_wsgi.input_chunked': '0',
 'mod_wsgi.listener_host': '',
 'mod_wsgi.listener_port': '80',
 'mod_wsgi.process_group': 'queestapasandoen',
 'mod_wsgi.request_handler': 'wsgi-script',
 'mod_wsgi.script_reloading': '1',
 'mod_wsgi.version': (3, 3),
 'wsgi.errors': <mod_wsgi.Log object at 0xabb38930>,
 'wsgi.file_wrapper': <built-in method file_wrapper of mod_wsgi.Adapter object at 0xaba07d58>,
 'wsgi.input': <mod_wsgi.Input object at 0xab411368>,
 'wsgi.multiprocess': False,
 'wsgi.multithread': True,
 'wsgi.run_once': False,
 'wsgi.url_scheme': 'http',
 'wsgi.version': (1, 1)}>

example.html is blank

No content in example.html

Bower support

This is must have :)

a

Buttons are hidden by adblock

I discovered an issue where adBlock prevents the share icons from showing. Mozilla Firefox and plugin adblock.
Does anyone have a fix for this?
regards
Antonyf

Responsive?

This plugin is fantastic. However, since the styles are being written inline via jquery, css media queries cannot be used. Is there a way to go from the social media icons to be
affix: 'right center', but then go to the normal inline layout with relative positioning once the user gets below 1024 pixels wide of screen space?

This isn't really an issue, but a suggestion / question :)

Wordpress icon

Would it be possible for you to create a Wordpress icon as well?

Pinterest No Image

There is no image with the Pinterest option.

Also it looks like this plugin is not being actively maintained. No updates for a few years.

Fix a Javascript Error

href = helpers.networkDefs[item].url;

it can not read the property of the url

Examples are emtpy

The example HTML file is empty, am I missing something?

Some Enhancements

Hi,

I'm new to Github and jquery and wanted to share some enhancements I made - not sure if you would like to include them:

1. added ability to define different window sizes for each icon's popup window.
2. when using email, the popup window would remain open - enhanced to close it by allow you to set the class to nopop or pop.
3. changed twitter to use the Twitter Web Intents and added via as a value that can be included. This does require the twitter widgest.js be included in the html.
4. changed facebook to use the feed dialog (looks nicer). This does require the facebook sdk to be included in the html.

Following is the new script. Feel free to use my changes if you want.

/*
 * jQuery.share - social media sharing plugin
 * ---
 * @author Carol Skelly (http://in1.com)
 * @version 1.0
 * @license MIT license (http://opensource.org/licenses/mit-license.php)
 * ---
 */
;
(function ($, window, undefined) {

    var document = window.document;

    $.fn.share = function (method) {

        var methods = {

            init: function (options) {
                this.share.settings = $.extend({}, this.share.defaults, options);
                var settings = this.share.settings,
                    networks = this.share.settings.networks,
                    theme = this.share.settings.theme,
                    via = this.share.settings.via,
                    redirect = this.share.settings.redirect,
                    orientation = this.share.settings.orientation,
                    affix = this.share.settings.affix,
                    margin = this.share.settings.margin,
                    pageTitle = this.share.settings.title || $(document).attr('title'),
                    pageUrl = this.share.settings.urlToShare || $(location).attr('href'),
                    pageDesc = "";

                $.each($(document).find('meta[name="description"]'), function (idx, item) {
                    pageDesc = $(item).attr("content");
                });

                // each instance of this plugin
                return this.each(function () {
                    var $element = $(this),
                        id = $element.attr("id"),
                        u = encodeURIComponent(pageUrl),
                        t = encodeURIComponent(pageTitle),
                        d = pageDesc.substring(0, 250),
                        href,
                        rel,
                        popup;

                    // append HTML for each network button
                    for (var item in networks) {
                        item = networks[item];
                        href = helpers.networkDefs[item].url;
                        rel = helpers.networkDefs[item].rel;
                        popup = helpers.networkDefs[item].popup;
                        href = href.replace('|u|', u).replace('|u|', u).replace('|t|', t).replace('|d|', d).replace('|140|', t.substring(0, 130)).replace('|v|', via).replace('|r|', redirect);
                        $("<a href='" + href + "' title='Share this page on " + item + "' rel='" + rel + "' class='" + popup + " share-" + theme + " share-" + theme + "-" + item + "'></a>").appendTo($element);
                    }

                    // customize css
                    $("#" + id + ".share-" + theme).css('margin', margin);

                    if (orientation != "horizontal") {
                        $("#" + id + " a.share-" + theme).css('display', 'block');
                    } else {
                        $("#" + id + " a.share-" + theme).css('display', 'inline-block');
                    }

                    if (typeof affix != "undefined") {
                        $element.addClass('share-affix');
                        if (affix.indexOf('right') != -1) {
                            $element.css('left', 'auto');
                            $element.css('right', '0px');
                            if (affix.indexOf('center') != -1) {
                                $element.css('top', '40%');
                            }
                        } else if (affix.indexOf('left center') != -1) {
                            $element.css('top', '40%');
                        }

                        if (affix.indexOf('bottom') != -1) {
                            $element.css('bottom', '0px');
                            $element.css('top', 'auto');
                            if (affix.indexOf('center') != -1) {
                                $element.css('left', '40%');
                            }
                        }
                    }

                    // bind click
                    $('.pop').click(function () {
                        var rel = $(this).attr("rel");
                        var winSpecs = winSpecsArray[rel];
                        window.open($(this).attr('href'), '', winSpecs);
                        return false;
                    });


                }); // end plugin instance
            }
        }

        var helpers = {
            networkDefs: {
                facebook: {
                    url: 'https://www.facebook.com/dialog/feed?app_id=537304962984013&display=popup&caption=|t|&link=|u|&redirect_uri=|r|',
                    rel: '0',
                    popup: 'pop'
                },
                twitter: {
                    url: 'https://twitter.com/intent/tweet?url=|u|&via=|v|&text=|140|',
                    rel: '1',
                    popup: 'pop'
                },
                googleplus: {
                    url: 'https://plusone.google.com/_/+1/confirm?hl=en&url=|u|',
                    rel: '2',
                    popup: 'pop'
                },
                email: {
                    url: 'mailto:?subject=|t|&body=|u|',
                    rel: '0',
                    popup: 'nopop'
                }
            }
        }

        var winSpecsArray = ['toolbar=0,resizable=1,status=0,width=640,height=320',
            'toolbar=0,resizable=1,status=0,width=550,height=440',
            'toolbar=0,resizable=1,status=0,width=600,height=600'
        ];

        if (methods[method]) {
            return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
        } else if (typeof method === 'object' || !method) {
            return methods.init.apply(this, arguments);
        } else {
            $.error('Method "' + method + '" does not exist in social plugin');
        }

    }

    $.fn.share.defaults = {
        networks: ['facebook', 'twitter', 'linkedin'],
        theme: 'icon',
        autoShow: true,
        margin: '3px',
        orientation: 'horizontal',
        useIn1: false
    }

    $.fn.share.settings = {}

})(jQuery, window);

$('#socialshare').share({
    networks: ['email', 'facebook', 'googleplus', 'twitter'],
    theme: 'square',
    via: 'TruthDeception',
    redirect: 'http://sandbox.truthaboutdeception.com/close_dialog.html'
});

The close_dialog.html page is simply:

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<p>If this window does not close automatically, 
  use the Close button to close it.</p>
<script>
    window.close();
</script>
</body>
</html>