การปรับแต่งข้อความและรูปภาพ



การปรับแต่งข้อความและรูปภาพ

สามารถ "ปรับแต่งข้อความ และ รูปภาพ" ได้โดย
  1. Login เข้าใช้งาน Webedit ด้วย Username และ Password ที่ทาง Ecomsiam ได้จัดส่งให้
  2. ทำการสร้างหน้าเว็บเพจใหม่ที่ "สร้างเว็บเพจ" หรือ ไปหน้าเว็บเพจที่สร้างไว้แล้วที่ "แก้ไขเว็บเพจ"
  3. คลิก "ROW" ที่ต้องการแก้ไข
  4. ปรับแต่งข้อความ และ รูปภาพ
  5. คลิก "Save Change"
 

การปรับแต่งข้อความ

1. คลิก "ROW" ที่ต้องการแก้ไข
 

การยกเลิกการแก้ไขข้อความ


2. ทำการใส่ข้อความและปรับแต่งข้อความ โดยประกอบด้วย
 
  • ตัวหนา  (โดยเลือกข้อความที่ต้องการ แล้วกดปุ่ม  )
  • ตัวอักษรเอียง  (โดยเลือกข้อความที่ต้องการ แล้วกดปุ่ม  )
  • ขีดเส้นใต้ข้อความ  (โดยเลือกข้อความที่ต้องการ แล้วกดปุ่ม  )
  • ขีดฆ่าข้อความ (โดยเลือกข้อความที่ต้องการ แล้วกดปุ่ม  )
  • ตัวห้อย (โดยเลือกข้อความที่ต้องการ แล้วกดปุ่ม  )
  • ตัวยก (โดยเลือกข้อความที่ต้องการ แล้วกดปุ่ม  )
  • จัดข้อความชิดซ้าย  (โดยเลือกข้อความที่ต้องการ แล้วกดปุ่ม  )
  • จัดข้อความกึ่งกลาง  (โดยเลือกข้อความที่ต้องการ แล้วกดปุ่ม  )
  • จัดข้อความชิดขวา   (โดยเลือกข้อความที่ต้องการ แล้วกดปุ่ม  )
  • จัดข้อความให้ด้านซ้ายและด้านขวาอยู่ในระดับเดียวกัน  (โดยเลือกข้อความที่ต้องการ แล้วกดปุ่ม  )
  • แสดงลำดับเป็นตัวเลข  (โดยเลือกข้อความที่ต้องการ แล้วกดปุ่ม  )
  • แสดงหัวข้อแบบสัญลักษณ์  (โดยเลือกข้อความที่ต้องการ แล้วกดปุ่ม  )
  • เปลี่ยนสีตัวอักษร  (โดยเลือกข้อความที่ต้องการ แล้วกดปุ่ม  )
  • เปลี่ยนสีพื้นหลังตัวอักษร  (โดยเลือกข้อความที่ต้องการ แล้วกดปุ่ม  )
     

การยกเลิกการแก้ไขข้อความ


3. คลิก "Save Change" เพื่อบันทึกข้อมูลที่แก้ไข หรือ คลิก "Don't save" เพื่อยกเลิกการแก้ไข
 

การยกเลิกการแก้ไขข้อความ




การปรับแต่งรูปภาพ

สามารถทำการเพิ่มรูปภาพใน Layout ชนิด Taxt ได้โดย
1. คลิก "ROW" และ ตำแหน่งที่ต้องการเพิ่มรูปภาพ สามารถแทรกรูปภาพในข้อความได้
2. คลิกเครื่องมือ Image

ตัวอย่างการใส่รูปภาพในข้อความ และ การใส่ class

 

3. คลิก Browse Server เพื่อเลือกรูปภาพ

ตัวอย่างการใส่รูปภาพในข้อความ และ การใส่ class


4. จะปรากฎหน้าต่างขึ้นมาดังภาพ
    4.1 คลิกเลือก รูปภาพ ที่ต้องการ
    4.2 คลิก Link
หากยังไม่ได้อัพโหลดรูปภาพ สามารถอ่านขั้นตอนเพิ่มเติมได้โดยคลิก

ตัวอย่างการใส่รูปภาพในข้อความ และ การใส่ class


5. ลบค่าความสูงและความกว้างในช่อง Width และ Height ให้เป็นค่าว่าง

ตัวอย่างการใส่รูปภาพในข้อความ และ การใส่ class


6. ใส่คำอธิบายรูปภาพในช่อง Alternative Text

ตัวอย่างการใส่รูปภาพในข้อความ และ การใส่ class


7. คลิก Advanced จะปรากฎหน้าต่างดังภาพ
    7.1 พิมพ์ "img-responsive" ในช่อง Stylesheet Classes
    7.2 คลิก OK

ตัวอย่างการใส่รูปภาพในข้อความ และ การใส่ class


8. คลิก Save Change เพื่อบันทึกข้อมูล

 



เพจที่เกี่ยวข้อง