 |
| كيفية إنشاء شاشة البداية على مدونة بلوجر |
ما هي شاشة البداية ولماذا تحتاجها لمدونتك؟
شاشة البداية: تعريف بسيط
شاشة البداية هي عبارة عن صفحة أو نافذة تظهر قبل المحتوى الرئيسي للمدونة عند زيارة الموقع. تهدف هذه الشاشة إلى جذب انتباه الزوار وتقديم رسالة قصيرة أو ترحيب بسيط، وفي بعض الأحيان قد تحتوي على شعار المدونة أو إعلان عن محتوى جديد أو خاص.
لماذا تحتاج شاشة البداية؟
إنشاء شاشة البداية يعزز تجربة المستخدمين ويترك انطباعًا أوليًا رائعًا. إنها فرصة لإبراز العلامة التجارية لمدونتك وجعل زوارك يشعرون بالاهتمام. كما أن وجود شاشة بداية قد يساعد في تحسين نسبة التفاعل على المدونة وتحسين ترتيبك في محركات البحث بفضل التجربة الإيجابية التي تقدمها للزوار.
خطوات إنشاء شاشة البداية على مدونة بلوجر
الخطوة 1: اختر الفكرة أو التصميم المناسب
قبل أن تبدأ في إضافة شاشة البداية، عليك أولاً تحديد الفكرة أو التصميم الذي ترغب في استخدامه. هل ترغب في شاشة بسيطة تحتوي على رسالة ترحيب فقط؟ أم تفضل إضافة عداد تنازلي أو شعار مميز لمدونتك؟ اختر التصميم الذي يعكس هويتك ويجذب الزوار.
الخطوة 2: أضف الكود إلى قالب بلوجر الخاص بك
كيفية الوصول إلى القالب لتتمكن من إضافة شاشة البداية، يجب أن تدخل إلى قالب مدونتك. قم باتباع الخطوات التالية:
1. اذهب إلى لوحة التحكم الخاصة بمدونتك.
2. اختر المظهر من القائمة الجانبية.
3. انقر على تعديل HTML لفتح محرر القالب.
4. انسخ الكود CSS أدناه والصقه فوق الكود
]]></b:skin> أو أعلى الكود</style> . /* splash screen by wendy code */.wc-splash-wrap .wc-splash-screen{position:relative;top:50%;left:50%;display:flex;background:transparent;flex-direction:column;align-items:center;width:100%;transform: translate(-50% , -50%) scale(0.97);opacity:0}.wc-splash-wrap .wc-splash-screen img{width:150px;height:150px}.wc-splash-wrap .wc-splash-screen span{text-align:center;font-size:15px;font-weight:600;margin:20px;font-family:Noto Sans', sans-serif}5. ابحث عن الكود التالي <body> انسخ الكود أدناه
<div class='wc-splash-wrap'><div class='wc-splash-screen'><img alt='wendycode' src='https://cdn.staticaly.com/img/1.bp.blogspot.com/-Z1dA_G3X3Ro/X9SMbhKD9xI/AAAAAAAACO8/KAGlrPV2SncdnM2yXR3tzFqR08V9ebF7QCNcBGAsYHQ/s0/wendycode-logo-s300.png'/><span>wendy code</span></div></div>ملحوظة: تأكد من استبدال URL بالرابط الصحيح لصورة أو شعار مدونتك وكذلك الكلمة التي تريد الضهو أسفل الشعار لقد قمت بتغيير الألوان إلى أحمر في الاعلى ليسهل عليك التغيير بأريحية.!
6. إضافة كود JavaScript.
</body> .</body> .<script>//<![CDATA[/** Wendy Code Splash Screen* Copyright (c) 2021https://www.wendycode.com* Javascript Pure*/var splashSession =sessionStorage.getItem('splashSession');document.addEventListener('DOMContentLoaded',function(){if (splashSession === null){document.querySelector('.wc-splash-screen').style.opacity ='1';splashSession =sessionStorage.setItem('splashSession',true);setTimeout(function({document.querySelector('.wc-splash-wrap').style.display ='none';}, 3000);} else{document.querySelector('.wc-splash-wrap').style.display='none';}});//]]> </script>الخطوة 3: تخصيص الشاشة وفقًا لهوية مدونتك
الآن بعد أن قمت بإضافة الكود الأساسي، يمكنك تخصيص التصميم وفقًا لاحتياجاتك. يمكنك تعديل الألوان، إضافة شعار مخصص، أو حتى إضافة عداد تنازلي إذا كنت تريد إشعار الزوار بأن المحتوى سيكون جاهزًا خلال بضع ثوانٍ.
الخطوة 4: اختبار شاشة البداية
بعد أن تنتهي من تخصيص شاشة البداية، تأكد من اختبارها. افتح مدونتك في متصفح جديد أو من نافذة التصفح المتخفي لترى كيف تبدو شاشة البداية وتأكد من أنها تعمل بشكل صحيح. إذا كانت هناك أي مشاكل، يمكنك تعديل الكود أو التصميم حتى تحصل على النتيجة المرجوة.
كيفية تحسين شاشة البداية لمحركات البحث (SEO)
تأثير شاشة البداية على SEO
على الرغم من أن شاشة البداية تعتبر إضافة مرئية رائعة، إلا أنه يجب عليك الانتباه لأثرها على تحسين محركات البحث. إذا تم تحميل شاشة البداية بشكل بطيء أو تسببت في تأخير عرض المحتوى الأساسي، فقد يؤثر ذلك سلبًا على أداء مدونتك في نتائج البحث.
نصائح لتحسين SEO عند استخدام شاشة البداية
- حافظ على سرعة التحميل: تأكد من أن شاشة البداية لا تؤثر سلبًا على سرعة تحميل الموقع. استخدم أكواد خفيفة وتجنب الصور الكبيرة الحجم.
- استخدام نصوص بديلة (Alt Text): إذا كنت تستخدم صورًا في شاشة البداية، تأكد من إضافة نصوص بديلة لهذه الصور لتحسين SEO.
- تجنب الإطالة: لا تجعل شاشة البداية تظهر لفترة طويلة. تذكر أن الهدف هو تحسين تجربة المستخدم وليس تعطيله.
- الاستجابة للجوال: تأكد من أن شاشة البداية تعمل بشكل مثالي على الأجهزة المحمولة، حيث أن نسبة كبيرة من الزوار يستخدمون الهواتف الذكية للوصول إلى المدونات.
خاتمة
إضافة شاشة البداية إلى مدونة بلوجر تعتبر خطوة ذكية لتحسين تجربة المستخدم وجعل مدونتك تبدو أكثر احترافية. من خلال اتباع هذا الدليل البسيط خطوة بخطوة، يمكنك إنشاء شاشة بداية جذابة وفعالة دون الحاجة إلى معرفة برمجية متقدمة. تأكد من تخصيص الشاشة وفقًا لاحتياجات مدونتك وتحسينها لزيادة فرص ظهور مدونتك في نتائج البحث. إذا كانت لديك أي أسئلة أو استفسارات، لا تتردد في ترك تعليق وسنكون سعداء بمساعدتك.
بادر الآن بإضافة شاشة البداية لمدونتك وامنح زوارك تجربة مميزة!
