สวัสดีครับ ในบทความนี้เราจะมาทำการติดตั้ง Page Bulider CK และทำความรู้จักเจ้า Page Bulider CK กันคร่าวๆ ก่อนนะครับ ซึ่งในหมวดนี้ผมจะพยายามทำบทความอธิบายในแต่ละส่วนให้เพื่อนๆ ได้เข้าใจในการนำไปใช้งาน ในแต่ละประเภทนะครับ ถ้าเริ่มอยากลองก็ตามผมมาเลยครับ
ก่อนอื่นเลยเราต้องไปทำการโหลดเจ้า Page Bulider CK กันก่อนนะครับ โดยให้เราไปที่หน้าเว็บไซต์
https://www.joomlack.fr/en/joomla-extensions/page-builder-ck
หน้าหลักเว็บไซต์ของ Page Bulider
จากนั้นให้เลื่อนลงมาด้านล่าง ก็จะพบกับเวอร์ชั่นฟรีและเสียเงินนะครับ ให้เราเลือกแบบฟรีก่อนนะครับ โดยคลิ๊กที่ DOWNLOAD ครับ
ดาวน์โหลดมาเก็บไว้ในเครื่องคอมพิวเตอร์ของเรานะครับ
จากนั้นก็ให้ทำการ Save ไว้ในเครื่องคอมพิวเตอร์ของเรานะครับ โดยเวอร์ชั่นที่ทำบทความนี้จะเป็น pagebuilderck-light_2.5.10 นะครับ เมื่อเราเซฟแล้ว ก็ให้เราทำการติดตั้งใน Joomla ได้เลยครับ
ทำการติดตั้ง Page Bulider CK ให้เรียบร้อย
เมื่อเราติดตั้ง Page Bulider CK แล้วนั้น ให้เราไปที่เมนู Components เลือกที่ Page Bulider CK แล้วไปที่ในส่วน Options
จะเข้าไปที่ในส่วน Options ของ Page Bulider CK เพื่อที่เราจะได้รู้จักบางส่วนที่สามารถตั้งค่าได้นะครับ
Options ของ Page Builder CK
ในส่วนแท็บ General options
ทีนี้ในส่วนแท็บ General options นั้นจะเป็นตั้งค่าทั่วไป ซึ่งหัวข้อที่เราต้องรู้คร่าวๆ มีดังนี้นะครับ
1. Load Font Awesome
หัวข้อนี้จะเป็นในส่วนของการใช้ Icons ของ Page Builder CK โดยปกติมันจะตั้งค่าเอาไว้อยู่แล้วนะครับ แต่ถ้าในกรณีที่เราไม่ได้มีการจะใช้ icons ในส่วนนี้ ก็สามารถทำการปิดได้ครับ เพราะว่าจากการที่ได้ทดสอบนั้น ในส่วนนี้จะมีผลต่อการโหลดในหน้าเว็บนะครับ ถ้าอยากให้ PageSpeed เร็วขึ้นอีกนิดก็ปิดในส่วนนี้ได้ครับ( แนะนำให้เปิดไว้ตามปกติก่อนครับ )
ตัวอย่างการใช้ Icons ใน Page Bulider CK
2. Fixed width content resolution
ในส่วนหัวข้อนี้จะเป็นการกำหนดค่ามาตราฐานเริ่มต้น ในกรณีที่เราอยากที่จะกำหนดความกว้างของ Row เป็นแบบ Fixed width ก็สามารถกำหนดค่าเริ่มต้นจากตรงนี้ก็ได้ครับ หรือจะไปปรับในส่วนของ Fixed width เลยก็ได้เช่นกัน
เราสามรถที่จะปรับค่าจากที่กำหนดเอาไว้ได้จากในส่วนช่องตัวเลขตามรูปในข้อ 3 นะครับ
3.Enable nested rows
เป็นการกำหนดเปิดใช้การสร้าง Row แบบ ทับซ้อนกันได้ ซึ่งถ้าเราเปิดใช้ก็จะทำให้เราสามารถสร้าง Row ย่อยๆ ได้หลายชั้น ซึ่งจะทำให้งานเราดูละเอียดขึ้น แต่ข้อเสียคือ การแก้ไขจะทำได้ยากในเวลาต้องเลือกเครืองมือในการแก้ไขครับ (แนะนำเริ่มต้นควรปิดไว้ครับตามเดิม)
ตัวอยากการใช้ nested rows สามารถวางทับ Row เดียวกันได้ แต่ แก้ไข Row ยาก เมนูมักทับซ้อนครับ
4. Color palette
เป็นการสร้าง สีพื้นฐาน 5 สี เอาไว้ให้เราเลือกใช้ ในกรณีที่เราต้องการกำหนดสีต่างๆ ซึ่งจะสะดวกเวลาเราต้องกำหนดสีหลายๆ รอบ (แต่โดยปกติเรื่องสีผมมักจะกำหนดจาก CSS ของ Template ซึ่งมักจะใช้กับหัวข้อที่เป็น H Tag H2,H3,H4 มากกว่า ครับ ส่วนสีพื้นหลังของ Row ใช้ไม่ค่อยบ่อยครับ ตรงนี้ผมเลยไม่ค่อยได้กำหนดเอาไว้)
ตัวอย่างหากกำหนดสีเอาไว้ เวลาเลือก Select a palette เราก็จะมีเชดสีที่กำหนดไว้ให้ใช้ครับ
ต่อมาจะเป็นในส่วนแท็บ Responsive นะครับ
แท็บ Responsives
แท็บ Responsive สำหรับตั้งค่าขนาดการย่อ ขยาย Row และ Columns ซึ่งจะมีการแยกเอาไว้ให้ 4 ขนาด ซึ่งโดยปกติผมก็จะใช้ตามที่เขากำหนดมาให้ แต่ถ้าใครอยากลองปรับก็สามารถแก้ไขได้ ซึ่งถ้าให้แยกแบบพอเข้าใจคือ
- Resolution for Tablet - Landscape เป็น Tablet แนวนอน จะให้มีขนาดความกว้างเท่าไหร
- Resolution for Tablet - Portrait เป็น Tablet แนวตั้ง จะให้มีขนาดความกว้างเท่าไหร
- Resolution for Phone - Landscape เป็น มือถือแนวนอน จะให้มีขนาดความกว้างเท่าไหร
- Resolution for Phone - Landscape เป็น มือถือแนวตั้ง จะให้มีขนาดความกว้างเท่าไหร
ซึ่งจะส่งผลในส่วนของ Responsive เวลาเราทำข้อมูลนะครับ เพื่อให้เราสามารถปรับได้ว่า Row ที่จะแสดงในขนาดนั้นๆ จะให้เป็นแนวตั้งหรือนอน นั้นเอง
ในส่วน Responsive ที่เราสามารถกำหนดรูปแบบการแสดงผลของ Row และ Columns ได้อย่างอิสระ
ต่อมาในแท็บ Optimization เป็นการกำหนดให้มีการบีบอัดไฟล์ CSS ของ Page Builder CK ในการทำข้อมูลหรือไม่ เพื่อที่จะทำให้มีผลในเรื่องของ SEO ที่ดีขึ้น แต่จากการใช้งานจริงในบางกรณี รูปแบบที่ถูกบีบอัด อาจจะทำให้การแสดงผลของข้อมูลผิดเพี้ยนไปนะครับ แนะนำว่าปิดไว้เหมือนเดิมจะดีกว่าครับ หรือถ้าจะลองก่อนก็ได้ครับ ถ้าทดสอบไม่มีปัญหาอะไร เพราะผมเจอปัญหาไม่บ่อยเหมือนกัน
ในส่วนของ Optimization ถ้าเปิดใช้แล้วไม่เจอปัญหาจะดีมากเลยครับ
ในส่วนแท็บอื่นๆ ก็จะเป็นในรุ่น PRO ที่เราต้องซื้อนะครับ แต่เจ้า Page Bulider CK ในเวอร์ชั่นฟรี นี้ผมนำมาใช้งานก็ถือว่า OK แล้วนะครับ ในระดับหนึ่ง แต่ถ้าใครอยากได้ Addons เพิ่มเติม เช่น Images Slide , Animated number , Blog เป็นต้น ก็ซื้อมาใช้ได้ครับ ราคาก็ไม่ได้แพงมาก แต่ถ้าเริ่มต้น ผมอยากให้ลองใช้ตัวฟรีก่อนนะครับ แล้วจะติดใจเหมือนผม อิอิ
ขอบคุณครับ
Webmaster JoomlaHitz.com (ริว)
รับทำเว็บไซต์ / รับดูแลเว็บไซต์ รายเดือน / รับดูแลเว็บไซต์ รายปี / สอนทำเว็บไซต์ Joomla / รับทำเว็บราคาถูก
