บันทึกการ หาเงินออนไลน์ ของลุงกบ : เพิ่ม Breadcrumb ใน Blogger/Blogspot

Blogger SEO : เพิ่ม Breadcrumb ใน Blogger/Blogspot

ใส่ Breadcrumb ให้กับ Blogger/Blogspot

ห่างหายกันไปนานกับการอัพเดท blog แต่ก็ไม่ได้ไปไหนครับ วนๆ เวียนๆ อยู่แถวๆ นี้ กับแอบไปหลงไหลกับเจ้า 3D Printing Technology สั่งเครื่องมาประกอบ สั่งเส้นพลาสติกมาพิมพ์ขึ้นงานดู แล้วก็แอบเขียน blog เล็กๆ เอาไว้ แต่ก็เช่นกันครับ ไม่ได้อัพเดทอะไรสักเท่าไหร่

มาวันนี้ก็ไม่มีอะไรมากครับ แค่อยากจะมาอัพเดทให้ทุกคนได้ลองทำกันดู เพราะว่าไปเจอเวปฯ หลายเวปฯ มากที่ทำ Navigator ให้กับเวปฯ ของเขา โดยใช้เทคนิคที่เรียกว่า "Breadcrumb" ที่ที่พบเห็นโดยมากหากไม่ใช้ Wordpress ก็จะเป็นสคริป์ที่เขียนขึ้นมา แต่ว่าเราๆ นี่ ใช้ Blogger หรือ Blogspot เป็นหลัก หากเราต้องการทำ Breadcrumb เราจะทำกันได้ไหม และทำอย่างไร?

What Breadcrumb will do on my blog?

ก่อนอื่น เราทุกคนคงอยากจะทราบซินะว่า เจ้า Breadcrumb นี่เขาเอาไว้ทำอะไร แล้วหากมีไว้ใน blog ของเรา มันจะเป็นอย่างไร ส่งผลอะไรให้กับ Blog ของเราบ้าง

การที่เราใส่ Breadcrumb เปรียบเสมือน หนูน้อยหมวกแดงโรยเศษขนมปังปังไว้ตามทางเพื่อให้กลับมาบ้านได้ถูก โดยที่ Breadcrumb จะอยู่ในรูปแบบของ การนำทางโดยตัวหนังสือ หรือที่เรียกกันว่า text-base navigation. 

Breadcrumb จะแสดงให้คนที่เข้ามายัง blog ของเราทราบว่า ตอนนี้เขาอยู่ที่จุดไหนของ blog และข้อดีของการทำ breadcrumb ก็คือจะช่วยให้ผู้ที่เข้ามายัง blog ของเราไปยังหน้าอื่นๆ หรือโฟสอื่นๆของเราได้โดยง่าย

ลักษณะของการแสดง breadcrumb จะเป็นในรูปแบบง่ายๆ แบบนี้

--------------------------------------------------------------------------
Home > Label > Post Title
--------------------------------------------------------------------------

ยกตัวอย่างจากโฟสนี้ (จะแสดง label ที่เยอะเป็นผลมาจากการใส่ label ของโฟสนั่นเอง) จะได้โฟสที่มี breadcrumb ในลักษณะนี้

ตัวอย่าง Breadcrumb ของ post นี้

SEO Benefits from Breadcrumb

นอกเหนือไปจากการที่เราช่วยให้ผู่ที่อยู่ใน blog ของเราได้ไปไหนมาไหนสะดวกแล้ว Breadcrumb ยังช่วยเราในเรื่องของ SEO โดยจะเป็นตัวช่วยให้ search engine ที่เข้ามา สามารถไต่ไปยังส่วนต่างๆของ blog เรา โดยเฉพาะไปตาม Label ที่เราสร้างไว้ โดย search engine จะมองเป็น text link ตัวหนึ่ง ที่เป็นเสมือน keywords ของ blog เรานั้นเอง ภาษาที่พวกเราชอบใช้กันคือ ทำให้ "บอทไต่" ไปได้ทั่วทั้ง blog ของเรานั้นเอง

