Social Sharing Links

by Joshua Dwire

HTML

<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<div class="form-horizontal">
    <div class="form-group">
        <label for="post-url" class="col-sm-2 control-label">Post URL</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" id="post-url">
        </div>
    </div>
    <div class="form-group">
        <label for="tweet-text" class="col-sm-2 control-label">Tweet Text</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" id="tweet-text">
        </div>
    </div>
    <div class="form-group">
        <div class="col-sm-offset-2 col-sm-10">
            <button id="get-links" class="btn btn-default">Get Links</button>
        </div>
    </div>
    <div class="form-group">
        <label for="facebook-url" class="col-sm-2 control-label">Facebook URL</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" disabled="disabled" id="facebook-url">
        </div>
    </div>
    <div class="form-group">
        <label for="twitter-url" class="col-sm-2 control-label">Twitter URL</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" disabled="disabled" id="twitter-url">
        </div>
    </div>
</div>

CSS

/* Latest compiled and minified CSS included as External Resource*/

/* Optional theme */
 @import url('//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css');
 body {
    margin: 10px;
}

JavaScript

/* Latest compiled and minified JavaScript included as External Resource */
$('#get-links').click(function(){
    var postURL = $('#post-url').val();
    var tweetText = $('#tweet-text').val();
    
    $('#facebook-url').val('https://facebook.com/sharer.php?u='+encodeURIComponent(postURL));
    $('#twitter-url').val('https://twitter.com/intent/tweet?url='+encodeURIComponent(postURL)+'&text='+encodeURIComponent(tweetText));
});