ก่อนหน้านี้หลายๆ ท่านคงได้เห็นเสิร์ชที่บล็อกเป้มาก่อนแล้ว เป้ก็พึ่งได้ลองศึกษาแล้วก็
    ทำลงบล็อกตัวเองดูครับ และหลังจากผ่านมาได้สักระยะแล้วก็มีหลายๆ คนได้มาใช้งาน
    จริง ส่วนใหญ่คำค้นจะเป็นพันธุ์หมา แล้วก็ชื่อเพลงต่างๆ (เป้ดูผลการค้นหาจาก
    Google
    Analytics
    ) ...ก็สรุปใช้งานได้ดีจริง เป้เลยถือโอกาสมาบอกต่อถึงวิธีทำ เพราะเห็นจาก
    บล็อกของหลายๆ คน
    ก็มีข้อมูลที่เป็นประโยชน์ จากเครื่องมือกูเกิลเสิร์ชนี้จะช่วยให้
    บล็อกของเพื่อนๆ สะดวกและง่ายต่อการค้นหา หาาาา หาาาา...

    วิธีทำกูเกิลเสิร์ชในบล็อกฉัน

    ภาพตัวอย่างการแสดงผล


  • ก่อนอื่นเลยเราต้องมี Google Account ก่อนนะครับ google.com/accounts
  • เมื่อมีแอคเค้าท์แล้ว ก็ทำการขอสร้างเสิร์ชเอนจิ้นเป็นของเราเอง google.com/coop/cse
    คลิก Create a Custom Search Engine และดูตัวอย่างของเป้ก็ได้ครับ...

  • กรอกข้อมูลครบแล้ว อย่าลืมติ๊กถูก I have read ด้วยนะ
  • เสร็จก็ คลิก Next แล้วในหน้าต่อไปก็คลิก Finish เป็นอันจบการขอสร้างเสิร์ชเอนจิ้น
  • ขั้นตอนต่อไปเป็นการจัดการรายละเอียด คลิก google.com/coop/manage/cse
    คลิก Control Panel ในหัวข้อ Basics หัวข้อย่อย Preferences อันล่างสุด
    Advertising status: เราเปลี่ยนเป็น Do not show ads on results pages
    คือเราไม่ต้องการให้โชว์โฆษณาในหน้าแสดงผลลัพธ์การค้นหา
    ...Save Changes
    (แต่เป้ไม่รู้ว่าสำหรับบล็อกที่มีโฆษณาด้วยจะใช้ได้ไหมนะครับ)
  • หัวข้อ Sites คลิก Add Sites ในช่อง URL: ให้ใส่ชื่อบล็อกเราลงไป แล้วลงท้าย
    ด้วย * ตัวอย่าง
    http://farsaiex.exteen.com/* ...Save (ถ้าหากมีอยู่แล้วก็ลบ
    ออกแล้วใส่ใหม่ได้เลย)
  • หัวข้อ Look and feel หัวข้อย่อย Customize your search results ในส่วนนี้สามารถ
    เปลี่ยนสีตัวอักษรต่างๆ เพื่อให้เข้ากับธีมของบล็อกเราได้
  • หัวข้อ Code หัวข้อย่อยอันแรก ให้เลือกเป็นอันที่ 2 คือ Host results on your website:
    จากนั้นข้ามมาหัวข้อย่อยที่ 2 ในช่องให้เราใส่ชื่อหน้าเวปเสิร์ชของเราที่จะให้แสดงผลการ
    ค้นหา ตัวอย่างหน้าเวปเสิร์ชของเป้เอง http://farsaiex.exteen.com/20090202/search-page-2
    ในส่วนของหน้านี้เราสร้างเองจาก Entry หรือ Page ก็ได้ และเลือกเป็น Top and Right
    จะเหมาะสมที่สุดครับ

  • ต่อมา หัวข้อย่อย Search box code จะมีโค๊ดอยู่ 2 อัน เราก็นำโค๊ดทั้ง 2 อันนี้ไปใส่
    ในหน้าเวปเสิร์ชที่เราสร้างขึ้นตะกี้นี้ครับ วิธีการใส่โค๊ด...
    • เข้า Edit ที่หน้าเวปเสิร์ชของเรา จากนั้นคลิกที่ เพื่อปิดการแสดง
      คำสั่ง
      ก่อน (หรือจะใช้ แทนก็ได้)
    • แล้วนำโค๊ดทั้ง 2 มาใส่เลย ตัวอย่าง...

  • ใส่ครบเรียบร้อย คลิก กลับคืนเป็น Enable แล้วก็ Save เป็นอันจบขั้นตอน
    การใส่กูเกิลเสิร์ชที่หน้าเวปเราครับผม

 

    ต่อไปเป็นขั้นตอนนำช่องเสิร์ชออกมาไว้ที่หน้าบล็อก

    ตัวอย่างช่องเสิร์ชที่หน้าบล็อก 

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

  • ไปที่ Widgets แล้วนำโค๊ดเมื่อตะกี้นี้มา แต่เอาเฉพาะโค๊ดอันแรกมาใส่ไว้ใน Custom Code
    เพื่อนๆ ก็เลือกเอาว่าจะใส่
    Custom Code ตัวไหน

  • เมื่อนำโค๊ดมาใส่แล้ว ให้ใส่คำสั่ง <div id=searchbox> ที่หน้าสุดของโค๊ด
  • ไปที่ CSS Editor แล้วใส่คำสั่งนี้ไปไว้ที่ด้านล่างสุด 
    #searchbox {
    position:absolute;
    margin-left: 0px;
    margin-top: 0px;
    }
  • margin-left คือย้ายตำแหน่ง ซ้าย-ขวา (ก็ปรับค่าตัวเลขเอา)
    margin-top คือย้ายตำแหน่ง ขึ้น-ลง (สามารถปรับตัวเลขได้น้อยกว่า 0px คือ -1px)
    โดยเริ่มจากค่า 0px ก่อน แล้วก็ค่อยๆ เปลี่ยนค่าตัวเลข แล้วก็ดูการเปลี่ยนแปลงที่หน้าบล็อก
    ตัวอย่างใส่คำสั่ง

  • เสร็จแล้วอย่าลืม Save ละ
    ...จากวิธีนี้เราก็สามารถจัดวางย้ายตำแหน่งช่องเสิร์ชที่หน้าบล็อกได้อย่างอิสระโดยไม่ต้องรบกวน
    แก้ไขธีมให้เหนื่อยเลยละครับ แต่บล็อกของบางคนอาจจะไม่จำเป็นต้องทำวิธีนี้ก็ได้ แบบว่านำไป
    ใส่ใน Custom Code ที่อยู่ตำแหน่ง Top menu ใน Widgets พอดี

    มีปัญหาข้อสงสัยก็คอมเม้นท์หรือส่ง ems หรือโพสท์ข้อความลงที่ shoutbox ด้านล้่างได้เสมอครับ

    ขอบคุณ คุณ xvista ที่ให้คำปรึกษาด้านคำสั่งต่างๆ เรื่อยมา
    ขอบคุณ คุณ itimez ที่ช่วยเป็นหนูทดลองยาในการทดลองครั้งนี้ 55555

