วิธีสร้าง Follow Gadget สวย ๆ จาก Google Friend Connect

บทความนี้ผมจะนำเสนออีกหนึ่งวิธีในการสร้าง Gadget ผู้ติดตามบน Blogger ซึ่งเป็น gadget ที่มีอยู่ใน List พื้นฐานของ Blogger อยู่แล้ว แต่บางแม่แบบโดยเฉพาะแม่แบบรุ่นใหม่อาจจะมีปัญหากับ gadget นี้ คือเมื่อติดตั้งแล้วไม่ทำงาน ไม่แสดงผลหรือผู้อื่นไม่สามารถติดตามบล็อกของคุณได้ ก็จะทำให้คุณเสียโอกาสในการเพิ่มจำนวนสมาชิก

วิธีสร้างบล็อก สอนทำบล็อก

นอกจากนี้วิธีที่นำเสนอในบทความนี้สามารถใช้ได้กับบล็อกชนิดอื่น เช่น wordpress รวมทั้งเว็บไซต์ด้วย


ขั้นตอนการสร้าง Follow Gadget จาก Google Friend Connect

ขั้นที่ 1 ไปที่ http://www.google.com/friendconnect/ และลงชื่อเข้าสู่ระบบด้วยบัญชีของ Blogger

วิธีสร้าง blogger blogspot




ขั้นที่ 2 มองทางซ้ายมือจะเห็น ปุ่มสำหรับ เพิ่มไซต์ใหม่ ให้คลิกและกรอกข้อมูลลงไปและดำเนินการต่อ

วิธีสร้าง blog 


สอนแต่งบล็อก 


ขั้นที่ 3 ต่อไปเราจะสร้างโค้ดของ Gadget สมาชิกเพื่อนำมาติดตั้งบน Blogger ซึ่งเริ่มโดยการ คลิกปุ่มเพิ่มแกดเจ็ตสมาชิก

สอนสร้างบล็อก สอนทำบล็อก

จากนั้น เลือกขนาด  >> เลือกสี และกดสร้างโค้ด

วิธีทำบล็อก blogger blogspot

โค้ดที่ได้จะมีลักษณะดังนี้

<script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script>
<!-- Define the div tag where the gadget will be inserted. -->
<div id="div-2427080382746906139" style="width:300px;border:1px solid #cccccc;"></div>
<!-- Render the gadget into a div. -->
<script type="text/javascript">
var skin = {};
skin['BORDER_COLOR'] = '#cccccc';
skin['ENDCAP_BG_COLOR'] = 'transparent';
skin['ENDCAP_TEXT_COLOR'] = '#ffffff';
skin['ENDCAP_LINK_COLOR'] = '#660000';
skin['ALTERNATE_BG_COLOR'] = 'transparent';
skin['CONTENT_BG_COLOR'] = '#ffffff';
skin['CONTENT_LINK_COLOR'] = '#ff0000';
skin['CONTENT_TEXT_COLOR'] = '#333333';
skin['CONTENT_SECONDARY_LINK_COLOR'] = '#ffffff';
skin['CONTENT_SECONDARY_TEXT_COLOR'] = '#666666';
skin['CONTENT_HEADLINE_COLOR'] = '#333333';
skin['NUMBER_ROWS'] = '15';
google.friendconnect.container.setParentUrl('/' /* location of rpc_relay.html and canvas.html */);
google.friendconnect.container.renderMembersGadget(
{ id: 'div-2427080382746906139',
   site: '11684523236111180665' },
  skin);
</script>

ขั้นที่ 4 นำโค้ดแกดเจ็ตสมาชิกไปติดตั้งบน Blogger

วิธีติดตั้งแกดเจ็ตสมาชิก บน Blogger ทำได้โดยเพิ่ม HTML/จาวาสคริปต์ Gadget แล้ววางโค้ด แกดเจ็ตสมาชิกที่ได้จากขั้นที่ 3 ลงไป


วิธีสร้างบล็อก

เท่านี้ก็ได้ gadget ผู้ติดตามที่งามกว่าเดิมมากมายครับ

วิธีสร้าง blog  


คำเตือน ถ้าคุณมีสมาชิกอยู่แล้วสมาชิกเดิมจะไม่ติดมากับ Gadget ที่ติดตั้งเข้าไปใหม่ วิธีนี้จึงเหมาะกับบล็อก/เว็บไซต์ที่ยังไม่มีสมาชิกติดตาม

นอกจาก gadget ผู้ติดตามแล้วยังมี gadget ให้เลือกใช้อีกมากมายที่ google friendconnect ลองเลือกมาใช้กันครับ สุดท้ายหวังว่าคงชอบกันนะครับ สวัสดีครับ 

ตอนนี้มีความคิดเห็น : 3 ความคิดเห็น
หากคุณมีปัญหาหรือข้อสงสัยใดๆ สามารถสอบถามได้จากกล่อง comment ด้านล่างนี้ได้เลยครับ

  1. ผม สมัคร Google Friend Connect
    แล้วเอาโค้ดไปติดที่หน้าเว็บแล้วมันไม่แสดงผลอะไรเลยครับ

    เว็บผมสร้างด้วย html ครับ

    ช่วยชี้แนะด้วยครับ

    ขอบคุณครับ

  1. ผมเข้าใช้งานgoogle friend connectไม่ได้ต้องสมัครใหม่มีหรือเปล่า

  1. ขอบคุณครับ
    http://vistocks.blogspot.com/

แสดงความคิดเห็น

ถ้าต้องการโพส HTML ให้แปลงโค้ดที่เครื่องมือด้านล่างนี้ก่อนครับ

สร้างบล็อก Facebook SEO บล็อก Linkwheel iMacros Link Wheel