Get Start

วิธีเลือกใช้ Smart Theme และปรับแต่งสี

Smart Theme สำเร็จรูป ในระบบเว็บไซต์พร้อมใช้ VelaEasy เป็นค่าเริ่มต้นที่กำหนดการแสดงผล Section ข้อมูลในหน้าแรก และเฉดสีทั้งหมดของเว็บไซต์ โดยเว็บมาสเตอร์สามารถเลือกเปลี่ยน Theme รวมถึงเพิ่ม แก้ไข หรือลบ Section การแสดงผลได้ตามต้องการ

1. ที่เมนู "Look & Feel" คลิก "Smart Theme" และคลิกบริเวณรูปภาพภายใต้หัวข้อ "Theme"

2. ระบบจะแสดง Smart Theme ให้เลือกทั้งหมด 43 รูปแบบ โดยคลิกเลือกรูปแบบที่ต้องการ 

3. เมื่อมีการคลิกเปลี่ยน Theme ระบบจะมี Pop Up แจ้งเตือนผลกระทบของการเปลี่ยน ข้อความว่า "This action will create new home page. You can find current home page in content library" จากนั้นคลิกที่ปุ่ม “Save”

4. โดยการแสดงผลหน้าแรกของเว็บไซต์ จะมี "Smart Section" พร้อมข้อมูลเริ่มต้นใหม่ ตามชุดรูปแบบ Smart Theme ที่เลือก รวมถึงเฉดสีของเว็บไซต์จะเปลี่ยนไปตามค่าเริ่มต้นของ Theme นั้น ๆ

ซึ่งคุณสามารถแก้ไข  Section ต่าง ๆ ที่ปรากฎ โดยการพิมพ์ข้อความ รวมถึงใส่รูปภาพใน Section ได้โดยตรง  ด้วยวิธีเพิ่ม Smart Section

*หมายเหตุ : รูปแบบ Theme เว็บไซต์ที่เห็นเป็นเพียงตัวอย่างเท่านั้น เมื่อเปิดใช้งานจริง อาจจะมีการเปลี่ยนแปลงได้ 

ทั้งนี้ เมนู "Home" หรือเมนูด้านบนลำดับแรกสุด ที่คุณได้ใส่ข้อมูลไว้แล้วก่อนเปลี่ยน Theme ใหม่ จะถูกจัดเก็บสำรองข้อมูลไว้ให้ในเมนู "Content Library" โดยระบบจะสำรองเมนูหน้าแรกทุกครั้งที่เลือกเปลี่ยน Theme (เก็บไว้สูงสุดจำนวน 20 เมนู)

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

วิธีเปลี่ยนโทนสีของเว็บไซต์

เว็บมาสเตอร์สามารถเปลี่ยนการแสดงผลโทนสีของเว็บไซต์ โดยไปที่เมนู "Look & Feel" ภายใต้แท็บ "Smart Theme" จะแสดงผล "Theme Color" ที่ระบบกำหนดให้ 5 ชุดสี รวมถึงชุดสีพิเศษที่จะแสดงผลเฉพาะธีมที่เลือกบางชุด หรือจะคลิกเลือกใช้ชุดสีลำดับสุดท้าย ที่ให้คุณเลือกการแสดงผลสีส่วนต่าง ๆ ของเว็บไซต์เองที่ "Theme color details" เพื่อให้การแสดงผลเว็บไซต์ในส่วนต่าง ๆ เป็นไปในโทนสีที่คุณต้องการ จากนั้นคลิกที่ปุ่ม “Save”

กำหนดรูปแบบของเว็บไซต์โดยรวม

เมนูรูปแบบโดยรวม อยู่ภายใต้เมนู ตกแต่ง เป็นเมนูสำหรับการกำหนดการแสดงผลเว็บไซต์ ในส่วนของ 

• ตั้งค่าการแสดงผลรูปแบบเมนู
• เลือกการแสดงโทนสีเว็บไซต์
• เลือกแสดงสัญลักษณ์แสดงความอาลัย
• เลือกแสดงฟอนต์ของเว็บไซต์

Menu styles

