Social Share Count With JS

Developer
Hemant Aggarwal
Size
2,515 Kb
Views
8,096
  1. Social Share Count With JS Previews
  2. Social Share Count With JS HTML Codes
  3. Social Share Count With JS JS Codes

How do I make an social share count with js?

What is a social share count with js? How do you make a social share count with js? This script and codes were developed by Hemant Aggarwal on 09 January 2023, Monday.

Social Share Count With JS Previews
IQ Test

Social Share Count With JS - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Social Share Count With JS</title> <link rel='stylesheet prefetch' href='https://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css'>
</head>
<body> <div class="container"> <div class="row"> <div class="col-md-3"> <div class="panel panel-default"> <div class="panel-body"> <form role="form"> <div class="form-group"> <label>URL</label> <input type="text" class="form-control" id="urlInput" placeholder="Enter URL" /> <p class="help-block">with <code>http</code> or <code>https</code> </p> </div> <button type="button" class="btn btn-success" id="getJSON">Get Share Counts</button> </form> </div> </div> </div> <div class="col-md-4" id="data-tab"> <div class="list-group"> <a href="#" class="list-group-item"> <h4 class="list-group-item-heading">Facebook</h4> <p class="list-group-item-text" id="facebook-count"></p> </a> <a href="#" class="list-group-item"> <h4 class="list-group-item-heading">Twitter</h4> <p class="list-group-item-text" id="twitter-count"></p> </a> <a href="#" class="list-group-item"> <h4 class="list-group-item-heading">LinkdIn</h4> <p class="list-group-item-text" id="linkdin-count"></p> </a> </div> </div> </div>
</div> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Social Share Count With JS - Script Codes JS Codes

$('#getJSON').click(function () { $('#data-tab').fadeOut(); $URL = $('#urlInput').val(); totalShares($URL); $('#data-tab').fadeIn();
});
// Format Number functions
function ReplaceNumberWithCommas(yourNumber) { //Seperates the components of the number var components = yourNumber.toString().split("."); //Comma-fies the first part components[0] = components[0].replace(/\B(?=(\d{3})+(?!\d))/g, ","); //Combines the two sections return components.join(".");
}
// SHARE COUNTS FUNCTIONS
// Facebook Shares Count
function facebookShares($URL) { $.getJSON('https://graph.facebook.com/?id=' + $URL, function (fbdata) { $('#facebook-count').text('The URL has ' + ReplaceNumberWithCommas(fbdata.shares) + ' shares count on Facebook') $('#total-shares').attr('data-facebookShares', fbdata.shares) });
}
// Twitter Shares Count
function twitterShares($URL) { $.getJSON('https://cdn.api.twitter.com/1/urls/count.json?url=' + $URL + '&callback=?', function (twitdata) { $('#twitter-count').text('The URL has ' + ReplaceNumberWithCommas(twitdata.count) + ' shares count on Twitter') $('#total-shares').attr('data-twitterShares', twitdata.count) });
}
// LinkIn Shares Count
function linkdInShares($URL) { $.getJSON('https://www.linkedin.com/countserv/count/share?url=' + $URL + '&callback=?', function (linkdindata) { $('#linkdin-count').text('The URL has ' + ReplaceNumberWithCommas(linkdindata.count) + ' shares count on linkdIn') $('#total-shares').attr('data-linkdInShares', linkdindata.count) });
}
// Check if all JSON calls are finished or not
function checkJSON_getSum() { if ($('#total-shares').attr('data-facebookShares') != undefined && $('#total-shares').attr('data-twitterShares') != undefined && $('#total-shares').attr('data-linkdinshares') != undefined) { } // Check for JSON again! else { setTimeout(function () { checkJSON_getSum(); }, 200); }
}
function totalShares($URL) { linkdInShares($URL); twitterShares($URL); facebookShares($URL); checkJSON_getSum();
}
Social Share Count With JS - Script Codes
Social Share Count With JS - Script Codes
Home Page Home
Developer Hemant Aggarwal
Username mstoic
Uploaded January 09, 2023
Rating 3
Size 2,515 Kb
Views 8,096
Do you need developer help for Social Share Count With JS?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Hemant Aggarwal (mstoic) Script Codes
Name
3 Level Menu jQuery
Navigation for Touch
Adsense Code Converter - Mstoic.com
Continuous News Ticker jQuery
Amazing White Border Below Link
DEL - SIP Calculator
Simple Slider Images
BreadCrumb Design
Pop Up AAA
Material Visiting Card Back
Create amazing blog posts with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!