9 WordPress Codes เพื่อเพิ่มรสชาติให้กับบล็อกของคุณและปรับปรุง UX

อัปเดต: 26 ต.ค. 2020 / บทความโดย: Luana Spinetti

การเปิดเผย: WHSR รองรับผู้อ่าน เมื่อคุณซื้อผ่านลิงค์ของเรา เราอาจได้รับค่าคอมมิชชั่น

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

แต่การพึ่งพาตัวเลือกเริ่มต้นของ WordPress อาจทำให้คุณเสีย:

  • ฟังก์ชันการทำงานน้อยลง
  • ผู้ใช้เบื่อ (ผู้ที่เห็นสิ่งเดียวกันในทุกเว็บไซต์ WP พวกเขาสะดุดเมื่อ)
  • ลดลงในการจัดอันดับของเครื่องมือค้นหา

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

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

ต้องการความช่วยเหลือ Spice Up Blog WordPress ของคุณหรือไม่?
WHSR เป็นพันธมิตรกับ Codeable.io เพื่อช่วยเหลือผู้ใช้ที่ต้องการพัฒนา WP / บริการปรับแต่งเอง

หากต้องการรับใบเสนอราคาฟรี โปรดกรอกแบบฟอร์มคำขอนี้.

ให้พวกเขาลองและแจ้งให้เราทราบวิธีที่พวกเขาทำงานออกสำหรับคุณ! ;)

รหัส 9 เพื่อเพิ่มประสิทธิภาพ WordPress Blog ของคุณ

ฉันจะเสนอตัวอย่างโค้ดสองประเภทในโพสต์นี้:

  1. โค้ด Codex
  2. ตัวอย่างโค้ดและวิดเจ็ต

โค้ด Codex เป็นตัวอย่าง PHP ที่ฉันเขียนเอง (ด้วยความช่วยเหลือของคู่หมั้นของฉัน Simone) โดยใช้อย่างเคร่งครัด WordPress.org Codex เป็นข้อมูลอ้างอิง

ตัวอย่างโค้ดและวิดเจ็ตเป็นส่วนของรหัส PHP (หรือปลั๊กอิน WordPress) ที่พร้อมใช้งานบนเว็บไซต์อื่น ๆ และใน WordPress.org แต่ฉันยังรวมตัวอย่างของคู่หมั้นของฉันและฉันเขียนตั้งแต่เริ่มต้นโดยใช้ข้อมูลอ้างอิงแบบเปิดและแบบแผน Codex

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

รหัส Codex

1 แยกแยะกระทู้ที่น่าสนใจ

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

<?php is_sticky(); ?>

ฟังก์ชันเพียงอย่างเดียวจะคืนค่า TRUE หรือ FALSE เท่านั้นดังนั้นคุณสามารถทำอะไรได้บ้างที่นี่หากเขียนโครงสร้างเงื่อนไข (if / else) เพื่อจัดการข้อความที่เหนียวของคุณ ตัวอย่าง:

<?php if is_sticky() {
  the_title();
  the_time('M, d, Y');
  the_excerpt();
}
else {
  include 'post-template.php';
}

ในการใช้ตัวอย่างนี้ฉันจะแสดงข้อความที่เหนียวเป็นช่องที่มีเฉพาะชื่อวันที่โพสต์และข้อความที่ตัดตอนมา (ไม่ใช่บทความทั้งหมด) ในขณะที่เทมเพลตมาตรฐานสำหรับโพสต์อื่น ๆ มีอยู่ใน post-template.php

โพสต์แต่ละประเภทจะมีสไตล์ชีท CSS ของตัวเอง แต่เราไม่ได้กำหนดสไตล์ที่นี่ เทมเพลตเท่านั้น

Single.php เป็นแม่แบบเริ่มต้นของคุณสำหรับโพสต์เดียว (คุณจะพบว่ามันรวมอยู่ในทุกธีม WP เริ่มต้น)

