วิธีที่จะให้รูปแบบที่ไม่ซ้ำกับรายการในแต่ละ WordPress

คุณเคยเจอเว็บไซต์ที่ตีพิมพ์บทความในบล็อกหรือไม่

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

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

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

จากนั้นกลับไปที่สาเหตุที่เราอยู่ที่นี่

Remarque: บทช่วยสอนนี้ต้องการให้คุณเพิ่ม CSS ที่กำหนดเองบน WordPress คุณจะต้องใช้เครื่องมือตรวจสอบ จำเป็นต้องมีความรู้ CSS และ HTML บางอย่าง

ให้แต่ละสไตล์ในรายการ WordPress

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

ค้นพบคำแนะนำของเราบน Permalinks: วิธีการปรับแต่งการเชื่อมโยงบล็อกของคุณ

หน้าที่หลักของ WordPress เรียกว่า " post_class () ธีมใช้เพื่อบอก WordPress ว่าจะเพิ่มคลาส CSS เริ่มต้นเหล่านี้ในบทความได้อย่างไร

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

นี่คือ CSS คลาสที่ถูกเพิ่มโดยค่าเริ่มต้นโดยยึดตามหน้าที่แสดงโดยผู้ใช้

• .post-ID
• .poster
• .attachement
• .gluant
• .hentry
• ID .category
• .category ชื่อ
• .tag ชื่อ
• .format- {ขนาด name}
• {.type- โพสต์ประเภท-name}
• .has โพสต์ภาพขนาดย่อ
• .post รหัสผ่านที่จำเป็น
• .protected โดย-a-รหัสผ่าน

ตัวอย่างของการแสดงผลจะมีลักษณะเช่นนี้:

คุณสามารถปรับแต่งแต่ละสิ่งพิมพ์ WordPress ที่แตกต่างกันโดยใช้คลาส CSS ที่เกี่ยวข้อง

อ่าน: วิธีการปรับปรุงของคุณ WordPress บล็อกสุดสัปดาห์นี้

ตัวอย่างเช่นหากคุณต้องการแก้ไขสิ่งพิมพ์แต่ละรายการคุณสามารถใช้คลาส post-id ใน CSS ที่กำหนดเองของคุณ

