รูปแบบและธีม

ลองใช้วิธีแบบ Compose
Jetpack Compose เป็นชุดเครื่องมือ UI ที่แนะนำสำหรับ Android ดูวิธีทำงานกับการกำหนดธีมใน Compose

สไตล์และธีมใน Android ช่วยให้คุณแยกรายละเอียดการออกแบบแอปออกจากโครงสร้างและลักษณะการทำงานของ UI ได้ คล้ายกับสไตล์ชีตในการออกแบบเว็บ

สไตล์คือคอลเล็กชันของแอตทริบิวต์ที่ระบุลักษณะที่ปรากฏของ View รายการเดียว โดยสไตล์จะระบุแอตทริบิวต์ต่างๆ เช่น สีแบบอักษร ขนาดแบบอักษร สีพื้นหลัง และอื่นๆ อีกมากมาย

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

ระบบจะประกาศสไตล์และธีมในไฟล์ทรัพยากรสไตล์ใน res/values/ ซึ่งมักจะชื่อ styles.xml

รูปที่ 1 ธีม 2 แบบที่ใช้กับกิจกรรมเดียวกัน ได้แก่ Theme.AppCompat (ซ้าย) และ Theme.AppCompat.Light (ขวา)

ธีมเทียบกับสไตล์

ธีมและสไตล์มีความคล้ายคลึงกันหลายอย่าง แต่ใช้เพื่อวัตถุประสงค์ที่ต่างกัน ธีมและสไตล์มีโครงสร้างพื้นฐานเหมือนกัน ซึ่งก็คือคู่คีย์-ค่าที่แมปแอตทริบิวต์กับทรัพยากร

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

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

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

ดูข้อมูลเพิ่มเติมเกี่ยวกับวิธีการทำงานร่วมกันของธีมและสไตล์ได้ที่บล็อกโพสต์การจัดสไตล์ Android: ธีมเทียบกับสไตล์

สร้างและใช้สไตล์

หากต้องการสร้างสไตล์ใหม่ ให้เปิดไฟล์ res/values/styles.xml ของโปรเจ็กต์ ทำตามขั้นตอนต่อไปนี้สำหรับแต่ละสไตล์ที่ต้องการสร้าง

  1. เพิ่มองค์ประกอบ <style> ที่มีชื่อซึ่งระบุสไตล์ได้ไม่ซ้ำกัน
  2. เพิ่มองค์ประกอบ <item> สำหรับแอตทริบิวต์สไตล์แต่ละรายการที่ต้องการกำหนด name ในแต่ละรายการจะระบุแอตทริบิวต์ที่คุณใช้เป็นแอตทริบิวต์ XML ในเลย์เอาต์ ค่าในองค์ประกอบ <item> คือค่าสำหรับแอตทริบิวต์นั้น

ตัวอย่างเช่น สมมติว่าคุณกำหนดสไตล์ต่อไปนี้

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="GreenText" parent="TextAppearance.AppCompat">
        <item name="android:textColor">#00FF00</item>
    </style>
</resources>

คุณใช้รูปแบบกับมุมมองได้ดังนี้

<TextView
    style="@style/GreenText"
    ... />

ระบบจะใช้แอตทริบิวต์แต่ละรายการที่ระบุในสไตล์กับมุมมองนั้นหากมุมมองยอมรับแอตทริบิวต์ดังกล่าว มุมมองจะละเว้นแอตทริบิวต์ที่ไม่ยอมรับ

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

ขยายและปรับแต่งสไตล์

เมื่อสร้างสไตล์ของคุณเอง ให้ขยายสไตล์ที่มีอยู่จากเฟรมเวิร์กหรือ Support Library เสมอ เพื่อให้คุณรักษาความเข้ากันได้กับสไตล์ UI ของแพลตฟอร์ม หากต้องการขยายสไตล์ ให้ระบุสไตล์ที่ต้องการขยายด้วยแอตทริบิวต์ parent จากนั้นคุณจะลบล้างแอตทริบิวต์สไตล์ที่รับช่วงมาและเพิ่มแอตทริบิวต์ใหม่ได้

เช่น คุณสามารถรับค่าลักษณะข้อความเริ่มต้นของแพลตฟอร์ม Android และแก้ไขได้ดังนี้

<style name="GreenText" parent="@android:style/TextAppearance">
    <item name="android:textColor">#00FF00</item>
</style>

อย่างไรก็ตาม ให้รับค่ารูปแบบแอปหลักจากไลบรารีการสนับสนุนของ Android เสมอ สไตล์ใน Support Library ช่วยให้ใช้งานร่วมกันได้โดยการเพิ่มประสิทธิภาพแต่ละสไตล์สำหรับแอตทริบิวต์ UI ที่มีในแต่ละเวอร์ชัน โดยปกติแล้วสไตล์ของ Support Library จะมีชื่อคล้ายกับสไตล์จากแพลตฟอร์ม แต่มี AppCompat รวมอยู่ด้วย

หากต้องการรับค่ารูปแบบจากไลบรารีหรือโปรเจ็กต์ของคุณเอง ให้ประกาศชื่อรูปแบบหลักโดยไม่มีส่วน @android:style/ ที่แสดงในตัวอย่างก่อนหน้า ตัวอย่างเช่น ตัวอย่างต่อไปนี้รับค่ารูปแบบลักษณะที่ปรากฏของข้อความจาก Support Library

<style name="GreenText" parent="TextAppearance.AppCompat">
    <item name="android:textColor">#00FF00</item>
</style>

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

<style name="GreenText.Large">
    <item name="android:textSize">22dp</item>
</style>

คุณสามารถรับค่ารูปแบบเช่นนี้ต่อไปได้กี่ครั้งก็ได้ตามต้องการโดยการต่อชื่อเพิ่ม

หากต้องการดูแอตทริบิวต์ที่คุณประกาศด้วยแท็ก <item> ได้ โปรดดูตาราง "แอตทริบิวต์ XML" ในข้อมูลอ้างอิงคลาสต่างๆ มุมมองทั้งหมดรองรับแอตทริบิวต์ XML จากคลาสพื้นฐาน View และมุมมองจำนวนมากเพิ่มแอตทริบิวต์พิเศษของตนเอง ตัวอย่างเช่น แอตทริบิวต์ XML TextView มีแอตทริบิวต์ android:inputType ที่คุณสามารถใช้กับมุมมองข้อความที่รับอินพุต เช่น วิดเจ็ต EditText

ใช้รูปแบบเป็นธีม

คุณสร้างธีมได้ด้วยวิธีเดียวกับการสร้างสไตล์ ความแตกต่างอยู่ที่วิธีใช้ โดยแทนที่จะใช้สไตล์ที่มีแอตทริบิวต์ style ในมุมมอง คุณจะใช้ธีมที่มีแอตทริบิวต์ android:theme ในแท็ก <application> หรือแท็ก <activity> ในไฟล์ AndroidManifest.xml

ตัวอย่างเช่น วิธีใช้ธีม "มืด" ของ Material Design ในไลบรารีการสนับสนุนของ Android กับทั้งแอปมีดังนี้

<manifest ... >
    <application android:theme="@style/Theme.AppCompat" ... >
    </application>
</manifest>

และวิธีใช้ธีม "สว่าง" กับกิจกรรมเดียวมีดังนี้

<manifest ... >
    <application ... >
        <activity android:theme="@style/Theme.AppCompat.Light" ... >
        </activity>
    </application>
</manifest>

ทุกมุมมองในแอปหรือกิจกรรมจะใช้สไตล์ที่รองรับจากสไตล์ที่กำหนดไว้ในธีมที่ระบุ หากมุมมองรองรับเฉพาะแอตทริบิวต์บางรายการที่ประกาศในสไตล์ มุมมองจะใช้เฉพาะแอตทริบิวต์เหล่านั้นและละเว้นแอตทริบิวต์ที่ไม่รองรับ

