มันใหม่ มันฟรี มันทรงพลัง

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

ลืมกลยุทธ์การตลาดแบบเดิมๆ ของคุณไปได้เลย (การตลาดผ่านอีเมล การโพสต์แบบรับเชิญ แบนเนอร์ รีวิว ฯลฯ) กลยุทธ์เหล่านี้ล้วนล้าสมัยไปแล้ว Brouavo คือเครื่องมือเปลี่ยนเกมที่เปลี่ยนทราฟฟิก 30% ที่ "ไม่ได้ใช้งาน" ของคุณให้กลายเป็นรายได้ที่มั่นคง เป็นเครื่องมือที่สมบูรณ์แบบสำหรับการโปรโมตโปรแกรมพันธมิตรหรือขายสินค้าของคุณเอง

ขึ้นอยู่กับประสิทธิภาพการทำงานของคุณ เรายังเสนอใบอนุญาตระดับมืออาชีพสำหรับปลั๊กอิน WordPress ให้กับคุณ เช่น: Elementor Pro, TranslatePress, Divi Builder & Ai, All In One SEO Pro, สมัครสมาชิกแบบชำระเงิน

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

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

เครื่องมือตรวจสอบสิ่งของคืออะไร?

เบราว์เซอร์สมัยใหม่เช่น Google Chrome และ Mozilla Firefox ได้สร้างเครื่องมือที่ช่วยให้นักพัฒนาเว็บสามารถแก้ไขข้อผิดพลาดได้ เครื่องมือเหล่านี้แสดง HTML, CSS และ JavaScript สำหรับหน้าและแสดงวิธีการเรียกใช้รหัส

การใช้เครื่องมือ " ตรวจสอบธาตุ คุณสามารถแก้ไขโค้ด HTML, CSS หรือ JavaScript สำหรับเว็บเพจใดก็ได้และดูการเปลี่ยนแปลงของคุณแบบสด (แต่เพียงผู้เดียวในคอมพิวเตอร์ของคุณ).

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

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

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

เรากำลังขูดพื้นผิวของกรณีการใช้งานเท่านั้นเนื่องจากเครื่องมือ " ตรวจสอบองค์ประกอบ ทรงพลังจริงๆ

ในบทความนี้เราจะเน้นเครื่องมือ " ตรวจสอบองค์ประกอบ จาก Google Chrome เนื่องจากเป็นเบราว์เซอร์ที่เราเลือก Firefox มีเครื่องมือในการพัฒนาของตัวเองซึ่งสามารถเรียกใช้ได้โดยเลือกเมนู " ตรวจสอบองค์ประกอบ '

เปิดตัวเครื่องมือ "ตรวจสอบองค์ประกอบ" และการแปลรหัส

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

หน้าต่างเบราว์เซอร์ของคุณจะแบ่งออกเป็นสองส่วนและหน้าต่างด้านล่างจะแสดงซอร์สโค้ดของหน้าเว็บ

หน้าต่างเครื่องมือสำหรับนักพัฒนาจะแบ่งออกเป็นสองหน้าต่างเพิ่มเติม ทางด้านซ้ายคุณจะเห็นโค้ด HTML ของหน้า ในบานหน้าต่างด้านขวาคุณจะเห็นกฎ CSS

ในขณะที่คุณเลื่อนเมาส์ไปเหนือซอร์สโค้ดของโค้ด HTML คุณจะเห็นพื้นที่ที่ถูกเน้นสีซึ่งไฮไลต์อยู่บนหน้าเว็บ คุณจะสังเกตเห็นกฎ CSS สำหรับองค์ประกอบนี้ด้วย

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

นักพัฒนารหัสและนักพัฒนาดีบักเกอร์

HTML และ CSS ในหน้าต่างการตรวจสอบองค์ประกอบสามารถแก้ไขได้ คุณสามารถดับเบิลคลิกในซอร์สโค้ด HTML และแก้ไขรหัสตามที่คุณต้องการ

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

เมื่อคุณทำการเปลี่ยนแปลงรหัส CSS หรือ HTML การเปลี่ยนแปลงเหล่านี้จะปรากฏในเบราว์เซอร์ของคุณทันที

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

หากต้องการดำเนินการเปลี่ยนแปลงจริง คุณจะต้องแก้ไขรูปแบบของธีมหรือเทมเพลต WordPress ของคุณเพื่อเพิ่มการเปลี่ยนแปลงที่คุณต้องการบันทึก

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

วิธีการหาข้อผิดพลาดใน WordPress

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

ตัวอย่างเช่นหากคุณเป็นลูกค้า OptinMonster ใครสงสัยว่าทำไม optin ของเขาไม่โหลดจากนั้นคุณสามารถค้นหาปัญหาที่ระบุว่า " กระสุนของหน้าของคุณไม่ตรง '

หากแถบแชร์ของคุณทำงานไม่ถูกต้องคุณจะเห็นว่ามีข้อผิดพลาด JavaScript ที่ทำให้เกิด

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

อวาตาร์ของผู้เขียน
แบลร์ Jersyer
ผู้พัฒนา WordPress และหลงใหลในทุกสิ่งที่เกี่ยวข้องกับแนวโน้มทางเทคโนโลยีใหม่ ๆ ผู้เขียนปลั๊กอินธีม WordPress และเว็บแอปพลิเคชันอื่น ๆ เขียนที่ BlogPasCher.com

Pin It เมื่อ Pinterest