شرح كود lazy Load
شرح كود lazy Load ،تسريع مدونة بلوجر، كيف اسرع مدونتى ، كود لتسريع تصفح مدونة بلوجر، مدونتى بطيئه كيف اسرعها، اختبار سرعة مدونة بلوجر ، كود lazy load لتسريع مدونات بلوجر .
كل هذه أسئله تتبادر الى الذهن حين نرى مدونتنا على بلوجر بطيئه، فنقوم بالبحث فى محرك البحث جوجل عن سبيل لزيادة سرعة المدونه بالطرق المعروفه سواء أكواد لتسريع التصفح أو من خلال تعديلات بالقالب الخاص بالمدونه ….. الخ .
فكل صاحب مدونه يتمنى ان تكون مدونته سريعه أمام الزائر لكى يكسب من خلال ذلك زوار ويزيد من تصفح مواضيع المدونه نظرا لسهولة تصفحها وهو مايفضله الزائر وبالتالى يقل الـ Bounce rate لمدونتك مما يؤهلها لكسب ثقة محركات البحث .
وهنا فى مقالى هذا سأتطرق الى وسيله فعاله لتسريع التصفح فى مدونتك بلوجر وهو كود رائع اسمه Lazy Load يعمل على تسريع المدونه .
دعونا اولا نتعرف على ماهو كود Lazy Load ووظيفته.
شرح كود Lazy Load هو عباره عن كود برمجى بلغة html وظيفته العمل على تتابع تحميل محتويات الصفحه بمعنى أنه عندما يكون لديك صفحه بها كثير من الصور فهذا الكود يقوم أولا بتحميل الكلام الموجود بالصفحه ثم يقوم بعد ذلك بتحميل الصور وعرضها أمامك حسب الطلب أى عند تحريك الصفحه لأسفل تظهر لديك الصور بالتتابع ممايكسب مدونتك سرعه فى التصفح وهذا مانسعى اليه .
لماذا يجب عليك تحميل كود Lazy Load بمدونتك
لم تعد مدوناتنا على منصة بلوجر وغيرها تحتوى على صفحه او صفحتين وقليل من الصور مع كثير من النصوص ممالايحدث أى حمل زائد على تصفح تلك المدونه ، ولكن تغير الحال اليوم حيث تحتوى المدونات على كثير من الصور والتى يتم تحميلها من أفضل مواقع الصور والخلفيات وأيضا أزرار وسائل التواصل الاجتماعى والاكواد والاعلانات وغيرها الأمر الذى يتطلب سرعة تحميل لتلك الصفحات أمام الزائر والا ستفقد زوارك وثقة محركات البحث فى مدونتك .
كل هذا يتطلب تسريع لمدونتك وهنا بأتى الطلب على تحميل كود ليزى لود بمدونتك ودمجه بالقالب الخاص بمدونتك للوصول للسرعه المثاليه لمدونتك والتى يفضلها الزائر.
ولكى نبدأ يجب أولا أخذ نسخه احتياطيه من قالب مدونتك لكى يتم العمل بدون اخطاء بحيث لو حدث أى خطأ تستطيع الرجوع للنسخه الاحتياطيه من قالبك .
ويتم ذلك عبر الدخول الى لوحة تحكم مدونتك ….. ثم المظهر ….. ثم اخذ نسخه احتياطيه وحفظها بجهازك …. شاهد الصوره التاليه:
قم بتسريع وحماية موقع WordPress الخاص بك دون أي تكلفة إضافية!
🌐 هل أنت مستعد لتعزيز تواجدك على الإنترنت؟ استمتع بتجربة استضافة الويب بسرعة البرق وبحماية رائعة لموقعك وتسريع مجانى وبسعر لا يقارن! 🔥
✨ لماذا أرشح لك إستضافة النقيب العربية الرائعة؟
- 💨 خوادم فائقة السرعة لمواقع ويب ستكون فائقة السرعة.
- 💰 أسعار منخفضة لا تقبل المنافسة وفى متناول الجميع.
- 🛡️ أمان قوي للحفاظ على أمان بياناتك، وتسريع موقعك مجانا.
- تمكين موقعك خلال فترة وجيزه من تجاوز مشكلة Core Web Vital والحصول على سرعة 100% بإختبار Google Page Insite
👉 هل أنت مستعد لتسريع موقع الويب الخاص بك؟ انقر فوق “البدء” الآن!
ثم من الصوره التاليه اضغط على تنزيل المظهر ….
1- اضافة jQuery الى مدونتك .
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
ويتم وضعه اعلا وسم </head> بالقالب ثم حفظ القالب .
2- طريقة اضافة كود Lazy Load الى مدونتك بلوجر.
هذا الكود مهم فى تحميل الصور وعرضها وقت الطلب للزائر اثناء وصوله بالقراءه لها فتظهر فورا وهكذا ، وهذا الكود يعمل على
اغلب المتصفحات ومتوافق معها وهى
IE 6-11, Chrome 1-31, Firefox 1.5-27.0, Safari 3-7, Opera 10.6-18.0, iOS 5-7,
Android 2.3-4.4, Amazon Kindle Fire 2 and HD 8.9, Opera Mini 7.
ويتم اضافة الكود التالى بأعلى الوسم </body> بقالب المدونه.
وبعد تركيب الكود قمت بإختبار السرعه للمدونه عبر PageSpeed Insights وكانت النتيجه كما بالصورتين على التوالى :
ثم
اتمنى أن اكون وفقت فى ايصال معلومه لك
مع وافر تحياتى
عن مدير الموقع
مهندس مدنى واهوى التدوين عن #السيو للمواقع والمدونات المختلفه وتهيئتها لمحركات البحث ، وكذلك شرح ماهو السيو وماهى فائدتة لمدونات بلوجر وكذلك دروس حول بلوجر ونشر قوالب بلوجر الأجنبية والعربية وشروحات حول جوجل ادسنس .
لم تعمل عندي
أهلا بك اخى الكريم
اولا اعتذر لك لإنى نقلت المدونة من بلوجر الى ووردبريس وحدث بعض الأخطاء بالأكواد
تم تعديل الكود وجرب الآن وسيعمل معك بكفاءة بعد اتباعك كافة الارشادات بالمقالة
مودتى لك
شكرا لك استاذي علي الشرح السهل
تم التطبيق وهناك فرق كبير طبعاََ لكن لا تزال المدونة بطيئة حسب تقرير جوجل فالمدونة حصلت علي تقييم 58 من 100 بعد الكود وكانت 37 وقمت بحذف الكثير من الأكواد الغير ضرورية وحذفت ايضاََ ادوات اضافات كثيرة من السايد بار ولكن لا تزال بطيئة بعض الشيء هل هناك حلول اخري ؟
اهلا بك اخى الكريم
اشكرك على ردك الكريم وبالنسبه الى مدونتك فالمشكله لديك تكمن فى زيادة حجم الصور بالمقالات فعليك بإعادة تصغير الحجم للصور واعادة رفعها مرة اخرى بمدونتك وخصوصا ان عدد المقالات لديك قليل فسهل التعديل وانصحك بهذا البرنامج
https://learnwebseo.com/%d8%b6%d8%ba%d8%b7-%d8%a7%d9%84%d8%b5%d9%88%d8%b1-%d8%a8%d9%88%d8%a7%d8%b3%d8%b7%d8%a9-google-squoosh/
وبعد الانتهاء من ذلك جرب اختبار السرعه مره اخرى وستجد ان موقعك زادت سرعته.
ايضا حاول أن يكون عدد المقالات بالواجهه الرئيسيه لايزيد عن 6 مقالات لزيادة سرعة مدونتك .
اتمنى لك التوفيق
الكود رائع جزاك الله خيرا.
سكرا لك اخى الكريم
شكرا على الكود اخي لكن الصفحة بطيئة جدا في الجوال هل يمكنك كتابة مقال عن تسريع الصفحة للجوال
اخى الكريم اهلا بك
بطء التصفج على الجوال يرجع الى قوة الهاتف نفسه اولا وثانيا انت عندما اختبرت تصفح موقعك على الجوال من خلال خدمات قياس سرعة النت ستظهر لك اخطاء حاول ان تقوم بإصلاحها وتاكد ان اغلب عيوب السرعه فى مدونات بلوجر من القالب
انصحك بهذا القالب وانا قمت بتعريبه
https://learnwebseo.com/%d8%b6%d8%ba%d8%b7-%d8%a7%d9%84%d8%b5%d9%88%d8%b1-%d8%a8%d9%88%d8%a7%d8%b3%d8%b7%d8%a9-google-squoosh/
تحياتى لك
شكرا لك تم تسريع تحميل الصفحة
شكرا لك انا مركب قالب بيج ماج هل يتوافق كود التسريع ده معاه وياريت تورينا نضعه ازاى اعلى وسم الهيد واذا فشل معايا ارجع النسخة المحفوظة ازاى والف شكر بانتظار ردك
نعم يتوافق الكود مع أى فالب بلوجر.. كل ماعليك فعله هو قياس سرعة مدونتك قبل تركيب القالب عن طريق موقع GTmetrix ثم قم بتركيب الكود اعلا الوسم
ثم احفظ القالب وجرب ان تعيد اختبار السرعه مره اخرى.وشاهد النتيجة.
اما لو اردت ان تلغى الكود فيمكنك حذفه مره اخرى وحقظ القالب او التراجع من نفس القالب ويتم هذا انك لاتغلق صفحة القالب حتى تنتهى من الاختبار . وهو لايؤثر نهائيا على تركيبة القالب فأطمئن.
تحياتى لك
السلام عليكم ورحمة الله
شكرا لك وبارك الله في اعمالك
هذا هو الكود الذي كنت اشتغل به وقد غيرته بالكود الذي وضعته
تحياتى لك ولاتتردد فى السؤال عن اى مشكلة تواجهك بعد استخدام الكود – وهذا ان شاء الله لن يحدث – وذلك بالرد هنا وسنتعاون سويا فى حلها.
تحياتى لك
شكراً لك …
لاشكر على واجب..تحياتى لك
هل نقوم بتغيير الرابط الموجود في الكود واستبدالة برابط مدونتي أم أنسخه كما هو
الرابط الموجود في الكود
نعم برابط مدونتك ولكن الرابط هذا المنشور يحولنى لموقع اخر… هل قمت بمحاولة حذف حقوق الملكية لقالب مدونتك؟
السلام عليكم أستاذ aldewaghry هذ رابط سبام يضر بموقعك أتمني أن تتنصل منه أو تحذفه
اهلا بك اخى الكريم
أشكرك على التنبيه …تحياتى وتقديرى
هو لم يرد على سؤالى له
نتمنى لك التوفيق
عند القيام بالحفظ يظهر هذا الإشعار
org.xml.sax.SAXParseException; lineNumber: 49; columnNumber: 5043; The element type “b:skin” must be terminated by the matching end-tag ““.
أهلا بك اخى الكريم
ارجوا منك التاكد من نسخ الكود كاملا هذا اولا . وثانيا هل هذا الخطأ ظهر لك من قبل والا أول مرة؟
وارجوا ان تعطينى اسم قالب مدونتك اذا امكن لاتمكن من حل المشكلة والتى اعتقد ان هناك حذف لاحد مكونات الوسم b:skin
شكرا اخى الكريم على الافادة …. لدى فقط مشكلة صغيرة عندما ابحث عن مدونتى على جوجل يظهر لى اسم المدونة فقط لا يظهر الوصف
اسم المدونة …. ماندو ويب
اهلا بك اخى الكريم
ارجوا ان تتأكد انك من الاعدادات بلوحة التحكم قد قمت بتفعيل العلامات الوصفيه … تأكد من لوحة تحكم بلوجر واكتب لى الرد
اهلا بك اخى الكريم
تأكد اولا من تفعيل العلامات الوصفية بالإعدادات بمدونتك
انتظر ردك
جيد
أشكرك اخى الكريم