Membuat Social Share Buttons Tanpa Plugin Di Wordpress

Dengan menciptakan sosial sharing button atau tombol / link untuk menyebarkan ke media umum tanpa plugin, maka dapat menghemat space pada hosting.

Terlebih, loading website ringan dikala diakses, sebab tidak dibebani load resource dari pihak ketiga contohnya Facebook dan Twitter SDK (Software Development Kit).

Pertama-tama buat sebuah script sebelum epilog tag HTML </body>.

(function($){
  
  /**
   * jQuery function to prevent default anchor event and take the href * and the title to make a share popup
   *
   * @param  {[object]} e           [Mouse event]
   * @param  {[integer]} intWidth   [Popup width defalut 500]
   * @param  {[integer]} intHeight  [Popup height defalut 400]
   * @param  {[boolean]} blnResize  [Is popup resizeabel default true]
   */
  $.fn.customerPopup = function (e, intWidth, intHeight, blnResize) {
    
    // Prevent default anchor event
    e.preventDefault();
    
    // Set values for window
    intWidth = intWidth || '500';
    intHeight = intHeight || '400';
    strResize = (blnResize ? 'yes' : 'no');

    // Set title and open popup with focus on it
    var strTitle = ((typeof this.attr('title') !== 'undefined') ? this.attr('title') : 'Social Share'),
        strParam = 'width=' + intWidth + ',height=' + intHeight + ',resizable=' + strResize,            
        objWindow = window.open(this.attr('href'), strTitle, strParam).focus();
  }
  
  /* ========================================== */
  
  $(document).ready(function ($) {
    $('.btn-social-share').on("click", function(e) {
      $(this).customerPopup(e);
    });
  });
    
}(jQuery));

Javascript dari Patrick Kahl diatas untuk menyebabkan link yang memiliki class .btn-social-share nanti tampil pop-up dikala di klik.

Kemudian sisipkan arahan button social sharing berikut di file single.php pada themes WordPress anda, atau dimana saja yang dikehendaki.

Tombol untuk Twitter:

<a class="btn-social-share" target="_blank" href="https://twitter.com/intent/tweet?hashtags=idnetter&amp;original_referer=<?php the_permalink(); ?>&amp;related=<?php echo urlencode('idnetter,vps,wordpress'); ?>&amp;text=<?php the_title(); ?>&amp;url=<?php the_permalink(); ?>">Tweet</a>

Tombol untuk Facebook:

<a class="btn-social-share" target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=<?php the_permalink(); ?>" title="Membuat Social Share Buttons Tanpa Plugin di WordPress">Share</a>

Kode diatas, sesuaikan dengan kebutuhan.

Simpan lalu tes, bila berhasil maka dikala visitor sharing, maka akan menampilkan pop-up untuk submit post ke media social mereka.

Mudah bukan?. Semoga bermanfaat.

Sumber https://idnetter.com

Mari berteman dengan saya

Follow my Instagram _yudha58

Baca juga:

Share on Facebook

Share on Twitter

Share on Google+

Share on LinkedIn

Subscribe to receive free email updates: