سيو Seo حل مشكلة ظهور css المخفي display:none فى google crawl
google crawl — display:none & display:block
Does Google Crawl CSS ‘display:none’ Content
Does Google index/crawl display:none divs
use javascript to hide on mobile - Seo and div display:none
Hiding DIV if using mobile browser
https://www.rise.company/upload/uplo...0432282671.png
المشكلة :
داخل Search Console هتجد ان جوجل اظهرت مشكلة فى الموقع على الموبايل
وان الموقع غير متجاوب / او غير مناسب ظهوره على الموبايل رغم انه Responsive
وتجد من ضمن الاخطاء ايضا ان الكلام صغير - الروابط قريبة جدا من بعضها رغم عكس ذلك !!!
المشكلة ان هناك اشياء فى الموقع مخفية فى الموبايل معمول لها hidden من خلال كود css
ولكن ارشفة جوجل تشاهد hidden والذى تمك اخفائه فى الاصل لانه غير مناسب للموبايل
ولكن جوجل تشاهد موقعك بكامل اكواده دون اى اخفاء لـ display none
وهذا هو الشكل الحقيقي الذى يظهر على الهاتف ولكن لا يظهر هكذا عند ذحف جوجل
https://www.rise.company/upload/uplo...0432307682.png
حل المشكلة :
اخفاء الاشياء من خلال كود اخفاء java Script بجانب او بديل كود اخفاء css
What I like to do in these situations is apply the display: none via JavaScript / jQuery
on $(document).ready() that way the user gets the experience you are looking for,
while Google indexes the page like so:
اذا كان هناك معرف الـ ID مثلا: #main-menu وتريد اخفائه
ضع هذا الكود فى js للتجربة على وضع الكمبيوتر
بعد التاكد من انه يعمل قم بتطبيقه على الموبايلكود:document.getElementById( 'main-menu' ).style.display = 'none';
يمكنك ايضا استخدامه اكثر من مرهكود:document.getElementById( 'main-menu' ).style.display = 'none';
كود الموبايل مخصص WordPress فقطكود:document.getElementById( 'main-menu1' ).style.display = 'none';
document.getElementById( 'main-menu2' ).style.display = 'none';
document.getElementById( 'main-menu3' ).style.display = 'none';
كل ما عليه فعله استبدل الازرق بالمستخدم عندك فى cssكود:if ( ! wp_is_mobile() ) {
document.getElementById( 'main-menu' ).style.display = 'none';
}
ثم ضع الكود فى custom java من خلال اى اضافة على الموقع
مثل Simple Custom CSS and JS على الووردبريس
---------------------------------------------------------------------------------
كود اخر فى حالة J Query
النتيجة :كود:jQuery(document).ready(function( $ ){
$('#main-menu').hide();
});
https://www.rise.company/upload/uplo...0601056911.png
المرجع:
https://stackoverflow.com/questions/...aynone-problem
https://stackoverflow.com/questions/...mobile-browser
