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

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

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

โชคดีที่มีวิธีที่ง่ายกว่าสำหรับผู้เริ่มต้นที่ อย่าบอกเป็นนัยว่า ไม่มีรหัส

สิ่งแรกที่ต้องทำคือติดตั้งและเปิดใช้งานปลั๊กอิน เพิ่มวิดเจ็ตหลังเนื้อหา. หลังจากเปิดใช้งานปลั๊กอินคุณต้องไปที่หน้าจอ หน้าตา»วิดเจ็ต ซึ่งคุณจะเห็นพื้นที่วิดเจ็ตใหม่ชื่อ " หลังจากเนื้อหา".

พื้นที่วิดเจ็ตหลังเนื้อหาปลั๊กอิน WordPress

ตอนนี้สิ่งที่คุณต้องทำคือเพียงลากและวางวิดเจ็ตทั้งหมดที่คุณต้องการลงในพื้นที่วิดเจ็ต หลังจากเนื้อหา".

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

โซลูชันนี้ใช้ได้กับ Custom Theme Frameworks ทั้งหมดเช่น Genesis, Thesis, Headway Themes เป็นต้น

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

ส่วนบุคคล

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

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

ปิดการแสดงเนื้อหาหลังจากโพสต์เฉพาะ

จัดรูปแบบเนื้อหาหลังบทความ

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

ปลั๊กอินเพิ่มคลาส CSS awacet awac-wrapperCSS ไปยังพื้นที่วิดเจ็ต คุณสามารถใช้คลาสเหล่านี้เพื่อเปลี่ยนลักษณะของพื้นที่วิดเจ็ต นี่คือสิ่งเล็กน้อยที่เราลองใน Twenty Thirteen:

.awac-wrapper {margin: 0px auto; ความกว้าง: 30%; ลอย: ซ้าย; การขยาย: 10px; }

โค้ดด้านบนช่วยให้เราสามารถแสดงวิดเจ็ตของเราในรูปแบบกริดได้ดังนี้:

ตัวอย่างการแสดงผลหลังบทความ

เราหวังว่าบทความนี้จะช่วยให้คุณเพิ่มพื้นที่วิดเจ็ตหลังจากบทความบน WordPress