Comment



smilebig smileopen-mounthed smileconfused smilesad smileangry smiletonguequestionembarrassedsurprised smilewinkdouble winkcry

Tweet

อัพใกล้เคียงกันเลยแฮะ sad smile

#1 By i' FY on 2009-02-15 17:23

มีประโยชน์ดีจังเลยค่ะ

เอาไป1ดาว

แล้วลองกลับไปทำบ้างดีกว่าcry Hot!
เฮ้อ...
คนแก่อ่านแล้ว....งง....
question
ขอบคุณ ๆ ^^


แต่ยังไม่อยากทำ


ขอบิ้วก่อน อิๆ


อ่ะ Hot! น่าจะมีคนอยากทำ

#4 By sansanae on 2009-02-15 17:41

น้องเป้ ... คนแก่อ่านแล้วงงจริง ๆ นะเนี่ย!!!

(ขอบคุณที่ชมว่านางแบบงามนะจ๊ะ)

#5 By Nong-Takrai on 2009-02-15 17:43

แหม่ อุดมไปด้วยสาระและประโยชน์ ถ้าอีฟไม่งงเดี๊ยวจะลองทำดูนะคะ open-mounthed smile

#6 By eVeZaa on 2009-02-15 17:44

ขอบคุณคร้าบ

เดี๋ยวสอบเสร็จแล้วจะลองทำบ้าง

