แสดงไฟล์ PDF ในเว็บไซต์จูมล่า

บางครั้ง ถ้าเรามีแคตตาล็อกสินค้า คู่มือ หรือ ตารางเปรียบเทียบต่างๆ ที่เป็นไฟล์ PDF
หากเราอยากจะให้มันแสดงผลภายในเว็บจูมล่าของเรา... แต่ไม่รู้จะทำอย่างไร??
สามารถทำได้ครับ โดยติดตั้ง Plugin ที่ชื่อว่า Enbed pdf's


ขั้นตอนที่ 1 ให้เราโหลด Plugin ดังกล่าวก่อนครับ โดยสามารถ ดาวน์โหลดได้ที่นี่ หรือ ที่เว็บไซต์
www.heinelt.info

ขั้นตอนที่ 2 ไปที่หน้า Admin และทำการติดตั้ง Plugin




ขั้นตอนที่ 3 จากนั้นให้ Enable Plugin ครับ โดยเข้าไปที่ Extension=>Plugin Manager มองหา Enbed pdf's แล้วคลิก Enable




ขั้นตอนที่ 4 อัพโหลดไฟล์ PDF ที่ต้องการแสดง ในบทความนี้ผมจะอัพโหลดไฟล์ชื่อว่า example.pdf ไว้ที่โฟลเดอร์ชื่อว่า PDF




ขั้นตอนที่ 5 สร้างบทความใหม่โดยใช้โค้ด (สามารถกำหนดความสูงและความกว้างที่จะแสดงได้เองนะครับ)

{pdf}PDF/example.pdf|height:700|width:725{/pdf}

ขั้นตอนที่ 6เสร็จแล้วครับ!! ทำการเผยแพร่บทความ แล้วลองเปิดดูผลงานได้เลย :)

---

เว็บมาสเตอร์เว็บไซต์ไทยโอเทลโล่

อ่านต่อ...

วิธีแสดง Avatar ใน JComments

หากใครทำเว็บไซต์ด้วย Joomla แล้วอยากให้มีคอมเมนต์ในบทความ

ผมแนะนำเลยครับว่าให้ใช้คอมโพเนนท์ที่ชื่อว่า JComments

แต่สำหรับคนที่เคยใช้ JComments แล้ว มือใหม่หลายๆคนอาจจะงงว่าเวลาคอมเมนต์ทำไมมันไม่โชว์ Avatar ซักที?...

ไม่ต้องห่วงครับ บทความนี้จะสอนวิธีแสดง Avatar ใน JComments กัน



ขั้นตอนที่ 1: หากใครยังไม่มี JComments ให้ติดตั้ง JComments ก่อนเลยครับ ดาวน์โหลดJCommentsได้ที่นี่เลย

ขั้นตอนที่ 2: คราวนี้เราต้องติดตั้ง Plugin ชื่อ JComments Avatars ด้วยครับ ดาวน์โหลด Plugin JComments Avatarsได้ที่นี่ครับ


ขั้นตอนที่ 3: หลังจากติดตั้ง JComments และ Plugin JComments Avatars เรียบร้อยแล้ว เราก็ต้องมาเซตค่ากันซักนิดครับ

เข้าหน้า Admin =>Extensions=>Plugin Manager มองหา JComment Avatars

ฝั่ง Details ในส่วน Enable ให้คลิก Yes ครับ



ฝั่ง Parameters ในส่วน Avatar Source อันนี้แล้วแต่เราจะเลือกนะครับ (ส่วนผมเลือก Community Builder)



ขั้นตอนที่ 4: ไปที่ JComments Settings=> ไปที่แท็บ Permissions

-ที่ User Groups สามารถเลือกได้ว่าให้ User ระดับไหนมองเห็น Avatar หรือไม่

-ถ้าอยากให้ User ระดับไหนมองเห็น Avatar ก็ติ๊กที่ Show Gravatar ครับ





เรียบร้อย!!!

---

เว็บมาสเตอร์เว็บไซต์ไทยโอเทลโล่

อ่านต่อ...

แนะนำ Smush It สุดยอดวิธีลดขนาดรูปจาก Yahoo!

สำหรับเว็บมาสเตอร์ที่ทำเว็บไซต์ แล้วต้องการตกแต่งด้วยรูปภาพขนาดใหญ่ (กว้าง 600 พิกเซล ขึ้นไป)
ด้งรูปด้านล่าง

