HTML: Bagaimana membuat sendiri Button Facebook dan Twitter share

Sebarinn yukkShare on FacebookShare on Google+Tweet about this on TwitterShare on LinkedInPin on Pinterest

Serunya kalau halaman website kita memiliki button Facebook atau Twitter, selain terlihat lebih social juga sangat membantu publikasi website. Tapi bagaimana cara membuat sendiri button Facebook dan Twitter tersebut? lanjutkan bacanya yah ๐Ÿ™‚

Untuk yang memiliki website dengan CMS, pasti mudah karena, sudah ada plugin tersedia, tinggal install, setting-setting sedikit jadi deh facebook dan twitter share-nya. Tapi kalau tidak pake CMS, bagaimana membuat sendiri button facebook dan twitter share itu? Sebenarnya, di websitenya facebook dan twitter sendiri sudah ada panduan lengkap mengenai cara membuat button facebook share dan twitter share ini. Anggaplah ini terjemahannya dan semoga anda tidak bingung hehe.

1. Button Facebook share sendiri



Kode HTML untuk membuat buton tersebut adalah:

<a href="http://www.facebook.com/share.php?u=http://orangorangan.com/bagaimana-membuat-sendiri-button-facebook-dan-twitter-share" target="_blank">
<img class="alignleft size-full wp-image-664" title="custom-fb-share" src="http://orangorangan.com/wp-content/uploads/2012/02/custom-fb-share.png" alt="" width="150" height="41" />
</a>

Sudah tahu kan yang mana yang diganti kalau mau share alamat website sendiri? oke sekarang lanjuuuut

2. Button Twitter share sendiri




Kode HTMLnya adalah:

<a href="http://twitter.com/intent/tweet?url=http://orangorangan.com/bagaimana-membuat-sendiri-button-facebook-dan-twitter-share&amp;[email protected]&amp;hashtags=orangorangan" target="_blank">
<img class="alignleft size-full wp-image-664" title="custom-twitter-button" src="http://orangorangan.com/wp-content/uploads/2012/02/custom-twitter-button.png" alt="" width="150" height="41" />
</a>

Nah, sedikit penjelasan untuk custom twitter button ini:

url: isi dengan url tujuan
text: deskripsi singkat mengenai url (perhatikan tanda ‘+’ berarti spasi)
@jipeus: id twitter kamu atau yang bersangkutan
hastags: #

that’s all teman-teman, gampang kan? kalo iya bantu share dong biar yang lain nambah pengetahuan juga ๐Ÿ™‚

Sebarinn yukkShare on FacebookShare on Google+Tweet about this on TwitterShare on LinkedInPin on Pinterest
  • Untuk yang facebook, bagaimana kalau bukan share, tetapi like? Mohon infonya, thx

  • Andri_raj

    Andri

    Selamat siang Mas, infonya sangat berguna banget, tp sayang saya awam bt website, bisa dijelaskan lebih detail lagi…???Terima kasih

    • Halo mas Andri,

      Untuk Facebook share: Yang diganti cukup nilai href (setelah ‘http://www.facebook.com/share.php?’ ganti dengan alamat website yang mau dishare) dan nilai src (dengan alamat image yang mau dipakai)

  • DAvid

    informasinya berguna banget bro… ini yang saya nyari2 dari kemaren, ternyata ada disini. Terima Kasih

  • bams

    gan mau tanya dong.

    itu kan page yang mau kita sharenya sudah di buat ya contoh “http://orangorangan.com/bagaimana-membuat-sendiri-button-facebook-dan-twitter-share/”

    nah kalau generate otomatis sesuai alamat webnya gimana ya.?

  • Andri Hermawan

    Terimakasih Informasinya mas, cuma saya bingung menerapkannya di php nya gmn? maklum baru belajar. bisa di kasih contoh bagaimana memanggil fungsi nya agar dapat di pasang di setiap halaman artikel saya.

  • fauzzen

    klo ditambah counter scriptnya gimana ya bos?

  • meliyanto

    tlng bro klo kasi info yg kongkrit utk orang awam atau pemula seperti saya,ini malah bikin pusing kepala.dimana hrs di ketik kode cssnya dan yg mana hrs diganti nama webnya?tlng lebih terperinci seklian jgn tanggung tanggung,klo penjelasan seperti ini sdh buanyaak sekali.sorry saya msh awam

  • yubi

    okee

  • Ahmad Syarifudin

    thank