Make SEO Smart Link with Icon use jQuery - Hallo friend Cara Mudah Posting Gratisan, In the article you read this time with the title Make SEO Smart Link with Icon use jQuery, we have prepared well for this article you read and download the information therein. hopefully fill posts Article jQuery, Article Snippet, Article Trik dan Tips, Article Tutorial, we write this you can understand. Well, happy reading.

Title : Make SEO Smart Link with Icon use jQuery
link : Make SEO Smart Link with Icon use jQuery

Make SEO Smart Link with Icon use jQuery

Master Koben akan update sedikit trik seputaran tentang links. Apakah sobat masih ingat dengan postingan fenomenal pasang SEO smart link untuk Blogspot? Tutorial sekarang tidak jauh berbeda dengan hal tersebut. Tetapi yang membedakan di sini adalah, akan kita sematkan gambar icon pada link keyword! Sehingga gambar icon unyu-unyu akan tampak tepat setelah link-keywords. Perhatikan pada screen-shot berikut:Gambar di atas menunjukan penerapan keywords dengan kata script, hacker, blogspot and blogger. Jadi ketika sobat melakukan kegiatan mengetik untuk post, lalu sobat mengetikan ada keyword yg di tuju, maka jangan lupa tuliskan syntax link yang tujuannya terserah kalian! Tutorial ini terhubung dengan script jQuery, jadi di dalam template sobat harus sudah terpasang ya :)

.entry-title {
  padding-right: 21px;    
  vertical-align: middle;
}
.KEYWORD-1 {
  background: url(LINK-IMAGE) no-repeat right transparent;
}
.KEYWORD-2 {
  background: url(LINK-IMAGE) no-repeat right transparent;
}
.KEYWORD-3 {
  background: url(LINK-IMAGE) no-repeat right transparent;
}
.KEYWORD-4 {
  background: url(LINK-IMAGE) no-repeat right transparent;
}

Gantikan KEYWORD- sesuai dengan keinginan. LINK-IMAGE ganti juga dengan gambar resolusi icon (16px x 16px)

<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
  $.expr[":"].contains = $.expr.createPseudo(function(arg) {
    return function( elem ) {
        return $(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
    };
});
$('.entry-title').each(function() {
var title = $(this);
  if(title.is(':contains("KEYWORD-1")')) {
     title.addClass('KEYWORD-1');
}
  else if (title.is(':contains("KEYWORD-2")')) {
   title.addClass('KEYWORD-2');
}
  else if (title.is(':contains("KEYWORD-3")')) {
    title.addClass('KEYWORD-3');
}
  else {
    title.addClass('KEYWORD-4');
}
});
$( 'a[href^="http://"]' )
    .attr( 'target','_blank' )
    .addClass( 'entry-title' )
});
//]]>
</script>

Pada script di atas baris else {
title.addClass('KEYWORD-4');
}merupakan default link keyword. Jadi ketika anda membuat syntax link, namun di luar kontek keyword yg di buat maka gambar icon yg muncul adalah kode tersebut.
Demo: codepen.io/beben-koben/full/vNoJom
Source: codepen.io/mariemosley/pen/zueEI
Other technique: jsfiddle.net/barmar/S6d54/4

Happy snippet \m/

Thus articles Make SEO Smart Link with Icon use jQuery

that is all articles Make SEO Smart Link with Icon use jQuery This time, hopefully can provide benefits to all of you. Okay, see you in another article posting.

You now read the article Make SEO Smart Link with Icon use jQuery with the link address https://autopostingblogspot.blogspot.com/2015/11/make-seo-smart-link-with-icon-use-jquery.html