Hot! Hot! Hot!
น่าสนใจมากเลยครับ
ไว้มีโอกาสจะลองทำดูมั่ง
Hot!

#9 By รัตนาดิศร on 2009-02-15 17:47

ว้าวว้าวbig smile

#10 By V@R on 2009-02-15 17:52

ไว้สมาธิดี ๆ จะมาอ่านละเอียดแล้วทำตามbig smile
ขอบคุณค่ะ

#11 By จอมบงการ on 2009-02-15 17:57

หนูทดลองเหรอ Hot! Hot! Hot!

#12 By ไอ้ไทม์ on 2009-02-15 18:03

จะเอามาใส่ได้ต้องเป็ฯ CSS แบบใหม่ด้วยไหมอะจ๊ะ

#13 By NiDA MAilO on 2009-02-15 18:12

โอ้ววว ความรู้ๆๆๆ

** tongue << คือไรจ๊ะ .. 555

#14 By KAINUI * on 2009-02-15 19:05

oh yesbig smile

#15 By kea on 2009-02-15 19:08

ต้องลองศึกษา

big smile

น่าสนใจมาก
แต่ตอนนี้เนื้อหาบล็อกวิกมีนิดเดีย ไม่รู้มีเนื้อหาอะไรให้เสิร์ชมั่ง 555

Hot!

#16 By HeDw!g on 2009-02-15 19:31

เอาไว้รอให้บล็อกใหญ่โตกว่านี้ก่อนดีกว่า ใส่ไปตอนนี้คงไม่มีคนสนใจ

#17 By WhiteMapleS on 2009-02-15 19:33

ไม่แน่ใจว่า บล็อกตัวเองจะมีข้อมูลสาระ ให้คนอื่นเอาไปใช้งานได้ป่าว sad smile ส่วนใหญี่เขียนตามอ.ใจ

#18 By NihaoJAA on 2009-02-15 20:42

โอ้ Exclusiveconfused smile

#19 By น้ามชา on 2009-02-15 21:40

คุณเป้หายไปนานเลยนะคะ question

#20 By Burning` on 2009-02-15 21:51

ขอบคุณค่า cry

#21 By 「nA✿mae」 on 2009-02-15 21:52

ไว้จะลองไปทำบ้างนะ ^^

Hot!
เนื้อหาในบล๊อคตัวเองยังน้อยอยู่เลยอ่ะค่ะ ไว้รอเยอะกว่านี้อีกสักหน่อย แล้วจามาเอาลงดีกว่า ให้ดาวไว้ก่อนเลยแล้วกันเนอะะHot! Hot! Hot! Hot!

#23 By Glinda The Good on 2009-02-15 22:54

big smile Hot!

แล้วเจอกันใหม่ด้วยความห่วงใย..confused smile
เก่งคอดดดด Hot!

#25 By Bluemoon on 2009-02-16 00:35

โอ้ว ขอบคุณคับเก่งโปรจัง

แอบชอบ fav ที่ปรับให้เป็น โชว์หน่อย กะ ปิดเหอะ นั่นจัง confused smile