.post-412 {สีพื้นหลัง: #FF0303; สี: #FFFFFF; }

อย่าลืมเปลี่ยนรหัสโพสต์ให้ตรงกับรหัสโพสต์ของคุณ

ลองมาดูตัวอย่างอื่น

เวลานี้เราจะกล่าวถึงบทความทั้งหมดที่โพสต์ในหมวดหมู่เฉพาะที่เรียกว่า "ข่าว"

ค้นหาคำแนะนำของเรา วิธีเพิ่ม CSS ที่กำหนดเองในบล็อก WordPress ของคุณ

เราสามารถทำได้โดยเพิ่ม CSS ที่กำหนดเองต่อไปนี้ให้กับธีมของเรา

.category ข่าว {font-size: 18px; ตัวอักษรสไตล์: italic; }

CSS นี้จะมีผลกับรายการทั้งหมดในหมวดหมู่ " ความทันสมัย '

ฟังก์ชั่น post_class ()

ผู้พัฒนาธีมใช้ฟังก์ชั่นนี้ post_class () เพื่อบอก WordPress ว่าจะเพิ่มโพสต์คลาสได้ที่ไหน โดยปกติจะอยู่ในแท็ก "บทความ"

ฟังก์ชั่น post_class () ไม่เพียง แต่โหลดคลาส CSS ที่สร้างโดย WordPress ตามค่าเริ่มต้น แต่ยังช่วยให้คุณสามารถเพิ่มคลาสของคุณเองได้

ค้นพบยัง วิธีการป้องกันขูดเนื้อหาบล็อกของคุณ

ตามคุณ ธีม WordPressคุณจะพบฟังก์ชัน post_class() ในไฟล์ single.php หรือในไฟล์เทมเพลต โดยปกติรหัสจะมีลักษณะดังนี้:

" >

คุณสามารถเพิ่มคลาส CSS ของคุณเองด้วยคุณสมบัติเช่นนี้:

" >

คลาส post_class จะพิมพ์คลาส CSS เริ่มต้นตามลำดับด้วยคลาส CSS ที่กำหนดเองของคุณ

หากคุณต้องการเพิ่มคลาส CSS หลายคลาสคุณสามารถกำหนดให้เป็นอาร์เรย์และใช้ในฟังก์ชั่น post-class ()

" >

แสดงบทความที่มีสไตล์แตกต่างกันไปตามผู้แต่ง

คลาส CSS เริ่มต้นที่สร้างโดยฟังก์ชัน posts_class จะไม่รวมชื่อผู้แต่งเป็นคลาส CSS

หากคุณต้องการปรับแต่งสไตล์ของแต่ละโพสต์ตามผู้เขียนคุณต้องเพิ่มชื่อผู้เขียนเป็นคลาส CSS ก่อน

อ่าน: วิธีการเพิ่มภาพเคลื่อนไหว CSS WordPress

คุณสามารถทำได้โดยใช้ตัวอย่างต่อไปนี้:

" >

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

ดูคำแนะนำของเราบน วิธีเพิ่ม CSS ที่กำหนดเองในบล็อก WordPress ของคุณ

โค้ดด้านบนมีแนวโน้มที่จะแสดงเช่นนี้:

ตอนนี้คุณสามารถใช้ ".peter" ใน CSS ที่กำหนดเองของคุณเพื่อแก้ไขโพสต์ทั้งหมดโดยผู้เขียนคนนั้นให้ปรากฏแตกต่างกัน

.Peter {สีพื้นหลัง: #EEE; ชายแดน: ของแข็ง 1px # CCC; }

กำหนดโพสต์ของบทความตามความคิดเห็น

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

ค้นพบของเรา ปลั๊กอิน WordPress 10 พรีเมียมเพื่อจัดการความคิดเห็นของคุณ

ขั้นแรกเราต้องได้รับจำนวนความคิดเห็นและเชื่อมโยงชั้นเรียน

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

อนุมัติ; ถ้า ($ my_comment_count <10) {$ my_comment_count = 'ใหม่'; } elseif ($ my_comment_count> = 10 && $ my_comment_count <20) {$ my_comment_count = 'ermerging'; } elseif ($ my_comment_count> = 20) {$ my_comment_count = 'ยอดนิยม'; }?>

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

จากนั้นคุณต้องเพิ่มคลาส CSS ลงในฟังก์ชัน post_class

" >

สิ่งนี้จะเพิ่มคลาส CSS ใหม่ที่กำลังจะเกิดขึ้นและเป็นที่นิยมในบทความทั้งหมดตามจำนวนความคิดเห็นในแต่ละโพสต์

เราขอเชิญคุณให้อ่านบทความของเราใน ปลั๊กอิน 6 WordPress สำหรับลงนามเอกสารออนไลน์

คุณยังสามารถเพิ่ม CSS ที่กำหนดเองเพื่อเผยแพร่สไตล์ตามความนิยม:

.new {ชายแดน: ของแข็ง 1px #FFFF00;} {.emerging ชายแดน: ประ 1px #FF9933;} {.popular ชายแดน: ประ 1px #CC0000;}

เราเพิ่งเพิ่มเส้นขอบ แต่คุณสามารถเพิ่มกฎ CSS ที่คุณต้องการ

ค้นพบปลั๊กอิน WordPress พรีเมียมบางอย่าง  

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

เราเสนอปลั๊กอิน WordPress พรีเมี่ยมให้คุณที่นี่ซึ่งจะช่วยคุณได้

1 Ultimate Membership Pro

Ultimate Membership Pro ยอดเยี่ยมมาก WordPress ปลั๊กอิน การสมัครสมาชิกพรีเมี่ยมและการ จำกัด เนื้อหา อนุญาตให้ผู้ใช้จัดการตามแพ็คเกจ (ฟรีหรือจ่ายเงิน) โดยการสร้างระดับการเข้าถึงพิเศษ

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

อ่านบทความของเราเกี่ยวกับ ปลั๊กอิน WordPress 4 คุณภาพสูงเพื่อสร้างภาพขนาดย่อ

ฟังก์ชันหลัก ได้แก่ การป้องกันเนื้อหาระดับการเข้าถึงหลายระดับรองรับเกตเวย์การชำระเงินหลายรายการ - บัตรเครดิต/เดบิต หรือ PayPal,Authorize.net, ลาย, 2CheckOut, โอนเงินผ่านธนาคาร -, การป้องกันเนื้อหาบางส่วน, และอื่น ๆ อีกมากมาย ...

ดาวน์โหลด | สาธิต | เว็บโฮสติ้ง 

2. วิธีเลื่อนสำหรับ Facebook

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

ปลั๊กอินยังมีฟังก์ชั่นต่าง ๆ เพื่อขยายขีดความสามารถของเว็บไซต์ของคุณ: ตัวอย่างเช่น ส่วน Like (“ Like Box”) หรือเพจสำหรับแฟน ๆ (“ Fan Page Wall)

ค้นพบด้วย วิธีการโหลด Facebook และ Disqus อย่างช้าๆ

คุณไม่จำเป็นต้องฝังปุ่ม "ไลค์" และ "แชร์" บนโพสต์หรือเพจเนื่องจาก Facebook Comment Slider มีอยู่แล้วและสามารถปรากฏในโพสต์หรือเพจใดก็ได้ ผู้เยี่ยมชมจะพบปุ่ม "ถูกใจ" ปุ่ม "แบ่งปัน" และกล่องความคิดเห็นตัวเลื่อน Facebook เห็นได้ชัดว่าพวกเขาจะใช้บัญชี Facebook ของพวกเขา

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

ดาวน์โหลด | สาธิต | เว็บโฮสติ้ง

3 เข้าสู่ระบบนินจา

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

คุณสมบัติอื่น ๆ : การป้องกันการเข้าสู่ระบบและแบบฟอร์มการลงทะเบียนด้วย captcha, การห้าม IP โดยอัตโนมัติและด้วยตนเองที่โจมตีคุณด้วยกำลังดุร้าย, บันทึกโดยละเอียดของกิจกรรมที่เกี่ยวข้องกับการเชื่อมต่อทั้งหมด, การเปลี่ยนเส้นทางของผู้ใช้ตามบทบาทและชื่อผู้ใช้, รับการแจ้งเตือนทางอีเมล สำหรับกิจกรรมการเชื่อมต่อทั้งหมดอินเทอร์เฟซแบบกราฟิกที่ใช้งานง่ายเอกสารรายละเอียดและอื่น ๆ

ดาวน์โหลด | สาธิต | เว็บโฮสติ้ง

ทรัพยากรที่แนะนำ

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

• ปลั๊กอิน WordPress 9 เพื่อจัดการการชำระเงิน PayPal บนบล็อกของเขา
• 10 ปลั๊กอิน WordPress ที่จำเป็นสำหรับติดตั้งในบล็อกของคุณ
• ปลั๊กอิน WordPress 10 ตัวที่ใช้สำหรับจัดการโฆษณา
• ปลั๊กอิน 10 WordPress เพื่อสร้างแอตทริบิวต์สำหรับผลิตภัณฑ์ตัวแปรของคุณ

สรุป

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

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

แต่ในขณะเดียวกัน แบ่งปันบทความนี้ในเครือข่ายโซเชียลต่าง ๆ ของคุณ.

...