Top bar is always visible : หากทำเครื่องหมายกาถูกที่หัวข้อนี้ จะทำให้แถบเมนูด้านบนแสดงอยู่ตลอดเวลา ถึงแม้ว่าจะเลื่อนหน้าจอลงมาดูเนื้อหาด้านล่าง ซึ่งการที่แถบเมนูด้านบนแสดงอยู่ตลอดเวลาจะช่วยให้ผู้ชมสามารถเข้าดูหน้าอื่น ๆ ของเว็บได้สะดวกยิ่งขึ้น

Show Logo : โดยปกติแล้ว Logo จะแสดงผลอยู่ที่แถบเมนูหลัก แต่หากต้องการเปลี่ยนตำแหน่งการแสดงผล เมื่อคลิกเลือก "แสดง Logo" ระบบจะตั้งค่าให้สามารถย้าย Logo ไปแสดงผผลที่แถบ Header ได้

Website color

ทาง ReadyPlanet ได้เพิ่มตัวเลือกการแสดงผลสีของหน้าเว็บไซต์ ซึ่งจะช่วยปรับการแสดงผลโทนสีทั้งข้อมูลตัวอักษรและรูปภาพทุกส่วนของหน้าเว็บไซต์โดยอัตโนมัติ ดังนี้

4.1. แสดงเว็บไซต์สีปกติ จะแสดงผลเว็บไซต์ในโทนสีตามปกติ

4.2. แสดงเว็บไซต์โทนสีเทา หน้าเว็บไซต์จะแสดงผลในโทนสีเทา-ดำ

4.3. ลดเฉดสีเว็บไซต์ ระบบจะปรับการแสดงผลทั้งข้อมูลตัวอักษร และรูปภาพทุกส่วนของหน้าเว็บไซต์ให้มีโทนสีที่ลดระดับลง

Symbol of mourning

เมื่อคลิกเลือก "Show" ที่หัวข้อนี้ จะแสดงผลสัญลักษณ์รูปริบบิ้นสีดำที่มุมบนขวาในทุกหน้าเว็บไซต์ของคุณโดยอัตโนมัติค่ะ โดยสามารถใช้งานร่วมกับการแสดงเว็บไซต์โทนสีเทาได้

Website fonts

เมื่อคลิกที่ > Look & Feel > Global Styles > Website fonts จะสามารถเลือกใช้งานฟอนต์ที่ระบบมีให้ได้ โดยเป็นของ Google Font แบ่งเป็นฟอนต์ไทย 23 ฟอนต์ และฟอนต์ของเมียนม่า 2 ฟอนต์ เมื่อทำการเปลี่ยนฟอนต์ของบเว็บไซต์เนื้อหาในเว็บไซต์ทุกตำแหน่งจะเปลี่ยนไปตามฟอนต์ที่เลือก แต่จะมีที่ Smart Section และ Text Editor จะไม่เปลี่ยนตาม โดยที่

- Smart Section จะยังคงแสดงเป็นฟอนต์ของ Smart Section ซึ่งหากต้องการให้เป็นฟอนต์ของเว็บไซต์ จะต้องไปตั้งค่า "ปิดการใช้งานฟอนต์ของ Smart Section"
- Text Editor ถ้ายังไม่ได้เลือกฟอนต์ใน Text Editor ค่าเริ่มต้นจะแสดงเป็นฟอนต์ของเว็บไซต์ แต่เมื่อทำการเลือกฟอนต์ของ Text Editor ในหน้านั้นๆ ฟอนต์ก็จะเปี่ยนไปตามที่เลือก

เมื่อปรับแต่งการแสดงผลเว็บไซต์ในเมนู "Global Styles" แล้ว อย่าลืมคลิกปุ่ม "Save" ตามตำแหน่งหมายเลข 4 เพื่อยืนยันการเปลี่ยนแปลง

วิธีใส่โลโก้ที่เมนูด้านบน

เว็บมาสเตอร์สามารถแสดงโลโก้สัญลักษณ์ธุรกิจได้ นั่นก็คือ โลโก้บริเวณเมนูด้านบน 

คุณสมบัติของรูปโลโก้ที่ระบบรองรับ

นามสกุลของไฟล์รูปภาพที่รองรับ : .jpg , .gif , .png

ขนาดของไฟล์รูป : ไม่เกิน 5 MB

วิธีใส่โลโก้ที่เมนูด้านบน

1. บริเวณเมนูด้านบน ให้นำเมาส์วางที่ตำแหน่งของรูปโลโก้ เมื่อปรากฎสัญลักษณ์  ให้คลิก "Edit image"