คลิกที่รูปเพื่อดูรูปใหญ่

หากเราใช้ Adobe Photoshop ฟังก์ชั่น Save for Web มักจะพบปัญหา คือ ภาพจะไม่ชัดเจนเท่าเดิมครับ แม้ว่าขนาดไฟล์จะเล็กลงก็ตาม

เปรียบเทียบรูปต้นฉบับ กับรูปหลังจาก Save for Web แล้ว เห็นได้ชัดเจนว่าบริเวณขอบจะเบลอ

หากเราต้องการใช้รูปที่มีขนาดใหญ่ (กว้าง 600 พิกเซลขึ้นไป) ต้องการความคมชัด แต่อยากให้ไฟล์ขนาดเล็ก เพื่อให้หน้าเว็บทำการโหลดเร็ว ผมขอแนะนำ Smush It ครับ




Smush It คือ เทคโนโลยีที่พัฒนาโดยทีมงาน Yahoo! ในการ Optimize ขนาดรูป แต่ไม่ลดความคมชัดนะครับ

ว่าแล้วก็ลองไปดูวิธีการใช้กันเลยครับ

-เข้าไปที่หน้าเว็บ Smush It (www.smushit.com) หรือ คลิกที่นี่

-จากนั้นคลิกที่ uploader
-แล้วทำการเลือกไฟล์ที่ต้องการย่อรูปเลยครับ มันจะย่อให้เราเอง แค่รอมันทำเสร็จเท่านั้น


-เสร็จแล้วครับ



-ความคมชัดเท่ารูปเดิม แต่ขนาดไฟล์ลดลงเยอะครับ :) (24.89% ว้าว!)



ลองไปใช้กันดูครับ ดีมากๆ

---

เว็บมาสเตอร์เว็บไซต์ไทยโอเทลโล่

อ่านต่อ...

วิธีเพิ่มขนาด Avatar ของ Jcomments

Jcomments คือ อะไร?
Jcommentsก็คือ หนึ่งในสุดยอดระบบคอมเมนต์สำหรับ joomla

จุดเด่น คือ:
-รองรับหลายภาษา รวมถึง ภาษาไทยด้วย (ซึ่งผมเองเป็นผู้แปล)
-ใช้ง่ายมากๆ
-มีระบบ Smiles
-สามารถกำหนด BBCode เองได้
-สามารถนำเข้าคอมเมนต์จากคอมโพเน้นท์ฺอื่นๆ
-และอื่นๆ อีกมากมาย

ทดลองใช้ได้ที่นี่:
Demo JComments

ดาวน์โหลด JComments ได้ืที่นี่:
Download JComments

จากการที่ผมลองใช้ดูแล้วถือว่าเป็นคอมโพเน้นท์ที่ดีมากๆ เสียอยู่อย่าง คือ Avatar เล็กไปนิด (แค่ 32x32 พิกเซลเองครับ)

ดูรูปครับว่าเล็กแค่ไหน

ถ้าใครอยากจะเพิ่มขนาดของ Avatar ล่ะก็... ง่ายๆครับทำตามนี้:


ขั้นตอนที่ 1: เปิดไฟล์ style.css
อยู่ที่นี่ครับ(/components/com_jcomments/tpl/default/style.css)

ขั้นตอนที่ 2: จากนั้นมองหาบรรทัดนี้:

/* Avatar */
#comments .comment-avatar img {width: 32px}

ขั้นตอนที่ 3: แก้ขนาดตามใจชอบครับ แต่ใหญ่ไปก็จะแตกครับ เอาพอดีๆ: (ผมแก้เป็น 48 พิกเซล)

/* Avatar */
#comments .comment-avatar img {width: 48px}

เสร็จแล้วครับ: เซพไฟล์ style.css, จากนั้นอัพโหลดกลับไปที่เดิม แล้วเปิดหน้าเว็บดูผลครับ!!

Avatar ใหญ่ขึ้นแล้วนะครับ :)

---

Webmaster of Thai Othello Page

อ่านต่อ...

วิธีเปลี่ยน Collation ฐานข้อมูลให้เป็น UTF-8

วิธีเปลี่ยน Collation ฐานข้อมูลให้เป็น UTF-8 เพื่อแก้ปัญหาภาษาไทยเป็น ??????

