حول الدرس
في هذا الدرس سنوضح لك كيفية حل تحذيرات المحتوى المختلط، فهذه مشكلة شائعة بعد تثبيت شهادة SSL على موقع الويب الخاص بك أو مدونتك، تحصل على علامة تعجب بدلاً من القفل الأخضر في شريط المتصفح ويظهر “غير آمن “عند زيارة موقعك على الويب باستخدام HTTPS. قد يكون هذا بسبب “المحتوى المختلط” mixed content. يوضح ما يلي بعض الطرق المفيدة لمساعدتك في تحديد ما هو غير الآمنة التي يتم تحميلها على الصفحات الآمنة (HTTPS)، لحل تحذيرات المحتوى المختلط.
الطريقة1: إعاد النظر في الصفحات (View Source)
- تصفح صفحة على موقع الويب الخاص بك باستخدام https.
- انقر بزر الماوس الأيمن على أي مكان بالصفحة وانقر على “عرض مصدر الصفحة / View Page Source” أو “عرض المصدر/ View Source” أو “المصدر / Source”، وفقًا لمتصفحك.
- استخدم الأمر “بحث / Find” عبر (Edit -> Find or Ctrl+F أو Cmd+F)، وابحث عن:
sHTTPhttp: and src=’http:
4. إذا لم تحصل على أي نتيجة، فاستمر في التصفح إلى صفحات HTTPS الأخرى واستمر في البحث من خلال عرض المصدر عبر اتباع نفس الخطوات.
الطريقة 2: استخدام الإضافات / Plugin في الووردبس
تم تصميم بعض إضافات WordPress لمساعدتك في تحديد المحتوى المختلط. فيما يلي بعض منها:
بشكل أساسي، قم بتنشيط احدى هذه المكونات الإضافية وتصفح موقع الويب الخاص بك باستخدام HTTPS. سيعرض المكون الإضافي إشعارات أصول HTTP. يرجى أن تضع في اعتبارك أن بعض المكونات الإضافية تعرض تحذيرات للمسؤولين وبعضها تعرض لجميع الزوار لذا احذر من ترك أي من هذه المكونات الإضافية نشطة بمجرد الانتهاء من الاختبار.
الطريقة 3: استخدم مواقع متخصصة في الاختبار لإيجاد السبب
تقدم لك بعض مواقع الويب تقريرًا عن الأصول غير الآمنة على موقع الويب الخاص بك. إليك بعض الميزات التي يمكنك استخدامها مجانًا:
الطريقة 4: Google Chrome Inspector Console
يمكنك استخدام Chrome Inspector Console للعثور على الأصول غير الآمنة. لفتح وحدة تحكم Chrome Inspector ، انقر بزر الماوس الأيمن على أي مكان في الصفحة وانقر على فحص / Inspect، ثم انقر على وحدة التحكم / Console. بعد تدوين كل عنصر مصدره عبر HTTP، ستحصل على فكرة عن سبب المشكلة وكيفية إصلاحها. إليك بعض الأمثلة التي يمكن أن تساعدك في تحديد سبب المشكلة:
- A plugin loading a JavaScript file via HTTP: http://example.com/wp-content/plugins/example-plugin/awesome.js
- Active theme loading an insecure image file: http://example.com/wp-content/themes/example-theme/assets/images/circle.png
- Active theme loading Google fonts insecurely: http://fonts.googleapis.com/css?family=Lato:100,400,700