2. ปรากฎหน้าต่างให้คลิก "Upload image" ในครั้งแรก และเลือกรูปโลโก้ที่ต้องการ จากเครื่องคอมพิวเตอร์ของคุณ

3. เมื่ออัพโหลดภาพโลโก้แล้ว คุณสามารถเลือกขนาดโลโก้ที่จะแสดงผลบนแถบเมนูด้านบนได้ 3 ขนาด ดังนี้

- Logo ขนาดเล็ก : ความกว้างไม่เกิน 5% ของความกว้างหน้าเว็บไซต์ที่ใช้งาน ความสูงไม่เกิน 33 pixel

- Logo ขนาดกลาง : ความกว้างไม่เกิน 7.5% ของความกว้างหน้าเว็บไซต์ที่ใช้งาน ความสูงไม่เกิน 60 pixel

- Logo ขนาดใหญ่ : ความกว้างไม่เกิน 15% ของความกว้างหน้าเว็บไซต์ที่ใช้งาน ความสูงไม่เกิน 90 pixel

โดยระบบจะ resize ขนาดความกว้างและความสูงของโลโก้ให้พอดีกับพื้นที่แสดงผลอัตโนมัติ

ซึ่งหากคุณต้องการเปลี่ยนขนาดการแสดงผลโลโก้ หรืออัพโหลดรูปภาพใหม่ สามารถทำได้โดยนำเมาส์ไปที่สัญลักษณ์ และคลิกแก้ไขรูปภาพ ซึ่งการแก้ไขครั้งนี้จะมีตัวเลือก "Edit the Image" เพิ่มเติมขึ้นมา

วิธีซ่อนโลโก้ที่เมนูด้านบน

กรณีที่ไม่ต้องการแสดงโลโก้บนแถบเมนูด้านบนแล้ว ให้คลิกสัญลักษณ์ ที่อยู่ด้านขวาของรูปโลโก้ เพื่อซ่อนภาพได้ทันที หรือคลิกอีกครั้ง เพื่อเปิดการแสดงผลโลโก้

วิธีเพิ่มเมนู

เว็บมาสเตอร์สามารถเพิ่มเมนูในเว็บไซต์ได้ โดยคลิกปุ่ม "Add a Menu" ที่พื้นที่ เมนูด้านบน หรือ เมนูด้านข้าง

ปรากฎหน้าต่าง "Select a Type of Menu" สามารถเลือกเพิ่มได้ 7 ประเภท

Article
นับเป็นชนิดเมนูที่เป็นหัวใจหลักของเว็บไซต์เลยก็ว่าได้ค่ะ เพราะใช้ สำหรับแสดงผลเนื้อหาทั้งข้อความและรูปภาพได้ไม่จำกัด โดยเมื่อคลิกเลือกเพิ่มเมนูประเภท "Article" แล้วจะปรากฎหน้าต่าง "Edit menu" คุณสามารถใส่ข้อมูลในหัวข้อต่าง ๆ ดังต่อไปนี้

"Menu title" : สำหรับใส่ชื่อของบทความ สินค้า หรือเรื่องราวที่ต้องการ

"Content title / Article title" : สามารถใส่คำอธิบายข้อมูลเพิ่มเติมจากส่วน "ชื่อเมนู" ในเว็บไซต์แต่ละหน้าซึ่งสามารถเปลี่ยนชื่อหรือแก้ไขได้

Sync "Content title / Article title" with "Menu title" : หากทำเครื่องหมายกาถูกในหัวข้อนี้ ระบบจะนำข้อความในช่อง "ชื่อเมนู" มาแสดงผลในช่อง "หัวข้อเนื้อหา / ชื่อบทความ" อัตโนมัติ

Tags : สามารถใส่คำและคีย์เวิร์ดที่เกี่ยวข้องกับสินค้าหรือเนื้อหาเรื่องนั้น ๆ แล้วคำนั้นจะกลายเป็นลิงก์ให้สามารถคลิกได้ โดยเว็บมาสเตอร์สามารถใส่ Tag เพื่อแสดงผลสินค้าหรือเนื้อหาที่เกี่ยวข้องกันได้อย่างเป็นหมวดหมู่ตามต้องการ