ผู้ให้บริการเว็บโฮสติ้งใหม่ๆ มักจะใช้ Cpanel และFantastico installer ซึ่งก็สะดวกมากๆนะครับในการติดตั้ง Joomla หรือ CMS อื่นๆ แค่คลิกทีเดียวก็ติดตั้งเสร็จทันที

หน้าตาของ Cpanel

แต่ก็มีข้อเสียบ้างเช่นกัน, เพราะบางโฮสต์ (ต่างประเทศ) ได้ตั้งค่า collation ในฐานข้อมูลไว้เป็น Latin Swedish เลย ซึ่งถ้าเราจะทำเว็บภาษาไทย หรือ จีน หรือ เกาหลีนี่ ต้องแก้ฐานข้อมูลให้เป็นUTF-8 ครับ

แก้ยังไงเนี่ย???

เพราะถ้าฐานข้อมูลไม่เป็น UTF-8 แล้ว การแสดงผลภาษาไทยก็จะเพี้ยนเหมือนในรูปด้านล่างครับ

อ่านไม่ออกแฮะ ^^''

แต่ไม่ต้องกลัวครับ ทุกปัญหาย่อมมีทางออกเสมอ :)


การจะเปลี่ยน collation ของฐานข้อมูล จริงๆ แล้วง่ายๆ สามารถทำด้วย notepad หรือ dreamweaver ก็ได้ครับ
แต่อาจจะไม่สะดวกเท่าไร ถ้าฐานข้อมูลเยอะมากๆ ดังนั้นผมจะสอนวิธีที่ง่าย+สะดวกที่สุดครับ

ขั้นตอนที่ 1. ให้ไปดาวน์โหลด เครื่องมือสำหรับเปลี่ยน collation ของ phoca ครับ ชื่อไฟล์ว่า tool_phoca_changing_collation.zip คลิกที่นี่เพื่อไปหน้าดาวน์โหลดครับ เจ๋งสุดๆครับ

ขั้นตอนที่ 2. หลังจากโหลดมาที่เครื่องเราแล้ว คลิกขวาแตกไฟล์ไว้ที่ Desktop เลย(ใช้ WinZip หรือ WinRAR หรืออื่นๆ ตามสะดวก)



ขั้นตอนที่ 3. พอแตกมาแล้วจะพบกับโฟลเดอร์ชื่อว่าtool_phoca_changing_collation.... (ชื่อมันยาวไปหน่อยครับ) ให้เปลี่ยนชื่อ(Rename) ของโฟลเดอร์ซะ เอาเป็นคำว่า collation นะครับ สะดวกดี

เปลี่ยนชื่อโฟลเดอร์ให้เป็นชื่อว่า collation

ขั้นตอนที่ 5. อัพโหลดโฟลเดอร์ไปไว้ที่ Root ของเว็บไซต์เราครับ




ขั้นตอนที่ 6. โอเคครับ ใกล้เสร็จแล้ว... จากนั้นเปิด Firefox หรือ IE ก็ได้ แล้วกรอก URL ตามนี้นะ: (โดเมนเนมของคุณ/collation/index.php)




ขั้นตอนที่ 7. จากนั้นก็จะเจอหน้านี้ครับ



ขั้นตอนที่ 8. ก็กรอกข้อมูลลงไปให้ครบ แล้วก็คลิกปุ่ม Submit

• Database Host: ใส่ชื่อโฮสต์


• Database User: ใส่ username ที่ใช้เวลาติดต่้อฐานข้อมูล


• Database Password: ใส่ รหัสผ่าน ที่ใช้เวลาติดต่้อฐานข้อมูล


• Database Name: ใส่ชื่อ ฐานข้อมูล


• Database Collation: utf8_general_ci (ใครอยากแก้collation เป็นอย่างอื่นก็ตามสะดวกนะครับ)

ขั้นตอนที่ 9.เสร็จแล้วววววววววววว!!! ตอนนี้ฐานข้อมูลก็เปลี่ยนเป็น UTF-8 เรียบร้อยครับ ลองดูหน้าเว็บคุณสิ ภาษาไทยแสดงผลได้แล้วนะครับ :)





ขอขอบคุณ, ทีมพัฒนาของ Phoca ครับ สำหรับเครื่องมือดีๆอย่างนี้!!!

---

เว็บมาสเตอร์เว็บไซต์ไทยโอเทลโล่

อ่านต่อ...