Divi: بهترین تم وردپرس تمام وقت!

بیشتر دانلود 901.000، Divi محبوب ترین تم وردپرس در جهان است. این کامل، آسان برای استفاده است و همراه با بیش از قالب های رایگان 62.

آیا تا به حال خواسته اید یک صفحه وب را به طور موقت ویرایش کنید تا ببینید با رنگها ، قلم ها ، سبک خاص چگونه به نظر می رسد؟ این با ابزاری که از قبل در مرورگر شما وجود دارد به نام "" امکان پذیر است. عنصر را بازرسی کنید ". این یک رویا برای همه کاربرانی که دوست دارند CSS را دستکاری کنند ، محقق می شود.

در این آموزش ، ما اصول بازرسی موارد و نحوه استفاده از آن را با سایت وردپرس شما مرور خواهیم کرد.

بازرسی عنصر وردپرس

ابزار بازرسی اقلام چیست؟

مرورگرهای مدرن مانند Google Chrome و Mozilla Firefox ابزاری ساخته اند که به توسعه دهندگان وب اجازه می دهد خطاها را اشکال زدایی کنند. این ابزارها HTML ، CSS و JavaScript را برای یک صفحه نمایش می دهند و نحوه اجرای کد را نشان می دهند.

استفاده از ابزار " بازرسی عنصر می توانید کد HTML ، CSS یا JavaScript را برای هر صفحه وب ویرایش کنید و تغییرات خود را بصورت زنده مشاهده کنید (فقط بر روی کامپیوتر شما).

برای یک صاحب وب سایت ، این ابزارها می توانند به شما کمک کنند پیش نمایش یک سبک خاص را بدون اجرای واقعی تغییرات برای همه ، به شما نشان دهند.

برای نویسندگان ، این ابزارها بسیار جذاب هستند زیرا شما می توانید به راحتی اطلاعات قابل شناسایی شخصی را تغییر دهید در حالی که عکس های صفحه خود را از بین می برید و دیگر نیازی به محو شدن عناصر نیست.

برای نمایندگان پشتیبانی ، این یک روش عالی برای شناسایی خطایی است که می تواند باعث بارگیری نشدن گالری های شما یا جلوگیری از کار صحیح آنها شود.

ما فقط سطح موارد استفاده را می خراشیم ، زیرا ابزار " عنصر را بازرسی کنید واقعاً قدرتمند است

در این مقاله ، ما به ابزار " عنصر را بازرسی کنید از Google Chrome ، زیرا این مرورگر مورد نظر ما است. Firefox ابزار توسعه خاص خود را دارد که با انتخاب منو نیز می توان از آنها استفاده کرد " عنصر بازرسی '.

به راحتی وب سایت خود را با Elementor بسازید

Elementor به شما امکان می دهد ایجاد کنید به راحتی و رایگان هر طراحی وب سایت یا وبلاگ با ظاهری حرفه ای. از پرداخت هزینه زیاد برای وب سایتی که خودتان می توانید انجام دهید خودداری کنید.

راه اندازی ابزار "بازرسی عنصر" و محلی سازی کد

شما می توانید این ابزار را با فشار دادن کلیدها راه اندازی کنید CTRL + SHIFT + I روی صفحه کلید شما متناوباً ، می توانید بر روی هر صفحه از یک صفحه وب کلیک کنید و سپس گزینه Inspect the menu menu را انتخاب کنید.

کد نمایشی کد

پنجره مرورگر شما به دو قسمت تقسیم می شود و پنجره پایین کد منبع صفحه وب را نشان می دهد.

پنجره ابزار توسعه دهنده به دو پنجره تقسیم می شود. در سمت چپ خود ، کد HTML صفحه را مشاهده خواهید کرد. در پنجره سمت راست ، قوانین CSS را مشاهده خواهید کرد.

بازرسی کد HTML-CSS

با حرکت دادن موس خود بر روی منبع کد HTML ، منطقه برجسته شده را در صفحه وب مشاهده خواهید کرد. همچنین برای این عنصر مورد نظر ، قوانین CSS را متوجه خواهید شد.

قوانین CSS از عنصر HTML

همچنین می توانید نشانگر ماوس را روی یک مورد در صفحه وب بگیرید ، کلیک راست کنید و " عنصر را بازرسی کنید " موردی که کلیک کردید در کد منبع برجسته می شود.

کد برنامه نویس و اشکال زدایی برنامه نویس

HTML و CSS در پنجره بازرسی عناصر قابل ویرایش هستند. می توانید روی کد منبع HTML دوبار کلیک کرده و کد مورد نظر خود را ویرایش کنید.

اصلاح کد منبع HTML

همچنین می توانید در کادر CSS ویژگی های سبک را دو بار کلیک کرده و ویرایش کنید. برای افزودن یک قانون ، روی نماد به علاوه در قسمت سبک در بالای صفحه کلیک کنید.

یک قانون جدید css اضافه کنید

وقتی تغییراتی در کد CSS یا HTML ایجاد می کنید ، این تغییرات فوراً در مرورگر شما منعکس می شوند.

کد را تغییر دهید

توجه داشته باشید که همه تغییرات ایجاد شده در اینجا در هر مکانی ذخیره نمی شوند. ابزار عنصر را بازرسی کنید یک ابزار اشکال زدایی است و تغییرات شما را در پرونده روی سرور شما ذخیره نمی کند. این بدان معنی است که اگر صفحه را تازه کنید ، تمام تغییرات شما از بین می رود.

برای ایجاد تغییرات ، باید سبک تم یا قالب وردپرس خود را تغییر دهید تا تغییراتی را که می خواهید ذخیره کنید اضافه کنید.

قبل از شروع ویرایش موضوع وردپرس موجود خود با استفاده از ابزار " عنصر را بازرسی کنید مطمئن شوید که با ایجاد یک موضوع کودک ، تمام تغییرات خود را ذخیره می کنید.

چگونه به راحتی خطاهای وردپرس را پیدا کنید

ابزار عنصر را بازرسی کنید منطقه ای به نام " کنسول که تمام خطاهایی را که در سایت شما وجود دارد نشان می دهد. قبل از تلاش برای رفع اشکال یا درخواست کمک از نویسندگان یک موضوع یا افزونه ، همیشه ارزش جستجو در اینجا برای دیدن چه اشتباهی وجود دارد.

کنسول جاوا اسکریپت

مثلاً اگر مشتری بودید OptinMonster چه کسی تعجب می کند که چرا انتخاب خود را بارگیری نمی کند ، پس می توانید به راحتی مشکلی را پیدا کنید که نشان می دهد "" سمبل صفحه شما مطابقت ندارد '.

اگر نوار اشتراک شما به درستی کار نمی کند ، می توانید خطای JavaScript را ایجاد کنید.

این همه برای این آموزش است ، امیدوارم که بتوانید بهتر وبلاگ وردپرس خود را تنظیم کنید. احساس رایگان برای به اشتراک گذاشتن این آموزش با دوستان خود.