ตั้งแต่ Android 5.0 (ระดับ API 21) และไลบรารีการสนับสนุนของ Android v22.1 เป็นต้นไป คุณยังระบุแอตทริบิวต์ android:theme ให้กับมุมมองในไฟล์เลย์เอาต์ได้ด้วย ซึ่งจะแก้ไขธีมสำหรับมุมมองนั้นและมุมมองย่อยทั้งหมด ซึ่งมีประโยชน์สำหรับการปรับเปลี่ยนชุดสีของธีมในส่วนที่เฉพาะเจาะจงของอินเทอร์เฟซ

ตัวอย่างก่อนหน้านี้แสดงวิธีใช้ธีม เช่น Theme.AppCompat ที่ไลบรารีการสนับสนุนของ Android มีให้ อย่างไรก็ตาม โดยปกติแล้วคุณจะต้องการปรับแต่งธีมให้เหมาะกับแบรนด์ของแอป วิธีที่ดีที่สุดคือการขยายสไตล์เหล่านี้จาก Support Library และลบล้างแอตทริบิวต์บางรายการตามที่อธิบายไว้ในส่วนต่อไปนี้

ลำดับชั้นของสไตล์

Android มีวิธีต่างๆ ในการตั้งค่าแอตทริบิวต์ทั่วทั้งแอป Android เช่น คุณสามารถตั้งค่าแอตทริบิวต์ในเลย์เอาต์โดยตรง ใช้สไตล์กับมุมมอง ใช้ธีมกับเลย์เอาต์ และแม้แต่ตั้งค่าแอตทริบิวต์แบบเป็นโปรแกรม

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

  1. การใช้การจัดรูปแบบระดับอักขระหรือย่อหน้าโดยใช้ช่วงข้อความกับคลาสที่ได้มาจาก TextView
  2. การใช้แอตทริบิวต์แบบเป็นโปรแกรม
  3. การใช้แอตทริบิวต์แต่ละรายการกับมุมมองโดยตรง
  4. การใช้สไตล์กับมุมมอง
  5. การจัดรูปแบบเริ่มต้น
  6. การใช้ธีมกับคอลเล็กชันของมุมมอง กิจกรรม หรือทั้งแอป
  7. การใช้การจัดรูปแบบเฉพาะมุมมองบางอย่าง เช่น การตั้งค่า TextAppearance ใน TextView

รูปที่ 2 การจัดรูปแบบจาก span จะลบล้างการจัดรูปแบบจาก textAppearance

TextAppearance

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

<TextView
    ...
    android:textAppearance="@android:style/TextAppearance.Material.Headline"
    android:text="This text is styled via textAppearance!" />

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

TextAppearance รองรับชุดย่อยของแอตทริบิวต์การจัดรูปแบบที่ TextView มีให้ ดูรายการแอตทริบิวต์ทั้งหมดได้ที่ TextAppearance

แอตทริบิวต์ TextView ทั่วไปบางรายการที่ไม่ได้รวมไว้ ได้แก่ lineHeight[Multiplier|Extra], lines, breakStrategy และ hyphenationFrequency TextAppearance ทำงานที่ระดับอักขระ ไม่ใช่ระดับย่อหน้า ดังนั้นจึงไม่รองรับแอตทริบิวต์ที่ส่งผลต่อเลย์เอาต์ทั้งหมด

ปรับแต่งธีมเริ่มต้น

