Generelt bruger vi sociale delingsknapper på vores side til at dele indhold på vores site på forskellige sociale netværksplatforme. Disse knapper til social deling tilføjer få ekstra byte-størrelse til dine websider. Hvis nogen gennemsøger den pågældende webside med langsom internetforbindelse, vil det medføre rod. For at undgå dette især på Responsive Designs kan du indlæse knapper til social deling betinget og stoppe dem for at indlæses på mobile enheder for at undgå rod.
Sådan indlæses sociale widgets betinget:
Nedenfor er en simpel teknik, hvor vi beregner browserens bredde, og hvis bredden overstiger en bestemt bredde, siger kun 480 px, så vises knapperne for social deling.
Her er det bedste, at vi ikke skjuler dem ved hjælp af css, men i stedet helt undgår dem at indlæse, hvilket vil spare meget lastetid, når nogen gennemser fra mobile enheder.
For at implementere betinget indlæsning på din blog / hjemmeside skal du først tilføje alle de nødvendige sociale widgets til din blog ved hjælp af den sædvanlige procedure. For eksempel kan du besøge facebook.com at generere kode til knappen Like mens dev.twitter.com vil giver koder til Tweet- og følg-widgets på Twitter.
Fjern JavaScript fra disse genererede koder - alt, hvad der er mellem tags – and add everything else to your website template. Then copy-paste the following snippet before the closing tag of your website template.
(function(doc, script, minimum) {
// Calculate the width of the 's screen
var browserWidth = window.innerWidth
|| doc.documentElement.clientWidth
|| doc.body.clientWidth;
// Load JavaScript only if the site is being viewed on a wide (non-mobile) screen
if (browserWidth > minimum) {
var js, frag = doc.createDocumentFragment(),
// Credit : Stoyan Stefanov of phpied.com
js_queue = function(url, id) {
if ( ! doc.getElementById(id) ) {
js = doc.createElement(script);
js.src = url; js.id = id;
frag.appendChild(js);
}
};
// These are the most common social widgets, remove the ones you don't need
js_queue ("https://apis.google.com/js/plusone.js", "googleplus-js");
js_queue ("//platform.twitter.com/widgets.js", "twitter-wjs");
js_queue ("//connect.facebook.net/en_US/all.js#xfbml=1","facebook-jssdk");
js_queue ("//platform.linkedin.com/in.js", "linkedin-js");
js_queue ("//assets.pinterest.com/js/pinit.js", "pinterest-js");
var fjs = doc.getElementsByTagName(script)[0];
fjs.parentNode.insertBefore(frag, fjs);
}
// Set the minimum width here (default is 480 pixels)
} ( document, 'script', 480 ) );
Ovenstående JavaScript-kode indlæser asynkront alle de populære sociale widgets - Twitter, Facebook, LinkedIn, Google+ og Pinterest - men du kan fjerne js_queue-opkaldene til widgets, som du ikke planlægger at bruge på dit websted. Gem ændringerne, og du er færdig.
Det er det! Du er langsomt og med succes flyttet til de avancerede strategier inden for blogging og SEO. Dette kapitel vil helt sikkert hjælpe dig med at reducere blogens indlæsningstid, som er et af de afgørende aspekter vedrørende On Page SEO.
