วิธีการจัดรูปแบบส่วนหัวในธีม WordPress

เผยแพร่แล้ว: 2022-11-04

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

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

ขึ้นอยู่กับธีมของคุณ คุณอาจสามารถเข้าถึงตัวเลือกเหล่านี้ได้โดยคลิกที่ไอคอนดินสอสีน้ำเงินถัดจากองค์ประกอบในส่วนหัวของคุณ นอกจากการกำหนดเป้าหมายผู้ใช้หรือเนื้อหาเฉพาะแล้ว คุณยังสามารถใช้ตัวเลือก "แสดงบน" หรือ "บทบาทผู้ใช้" ได้อีกด้วย หากคุณเป็นผู้ใช้ขั้นสูง คุณยังสามารถปรับแต่งส่วนหัวของ WordPress ด้วยรหัสของคุณเองได้ คุณจะต้องคุ้นเคยกับ HTML, PHP และ CSS หากคุณต้องการทำงานนี้ให้สำเร็จ บางธีม เช่น Astra มี hooks ที่สามารถใช้เพื่อแทรกเนื้อหาลงในส่วนหัว ความสำเร็จของไซต์ของคุณขึ้นอยู่กับส่วนหัว สร้างแบรนด์ให้เว็บไซต์ของคุณ เพิ่มปริมาณการเข้าชมเนื้อหาหลัก โปรโมตข้อมูลสำคัญหรือโปรไฟล์โซเชียล และอื่นๆ อีกมากมายด้วยการใช้ประโยชน์ ไม่มีวิธีใดที่จะดีไปกว่าการใช้ธีม Astra แบบฟรี นอกจากนี้ หากคุณมีความรู้ด้านเทคนิค คุณสามารถใช้การตั้งค่าเครื่องมือปรับแต่งหรือโค้ดของคุณเองจากธีมอื่นได้

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

HTML มีแท็กหกแท็กสำหรับส่วนหัว: h1, h2, h3, h4, h5 และ h6 ขนาดของส่วนหัวควรกำหนดโดยใช้แท็กส่วนหัวต่อไปนี้: h1 ถึง h6 ส่วนหัวที่สำคัญที่สุดระบุโดย *h1tag ในขณะที่ *h6tag ระบุส่วนหัวที่มีความสำคัญน้อยที่สุด

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

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

ฉันจะปรับแต่งส่วนหัว WordPress ของฉันได้อย่างไร

ที่มาของภาพ: firstsiteguide.com

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

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

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

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

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

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

วิธีแก้ไขส่วนหัวของเว็บไซต์ Ba

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

ฉันจะแก้ไขส่วนหัว Css ใน WordPress ได้อย่างไร

ในการแก้ไขส่วนหัว CSS ใน WordPress คุณจะต้องเข้าถึงส่วน ลักษณะที่ปรากฏ > ปรับแต่ง > CSS เพิ่มเติม จากแผงการดูแลระบบ WordPress ของคุณ จากที่นี่ คุณสามารถเพิ่มโค้ด CSS ของคุณเองซึ่งจะแทนที่สไตล์เริ่มต้น

หน้าหลักของเว็บไซต์ WordPress ประกอบด้วยหน้า HTML หน้าเดียว ไฟล์ชื่อ header.php จะรวมอยู่ในโฟลเดอร์ธีมที่ใช้งานอยู่ มันมีเนื้อหาของไฟล์ ไฟล์สามารถพบได้ในไดเร็กทอรี WP-content/themes หรือโดยไปที่ your-theme-name/theme-heading.php หลังจากที่คุณเปิดแล้ว คุณสามารถเปลี่ยนการกำหนดค่าใดๆ ที่คุณต้องการโดยใช้โปรแกรมแก้ไขโค้ด ตรวจสอบให้แน่ใจว่าคุณได้เลือกธีมที่ใช้งานอยู่ในแถบด้านข้างทางขวา: header.php จะมีข้อความกำกับว่า ส่วนหัวของธีม เพื่อช่วยให้คุณค้นหาได้ง่ายขึ้น หลังจากที่คุณเลือก อัปเดตไฟล์ คุณสามารถทำการเปลี่ยนแปลงได้ คุณจะต้องเรียกใช้การตรวจสอบ PHP เพื่อให้แน่ใจว่าการเปลี่ยนแปลงโค้ดของคุณจะไม่ทำให้เกิดปัญหาใดๆ

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