"Show for member only" กรณีที่เว็บมาสเตอร์เปิดใช้งาน ระบบสมาชิก (Member Login) จะสามารถทำเครื่องหมายกาถูกในช่อง "Show for member only" เพื่อปิดเมนูนี้ให้เฉพาะสมาชิกที่ log in เข้าสู่ระบบสมาชิกของเว็บไซต์แล้วเท่านั้นจึงจะมองเห็น และคลิกดูข้อมูลในเมนูนั้น ๆ ได้

หลังจากกรอกข้อมูลในหัวข้อต่าง ๆ เรียบร้อยแล้ว คลิก "Save"

4. จะปรากฎเมนูที่เพิ่มเข้ามาใหม่ที่บริเวณเมนูด้านบน หรือเมนูด้านข้าง คุณสามารถใส่รายละเอียดในหน้าใหม่ที่ปรากฎ

ตำแหน่งหมายเลข 1 Menu title

จะเป็นพื้นที่หลักสำหรับใส่เนื้อหาและรูปภาพ ที่คุณต้องการนำเสนอในแต่ละหน้า ซึ่งจะเรียกพื้นที่หลักสำหรับใส่เนื้อหาส่วนนี้ว่า พื้นที่เนื้อหาหลัก (Section Main)

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

ตำแหน่งหมายเลข 2 Content title / Article title

ในกรณีที่ไม่ได้ ตั้งค่าสำหรับ SEO ที่เมนูนี้ หัวข้อเนื้อหาจะถูกนำไปแสดงผลเป็น Title Tag ที่แสดงบน Title Bar ของ Web Browser และแสดงในผลการค้นหาบรรทัดแรกของ Google อีกด้วย

หมายเลข 3 Image

สามารถใส่รูปภาพประกอบ ใน Section Main แต่ละหน้าได้ 7 รูป โดยสามารถลากเปลี่ยนสลับตำแหน่งของแต่ละรูปได้ หรือคลิก ซ่อน หากไม่ต้องการให้แสดงรูปประกอบ

หมายเลข 4 Article Content

คุณสามารถพิมพ์เนื้อหาสินค้าหรือบริการในส่วนนี้ได้โดยตรง โดยระบบจะทำการบันทึกข้อมูลให้อัตโนมัติ หรือ แก้ไขข้อมูลโดยใช้เครื่องมือ Text Editor ตกแต่งเพิ่มเติม โดยนำเมาส์ไปวางตำแหน่งรายละเอียดเนื้อหา จะปรากฎสัญลักษณ์    และคลิก "Edit with Text Editor"

เมื่อแก้ไขข้อมูลเรียบร้อยตามความต้องการแล้ว คลิก "Save"

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

วิธีเพิ่ม Smart Section

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

วิธีเพิ่ม Smart Section

1. คลิกปุ่ม "Add a Section"

2. ปรากฎหน้าต่าง "Select a Section" ให้คลิกเลือก "Smart Section"

3. ระบบจะแสดงหน้าต่างตัวอย่าง Smart Section ต่าง ๆ โดยให้คลิกที่รูปแบบที่ต้องการใช้งานได้เลย*

*หมายเหตุ : รูปแบบ Smart Section ที่แสดงเป็นเพียงตัวอย่างเท่านั้น เมื่อเปิดใช้งานจริง อาจจะมีการเปลี่ยนแปลงได้

4. ระบบจะแสดงผล Smart Section ที่ส่วนเนื้อหาของเว็บไซต์ พร้อมให้คุณแก้ไขและใส่ข้อมูลของคุณเองอย่างง่าย

วิธีใส่ข้อมูลใน Smart Section เบื้องต้น

ด้วยพื้นที่เนื้อหาในแต่ละ Section ที่รองรับการพิมพ์ข้อความและใส่รูปภาพได้โดยตรง ตามคอนเซปต์ "What you see is what you get." ดังนั้น การใส่ข้อมูลและรูปภาพในแต่ละ Section จึงง่ายมาก ๆ ตามวิธีดังนี้

1. วิธีอัพโหลดรูปภาพ

• คุณสมบัติของรูปภาพที่เหมาะสมกับการอัพโหลดใน Smart Section

- เป็นไฟล์ภาพนามสกุล (Type) : .jpeg/ .jpg/ .png

- ขนาดไฟล์ (File Size) ไม่เกิน 5 MB

