การใส่ปุ่ม 1 plus ใน blogger

1. เพิมปุ่ ม google 1 plus ลงในเวบบล็อกของ blogger
่
ที่มา : ชวนเพื่อนเขียนบล็อก
http://introduction-blogger.blogspot.com
ผ่านไปอ่านบทความที่ เวบโปรดแห่ งหนึ่ง เหลือบไปเห็นสัญลักษณ์ google 1 plus ซึ่งมีหน้าตาเป็ นปุ่ มคล้าย ๆ facebook like
โดยปุ่ ม google 1 plus ก็คล้าย ๆ กับ facebook like คือเหล่านักอ่านคนใดเกิดชอบใจบทความก็จะกดปุ่ ม +1 ให้ คล้าย กัน
โดยคะแนน +1 นี้จะเป็ นคะแนนที่ผอ่านบทความแจ้งกับ google ถึงคุณภาพของบทความหรื อคุณภาพของเวบไซต์ ความสาคัญมันอยูที่
ู้ ่
คะแนนที่ได้จะแจ้งตรงต่อ google นี่ซิ มันหมายถึงหากมีคะแนนมาก search engine ใหญ่อย่าง google ก็จะให้ความสนใจ
กับบทความหรื อเวบบล็อกของเรา อันนี้ หล่ะเหล่าบล็อกเกอร์ น่าจะติด google 1 plus ไว้ในบทความด้วย หากแวะเข้าไปที่ google
webmaster จะสังเกตเห็นเมนูที่ใช้วิเคราะห์จาก ปุ่ ม google 1 plus ด้วย เป็ นโอกาสเพิ่ม traffic แจ่ม ๆให้กบเวบบล็อกได้
ั
อีกทางเลยหล่ะค่ะ
สาหรับการติดตั้งใน blogger ก็ไม่ยาก ตามดิฉนมากันเลยค่ะ
ั

2. กรณี ที่ 1 เลือกใช้ปุ่มแบ่งปั นของบล็อกเกอร์ ซึ่ งจะแสดงอยูดานล่างของบทความ โดยให้เพื่อน ๆ login เข้า blogger ไปที่ การ
่้
ออกแบบ> องค์ประกอบของหน้า> คลิ๊กแก้ไขการตั้งค่าของบล็อกที่มุมล่างสุ ดของบทความบล็อก
่ ้
หลังจากนั้นจะปรากกฏหน้าต่างให้ต้งค่าบทความ เลื่อนลงไปคลิ๊ก แสดงปุ่ มแบ่งปั น เพื่อให้้ปุ่มแบ่งปั นปรากฏอยูดานล่างของบทความในเว
ั
บบล็อก
แค่น้ ีก็จะปรากฏปุ่ ม google 1 plus ในด้านล่างของบทความแล้วหล่ะค่ะ
กรณี ที่ 2 สาหรับเพื่อนท่านใดที่ได้ใช้ bookmark ของ blogger เช่นดิฉน ลองมาเพิ่ม google 1 plus ไว้ในบทความอีกวิธี
ั
ค่ะ นันคือนา code ไปวางในเวบบล็อก
่

3. ั
ขั้นตอนที่ 1 login เข้า blogger > การออกแบบ> แก้ไข html ติ๊กเครื่ องหมายถูกหน้ากล่อง ขยายเทมเพลตวิตเจ็ต ดังรู ป
ด้านล่างนี้
2. คลิีก ctrl+f
ค้นหา code </head> แล้ว copy code ด้านล่างนี้ ไปวางไว้ก่อน </head>
<script type="text/javascript" src="http://apis.google.com/js/plusone.js">
{lang: 'en-US'} </script>
ดังตัวอย่างรู ปด้านล่าง
3. ต่อจากนั้น คลิ๊ก ctrl+f ค้นหา code <data:post.body> นา code ในตารางนี้ ไปวาง
โดยหากต้องการให้ปม google 1 plus อยูดานล่างของหัวข้อบทความ ก็นา code ไปวางไว้ก่อน <data:post.body>
ุ่ ่ ้
หากต้องการให้ปรากฏด้านล่างบทความก็วาง code ดังกล่าวไว้หลัง <data:post.body>
<div style='float:left'> <g:plusone size="standard"
expr:href="data:post.url"/> </div>

4. ตัวอย่างการนา code มาวางใน html โดยวางไว้ก่อน <data:post.body> เพื่อให้ปม google 1plus ปรากฏอยูดานล่าง
ุ่ ่ ้
ของหัวข้อบทความ
เราสามารถแก้ไขขนาดของ google 1 plus ได้โดยแก้ไข size ใน code เปลี่ยนจาก standard เป็ น
small (ขนาดเล็ก 15px)
medium (ขนาดกลาง 20px)
standard (ขนาดมาตรฐาน 24 px)
tall ( สูง 60px)
ลองปรับเปลี่ยนให้เหมาะกับหน้าตาเวบบล็อกของเรากันนะคะ สาหรับ ชวนเพื่อนเขียนบล็อก ขอเลือก standard ค่ะ
เมื่อเสร็ จแล้วก็ทดลอง เลือกบันทึกแม่แบบ คลิ๊กดูการแสดงผลของบล็อกค่ะ
แค่น้ ีก็จะมี google 1 plus อยูในเวบบล็อกแล้วหล่ะ คลิ๊กเลยดีกว่า ดิฉนคลิ๊ก +1 ให้กบบทความตนเอง เลยดีกว่า
่ ั ั