#26 By p.cobra on 2009-02-16 00:36

โห่ย ไฮเทคค่อด ป้าเฮ็ดบ่อเป็น

อ้อ ป้าเรียนหมอนวดที่รามาจ้ะ

#27 By ชาเขียวaddict on 2009-02-16 01:11

ไม่ยากอย่างที่คิดเลยconfused smile
เจ๋งดีอะคุณเป้
แต่บล็อคเราคนเข้าน้อย ไม่ต้องทำก็ได้

ฮ่าฮ่า



ไม่ได้มาเยือนตั้งนาน
สบายดีมั้ยคะ ? open-mounthed smile
big smile

#30 By ยัยตูดเป็ด on 2009-02-16 07:48

ทำไมไทม์กลายเป็นหนูลองยาซะงั้น... sad smile

#31 By → Ra$s*m€` [❤] on 2009-02-16 11:30

ชอบครับ... เพิ่งเห็นบล้อกนี้ ขอFav ซะเลย

#32 By inatmon on 2009-02-16 11:39

ทำไปแล้วก่อนหน้านี้ แต่ใช้ไปวางใน Custom Code เอา
ตอนทำออกจะงมๆ มั่วๆ นิดๆ จนได้มา
แต่ให้มารีวิวละเอียดๆ แบบนี้ ไม่ได้แน่ๆ ค่ะ

รีวิวละเอียดดีจังค่ะ big smile

#33 By moodee on 2009-02-16 12:01

อ่านเจอแต่ยังไม่ได้อ่าน
ว่าง ๆ จะกลับมาอ่าน
คิดว่าน่าจะให้ความรู้big smile

#34 By jamebox on 2009-02-16 13:17

ทำยากจังเลยอะครับ >.< ต้องการคำอธิบายเพิ่มเติม

ได้โปรดชี้แนะด้วยครับ -3-

#35 By ::: Beer's ::: on 2009-02-16 13:47

ถ้ามี Google Adsense ก็ Add Google Custom Search ถ้ามีคน Search เวบเรา แล้วมี Ads ขึ้น แล้วเค้า Click Ads ที่ว่า เราก็ได้ตังค์ด้วยอะครับ double wink

#36 By n h e p h e x on 2009-02-16 14:28

เอาเป็นว่า

ถ้าจะ search จะเข้า blog นี้เอาดีกว่า นะคะ surprised smile

#37 By นภธารา on 2009-02-16 14:35

ทำแล้วจ้าbig smile
กำลังหาวิธีทำอยู่เลยค่ะ ขอบคุณมากค่ะ

#39 By Daughter Of Sparda on 2009-02-16 15:03

Hot!

#40 By subsub on 2009-02-16 16:10

ประทับใจหมาหางโค้งในช่องคอมเม้น *-*

#41 By Rinna ♥ on 2009-02-16 16:34

สาระมากครับ

ขอบคุณครับ


Hot! Hot!

#42 By comzine on 2009-02-16 16:35

!!! แมวจริงด้วย !!! อ๊าาาาาาาาาาาาาาาา

#43 By Rinna ♥ on 2009-02-16 17:30

ตอนนี้กำลังจะแปะ Google Translater หละคับ

#44 By on 2009-02-16 18:17

โอ่ะ ยอดเยี่ยมค่ะ ว่างๆจะลองทำดูนะคะ big smile
เดี๋ยวของทำมั่ง

#46 By ดินสอสีม่วง on 2009-02-16 19:52

Hot! Hot! double wink

#47 By ❤ABITA on 2009-02-16 20:06

เป้ชีกอนิน๊า

ว๊ากก!!

#48 By ❤ABITA on 2009-02-16 20:27

เป้ชีกอนิน๊า

ว๊ากก!!

#49 By ❤ABITA on 2009-02-16 20:27

ว้าวๆๆๆๆ Hot!

#50 By iDoi* on 2009-02-16 20:39

Favourites