- สำหรับรูปภาพที่แสดงเป็นพื้นหลัง (Background) ของ Section ในส่วนของความกว้างและความสูง (Width & Height) ของภาพนั้น ระบบจะมีขนาดของรูปแนะนำที่เหมาะสมในทุกจุด เนื่องจากระบบเว็บไซต์แบบ Responsive ที่จะแสดงผลหน้าเว็บไซต์ให้พอดีกับหน้าจอของอุปกรณ์ต่าง ๆ โดยอัตโนมัติ แต่เพื่อความสวยงามและชัดเจน (โดยเฉพาะเมื่อแสดงผลบนหน้าจอคอมพิวเตอร์ ) ควรอัพโหลดรูปภาพขนาดกว้างตามที่ระบบแนะนำ

อัพโหลดรูปภาพประกอบ Smart Section ให้นำเมาส์ไปวางบริเวณรูปภาพที่ต้องการแก้ไข จะปรากฎสัญลักษณ์     จากนั้นคลิก "Edit an Image"

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

ซึ่งรูปภาพประกอบ Smart Section จะมีรูปทรงการแสดงผลที่แตกต่างกัน เว็บมาสเตอร์สามารถเลือกเพิ่ม Section ตามความเหมาะสมกับรูปภาพที่มี โดยภาพที่เตรียมมาควรมีความกว้างหรือความสูงตามที่ระบบแนะนำ เพื่อความชัดเจนเมื่อแสดงผลบนหน้าเว็บไซต์จริง

ตัวอย่าง Smart Section ที่แสดงผลภาพประกอบ แบบสี่เหลี่ยมผืนผ้าแนวตั้ง ในอัตราส่วนภาพ 3:4

ตัวอย่าง Smart Section ที่แสดงผลภาพประกอบอแบบสี่เหลี่ยมจัตุรัส ในอัตราส่วนภาพ 1:1

2. วิธีผูกลิงก์ให้กับรูปภาพประกอบ Smart Section เพื่อให้ผู้ชมคลิกไปยังหน้าเว็บปลายทางที่เกี่ยวข้องและดูรายละเอียดเพิ่มเติมได้ มีขั้นตอนดังนี้

- นำเมาส์ไปวางบริเวณรูปภาพ จะปรากฎสัญลักษณ์    จากนั้นคลิก Edit URL

- วางลิงก์หน้าเว็บไซต์ปลายทางในช่อง URL พร้อมเลือกประเภทการเปิดลิงก์ ให้แสดงผล The same window (นิยมใช้ในกรณีที่สร้างลิงก์ภายในเว็บไซต์เดียวกัน) หรือจะแสดงผล A new window (นิยมใช้ในกรณีที่สร้างลิงก์เชื่อมโยงไปยังเว็บไซต์ภายนอก)

- คลิก "Save"

และสำหรับบางตำแหน่งใน Section ที่คุณไม่ต้องการแสดงผลรูปประกอบใน Section ก็สามารถนำเมาส์ไปวางบริเวณรูปภาพที่ต้องการแก้ไข จะปรากฎสัญลักษณ์    และคลิกคำสั่ง "Delete" ได้

โดยในหน้าแก้ไข (Edit Mode) ระบบจะแสดงผลภาพเริ่มต้นสีเทาแทนที่ แต่ที่หน้าเว็บไซต์จริง (View Mode) พื้นที่ที่ลบรูปจะไม่แสดงรูปใด ๆ และอาจมีการปรับตำแหน่งการแสดงผลข้อความต่าง ๆ ให้อัตโนมัติ

วิธีเพิ่ม Section Slideshow

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

• ใช้ในการแสดงผล Banner รูปภาพ พร้อมเป็นลิงก์ไปยังหน้าที่ต้องการได้

• แสดงเป็น Banner ภาพเดี่ยว หรือสร้างเป็นชุด Banner Slideshow ได้

• สามารถเลือกการแสดผลรูปภาพ Banner ให้พอดีจอได้ โดยเลือกรูปแบบอัพโหลดรูปภาพเดียวแล้วให้ระบบย่อ-ขยายขนาดภาพอัตโนมัติ หรืออัพโหลดภาพ 3 ขนาด เพื่อให้ระบบเลือกไปแสดงผลให้พอดีกับหน้าจอบนคอมพิวเตอร์, Tablet และหน้าจอ Smart Phone

ขั้นตอนการเพิ่ม Section Slideshow

