343 views 56 comments

Langkah Pemasangan Butang Perkongsian Sosial (WordPress)

by on July 23, 2011
 

Jika korang perasan, blog ini mengalami perubahan sedikit sejak semalam apabila aku menambah butang perkongsian sosial pada bahagian atas dan bawah entri. Jika sebelum ini aku hanya memasang butang Facebook Like dan Tweet Button, kini ia ditambah dengan butang Google+. Idea untuk menambah butang ini datangnya dari paparan tema blog Amanz.MY. Disebabkan ia nampak kemas, lalu aku dengan tiada perasaan bersalah aku mencuri idea tersebut.

Jika korang merupakan pengguna tema Thesis, korang boleh mengikuti tutorial khas untuk tema tersebut di blog Si Bintang. Jika korang bukan pengguna Thesis, korang boleh cuba cara yang aku akan tunjukkan ini. Oh ya, paparan pada butang ini juga agak berbeza jika dibandingkan dengan butang yang terdapat pada entri Si Bintang.

 

 

Contoh Butang Sosial Dari Sibintang

 

Satu perkara lagi, buat masa ini, tutorial butang perkongsian sosial ini hanya untuk pengguna WordPress. Aku akan cuba mengubah kodnya bagi pengguna Blogspot dapat menggunakannya. InsyaAllah.

Langkah Pemasangan.

1. Pertama sekali, sila ke bahagian Appearance Editor.  Dashboard > Appearance > Editor.

2. Pastikan korang berada di style.css kerana proses pemasangan akan dimulakan.

Sesetengah theme, korang perlu memasukkan kod dibawah pada lokasi yang lain.

3. Masukkan kod dibawah ke dalam style.css tadi.

Sebelum melakukan pengubahsuaian, aku sarankan korang buat backup kod asal sebagai langkah berjaga-jaga.

4. Seterusnya, pergi ke header.php dan masukkan code dibawah sebelum </head>.


5. Seterusnya pergi ke Single Post (single.php), dan masukkan pula kod dibawah pada tempat yang korang mahu.


Korang boleh memilih untuk meletakkan pada bahagian atas atau bawah entri atau kedua-duanya. Tetapi diingatkan, sila lakukan backup pada kod asal.

6. Sila periksa samaada pemasangan butang sosial ini berjaya. Jika tidak, sila cuba sampai boleh. Boleh tanya pada aku, tetapi mungkin jawapan korang akan terima sedikit lewat.

Tambahan

Untuk butang sosial Facebook, terdapat 2 jenis butang yang disediakan (sila rujuk gambar dibawah). Bagi kod diatas, ia menggunakan butang jenis ‘a’. Bagi mereka yang mahukan butang jenis ‘b’, sila tukarkan kod Facebook diatas, kepada kod dibawah.


Jika kedudukan butang sosial ini kelihatan sedikit terkeluar dari entri, sila lakukan pengubahsuaian pada kelebaran butang Facebook. Ini kerana, kod yang aku buat ini mempunyai kelebaran kira-kira 580px.

Akhirnya berjaya jugak aku siapkan entri ni. Banyak error masa nak lihatkan kod. Kod ini diubahsuai dari kod yang dibuat oleh AzmanIshak. Bagi mereka yang mahu berkongsikan kod diatas, sila lakukan backlink kepada entri ini dan kalau ada yang nak kongsi, tolong jangan lakukan hotlinking pada gambar diatas. Sila save dan upload semula. Hargailah usaha aku membuat kod dan tutorial ini.

Kongsikan Artikel Kami
 

Tinggalkan komen anda