-->
شروحات ودروس تعليمية

شروحات مدمن ويب

شروحات مدمن ويب حول تطوير الويب والبرمجة وإستخدامات البرامج والتطبيقات والأدوات الإلكترونية وشروحات في جوانب أخرى مختلفة.

طريقة إضافة صندوق مراجعة وتقييم المنتجات لمدونات بلوجر

طريقة إضافة صندوق مراجعة وتقييم المنتجات لمدونات بلوجر

طريقة إضافة صندوق مراجعة وتقييم المنتجات لمدونات بلوجر

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

كما أن صندوق مراجعة وتقييم المنتجات تم تصميمه بإحترافيه (بأكواد HTML و CSS فقط) ليتوافق مع جميع المدونات وللعرض على مختلف الشاشات بشكل متجاوب ومميز ولا يحتاج إلى جافا سكربت كما أن طريقة تركيبه بسيطة جدا وبإمكان أي شخص أن يضيفها إلى مدونته على بلوجر.

يمكنكم مشاهدة مثال لصندوق مراجعة وتقييم المنتجات من هنا

كيفية تخصيص كل تسمية أو تصنيف بلون مخصص في بلوجر (التصنيفات بألوان مختلفة)

كيفية تخصيص كل تسمية أو تصنيف بلون مخصص في بلوجر (التصنيفات بألوان مختلفة)

كيفية تخصيص لون لكل تسمية أو تصنيف في بلوجر (التصنيفات بألوان مختلفة)

في هذا المقال، سأشارككم ميزة أو إضافة أكثر من رائعة لمدونات بلوجر، حيث سأقدم شرح لكيفية تخصيص لون معيّن لكل تسمية أو تصنيف (كل تسمية/تصنيف له لون مختلف) في مدونات بلوجر من خلال إستخدام كود CSS فقط، لإعطاء المدونة مظهر جمالي أكثر من رآئع ومميز بإظهار التسميات أو التصنيفات بألوان مختلفة.

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

بالإمكان إستخدام هذه الميزة أو الإضافة لتخصيص (لون الخط، حجم الخط، الخلفية، نوع الخط، تأثير الرابط وغيره) لتسمية أو تصنيف مُعيّن فقط أو لعدة منها أو لجميعها.

مثال لهذه الميزة يمكنكم مشاهدة ذلك في موقع مدمن ويب في الصفحة الرئيسية، كما هو ظاهر التسميات أو التصنيفات كلا منها بلون معين يختلف عن الآخر.

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

تنبيهلاتنسى أخذ نسخة إحتياطية للقالب قبل تطبيق هذا الدرس، كي تتمكن من إستعادة القالب في حال ظهور أي مشاكل أو أخطآء بعد تطبيق هذا الدرس.

طريقة تصوير وتسجيل الشاشة مع إمكانية تحرير الفيديو (بدون برامج)

طريقة تصوير وتسجيل الشاشة مع إمكانية تحرير الفيديو (بدون برامج)

طريقة تصوير وتسجيل الشاشة

في هذا المقال، مدمن ويب سيشرح لكم أسهل وأفضل طريقة لكيفية تسجيل و تصوير شاشة الكمبيوتر أو الجوال فيديو (صوت وصورة) بجودة خرافية مع إمكانية تحرير الفيديو بدون برامج أو تطبيقات لتسجيل الشاشة.

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

موقع RecordCast يمكنك من إلتقاط وتصوير أي شيء يستحق المشاركة على شاشتك باستخدام مسجل الشاشة ومحرر الفيديو متعدد الإمكانات أونلاين وبدون حاجة لتنزيل أي برامج أو تطبيقات.

إضافة صندوق قابل للطي [Spoiler] في مواضيع بلوجر أو صفحات المواقع الإلكترونية

إضافة صندوق قابل للطي [Spoiler] في مواضيع بلوجر أو صفحات المواقع الإلكترونية

إضافة صندوق قابل للطي [Spoiler] في مواضيع بلوجر أو صفحات المواقع الإلكترونية

اليلام عليكم، اليوم سأقدم لكم طريقة إضافة إضافة صندوق قابل للطي [Spoiler] في مواضيع بلوجر بستايل مميز وبسيط وبدون أي سكربتات، هذه الإضافة تم إنشاءها فقط بلغتي CSS و HTML أي لن تحتاج لإضافة أكزاد جافا سكربت أو روابط خارجية والتي قد تتسبب ببطء سرعة تصفح الموقع.

طريقة عمل الإضافة نفس طريقة عمل إضافة صندوق محتوى المواضيع (Table of Contents) باستثناء أنه يمكنك إضافة أي محتوى داخل هذا الصندوق ووضعه في أي مكان في صفحة الموضوع أي في أي صفحات ثابتة على بلوجر أو حتى على مواقع تعمل على منصات إدارة محتوى آخر.

