چگونه سورسکدهای HTML وبسایتها را در کروم مشاهده نماییم؟
اگر یک طراح وب هستید که در حال اشکالزدایی سورسکد وبسایت خود است و یا تنها کنجکاوید که بدانید کدهای یک وبسایت به چه شکل هستند، باید بدانید مشاهده سورسکد HTMl در کروم بهسادگی قابل انجام است. دو راه برای مشاهده کدهای HTML وجود دارد: مشاهده سورس و بازرسی بهوسیله ابزارهای برنامهنویس.
در ادامه مطلب با آموزش نحوه مشاهده سورسکدهای HTML در کروم با ما باشید.
مشاهده سورسکدها با استفاده از View Page Source
برای مشاهده سورسکدهای HTML در کروم ابتدا گوگل کروم را باز کنید و به وبسایتی که میخواهید سورسکد آن را مشاهده نمایید، بروید. در وبسایت موردنظر راستکلیک کنید و گزینه “View Page Source” را انتخاب نمایید. همچنین میتوانید برای مشاهده سورسکد وبسایت در یک تب جدید، دکمههای Ctrl + U را از کیبورد بزنید.
یک تب جدید حاوی تمام کدهای HTML وبسایت موردنظر بهصورت کاملا مفصل و بدون فرمت، باز میشود.
اگر شما به دنبال المان و یا قسمت خاصی از کدهای HTML هستید، استفاده از View Source خستهکننده و سنگین است؛ بهخصوص اگر صفحه شامل مقدار زیادی از کدهای جاوا اسکریپت و CSS باشد.
بررسی سورسکد با استفاده از Developer Tools
این روش از پنجره ابزارهای برنامهنویس در کروم استفاده میکند که نسبت به روش قبل ظاهر آراستهتر و تمیزتری برای دسترسی به کدها دارد. در اینجا به خاطر فرمتهای اضافی و قابلیت مخفی کردن المانهایی که برای ما اهمیتی ندارند، خواندن کدهای HTML سادهتر است.
کروم را باز کنید و به وبسایت موردنظر بروید. سپس دکمههای Ctrl + Shift + i را از کیبورد بفشرید. یک پنجره کوچک در کنار صفحهای که در حال مشاهده آن هستید، باز میشود.
بر روی فلش خاکستری کوچکی که در کنار هر المان وجود دارد کلیک کنید تا جزییات بیشتری را مشاهده نمایید.
اگر نمیخواهید بهصورت پیشفرض، کد تمام صفحه را مشاهده کنید و در عوض قصد دارید تا المان خاصی را در HTMl بررسی نمایید، در فضای خالی صفحه راستکلیک و سپس گزینه “Inspect” را انتخاب کنید.
اینبار پس از باز شدن پنجره مستقیما به قسمتی از کد میرود که حاوی المانی است که شما بر روی آن کلیک کرده بودید.
اگر بخواهید میتوانید موقعیت dock (ابزار) را تغییر دهید و آن را به سمت چپ، راست و پایین ببرید؛ حتی میتوانید آن را در یک پنجره جداگانه باز کنید. بر روی آیکون منو (آیکون سهنقطهای) کلیک کنید و سپس یکی از گزینههای undock into a separate window ،dock to the left ،dock to the bottom و یا dock to the right را انتخاب نمایید.
پس از اینکه کار شما با کد تمام شد، میتوانید کلا پنجره را ببندید و یا بر روی ‘X’ در پنجره ابزارهای برنامهنویس کلیک کنید تا به صفحه اصلی برگردید.
نوشته چگونه سورسکدهای HTML وبسایتها را در کروم مشاهده نماییم؟ اولین بار در وبسایت فناوری پدیدار شد.
به منظور اجرای هر افزونه مورد نیاز در حالت ناشناس، در قسمت زیر نام هر افزونه گزینه “Allow in incognito” را تیک بزنید. اخطاری با مضمون اینکه کروم قادر به جلوگیری ردیابی شما توسط افزونهها نیست، نمایش داده میشود. بههرحال ما هم به شما فعال کردن همه افزونهها در حالت ناشناس را توصیه نمیکنیم. کروم برای غیرفعال کردن افزونهها در حالت ناشناس دلیلی دارد، اما اگر فعال کردن افزونهای موجب به راحت شدن کار شما در حالت ناشناس میشود و شما هم به آن افزونه اطمینان دارید، میتوانید آن را فعال کنید.
حال میتوانید از منو کروم یک صفحه ناشناس جدید باز کنید.
پس از باز شدن صفحه ناشناس، افزونههایی که فعال کردهاید را در نوارابزار خواهید دید.
پس از باز شدن پنجره About، کروم مشغول به چک کردن آپدیتها میشود و در صورت وجود آپدیت، شروع به دانلود آنها میکند.
پس از اینکه آپدیت دانلود شد و یا اگر چندین روز است که در دسترس بوده است، برای پایان فرآیند بهروزرسانی بر روی “Relaunch” کلیک نمایید.
اگر ترجیح میدهید ابتدا کار خود را با تبهای باز انجام دهید و سپس کروم را ریاستارت کنید، پس بر روی Relaunch کلیک نکنید و تنها تب تنظیمات را ببندید.
برای ذخیره تغییرات و مشاهده پاپآپهای وبسایت، صفحه را دوباره بارگذاری نمایید.
تقریبا در انتهای صفحه هنگامیکه عنوان Privacy and Security را مشاهده نمودید، پس از پیدا کردن گزینه “Content Settings” بر روی آن کلیک کنید.
در لیست تنظیمات بر روی گزینه “Pop-ups and Redirects” کلیک نمایید.
اگر تصادفا یک وبسایت را به لیست مجاز برای نمایش پاپآپ اضافه کردهاید، میتوانید مجوز آن را بلافاصله لغو کنید تا کروم شروع به مسدود کردن پاپآپهای آن وبسایت کند. در غیر اینصورت، باید آدرس URL سایتی که مایل به مسدود کردن نمایش پاپآپهای آن هستید را بهصورت دستی به بلاکلیست اضافه کنید. در ادامه، هر دو مورد بالا را توضیح میدهیم.
با این کار آدرس وبسایت از لیست مجاز به بلاکلیست منتقل میشود.
در صورتیکه آدرس وبسایت مورد نظر در هیچکدام از لیستها قرار نداشت از کنار عنوان “Block” بر روی دکمه “Add” کلیک کنید.
در پنجره کوچکی که نمایان میشود، آدرس وبسایت مورد نظر را وارد نمایید و در نهایت بر روی “Add” کلیک کنید.
نکته: هنگام ارایه آدرس وبسایت، اگر میخواهید تمام پاپآپها را در کل سایت مسدود نمایید، از پیشوند [.*] استفاده کنید تا تمام زیردامنهها نیز مسدود شوند.
در قسمت منو گزینه “Extensions” را انتخاب کنید.
در پنجره جدید که گشوده میشود، در پایین گوشه سمت چپ این صفحه، گزینه “Allow extensions from other stores” را فعال کنید.
در مرحله بعدی با اخطار مایکروسافت مواجه خواهید شد. در این قسمت گزینه “Allow” را انتخاب کنید.
در این قسمت، در 
روی گزینه “Add Extension” کلیک کنید تا مرحله نصب را تایید کند.
به یاد داشته باشید که هر افزونهای که نصب میکنید روی مرورگر Edge آزمایش نشده است. ممکن است با باگ یا دیگر مشکلات روبرو شوید. بهتر است یک افزونه را نصب کرده و پس از اطمینان از عملکرد صحیح آن، اقدام به نصب افزونهای دیگر کنید.