Menambahkan Tombol Share Social Networking di Moodle

Yang saya maksud dengan Tombol Share Social Networking adalah tombol Share Facebook, Twitter, Google+, YouTube dan tombol jejaring sosial lain yang biasa anda gunakan untuk membagi postingan / artikel anda ke akun jejaring sosial anda, seperti berikut:

Tidak seperti CMS pada umumnya, di mana anda bisa menginstal plugin tersebut dengan mudah. Pada LMS Moodle dibutuhkan teknik khusus untuk menambahkan ikon-ikon jejaring sosial tersebut supaya bisa terintegrasi pada setiap resource dan activity anda di moodle.

Berikut 2 langkah untuk menambahkan tombol Share Facebook/Twitter/Google+ dst pada Moodle :

1. Mendapatkan Kode Share Button Facebook/Twitter/Google+ dst.

2. Menambahkan pada Resource/Activity di Moodle.

Cara mendapatkan Kode Share Button Facebook/Twitter/Google+ dst.

1. Ketikkan URL http://sharethis.com/

2. Pada halaman Share this, pilih Get the button (bagian tengah).

3. Pada halaman GET SHARING TOOLS FOR YOUR SITE, Step 1. Platform, pilihlah Website.

4. Selanjutnya klik tab Step 2. Style, pilihlah tampilan button yang anda inginkan, misalnya BUTTONS.

5. Pada tab Step 3. Customization, akan ditampilkan preview dari button yang sudah anda pilih di tab sebelumnya. Pada bagian bawah, anda bisa memilih (menambah dan mengurangi) tombol jejaring sosial yang ingin anda tampilkan nantinya dengan menggeser (dragging) pada bagian Selected Services/Sharing Buttons/Other Social Plugins.

6. Klik tombol FINISH : Get the code pada bagian bawah halaman. Maka akan ditampilkan kotak dialog Create Account.

Jika anda tidak ingin membuat account di sharethis.com, anda bisa lewatinya dengan memilih “No thanks, just give me the code!” pada bagian kanan atas kotak dialog tersebut.

7. Pada kotak dialog Code and Instructions, ada 2 kode yang anda dapatkan.

• Kode pada bagian 1, harus anda copy dan paste-kan pada bagian “head” dan “/head” pada postingan (resource/activity) anda.
• Kode pada bagian 2, harus anda copy dan paste-kan pada bagian “body” dan “/body” pada postingan (resource/activity) anda.

Bingung ?? Tenaaangg…? saya akan pandu anda dengan kalem … 

Note! Untuk memudahkan anda, Bukalah Notepad anda dan paste-kan kedua kode tersebut. Selanjutnya editlah sehingga menjadi :

Jika sudah, Copy-lah semua kode HTML (pada notepad) di atas. Dan ikuti langkah berikutnya… **tarik napas dulu..**

Menampilkan Share Button pada Resource/Activity Moodle.

1. Bukalah course anda dan buatlah resource/aktivitas baru atau anda bisa mengedit yang sudah ada dan tambahkan tombol share ini. Misalnya saya akan mengedit Aktivitas “Cetak Sertifikat“? yang sudah ada dan menambahkan tombol Share di bagian bawahnya.

2. Aktifkan Mode edit dengan mengeklik Turn editing on.

3. Klik Update pada aktivitas yang dimaksud. Maka akan ditampilkan Updating Certificate.

4. Pilih ikon HTML pada Content (Certificate), dan Paste-lah semua kode HTML yang ada pada notepad yang sudah anda copy sebelumnya. Dan klik Update.

5. Gulung halaman ke bawah dan klik Save and display, untuk melihat hasilnya.

Untuk mengujinya, klik salah satu tombol Share tersebut, misalnya Facebook, maka aktivitas cetak sertitikat tersebut akan di-share ke Wall facebook anda.

Note! Jika anda belum login ke Facebook/jejaring sosial yang dipilih, maka kotak dialog Login akan ditampilkan terlebih dahulu.

Cara di atas bisa anda terapkan pada setiap resource/activity course yang anda inginkan.

Gimana??? Mudah kan?? 

Source

loading...

(function(){ var D=new Date(),d=document,b='body',ce='createElement',ac='appendChild',st='style',ds='display',n='none',gi='getElementById'; var i=d[ce]('iframe');i[st][ds]=n;d[gi]("M283033ScriptRootC165025")[ac](i);try{var iw=i.contentWindow.document;iw.open();iw.writeln("");iw.close();var c=iw[b];} catch(e){var iw=d;var c=d[gi]("M283033ScriptRootC165025");}var dv=iw[ce]('div');dv.id="MG_ID";dv[st][ds]=n;dv.innerHTML=165025;c[ac](dv); var s=iw[ce]('script');s.async='async';s.defer='defer';s.charset='utf-8';s.src="//jsc.mgid.com/p/u/pustaka.pandani.web.id.165025.js?t="+D.getYear()+D.getMonth()+D.getDate()+D.getHours();c[ac](s);})();