1. คลิกปุ่มเพิ่มเมนู ประเภท "Article" เพื่อสร้างเป็นเมนูใหม่ หรือ คลิกเข้าไปที่เมนู ประเภท "Article" เดิมที่สร้างไว้แล้ว จากนั้น คลิกปุ่ม "Add a Section"

2. ปรากฎหน้าต่าง "เลือก Section" ให้คลิกเลือก "Slideshow"

คุณสมบัติของรูปภาพที่ระบบรองรับ

- นามสกุลของไฟล์รูปภาพที่รองรับ : .jpg, .jpeg, .png

- ขนาดของรูปที่เหมาะสม (Dimension) คือ : 1800x600 pixels ขึ้นไป

- ขนาดของไฟล์รูป (File Size) : ไม่เกิน 5 MB

วิธีอัพโหลดรูปภาพ ใน Section Slideshow

1. นำเมาส์ไปวางมุมบนขวาภายใน Section จะปรากฎสัญลักษณ์ ให้คลิก "ตั้งค่า Slideshow" เพื่ออัพโหลดรูปภาพ Banner ใหม่ ในตำแหน่งต่าง ๆ ตามรูปแบบที่เลือก โดยระบบจะแสดงหน้าต่างให้เลือก crop การแสดงผลภาพตามต้องการ (หรือคลิก แก้ไข เพื่อปรับตำแหน่งการแสดงผลภาพเดิมที่ได้อัพโหลดไปแล้วได้)

2. นอกจากนี้ ยังมีหัวข้ออื่น ๆ ให้เว็บมาสเตอร์กรอกข้อมูลเพิ่มเติมได้ ดังนี้

• ALT Text : เป็นส่วนสำหรับใส่ข้อความอธิบายรูปภาพที่จะช่วยให้ Search Engine รับรู้ความหมายของภาพนั้น ๆ เนื่องจาก Search Engine ไม่สามารถเก็บข้อมูลรูปภาพจากหน้าเว็บไซต์จากการดูว่าภาพ ที่แสดงคือภาพอะไร ดังนั้นจำเป็นจะต้องใช้ Tag พิเศษ เรียกว่า Alternative Text หรือ Alternate tag นี้ เพื่อใช้ในการอธิบายรูปภาพให้ Search Engine ทราบ

• URL : กรอก URL หน้าเว็บไซต์ ใช้กรณีที่ต้องการให้ผู้ชมคลิก Banner ไปยังหน้า Landing Page ปลายทางที่ต้องการได้

• Link will open in : เลือกการเปิดหน้าเว็บไซต์เมื่อคลิก Banner ที่ผูกลิงก์ URL ไว้ ให้แสดงผลทับหน้าต่างเดิม (นิยมใช้ในกรณีที่สร้างลิงก์ภายในเว็บไซต์เดียวกัน) หรือจะแสดงผลในหน้าต่างใหม่ (นิยมใช้ในกรณีที่สร้างลิงก์เชื่อมโยงไปยังเว็บไซต์ภายนอก)

3. เมื่ออัพโหลดรูปภาพและตั้งค่าตามต้องการแล้ว คลิก "Save"

วิธีเพิ่มจำนวนภาพ Banner เพื่อแสดงผลเป็น Slideshow

หลังจากที่เพิ่ม Section Slideshow แล้ว จะปรากฎสัญลักษณ์บริเวณใต้ Section เพื่อเพิ่มและแก้ไขให้ภาพใน Section นี้ แสดงผลในรูปแบบภาพเคลื่อนไหวแบบ Slideshow ได้ โดยมีวิธีการใช้งานดังนี้

• สัญลักษณ์ + คลิกเพื่อเพิ่มรูปสไลด์ใหม่ใน Section นี้ (สูงสุด 20 ภาพสไลด์)

• สัญลักษณ์ - คลิกเพื่อลบภาพสไลด์ที่แสดงผลอยู่

• สัญลักษณ์ < เลื่อนภาพสไลด์นี้ไปทางซ้าย

• สัญลักษณ์ > เลื่อนภาพสไลด์นี้ไปทางขวา

หมายเหตุ : ในส่วนแก้ไขเว็บไซต์ (Edit Mode) ภาพสไลด์โชว์จะไม่เคลื่อนไหวอัตโนมัติ เพื่อความสะดวกในการใส่ข้อมูลบนสไลด์โชว์แต่ละภาพ

