انشاء زر الصعود في مدونة بلوجر

يساعدك زر الصعود الى رأس الصفحة على تسهيل تجربة المستخدم أثناء تصفحه أحد المواضيع التي تكتبها وبالتالي سهولة الوصول لمختلف أقسام الموقع الخاص بك

محتويات المقالة

اضافة زر الصعود الى رأس الصفحة

لون الاضافة

الأيقونة التي تظهر بمنتصف الزر

تركيب زر الصعود الى رأس الصفحة على بلوجر

اذا كنت تستخدم قالب سيو بلس المجاني وقد سئمت من عدم تمكنك من الحصول على الإضافات الخاصة بالقالب المدفوع. أو كنت تستخدم أي قالب وأردت الحصول على زر الصعود الى رأس الصفحة بشكل أكثر احترافية وأناقة من الذي تجده غالبا على اليوتوب أو مجرد بحث جوجل.

فهذا المقال قد كتب خصيصا لك ياصديقي فأرجو ان تكمل قراءته حتى النهاية.

اضافة زر الصعود الى رأس الصفحة

يساعدك زر الصعود الى رأس الصفحة على تسهيل تجربة المستخدم أثناء تصفحه أحد المواضيع التي تكتبها وبالتالي سهولة الوصول لمختلف أقسام الموقع الخاص بك

يتميز الزر الذي سنقوم بشرحه فيما بعد بالانسيابية

فعلى سبيل المثال عند الضغط عليه سيقودك الى الأعلى بسرعة 0.25 ثانية وعند الاقتراب شيئا فشيئا من رأس الصفحة ستقل السرعة الى أن تصل الى صفر وبالتالي سيتوقف عند رأس الصفحة

ولاضافة هذا الزر هنالك ثلاث خطوات بسيطة وسهلة

تحميل الأكوادالخاصةبزرالصعود1

اضغط هنا

التعديل على أكواد زرالصعود2

اذا تركت الأكواد كما هي فسيعمل معك الزر بدون أي مشاكل وسيكون افتراضيا مشابها للزر الذي بقالب سيو بلس المدفوع وأيضا يمكنك تعديل ماتشاء من الأكواد حسب خبرتك في اللغات Html و CSS و JavaScript.

ولكن ان كنت جديد في تعلم تصميم المواقع أو كنت لاتعلم شيئا عنها فلاتقلق سنشرح لك أهم الأشياء التي يبحث في تعديلها الأغلبية
وهي اللون والأيقونة التي تظهر في المنتصف.

لون الاضافة

للتعديل على لون الغلاف الخاص بزر الصعود الى رأس الصفحة ستبحث عن اسم الصف أو classtop-link-show.

وستقوم بالنزول أسفله قليلا حتى تجد الكلمة أو العبارة; background-color: #3560ab

في المكان المظلل ستقوم باختيار لونك المتناسق مع ألوان موقعك واستبداله برمز اللون الموجود مسبقا

سيساعدك هذا الموقع في انتقاء أفضل الألون بنفس تريمز الألوان المطلوب للدخول للموقع

الأيقونة التي تظهر بمنتصف الزر

يمكنك التعديل عليها بسهولة حيث يمكنك اختيار أي أيقونة وتحميلها وانصحك باختيار هذا الموقع لانتقاء أفضل التصاميم. للدخول للموقع.

بعد ذلك قم برفع صورتك على الانترنت على أحد مواقع استضافة الصور. ثم بعد ذلك ستقوم بنسخ رابط الصورة ثم البحث في السطر الرابع من الكود عن الكلمة Src . بعد هذه الكلمة ستجد رابط للأيقونة الافتراضية التي قمنا بانتقائها للتناسب مع القالب بين علامتي الاقتباس " "

ستقوم باستبدال الرابط الموجود مسبقا برابط صورتك التي قمت برفعها على الانترنت

تركيب زر الصعود الى رأس الصفحة على بلوجر

تعتبر هذه أسهل خطوة فكل ماعليك هنا هو نسخ جميع الأكواد الخاصة بزر الصعود الى رأس الصفحة. ثم التوجه عبر الصفحة الرئيسية لبلوجر ثم الى التنسيق. ستختار أي مكان تريده لإضافة الزر ولكن يستحسن أن تكون ضمن ذيل المدونة أو الفوتر footer.

قم بالضغط على اضافة اداة ثم اختارالأداة Javascript/Html قم بلصق جميع الأكواد في المحتوى ثم اضغط على حفظ. وبهذه الخطوات البسيطة كل ماعليك الآن هو الدخول الى موقعك وتجريب الأداة والاستمتاع بالتجربة

wesam developer

إذا أعجبك المقال أو كان مفيدًا - ضع "أعجبني". اشترك في المدونة اوشارك برأيك في التعليقات! أراك لاحقا