หากคุณพัฒนาชุดรูปแบบ WP ของคุณเอง แต่คุณไม่มีการตั้งค่าเทมเพลตสำหรับโพสต์เดียวคุณสามารถทำตามคู่มือ Codex โปรดคลิกที่นี่เพื่ออ่านรายละเอียดเพิ่มเติม.

2 แสดง URL โพสต์

วิธีนี้อาจเป็นการเพิ่มเนื้อหาลงในเทมเพลตของคุณ ถ้าคุณต้องการให้ผู้อ่านได้รับ URI สำหรับแต่ละหน้าเว็บ (หรือโพสต์) เพียงใช้แท็กต่อไปนี้ในไฟล์ single.php, page.php หรือแม้แต่ index.php:

">

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

 <?php echo get_page_link(); ?> 

ตัวอย่างเช่นเทมเพลตของเพจสามารถรวม:

ลิงค์:

3 เรียกและแสดงหมายเลขรหัสโพสต์

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

<?php the_ID(); ?>

การใช้ตัวอย่าง:

<p class="meta">Posted by Author's Name. Post ID is <?php the_ID(); ?></p>

4 แสดงหมวดหมู่ตามรหัส

ฟังก์ชันมาตรฐานของ WordPress คือ:

<?php get_all_category_ids() ?>

นี่คือตัวอย่างที่ฉันใช้ในบล็อกของฉันเขียนโดยใช้รหัสจาก Codex และ หัวข้อเกี่ยวกับ StackOverflow:

{$ cat_id}: {$ cat_name} ";}?>

…และวิธีการแสดง:

รหัส WP หมวดหมู่

หมายเหตุ: get_all_category_ids () เป็นฟังก์ชันที่เลิกใช้แล้ว แต่คุณยังสามารถใช้งานได้โดยไม่มีปัญหาเช่นเดียวกับฉันในบล็อก (ภาพหน้าจอด้านบน) อย่างไรก็ตามหากคุณต้องการใช้ฟังก์ชันใหม่สำหรับข้อมูลโค้ดนี้โปรดไปที่ get_terms () ของ Codex

รหัสนี้ทำอะไร?

รหัสจะได้รับรหัสหมวดหมู่ทั้งหมดและชื่อหมวดหมู่สำหรับแต่ละรหัสจากนั้นจะเชื่อมโยงรหัสกับลิงก์หมวดหมู่ในขณะที่รหัสจะแสดงชื่อหมวดหมู่ตามหลัง“:” - ด้วยเหตุนี้ ก้อง () การแสดงออก {$ cat_id} : {$ cat_name}.

5 หน้าผู้ใช้รายละเอียด / ผู้เขียนสำหรับบล็อกของคุณ

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

ดีคุณ สามารถ สร้างหน้า Authors / User ของคุณเองโดยใช้โปรแกรมแก้ไขข้อความเครื่องอัพโหลด FTP และแผงควบคุม WordPress อันเป็นที่รักของคุณ

ก่อนอื่นคุณต้องสร้างสำเนาของไฟล์ page.php ของคุณ เปลี่ยนชื่อสำเนาของคุณเป็นชื่อใดก็ได้ - ฉันตั้งชื่อว่า mine users.php

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

เปิดไฟล์ users.php ของคุณ (หรือไฟล์ที่คุณตั้งชื่อไว้) และใช้รหัสต่อไปนี้:

 <?php
 $result = count_users();
 echo 'There are ', $result['total_users'], ' total users';
 foreach($result['avail_roles'] as $role => $count)
 echo ', ', $count, ' are ', $role, 's';
 echo '.';
 ?> 

รหัสนี้ใช้ count_users ฟังก์ชันจะแสดงเป็น“ การใช้งานเริ่มต้น” ใน Codex คุณสามารถดูตัวอย่างสดของรหัสนี้ได้ที่ http://robocity.in/users/.

หลังจากรหัสนั้นมาเพิ่มบางสิ่งเกี่ยวกับผู้ดูแลบล็อก:

ฉันใช้ count_user_posts ทำงานที่นี่ตามรูปแบบการใช้ที่แนะนำโดย Codex