หากผู้ชมไม่ได้นำ Cursor เมาส์ ไปชี้บริเวณพื้นที่สไลด์โชว์ ภาพในชุดสไลด์จะเลื่อนแสดงผลภาพถัดไปอัตโนมัติ

หากผู้ชมนำเมาส์ไปชี้ไว้ที่สไลด์ ระบบจะแสดงผลสไลด์นั้น ๆ ค้างไว้

ผู้ชมสามารถคลิกลิงก์บนภาพสไลด์ตามที่เว็บมาสเตอร์กำหนดไว้ เพื่ออ่านเนื้อหาเรื่องนั้น ๆ เพิ่มเติมได้

วิธีเพิ่มลิงก์เมนูลัด ในพื้นที่ด้านล่างของเว็บไซต์ (Footer Link)

กล่อง Footer Link คือ ส่วนแสดงลิงก์เมนูลัดที่บริเวณพื้นที่ด้านล่างของเว็บไซต์ โดยเว็บมาสเตอร์สามารถเลือกกลุ่มสินค้าหรือบทความต่าง ๆ ที่เคยเพิ่มไว้แล้วจาก เมนูด้านบน เมนูด้านข้าง (เมนูระดับ 1 และระดับ 2) และคลังเนื้อหา มาแสดงที่พื้นที่ของกล่อง Footer Link ได้ตามต้องการ

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

วิธีเพิ่มกล่อง Footer Link

1. ที่บริเวณพื้นที่ด้านล่างของเว็บไซต์ ให้คลิก "เพิ่มกล่อง Footer Link" จากนั้น จะปรากฎหน้าต่าง "Select contents" และเลือกเมนูที่ต้องการมาแสดงผล

2. แสดงผลเมนูที่เลือกในกล่อง Footer Link และสามารถเพิ่มกล่อง Footer Link เพื่อแสดงเมนูอื่น ๆ ที่ต้องการเพิ่มเติมได้ สูงสุดจำนวน 8 กล่อง และกรณีมีกล่อง Footer Link หลายกล่อง สามารถคลิกลากสลับตำแหน่งก่อน - หลัง ได้ด้วยค่ะ

3. สำหรับเมนูระดับ 1 ที่เป็น Footer Link และมีเมนูระดับ 2 เป็นลิงก์รายการย่อย ๆ อยู่ภายใต้ เว็บมาสเตอร์สามารถกำหนดจำนวนรายการย่อยที่ต้องการแสดงได้

โดยนำเมาส์ไปบริเวณตำแหน่งกล่อง Footer Link ที่ต้องการแก้ไข จะปรากฎสัญลักษณ์ จากนั้นให้คลิกที่เมนู "Sub-content settings"

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

วิธีลบกล่อง Footer Link

หากต้องการปิดการแสดงผล Footer Link บางกลุ่มหรือทุกกลุ่ม สามารถทำได้โดยนำเมาส์ไปบริเวณตำแหน่งกล่อง Footer Link ที่ต้องการ จะปรากฎสัญลักษณ์ จากนั้นให้คลิกที่เมนู "Delete this Footer Link" ค่ะ

โดยการลบกล่อง Footer Link จะไม่มีผลกระทบกับกลุ่มสินค้าหรือบทความต้นฉบับ และหากไม่ได้แสดงผลกลุ่มข้อมูลใด ๆ ในส่วน Footer Link เลย พื้นที่นี้จะถูกซ่อนบนหน้าเว็บไซต์จริงโดยอัตโนมัติค่ะ

ตั้งค่าพื้นที่ด้านล่างของเว็บไซต์

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

1. พิมพ์เนื้อหาในพื้นที่ด้านล่างโดยตรง

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

2. แก้ไข้ข้อมูลโดยใช้เครื่องมือ Text Editor
หากต้องการเพิ่มและตกแต่งข้อมูลอื่น ๆ นอกเหนือจากตัวอักษร สามารถใช้เครื่องมือ Text Editor ในการแก้ไขได้ โดยนำเมาส์วางบนสัญลักษณ์ และเลือก "Edit with Text Editor"

ระบบแสดงหน้าสำหรับจัดการข้อมูลด้วยเครื่องมือ Text Editor สามารถเพิ่มข้อมูล ตกแต่งตัวอักษร หรือใส่รูปภาพได้ตามความต้องการ จากนั้นคลิก "Save"