เมื่อคุณสร้างโปรเจ็กต์ด้วย Android Studio ระบบจะใช้ธีม Material Design กับแอปโดยค่าเริ่มต้นตามที่กำหนดไว้ในไฟล์ styles.xml ของโปรเจ็กต์ สไตล์ AppTheme นี้จะขยายธีมจาก Support Library และรวมการลบล้างแอตทริบิวต์สีที่องค์ประกอบ UI หลักใช้ เช่น แถบแอปและปุ่มการทำงานแบบลอย หากใช้ คุณจึงปรับแต่งการออกแบบสีของแอปได้อย่างรวดเร็วโดยการอัปเดตสีที่ให้มา

ตัวอย่างเช่น ไฟล์ styles.xml ของคุณจะมีลักษณะคล้ายกับตัวอย่างนี้

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
</style>

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

เมื่อทราบสีแล้ว ให้อัปเดตค่าใน res/values/colors.xml โดยทำดังนี้

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!--   Color for the app bar and other primary UI elements. -->
    <color name="colorPrimary">#3F51B5</color>

    <!--   A darker variant of the primary color, used for
           the status bar (on Android 5.0+) and contextual app bars. -->
    <color name="colorPrimaryDark">#303F9F</color>

    <!--   a secondary color for controls like checkboxes and text fields. -->
    <color name="colorAccent">#FF4081</color>
</resources>

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

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    ...
    <item name="android:windowBackground">@color/activityBackground</item>
</style>

ดูรายการแอตทริบิวต์ที่คุณใช้ในธีมได้ที่ตารางแอตทริบิวต์ใน R.styleable.Theme เมื่อเพิ่มสไตล์สำหรับมุมมองในเลย์เอาต์ คุณยังค้นหาแอตทริบิวต์ได้โดยดูที่ตาราง "แอตทริบิวต์ XML" ในข้อมูลอ้างอิงคลาสของมุมมอง เช่น ทุกมุมมองรองรับแอตทริบิวต์ XML จากคลาส View พื้นฐาน

แอตทริบิวต์ส่วนใหญ่จะใช้กับมุมมองบางประเภท และบางแอตทริบิวต์จะใช้กับมุมมองทั้งหมด อย่างไรก็ตาม แอตทริบิวต์ธีมบางรายการที่แสดงใน R.styleable.Theme จะใช้กับ หน้าต่างกิจกรรม ไม่ใช่มุมมองในเลย์เอาต์ ตัวอย่างเช่น windowBackground จะเปลี่ยนพื้นหลังของหน้าต่าง และ windowEnterTransition จะกำหนดภาพเคลื่อนไหวการเปลี่ยนภาพที่จะใช้เมื่อกิจกรรมเริ่มต้นขึ้น ดูรายละเอียดเพิ่มเติมได้ที่เริ่มกิจกรรมโดยใช้ภาพเคลื่อนไหว

ไลบรารีการสนับสนุนของ Android ยังมีแอตทริบิวต์อื่นๆ ที่คุณใช้ปรับแต่งธีมที่ขยายจาก Theme.AppCompat ได้ เช่น แอตทริบิวต์ colorPrimary ที่แสดงในตัวอย่างก่อนหน้านี้ ซึ่งดูได้ดีที่สุดในไฟล์ attrs.xml ของไลบรารี

นอกจากนี้ยังมีธีมต่างๆ ที่พร้อมใช้งานจาก Support Library ซึ่งคุณอาจต้องการขยายแทนธีมที่แสดงในตัวอย่างก่อนหน้านี้ คุณสามารถดูธีมที่พร้อมใช้งานได้ดีที่สุดในไฟล์ themes.xml ของไลบรารี

เพิ่มรูปแบบเฉพาะเวอร์ชัน

หาก Android เวอร์ชันใหม่เพิ่มแอตทริบิวต์ธีมที่คุณต้องการใช้ คุณสามารถเพิ่มแอตทริบิวต์เหล่านั้นลงในธีมได้โดยที่ยังคงเข้ากันได้กับเวอร์ชันเก่า คุณเพียงแค่ต้องมีไฟล์ styles.xml อีกไฟล์หนึ่งที่บันทึกไว้ในไดเรกทอรี values ซึ่งมีตัวระบุเวอร์ชันของทรัพยากร ดังนี้