ฟังก์ชั่น get_userdata เป็นการดีที่จะแสดงความสัมพันธ์ระหว่างชื่อผู้ใช้กับชื่อจริงของบุคคลที่ใช้มัน ดูด้านล่าง:

user_login; $ first_name = $ user_info-> first_name; $ last_name = $ user_info-> last_name; echo "$ first_name $ last_name ล็อกอินเข้าสู่เว็บไซต์ WordPress ด้วยชื่อผู้ใช้ $ username"; ?>

ตอนนี้นี่เป็นฟังก์ชันที่น่าสนใจที่สุดที่คุณสามารถใช้ได้ในหน้าผู้เขียน / ผู้ใช้ของคุณ - get_users ฟังก์ชั่น:

'. esc_html ($ user-> user_login) '-'. esc_html ($ user-> user_email) ' '; }?>

ฟังก์ชันนี้จะดึงรายชื่อผู้ใช้ตามพารามิเตอร์บางอย่างที่คุณสามารถกำหนดค่าในโค้ดได้ ในตัวอย่างด้านบน (นำมาจากหน้า Codex และแก้ไขให้พอดีกับหน้าผู้ใช้ของฉันที่ Robocity.in) ฉันต้องการรับรายชื่อผู้ดูแลระบบสำหรับบล็อก ID 1 (บล็อกปัจจุบัน) ที่เรียงลำดับโดย 'nicename' และสำหรับผู้ใช้แต่ละคน ฉันต้องการแสดงชื่อผู้ใช้และอีเมลในประโยคประเภท“ ชื่อผู้ใช้ - [ป้องกันอีเมล]"

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

ตัวอย่างโค้ดและวิดเจ็ต

6. ทางเลือก…จดหมายเหตุ!

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

มันจะไม่ช่วยให้ผู้อ่านของคุณจับอายุบล็อกและความลึกของเอกสารได้ง่ายขึ้นหรือไม่ :)

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

post_date)); ส่งคืน $ เอาท์พุท; } ฟังก์ชัน getLastPostID () {list ($ post) = get_posts (array ('posts_per_page' => 1)); ส่งคืน $ post-> ID; }?> บล็อกนี้มีโพสต์ตั้งแต่ . โพสต์ล่าสุดเผยแพร่เมื่อ . คุณต้องการเยี่ยมชมที่เก็บถาวรเฉพาะหรือไม่? 'รายเดือน', 'format' => 'option', 'show_post_count' => 1)); ?>

รหัสนี้ทำอะไร?

ฟังก์ชั่น formatPostDate ใช้รูปแบบ ID และวันที่ของโพสต์และส่งคืนวันที่ในรูปแบบที่คุณเลือก ฟังก์ชันที่สองคือ getLastPostID รับอาร์เรย์โพสต์ที่มีเพียงหนึ่งโพสต์และส่งคืน ID

ในการรับโพสต์แรกของบล็อก - โดยทั่วไปจะใช้ ID = 1 เราเขียน echo formatPostDate (1, '% B% e,% Y') ในย่อหน้าแรก: โค้ดนี้ใช้ฟังก์ชัน formatPostDate และใช้เป็นพารามิเตอร์ของรหัสโพสต์ # 1 และรูปแบบภาษาอังกฤษมาตรฐานสำหรับวันที่และส่งกลับวันที่

ในการรับโพสต์ล่าสุดของบล็อกเราใช้ formatPostDate (getLastPostID (), '% B% e,% Y') เพื่อรับ ID ของโพสต์ล่าสุดและรูปแบบวันที่ (เป็นภาษาอังกฤษอีกครั้ง) และพิมพ์วันที่บน หน้าจอ

7 ตรวจสอบว่าผู้เข้าชมใช้โทรศัพท์มือถือหรือไม่

Muneeb ที่ WP-Snippets.com แบ่งปันข้อมูลโค้ดที่น่าสนใจ (ฟังก์ชันหนึ่ง ๆ ) เพื่อตรวจสอบว่าผู้เข้าชมไซต์ของคุณใช้อุปกรณ์เคลื่อนที่หรือไม่