How to add Breadcrumb to Blogger or Blogspot Post

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

1. Login เข้าสู่หน้า  blog ของท่าน หากท่านยังไม่ได้ login
2. ไปที่ Template
3. ทำการสำรองข้อมูลของ Blog ไว้ก่อนทำการแก้ไข "สำคัญเป็นอย่างยิ่ง" หากเกดความผิดพลาดขึ้นมา ท่านจะได้เอาไฟล์สำรองมาทำการแก้ไข blog ให้กลับคืนมาได้ (หากท่านไม่ทราบว่าต้องทำอย่างไร ในการ Backup/Restore blog ของท่าน โฟสคอมเม้นท์ไว้นะครับ จะได้มาเขียนให้ทุกท่านได้ทราบอีกที)
4. คลิกที่ Edit HTML เพื่อเข้าสู่หน้า Edit Template
   
5. ค้นหา ข้อความนี้จาก HTML code โดยการกด Ctrl+F แล้วค้นหา <div class='blog-posts hfeed'> และ <data:defaultAdStart/>
6. เมื่อพบแล้ว ให้ทำการก๊อปปี้ โค๊ดสีแดง ข้างล่างนี้ไปใส่ต่อจาก <div class='blog-posts hfeed'>

<b:includable id='main' var='top'>
<b:if cond='data:top.showPlusOne'>
<script expr:src='data:top.plusOneJsUrl'/gt;
</b:if>
<!-- posts -->
<div class='blog-posts hfeed'>
<!--Breadcrumb Hack - disable default status message
<b:include data='top' name='status-message'/>default status message disabled -->
<b:include data='posts' name='breadcrumb'/>
<data:defaultAdStart/>

      7.  จากนั้นให้นำ code ต่อไปนี้ ไปวางไว้ก่อน <b:includable id='main' var='top'>

<b:includable id='breadcrumb' var='posts'>

<b:if cond='data:blog.homepageUrl == data:blog.url'> 

<!-- No breadcrumb on front page --> 

<b:else/> 

<b:if cond='data:blog.pageType == "item"'> 

<div class='breadcrumbs'> 

Browse » <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a> 

<b:loop values='data:posts' var='post'> 

<b:if cond='data:post.labels'> 

<b:loop values='data:post.labels' var='label'> 

<b:if cond='data:label.isLast == "true"'> » <a expr:href='data:label.url' rel='tag'><data:label.name/></a> </b:if> </b:loop> 

» <span><data:post.title/></span> </b:if> </b:loop> </div> 

<b:else/> 

<b:if cond='data:blog.pageType == "archive"'> 

<div class='breadcrumbs'> 

Browse » <a expr:href='data:blog.homepageUrl'>Home</a> » Archives for <data:blog.pageName/> </div> <b:else/> 

<b:if cond='data:blog.pageType == "index"'> 

<div class='breadcrumbs'> 

<b:if cond='data:blog.pageName == ""'> 

Browse » <a expr:href='data:blog.homepageUrl'>Home</a> » All posts <b:else/> 

Browse » <a expr:href='data:blog.homepageUrl'>Home</a> »

Posts filed under <data:blog.pageName/> 

</b:if> </div> </b:if> </b:if> </b:if> 

</b:if>

</b:includable>

      8.  จากนั้นทำการ Save Template เป็นอันเสร็จสิ้นวิธีการใส่  Breadcrumb ให้กับ Blogger / Blogspot ของเราเพื่อให้คนที่เข้าเวป และช่วยในเรื่อง SEO ของ blog เราครับ

หาท่านใดมีข้อสงสัยหรือต้องการให้ช่วยเหลือในด้านใด รบกวนช่วยโฟสไว้ในคอมเมนต์ หรือที่ facbook fanpage ของเรานะครับ ไว้พบกันใหม่ครับ

Read More

บันทึกการ หาเงินออนไลน์ ของลุงกบ : สิ้นสุดชีวิตการทำงานของมนุษย์เงินเดือน Active Income

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

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