فبإمكانك الإستفادة من هذه الإضافة على سبيل المثال لفقرات إضافية أو لأكواد HTML في جسم موايع بلوجر.

شرح تركيب تعليقات Disqus مع خاصية التحميل الكسول (Lazy Loading)

شرح تركيب تعليقات Disqus مع خاصية التحميل الكسول (Lazy Loading)

تركيب تعليقات Disqus مع خاصية التحميل الكسول (Lazy Loading)

سأشارككم اليوم طريقة تركيب تعليقات ديسكس Disqus comments على مدونات بلوجر أو أي موقع إلكتروني مع خاصية التحميل البطيء  (Lazy Loading) عند التمرير للأسفل Disqus for blogger with Lazy Loading on Scroll لتسريع المدونة أو الموقع وتجنب مشكلة تحميل الجافا سكربت الخاص بتعليقات Disqus والذي يتسبب عادة بزيادة حجم الصفحة وهو ما ينتج عنه بطىء تصفح المدونة وهو ماقد يترتب عليه أثر سلبي في تحسين أدآء الموقع لدى محركات البحث كمحرك جوجل والذي يعتبر سرعة تصفح الموقع عامل رئيسي في تحسين ظهور صفحات المدونة في نتائج البحث. 

ما هو ديسكس-Disqus ؟

Disqus - ديسكس هي منصة ويب توفر نظام تعليقات مميز يمكنك استخدامه على العديد من منصات المدونات وانظمة ادارة المحتوى للمواقع الالكترونية، وأصبح استخدام تعليقات Disqus الآن هو الخيار الأفضل لأنه يحتوي على ميزات أفضل مقارنة بنظام التعليقات الافتراضي على Blogger. يعد نظام تعليق Disqus شائعًا في المواقع التي تقوم بتضمينه وفي المدونات كما أنني أيضا أستخدم نظام تعليقات ديسكس في مدونة مدمن ويب.

شرح إضافة سمة اللغة (Lang attribute) إلى قوالب بلوجر

شرح إضافة سمة اللغة (Lang attribute) إلى قوالب بلوجر

شرح إضافة سمة اللغة "lang" إلى قوالب بلوجر

اليوم في مدمن ويب، أشارككم طريقة إضافة سمة اللغة lang=""  إلى قوالب بلوجر والتي تساعد على تحسين أرشفة المدونات وظهور صفحاتها أعلى نتائج محركات البحث كمحرك جوجل و بينج.

فلمعرفة أهميتها، قم أجرب معكم اختبار أداء موقع مدمن ويب قبل إضافة هذه السمات وبعدها ومعرفة درجة التحسين من خلال الأداة الرائعة لإختبار أداء المواقع web.dev، والتي كنت قد تحثت عنها في مقال سابق أفضل أداة لإختبار المواقع و SEO وأداءها وسرعتها وتحليلها.


تؤدي إضافة السمة "lang" إلى علامة html إلى تحديد اللغة الافتراضية لمحتوى موقع الويب. بعض سمات اللغة الشائعة هي "en" للغة الإنجليزية ، و "ja" للغة اليابانية ، و "es" للإسبانية ، و "fr" للفرنسية وما إلى ذلك.


أهم وأفضل أكواد الميتا تاج (العلامات الوصفية HTML5) لتحسين الأرشفة وتصدر نتائج محركات البحث

أهم وأفضل أكواد الميتا تاج (العلامات الوصفية HTML5) لتحسين الأرشفة وتصدر نتائج محركات البحث

أهم وأفضل أكواد الميتا تاج (العلامات الوصفية HTML5) لتحسين الأرشفة وتصدر نتائج محركات البحث

أكواد الميتا تاج أو لعلامات الوصفية (Meta Tags) هي علامات أو أكواد (HTML5) تصف وتوضح  محتوى مقعك أو مدونتك لزواره وتصف وتوضح لمحركات البحث محتوى موقعك أو مدونتك ونوعه وكيفية أرشفته. تظهر العلامات الوصفية في كود الصفحة  فقط (كود المصدر "Source Code") ، ويمكن لأي شخص التحقق منها والإطلاع عليها من خلال إظهار شفرة مصدر موقع الويب. 


تُعد العلامات الوصفية أساسية لأنها تخبر محركات البحث عن موضوع الصفحة. فكر فيهم على أنهم الانطباع الأول لجميع محركات البحث. فوفقًا لمحلل اتجاهات مشرفي المواقع في Google - جون مولر ، "يمكن أن تؤثر العلامات الوصفية على الطريقة التي يرى بها المستخدمون موقعك في نتائج البحث وما إذا كانوا سيرغبون بالنقر على نتائج موقعك بالفعل أم لا.


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

 
جميع الحقوق محفوظة لـمدمن ويب ©