รหัสนี้พร้อมใช้งาน โปรดคลิกที่นี่เพื่ออ่านรายละเอียดเพิ่มเติม.

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

8 ใช้โครงสร้าง if / else เพื่อจัดการกับเนื้อหาแถบด้านข้างของหน้า

ตัวอย่างโค้ดนี้ใช้ Codex ของ WordPress แต่ฉันวางไว้ในส่วนนี้เพราะมันช่วยให้มีความคิดสร้างสรรค์มากและคุณอาจพบตัวอย่างโค้ดบนเว็บ

สมมติว่าคุณต้องการใช้แถบด้านข้างหลายไซต์ของคุณ คุณสามารถกรอกแถบด้านข้างของคุณด้วย div และส่วนต่างๆได้ แต่ยิ่งไฟล์มีขนาดใหญ่ขึ้น (แม้ว่าคุณจะใช้วิดเจ็ตก็ตาม) ก็จะยิ่งหนักมากขึ้นเท่านั้น

Codex มาพร้อมกับคุณด้วย get_sidebar (ชื่อ $) ฟังก์ชัน การใช้งานง่าย:

  1. สร้าง (พูด) แถบด้านข้างสำหรับตัวอย่างข้อมูล Quotes ของคุณ ตั้งชื่อว่า sidebar-quotes.php
  2. ในไฟล์ sidebar.php หลัก (หรือไฟล์ส่วนหัวหรือดัชนีตามโครงสร้างธีม WP ของคุณ) เขียน get_sidebar (“ เครื่องหมายคำพูด”); เพื่อรวมไฟล์“ sidebar-quotes.php”

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

คุณอาจไม่ทราบสิ่งนี้ แต่เมื่อคุณใช้โค้ด get_sidebar () ทั่วไปซึ่งจะรวมถึง "sidebar.php" เนื่องจากคุณไม่ได้เพิ่มอาร์กิวเมนต์ $ name นี่คือการใช้งานเริ่มต้น เมื่อคุณเพิ่ม“ -name” หลัง“ sidebar * .php” คุณสามารถเรียก addon ชื่อนั้นด้วย $ name arg

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

9 เครื่องมือสำหรับการรวบรวมข้อมูลโค้ดลงในไซต์ WordPress ของคุณ

ภาพโค้ดวิดีโอ

ตัวอย่างโค้ด เป็นปลั๊กอิน WordPress ฟรีที่สร้างขึ้นโดย Shea Bange ที่ช่วยให้คุณสามารถเพิ่มข้อมูลโค้ดลงในบล็อกของคุณได้อย่างง่ายดาย

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

Tom Ewer ที่ WPMUDev.org เขียนคำแนะนำที่น่าสนใจเกี่ยวกับปลั๊กอินนี้ แต่เป็นแหล่งข้อมูลที่มีประโยชน์มากที่สุดที่ฉันพบจนถึงตอนนี้สำหรับตัวอย่างโค้ด ฟอรัมสนับสนุนปลั๊กอินที่ WordPress.org.

ไปยังคุณ!

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

เกี่ยวกับ Luana Spinetti

Luana Spinetti เป็นนักเขียนอิสระและศิลปินจากอิตาลีและเป็นนักศึกษาสาขาวิทยาการคอมพิวเตอร์ เธอมีประกาศนียบัตรระดับสูงด้านจิตวิทยาและการศึกษาและได้เข้าเรียนหลักสูตรศิลปะหนังสือการ์ตูนเรื่อง 3 ปีซึ่งเธอจบการศึกษาจาก 2008 ในฐานะที่เธอเป็นแบบหลายเหลี่ยมเพชรพลอยเธอจึงมีความสนใจในด้าน SEO / SEM และ Web Marketing โดยเฉพาะอย่างยิ่งกับ Social Media และเธอได้ทำงานในนวนิยายสามเล่มในภาษาแม่ของเธอซึ่งเธอหวังจะ indie เผยแพร่เร็ว ๆ นี้