Divi: ธีม WordPress ที่ดีที่สุดของเวลาทั้งหมด!

ขึ้น ดาวน์โหลด 901.000 แล้วDivi เป็นธีม WordPress ที่ได้รับความนิยมมากที่สุดในโลก สมบูรณ์และใช้งานง่ายและมาพร้อมกับเทมเพลตฟรีมากกว่า 62

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

บางเว็บไซต์มีบทความแนะนำที่เน้นด้วยพื้นหลังที่กำหนดเองในขณะที่เว็บไซต์อื่น ๆ อาจมีการโพสต์แต่ละหมวดหมู่ด้วยรูปลักษณ์ที่ไม่เหมือนใคร หากคุณต้องการเรียนรู้วิธีปรับแต่งโพสต์ 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 wordpress

นี่คือ 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; }

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

ปรับแต่งลักษณะของบทความบน wordpress

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

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

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

สร้างเว็บไซต์ของคุณอย่างง่ายดายด้วย Elementor

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

เราสามารถทำได้โดยเพิ่ม 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 และปลั๊กอินการ จำกัด เนื้อหา ช่วยให้ผู้ใช้สามารถจัดการได้ตามแผน (ฟรีหรือจ่ายเงิน) ด้วยการสร้างระดับการเข้าถึงพิเศษ

Ultimate Membership Pro ปลั๊กอิน WordPress สำหรับสมาชิก wordpress

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

สรุป

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

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

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

...