จากเคยมีเงินเดือนประจำกลายเป็นศูนย์ จะมุ่งมั่นเดินตาม Passive Income เส้นทางสาย IM อย่างเต็มที่ให้ประสบความสำเร็จเหมือนอย่าง "อาจารย์" ผู้ประสิทธิประสาทวิชามาให้ แม้ที่ผ่านมาจะไม่ประสบผลอย่างที่ควรจะเป็น แต่สิ่งที่ได้มาก็บอกได้ว่ามันเป็นเป็นได้ ขอเพียงตัวเองมีความมุ่งมั่นและพยายามให้เหมือนกับการทำงานประจำ

"การวางแผน" คงจะเป็นหัวใจสำคัญในช่วงเวลานี้
"การให้ความสำคัญและการจัดลำดับความสำคัญ" ก็เป็นหัวใจสำคัญอีกเช่นกัน

ต้องทำในสิ่งที่ตัวเองเคยทำได้ก่อน เพื่อให้ได้ "เงิน" มาต่อยอดงาน Passive Income อื่นๆในลำดับต่อ

การศึกษา การเรียนรู้ในการวางแผนธุรกิจ และอื่นๆ ต้องศึกษาเพิ่มเติม เพื่อเอาความรู้ปละประสบการณ์ในการทำงานแบบ Active Income มาแปลงเป็น Passive Income ในสายงานเฉพาะทางที่ตัวเองทำมา

กับการผันตัวเองเป็น Consultant เป็น Adviser ก็คงจะเป็นทางเลือกในแผนระยะกลาง ระยะยาว สำหรับการสร้าง Branding ของตัวเอง

แผนการสำหรับตัวเอง ตอนนี้คือ มุ่งหน้าเดินทางสาย Passive Income ด้วยการทำ IM, Internet Marketing เต็มตัว เพื่อหาเลี้ยงตัวเองต่อไป แล้วจะมาอัพเดท Blog นี้เรื่อยๆ นะครับ

Read More

บันทึกการ หาเงินออนไลน์ : ตอน สร้าง Text Logo ด้วย Microsoft Word

Logo จ๋า ทำออกมาได้อย่างไงเอ่ย

     จากที่เมื่อวานได้แชร์ไปในเรื่องของการสร้าง Brand เพื่บ่งบอกความเป็นตัวตนของตัวเราเอง เพื่อเอาไปใช้ต่อไปในวันข้างหน้าเพื่อให้ทุกคนได้จดจำให้ติดตา เหมือนกันที่หลายๆ คน หลายๆ เทพ เขาทำกัน
     เนื่องจากเราไม่มีเงินทองมากพอที่จะไปซื้อโปรแกรม หรือจ้างให้คนอื่นทำให้ ดังนั้น ตอนนี้หากจะทำให้สวยๆ อย่างคนอื่นเขาบ้าง ก็คงไม่มีทางอื่นนอกเสียจาก ตัดต่อพันธุกรรมจากของฟรีในเวปฯ และ/หรืออย่างที่ผมทำคือใช้ของที่มีอยู่ในมือ ผนวกกับไอเดียของเราที่มี อาจะะจเสียเวลาสักหน่อย แต่ก็ได้ความภาคภูมิใจ

เตรียมเครื่องไม้เครื่องมือกันก่อน

     สิ่งที่เป็นหัวใจสำคัญในการทำ Text Art หรือ Text Logo ที่ขาดไม่ได้คือ Font ตามที่เราต้องการ ปกติแล้วผมชอบที่จะเข้าไปหา Font ที่ต้องการใช้งานที่ dafont เป็นหลัก เป็นเวปที่แจก Font ฟรีๆ ไว้ให้เราโหลดมาติดตั้งในคอมพิวเตอร์ของเราเพื่อนำมาใช้งานในโปรเจ็คของเรา

Read More

บันทึกการ หาเงินออนไลน์ : ตอน สร้างแบรนด์ สร้างโลโก้ของตัวเอง

