แชร์ผ่าน


ปรับแต่งหน้าเว็บด้วยตัวแก้ไขหน้าสตูดิโอการออกแบบ

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

การใช้ตัวแก้ไข

ในการใช้ตัวแก้ไข:

  1. เปิด สตูดิโอการออกแบบ เพื่อแก้ไขเนื้อหาและส่วนประกอบของพอร์ทัล

  2. ไปที่พื้นที่ทำงาน หน้า

  3. เลือกหน้าที่คุณต้องการเพิ่มส่วนประกอบหรือส่วน

  4. ในการเพิ่มส่วน ให้วางเมาส์เหนือส่วนที่แก้ไขได้ จากนั้นเลือกสัญลักษณ์บวก (+) จากนั้นคุณสามารถเลือกระหว่างตัวเลือกเค้าโครงส่วนหกตัวเลือก

    ตัวเลือกเค้าโครงส่วนหกแบบ

  5. ในการเพิ่มส่วนประกอบ ให้วางเมาส์เหนือส่วนที่คุณต้องการวางส่วนประกอบ แล้วเลือก + จากนั้นคุณสามารถเลือกระหว่างส่วนประกอบที่มีพร้อมใช้งาน

    ตัวเลือกเมนูเพิ่มส่วนประกอบ

    หมายเหตุ

    คุณยังสามารถสร้างและใช้เทมเพลตเว็บเป็นส่วนประกอบในเว็บเพจได้ด้วย
    ข้อมูลเพิ่มเติม: วิธีการ: สร้างส่วนประกอบของเทมเพลตเว็บ

    คุณสามารถลากและวางส่วน คอลัมน์ และส่วนประกอบเพื่อจัดเรียงใหม่บนหน้าได้

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

    หมายเหตุ

    • ส่วนประกอบบางอย่างไม่สามารถลากได้ รวมถึงส่วนหัว ส่วนท้าย และส่วนประกอบที่ซ้อนกันบางส่วน (เช่น ลิงก์ภายในส่วนประกอบข้อความ)
    • ไม่รองรับฟังก์ชันการลากและปล่อยสำหรับส่วนที่มีการตั้งค่าคุณสมบัติ flex-direction CSS เป็น row-reverse
  6. เมื่อต้องการลบส่วนประกอบ ให้เลือกส่วนประกอบบนพื้นที่ทำงาน และจากนั้นเลือก ลบ

เพื่อประสบการณ์การแก้ไขที่สมจริงยิ่งขึ้น คุณสามารถใช้โหมดแก้ไขแบบเต็มหน้าจอได้ โดยเลือกไอคอนลูกศรคู่ที่มุมขวาบนของตัวแก้ไข คุณยังสามารถเปลี่ยนเป็น Visual Studio Code, ซูมเข้า (+), ซูมออก (-) หรือ รีเซ็ต มุมมองพื้นที่ทำงานการออกแบบเพจกลับไปเป็น 100%

ตัวควบคุมสำหรับตัวเลือกการแก้ไขที่สมจริง รวมถึงการซูมเข้า ซูมออก และรีเซ็ต

แก้ไขส่วนประกอบ

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

เลือกไอคอนพู่กันเพื่อปรับสไตล์ของส่วนหรือส่วนประกอบ

ภาพหน้าจอของไอคอนพู่กัน

ลักษณะที่ใช้ได้จะขึ้นอยู่กับชนิดของส่วนประกอบ ปัจจุบันรองรับส่วน ข้อความ ปุ่ม รูปภาพ และวิดีโอ ลักษณะที่มีอยู่จะแตกต่างกันไปขึ้นอยู่กับประเภทของส่วนประกอบ และรวมถึง:

  • เค้าโครง – ควบคุมการวางตำแหน่งและการจัดเรียงองค์ประกอบบนเพจ เช่น ระยะขอบ ระยะห่างจากขอบ และตำแหน่ง

  • การตกแต่ง – ปรับปรุงรูปลักษณ์ขององค์ประกอบต่างๆ เช่น เส้นขอบ เงา และรัศมีมุม

  • ตัวพิมพ์ – เปลี่ยนรูปลักษณ์ของข้อความ รวมถึงคุณสมบัติต่างๆ เช่น ตระกูลแบบอักษร ขนาดแบบอักษร และการเว้นวรรคตัวอักษร

หมายเหตุ

เมื่อคุณใช้ไอคอนพู่กันเพื่อใช้ลักษณะ โดยทั่วไปการปรับปรุงเหล่านี้จะมีความสำคัญเหนือกว่าการตั้งค่าที่กำหนดค่าไว้ในพื้นที่ทำงานลักษณะและ CSS แบบกำหนดเองใดๆ ที่มีอยู่ ตัวอย่างเช่น การเปลี่ยนแปลงแบบอักษรของส่วนประกอบข้อความด้วยเครื่องมือพู่กัน โดยทั่วไปจะแทนที่แบบอักษรที่ระบุโดยธีม (เช่น "หัวเรื่อง 1") หรือลักษณะที่สืบทอดอื่นๆ อย่างไรก็ตาม ลักษณะที่กำหนดด้วยคำสั่ง !important ใน CSS แบบกำหนดเองของคุณจะไม่ถูกแทนที่

เลิกทำ/ทำซ้ำ

ในพื้นที่ทำงานของ Pages ปุ่มเลิกทำ/ทำซ้ำจะแสดงที่ด้านบนซ้ายของพื้นที่ทำงาน ปุ่มเลิกทำจะเปิดใช้งานเมื่อคุณทำการเปลี่ยนแปลง ปุ่มทำซ้ำจะเปิดใช้งานเมื่อคุณเลิกทำการดำเนินการ

พื้นที่ทำงาน Pages ที่มีปุ่มเลิกทำและทำซ้ำแสดงอยู่

หากต้องการย้อนกลับการดำเนินการ ให้เลือกปุ่มเลิกทำ

หากต้องการย้อนกลับการเลิกทำ ให้เลือกปุ่มทำซ้ำ

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

ข้อจำกัด

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

หมายเหตุ

  • คุณไม่สามารถลบหัวกระดาษหรือท้ายกระดาษในพื้นที่ทำงานของหน้า ดู เทมเพลตเว็บ สำหรับข้อมูลเกี่ยวกับการสร้างเค้าโครงหน้าแบบกำหนดเอง
  • สำหรับไซต์ที่สร้างโดยใช้ Power Pages ก่อนวันที่ 23 กันยายน 2022 มีปัญหาที่ทราบเกี่ยวกับธีม ข้อมูลเพิ่มเติม: การปรับสีพื้นหลังสำหรับไซต์ Power Pages ของคุณ

แก้ไขส่วนประกอบของโค้ด

คุณสมบัติส่วนประกอบของโค้ดสามารถแก้ไขได้ภายในพื้นที่ทำงานของ Pages

หากต้องการแก้ไขส่วนประกอบของโค้ด:

  1. เลือกส่วนประกอบและเลือก แก้ไขส่วนประกอบของโค้ด จากแถบเครื่องมือ

  2. ตั้งค่าคุณสมบัติสำหรับส่วนประกอบของโค้ดของคุณ

  3. เลือก เสร็จสิ้น

สำหรับข้อมูลเพิ่มเติมเกี่ยวกับการเพิ่มส่วนประกอบของโค้ดในฟอร์มและเพจ โปรดดูที่ ใช้ส่วนประกอบของโค้ดใน Power Pages

ดูเพิ่มเติม