เมื่อเร็วๆ นี้ เราได้แสดงให้คุณเห็นถึงวิธีจัดรูปแบบเค้าโครงความคิดเห็น และวิธีจัดรูปแบบแบบฟอร์มความคิดเห็นของคุณ ผู้ใช้รายหนึ่งส่งอีเมลถึงเราและถามว่า “คุณสร้างภาพกราวาตาร์ให้กลมได้อย่างไร? คุณเก็บภาพกราวาตาร์ไว้เพื่อให้เป็นรูปทรงกลมหรือเปล่า?” ในบทความนี้ เราจะแสดงวิธีแสดงรูปภาพ Gravatar แบบวงกลมใน WordPress เราจะใช้คุณสมบัติ border-radius ของ CSS3 เพื่อสร้างภาพกราวาตาร์แบบวงกลม
สิ่งแรกที่คุณต้องทำคือแก้ไขไฟล์ style.css ของธีมของคุณ คุณสามารถทำได้โดยใช้โปรแกรม FTP หรือไปที่ ลักษณะที่ปรากฏ » ตัวแก้ไข ในส่วนผู้ดูแลระบบ WordPress ของคุณ ถัดไป คุณต้องการเพิ่มโค้ดต่อไปนี้ในไฟล์ CSS ของคุณ:
.avatar {
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
}
สิ่งนี้ควรใช้ได้กับธีม WordPress ส่วนใหญ่ อย่างไรก็ตาม หากวิธีนี้ใช้ไม่ได้กับธีมของคุณ แสดงว่าอาจมีปลั๊กอินหรือฟังก์ชันธีมของคุณรบกวนคลาสเริ่มต้นที่ใช้สำหรับ Gravatar ใน WordPress หากต้องการทราบว่ามีการใช้รูปภาพ Gravatar คลาส CSS ใดในธีมของคุณ คุณต้องเปิดบล็อกโพสต์ที่มีความคิดเห็น เลื่อนลงไปที่ส่วนความคิดเห็น และคลิกขวาที่ภาพ Gravatar เพื่อเลือก Inspect Element มันจะแสดงซอร์สโค้ดสำหรับกราวาตาร์ของคุณดังนี้:
หากรูปภาพ Gravatar มีอย่างอื่นที่ไม่ใช่ avatar ให้ใช้สิ่งนั้นแทน .avatar ในโค้ด CSS ด้านบน
เราหวังว่าบทความนี้จะช่วยให้คุณแสดงภาพ Gravatar แบบวงกลมบนบล็อก WordPress ของคุณ แจ้งให้เราทราบหากคุณมีคำถามหรือข้อเสนอแนะโดยแสดงความคิดเห็นด้านล่าง