Day 6/2015 : เล่นกับ Featured Content Slider

เล่นกับ Featured Content Slider ให้วนแสดงข้อมูลตามที่เราต้องการ

       หลังจากที่เราสำเร็จกับ Day 5/2015 : จัดการกับ Categories เจ้าตัวเยอะ ไปเป็นที่เรียบร้อยแล้ว มหากาพจ์ไตรภาคของเรา ภาคต่อไปเราไปเล่นกับ Featured Content Slider กันเถอะ เพราะดูแล้วไม่น่าจะยากนัก แปลไปด้วย ทำตามไปด้วย เดี๋ยวก็คงจะได้อย่างที่เราต้องการกัน

How to configure Features Content Slider

      ข้อดีของ PBTemplates คือ จะมีข้อมูล Support เราในการปรับแต่ง Blogger Template :

How to configure Features Content Slider

แปลกันก่อน

     เขาบอกให้เราทำอย่างนี้ ไปที่ "Template" แล้วต่อไปที่ "Edit HTML" จากนั้นให้ค้นหาคำว่า <!--Featured Content Slider Started --> แล้วให้ใช้เมีย เอ๊ย เมาส์เลื่อนลงมาเรื่อยๆ เราจะเจอ Code ของแต่ละ featured slide จะอยู่ระหว่างคำสั่ง <div class='fp-slides-Menus'> กับ </div>

จากนั้นให้ทำการแทนที่

• "This is default featured post X title" ด้วยข้อความ Featured post title ของเราเอง
• "#" ด้วย Featured post URL ของเราเอง
• "Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.This theme is Bloggerized by Lasantha Bandara - Premiumbloggertemplates.com." แทนที่ด้วย Slider Description ของเราเอง
• Slider image address ด้วยเส้นทางที่เก็บรูปของเราไว้.

ให้ทำแบบนี้กับทุกๆ Feature Slide

Featured slide เอาไปทำอะไรได้บ้าง?

     "Monetize" หาเงิน ตรงประเด็น Passive Income ชัวร์ๆ โปรโมทสินค้าของตัวเอง หรือ Affiliate Link ของตัวเองก็ได้ แต่ต้องเนียนๆ นะ เพราะเราอาศัย Google เขาอยู่ ยิ่งไม่ชอบ Link ประเภทนี้ซะด้วยซิ

     "Highlight Post" เอาไว้โปรโมท โฟสเด็ดๆของเราเอง แบบที่เรียกคนเข้า Blog ของเรา แต่จะยุ่งยากนิดที่ต้องเข้าไปแก้ไขอะไรบ่อยๆ 

     อื่นๆ ยังคิดไม่ออก ... ท่านใดคิดออกช่วยแชร์กันนะครับ

ลงมือจัดการกับ Featured Slider

    เนื่องจากจะไม่ส่งอะไรออกไปนอก Blog ดังนั้น Concept ในการทำครั้งนี้ จึงจะทดลองเพียงแค่ให้โฟสที่ผ่านๆ มาอันที่เป็น Highlight เอาขึ้นไปแสดงแทน

สิ่งที่ต้องเตรียม 

• รูปภาพที่จะเอาไปขึ้นแสดงในแต่ละ Slider อันนี้จะใช้ภาพที่เห็นว่าดีของแต่ละ post เอาขึ้นไปแสดง ซึ่งตอนนี้เราได้แสดงไปแล้ว ดังนั้นเราจะทดลองเพียงแค่นั้นพอ
• URL ของแต่ละ post ซึ่งเมื่อคลิ๊กไปก็จะแสดงผลของการโฟสนั้นๆ
• ข้อความที่จะแสดงในแต่ละ Slide ก็จะเอาย่อหน้าแรกของแต่ละโฟสมาแสดง

ตรงจุดนี้ หวังว่าทุกคนคงจะทำกันได้นะครับ หากไม่ได้ Comment ไว้ครับ จะได้นำวิธีการแบบบ้านๆ มาให้รับชม

แก้ไข HTML เพื่อให้แสดงใน slider

     เข้า blog ของเราครับแล้วจัดการตามเส้นทางที่เขาว่าไว้

Edit HTML Blogger Template

จะมาเจอะเจอหน้าตาแบบนี้ครับ

HTML Template

  

จากนั้นก็ค้นหา โดยกดปุ่มหากิน Ctrl+F ใส่คำค้น "Featured Content Slider Started"

search "Featured Content Slider Started"

     เจอแล้วครับ ตรงนี้นี่เอง

Search Result Featured Content Slider Started

ลงมือจัดการมันซะ

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

Edit Template html code

เอาของตัวเองมาให้ชมหนึ่ง Slide ครับ

ตัวอย่างการแก้ไข Featured Content Slider

อ้อ!!!! แก้แล้วอย่าลืม Save นะครับ

ผลงานการแก้ไข Featured Content Slider

ตัวอย่าง Slide 1 

หวังว่าทุกคนคงจะสนุกกับการทอลองแก้ไขเล่นๆ กันดูนะครับ  พรุ่งนี้คงจะเป็นเรื่อง การแก้ไข Menu ของ Blogger Template ครับ

Notes of the day :

• ทุกอย่างจะสำเร็จได้เมื่อลงมือทำ
• ประสบการณ์จะมาก็ต่อเมื่อลงมือทำ
• ลงมือทำ และลงมือทำ