Your Brand Defining 

     หลังจากที่เราได้ศึกษาทำความเข้าใจกันไปบ้างแล้วในตอนที่ผ่านๆ มาเกี่ยวกับการสร้าง brand สำหรับเป้าหมายของเราเราลองมากำหนดขอบเขตในการออกแบบ brand หรือ Logo ตามตำราที่ผ่านๆมาของเรากันดีกว่า เผื่อว่าวันข้างหน้าจะได้มีชื่อเสียง มี Passive Income อย่างกับคนอื่นๆเขาบ้าง (แอบฝัน วันเบลอๆ)

เริ่มต้นกันดีกว่า

• What is your company's mission?

      อืมมมม ไม่ได้เป็นบริษัทกับเขานี่นา เอาเป็นว่า เป็นความตั้งใจที่มีมานานแล้วดีกว่า เนื่องจากผมเปนชนคนออฟโรด มี ซูซูกิ คาริเบี้ยน เก่าๆ เป็นเพื่อนคู่กาย และเหน็ดเหนื่อยตรากตรำทำงานประจำมาเป็นระยะเวลาหลายสิบปี และถึงวันนี้ก็ยังทำงานประจำ กิน Active Income อยู่ทุกเมื่อเชื่อวัน แต่ก็มีความฝันที่จะสร้าง Passive Income ทำงานที่ไหนก็ได้ ที่ Internet สามารถเข้าไปถึง และที่สำคัญ จะต้องทำตามความฝันคือ ขับออฟโรดคู่กายไปไหนต่อไหนทั่วไทย โดยมีเงินท่องเที่ยวจาก Passive Income

• What are the benefits and features of your products or services?

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

• What do your customers and prospects already think of your company?

     อันนี้ตอบได้เต็มปากเต็มคำครับว่า "ไม่มี" อย่างแน่นอน ที่คนที่เข้ามาอ่าน Blog นี้จะคาดหวังอะไร แต่ผมนี่ซิ มีความคาดหวังอยู่ว่า :

อยากแบ่งปันความรู้ พูดคุย โต้เถียง ติชม เส้นทางการหาเงินของผม

• What qualities do you want them to associate with your company?

     555+ คำตอบเดียวกับข้อข้างบนๆครับ ไม่คาดหวังอะไรจากสังคมและคนอื่นๆ เพียงขอให้ได้แต่ "แบ่งปัน" ออกไปบ้างก็เท่านั้นเองครับ

Logo & Slogan

     จากข้างบนที่กล่าวมา จึงขอหาสโลแกนของตัวเองก่อน คิดไว้นานแล้วล่ะว่าจะเป็นประโยคไหน อย่างไรดี คงจะประมาณว่า

Off-road IM'er เส้นทางหาเงินของคนออฟโรด

ดังนั้น Logo จึงออกมาในแบบลุยๆ ตามสไตล์ของ คน Off-road สักหน่อย อยากจะมีอะไรที่ชี้บ่งถึงคนออฟโรด ที่แท้จริง โชคดีที่มีน้องคนหนึ่งสามารถทำ Graphic ได้เลยให้ออกแบบรถสีแดงจากรถจริงที่ตัวใช้อยู่ให้ ส่วนที่เหลือทำจาก Microsoft Words ล้วนๆครับ กับโปรแกรมฟรีบนเวปฯ บ้างเป็นบางตัว จึงออกมาเป็นรูปร่างหน้าตาอย่างที่เห็น

ป,ล, อยากให้เขียนเรื่องการออกแบบ text logo ด้วย Microsoft Word ให้แจ้งมานะครับ เดี๋ยวจัดให้

Tips of the day:

• ณ. เวลานี้ผมไม่รู้หรอกว่า Brand ที่ตัวผมกำลังสร้าง หรือ Logo ที่สื่อออกไปจะมีผลอย่างไรบ้าง
• อาจารย์น้องท่านหนึ่งกล่าวไว้ว่า "ทำเอามันส์ก่อนครับพี่ เรื่องตังค์เอาไว้ทีหลัง"

Read More