res/values/styles.xml        # themes for all versions
res/values-v21/styles.xml    # themes for API level 21+ only

เนื่องจากสไตล์ในไฟล์ values/styles.xml พร้อมใช้งานสำหรับทุกเวอร์ชัน ธีมของคุณใน values-v21/styles.xml จึงรับค่าสไตล์เหล่านั้นได้ ซึ่งหมายความว่าคุณสามารถหลีกเลี่ยงการทำซ้ำสไตล์ได้โดยเริ่มจากธีม "ฐาน" แล้วขยายธีมในสไตล์เฉพาะเวอร์ชัน

เช่น หากต้องการประกาศการเปลี่ยนหน้าต่างสำหรับ Android 5.0 (API ระดับ 21) ขึ้นไป คุณต้องใช้แอตทริบิวต์ใหม่ ดังนั้น ธีมพื้นฐานใน res/values/styles.xml อาจมีลักษณะดังนี้

<resources>
    <!-- Base set of styles that apply to all versions. -->
    <style name="BaseAppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <item name="colorPrimary">@color/primaryColor</item>
        <item name="colorPrimaryDark">@color/primaryTextColor</item>
        <item name="colorAccent">@color/secondaryColor</item>
    </style>

    <!-- Declare the theme name that's actually applied in the manifest file. -->
    <style name="AppTheme" parent="BaseAppTheme" />
</resources>

จากนั้นเพิ่มสไตล์เฉพาะเวอร์ชันใน res/values-v21/styles.xml ดังนี้

<resources>
    <!-- extend the base theme to add styles available only with API level 21+ -->
    <style name="AppTheme" parent="BaseAppTheme">
        <item name="android:windowActivityTransitions">true</item>
        <item name="android:windowEnterTransition">@android:transition/slide_right</item>
        <item name="android:windowExitTransition">@android:transition/slide_left</item>
    </style>
</resources>

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

ดูข้อมูลเพิ่มเติมเกี่ยวกับการใช้ทรัพยากรทางเลือกสำหรับอุปกรณ์ต่างๆ ได้ที่การจัดหาทรัพยากรทางเลือก

ปรับแต่งรูปแบบวิดเจ็ต

วิดเจ็ตทุกรายการในเฟรมเวิร์กและ Support Library มีสไตล์เริ่มต้น ตัวอย่างเช่น เมื่อคุณจัดสไตล์แอปโดยใช้ธีมจาก Support Library อินสแตนซ์ของ Button จะได้รับการจัดสไตล์โดยใช้สไตล์ Widget.AppCompat.Button หากต้องการใช้รูปแบบวิดเจ็ตอื่นกับปุ่ม คุณสามารถทำได้โดยใช้แอตทริบิวต์ style ในไฟล์เลย์เอาต์ ตัวอย่างเช่น โค้ดต่อไปนี้จะใช้รูปแบบปุ่มที่ไม่มีเส้นขอบของไลบรารี

<Button
    style="@style/Widget.AppCompat.Button.Borderless"
    ... />

หากต้องการใช้สไตล์นี้กับปุ่มทั้งหมด คุณสามารถประกาศสไตล์นี้ใน buttonStyle ของธีมได้ดังนี้

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="buttonStyle">@style/Widget.AppCompat.Button.Borderless</item>
    ...
</style>

นอกจากนี้ คุณยังขยายรูปแบบวิดเจ็ตได้เช่นเดียวกับการขยายรูปแบบอื่นๆ แล้วใช้รูปแบบวิดเจ็ตที่กำหนดเองในเลย์เอาต์หรือธีม

แหล่งข้อมูลเพิ่มเติม

ดูข้อมูลเพิ่มเติมเกี่ยวกับธีมและสไตล์ได้ที่แหล่งข้อมูลเพิ่มเติมต่อไปนี้

บล็อกโพสต์