سودان تكنولوجي: بلوجر

‏إظهار الرسائل ذات التسميات بلوجر. إظهار كافة الرسائل

الثلاثاء، 26 يناير 2016

الدرس 64: ما هى انواع الباك لينك Backlinks وفائدته و مضراته على المواقع ؟

بواسطة : watani بتاريخ : 7:28 ص

شرح ماهو الباك لينك Backlinks ومعرفة فوائده فى عمل روابط داخلية و خارجية لموقعك و أهميته فى تسريع الارشفة وكسب ثقة محركاث البحث للحصول على بيج رانك page rank قوي و مضراته فى حظر مدونتك عند الاكثار من نشر روابطك فى التعليقات و المنتديات

تعريف ماهو الباك لينك Backlinks ؟

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

ماهي أهميه الباك لينك Backlinks ؟

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

ما هى انواع الباك لينك Backlinks وفائدته و مضرات على موقعك

ماهي أنواع الباك لينك Backlinks ؟

يوجد نوعان من الباك لينك backlinks :

1 - نوع يسمى دوفولو Do follow :

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

2- نوع يسمى نو فولو No followed :

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

كيف استطيع الحصول على الباك لينك Backlinks لموقعي او مدونتى ؟
هناك العديد من الطرق و الحيل للحصول على باك لينك Backlinks لموقعك :

اولا : اضاقة روابط الداخلية فى مواضيع موقعك :

و هي وضع روابط مواضيع مشابهة فى مواضيعك الجديدة لمواضيع قديمة

ثانيا : العمل بالروابط الخارجية : ومن اهم الطرق التى تضع فيها روابط خارجية

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

- بروفيلك على المواقع : الطريقة تعتمد عند التسجل في اي منتدى او موقع تضع فى معلومات بروفيبك رابط موقعك في المكان المخصص له , وايضا فى التوقيع الخاص بك الذي يظهر اسفل مشاركاتك على تلك المنتديات .

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

- التبادل الاعلاني : التبادل الاعلاني يعد الطريقة الامنة لجلب باك لينك Backlinks نظيف لموقعك حيث يتم تبادل نشر الروابط بين المدونات التى يكون لديها نفس المضمون و هكذا يتم تبادل الزوار بينهم .

ماهي مضرات عمل الباك لينك Backlinks على موقعك ؟

يكون الباك لينك Backlinks مضر إذا قمت بعمل مئات الباك لينك في دقائق ولو كانت ذات جودة عالية فهي ستفقدك ثقة جوجل في موقعك و تظن ان روابطك هي عبارة عن سبام و يمكن ان تقوم محركاث البحث بحظر موقعك نتائجها نهائيا لذلك من الافضل نشر روابط مختلفة من روابط مواضيع موقعك و تكون فى حدود 5 الى 10 روابط يوميا .
و يجب ايضا التاكد من المواقع التى تنشر عليها روابطك حيث ان كانت تلك المواقع ضارة او على القائمة المحظورة من طرف محركاث البحث فهاذا يؤثر بالسلب على موقعك .

شرح بالفيديو : حول كيف اجعل موقعي مشهور على محركات البحث عبر عمل روابط الباك لينك Backlinks

/div>

الروابط و الاكواد التى تم شرحها على الفيديو
- اقوى مواقع بينغ Ping لاشهار و رفع و تحسين ترتيب موقعك على محركات البحث و اليكسا
- الكود :

Keyword "if you have a website, link to it here" "post a new comment"

إقرأ المزيد

الخميس، 21 يناير 2016

الدرس 63: كود لعمل مؤثرات جميلة على الصور و اضافة صندوق الاعجاب فايسبوك مثبت على بلوجر

بواسطة : watani بتاريخ : 4:26 ص

شرح كيفية اضافة تاثيرات جميلة على صور مدونة بلوجر و طريقة اضافة صندروق اعجاب الفيسبوك مثبث و مخفي على جانب مدونة Blogger يظهر عند تمرير الماوس عليه

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

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

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

- كيفية اضافة كود تاثير على الصور فى مدونة بلوجر

ابحث عن الوسم : ]]> و اضف فوقة كود CSS التاالي :

.separator {overflow:hidden;}
.post-body img {background:transparent;box-shadow:none;-webkit-backface-visibility:hidden;transition:all 2s}
.post-body img:hover {opacity:initial;-webkit-filter:invert(100%);}

كيفية اضافة صندوق مخفي و منبيثق على مدونة بلوجر

ابحث عن الوسم : و اضف تحته الكود التالي
- لاتنسى تغيير اسم صفحة الفيسبوك : infoarabe باسم رابط صفحتك

ملاحظة مهمة : قم بتحويل السكريبت الاخير الذي يبدا بـ :

مصمم عبر : علوم وتقنيات

تابع الشرح بالفيديو حول طريقة اضافة تاثيرات على الصور مع جعل صندوق اعجاب فيسبوك مثبث و مخفي على جانب مدونة بلوجر

إقرأ المزيد

الجمعة، 15 يناير 2016

الدرس 62: اضافة ازرار المتابعة والمشاركة على الصفحات الاجتماعية مع صندوق الاشتراك ومواضيع ذات صلة فى بلوجر

بواسطة : watani بتاريخ : 9:41 ص

طريقة اضافة ازرار المتابعة والمشاركة على الصفحات الاجتماعية الفيسبوك و التويتر و جوجل بلس مع صندوق الاشتراك فى القائمة البريدية فى مدونة بلوجر و كيفية اضافة مواضيع ذات صلة اسفل مواضيع blogger

السلام اخوتي الكرام فى حلقة جديدة على دورة انشاء مدونة بلوجر عربية فى هذا الدرس ان شاء الله سوف نتعلم كيفية اضافة بعض الاضافات المهمة على مدونة بلوجر و هي :

1- اضافة ازرار المتابعة على الصفحات الاجتماعية للفيسبوك و التويتر و جوجل بلس مع صندوق الاشتراك فى القائمة البريدية فى القائمة الجانبية لمدونة بلوجر

2 - اضافة ازرار المشاركة على الصفحات الاجتماعية للفيسبوك و التويتر و جوجل بلس اسفل مواضيع بلوجر و هو شئ مهم حتى يتم نشر مواضيع و الحصول على زوار من تصفحات التواصل الاجتماعي

3 - اضافة مواضيع ذات صلة اسفل مواضيع بلوجر التى تظهر جميع مواضيعك السابقة لنفسم قسم المواضيع التى تضيفها و هذا مفيد جدا حتى يتمكن زوار مدونتك من زيارة مواضيعك السابقة

ازرار المتابعة والمشاركة على الصفحات الاجتماعية مع صندوق الاشتراك ومواضيع ذات صلة فى بلوجر

تابع الفيديو لشرح كيفية اضافة ازرار مشاركة ومتابعة للصفحات الاجتماعية + صندوق الاشتراك ومواضيع ذات صلة فى بلوجر

1- طريقة اضافة ازرار المشاركة على الصفحات الاجتماعية للفيسبوك و التويتر و جوجل بلس اسفل مواضيع بلوجر

الاكواد

2- طريقة اضافة مواضيع ذات صلة اسفل مواضيع بلوجر

الاكواد

1- كود CSS نضيفها فوق الوسم : /*-----code css related-posts by www.arabes1.com ------*/ #related-posts h4{color:#FFFFFF;font-size:14px;line-height:16px;font-family:DroidKufi-Bold;margin:0 0 10px 0;padding:10px;border-bottom:1px solid #DFDFDF;background:#3F51B5;border-radius:5px 5px 0 0}  2- كود SCRIPT نضيفه اسفل الوسم :   </head>   <script type='text/javascript'>    //<![CDATA[     var relatedTitles = new Array();     var relatedTitlesNum = 0;     var relatedUrls = new Array();     function related_results_labels(json) {       for (var i = 0; i < json.feed.entry.length; i++) {         var entry = json.feed.entry[i];         relatedTitles[relatedTitlesNum] = entry.title.$t;         for (var k = 0; k < entry.link.length; k++) {           if (entry.link[k].rel == 'alternate') {             relatedUrls[relatedTitlesNum] = entry.link[k].href;             relatedTitlesNum++;             break;           }         }       }     }     function removeRelatedDuplicates() {       var tmp = new Array(0);       var tmp2 = new Array(0);       for(var i = 0; i < relatedUrls.length; i++) {         if(!contains(tmp, relatedUrls[i])) {           tmp.length += 1;           tmp[tmp.length - 1] = relatedUrls[i];           tmp2.length += 1;           tmp2[tmp2.length - 1] = relatedTitles[i];         }       }       relatedTitles = tmp2;       relatedUrls = tmp;     }     function contains(a, e) {       for(var j = 0; j < a.length; j++) if (a[j]==e) return true;       return false;     }     function printRelatedLabels() {       var r = Math.floor((relatedTitles.length - 1) * Math.random());       var i = 0;       document.write('<ul>');       while (i < relatedTitles.length && i < 20) {         document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>');         if (r < relatedTitles.length - 1) {           r++;         } else {           r = 0;         }         i++;       }       document.write('</ul>');     }     //]]>  </script> 3- كود HTML نضيفه اسفل وسم : <data:post.body/>  تابع الفيديو حتى تعرف ايهما الكود المحدد  <div id='related-posts'><h4>مواضيع ذات صلة قد تهمك : <div style='display:none;'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'>, </b:if><b:if cond='data:blog.pageType == "item"'><script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=15"' type='text/javascript'/></b:if></b:loop></div></h4><script type='text/javascript'>removeRelatedDuplicates();printRelatedLabels();</script></div>

3 - طريقة اضافة ازرار المتابعة على الصفحات الاجتماعية للفيسبوك و التويتر و جوجل بلس مع صندوق الاشتراك فى القائمة البريدية

- نذهب الى التخطيط و نقوم بانشاء اضافة HTML/JAVASCRIPT ثم نضيف الكود التالي :

لاتنسى تغيير :

infoarabe بمعرف صفحتك على الفيسبوك

didorahim يمعرف صفحتك على التويتر

rahimmerciful بمعرف الخاص بك على موقع feedburner

- ارجوا ان اكون قد افدتكم و الى حلقة اخرى ان شاء الله

إقرأ المزيد

الثلاثاء، 12 يناير 2016

الدرس 61: اكواد CSS و HTML لحماية مواضيع بلوجر من النقل و السرقة

بواسطة : watani بتاريخ : 7:20 ص

شرح طريقة منع نسخ و نقل و سرقة مواضيع بلوجر, تعطيل زر يمين الفارة, تعطي نسخ عبر اختصار لوحة مفاتيح Ctrl + C عبر اكواد CSS و HTML مع السماح او استثناء نسخ جزء من اي نص تريده فى مشاركاتك

السلام عليكم احبابي اخواني الكرام على مدونة علوم و تقنيات فى درس جديد على قسم دورة انشاء مدونة بلوجر احترافية فى درس من قبل طرحناه على الدورة و هو : الدرس 56: طريقة منع نسخ الصور وكيفية اخفائها من صفحة المواضيع و اظهارها فى الصفحة الرئيسية فقط

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

ملاحظة فى هذا الدرس قدمت لكم طريقتين يمكن استعمال واحدة منهم لمنع نقل مواضيعك

كيفية تعطيل زر يمين الفارة و تحديد نص و Ctrl +C لمنع نسخ و سرقة مواضيع بلوجر

1 - طريقة منع نسخ مواضيع بلوجر و استناء منطقة يمكن النسخ منها

هذه الطريقة تعتمد على اضافة اكواد CSS بدون الحاجة الى استعمال كود JAVA SCRIPT الذي يمكن تعطيله عبر المتصفح من طرف الذي يريد نسخ مواضيعك

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

هناك كودين تضاف فوق الوسم :

- الكود الاول : منع نسخ و تحديد اي نص على مواضيعك

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

2 - طريقة منع تحديد نص و تعطيل زر يمين الفارة و منع نسخ عبر اختصار لوحة مفاتيح Ctrl + C فى بلوجر

طريقة اخرى فعالة لمنع نسخ و نقل مواضيع بلوجر عبر منع الزوار من تحديد اي نص على مواضيعك و ايضا تعطيل خاصية زر يمين الفارة و ايضا تعطيل خاصية نسخ عبر اختصار لوحة مفاتيح Ctrl + C فى مواضيع بلوجر

قم باستبدال وسم بالكود التالي :

الكود

تخصيص الكود

oncontextmenu='return false : لتفعيل زر يمين فارة الحاسوب ارجع false الى true

onkeydown='return false : لتفعيل بنسخ عبر اختصار لوحة مفاتيح Ctrl + C ارجع false الى true

onmousedown='return false : للسماح بتحديد النص على مواضيع ارجع false الى true

فيديو : كيفية تعطيل زر يمين الفارة و تحديد نص و Ctrl +C لمنع نسخ و سرقة مواضيع بلوجر

إقرأ المزيد

الجمعة، 8 يناير 2016

الدرس 60: شرح كيفية تثبيت شريط الاقسام العلوى او الاضافات على مدونة بلوجر

بواسطة : watani بتاريخ : 6:14 ص

شرح طريقة تثبيث اي شريط الاقسام العلوي او اي اضافة فى القائمة الجانبية لبلوجر بدون ان يختفي عند النزول الى اسفل المدونة
how to fix and make sticky widget in blogger

السلام عليكم احبابي زوار مدونة علوم و تقنيات فى حلقة جديد على قسم دورة بلوجر فى هذا الدرس ان شاء الله سوف نتعلم طريقة تثبيث اي اضافة او شريط على مدونة بلوجر حيث عندما يقوم اي زائر فى مدونتك بالنزول الى اسفل مدونتك ستبقى الاضافات التى قمت بثتبيتها ظاهرة على صفحة المدونة او المتصفح

طبعا الطريقة سهلة جدا فقط عليك باضافة كود CSS واخر JAVA SCRIPT و القيام ببعض التعديلات

شرح طريقة تثبيت قائمة الاقسام العلوية واضافات القائمة الجانبية لمدونة بلوجر

1 - قم بالبحث عن الوسم : ثم اضف فوقه هذا الك

2 - قم بالنزول الى اسفل صفحة تحرر قالب مدونتك تجد وسم اضف فوقه هذا السكريبت

لاتنسى تغيير add id or class باسم ID او CLASS الخاص بالعنصر الذي تريد تثبيثه

تابع الفيديو : حول طريقة تثبيث اي اضافة او عنصر على مدونة بلوجر

إقرأ المزيد

السبت، 2 يناير 2016

الدرس 59: تحميل و شرح تعديل على اسرع واقوى قالب بلوجر BMAG الشبيه للمحترف 2016

بواسطة : watani بتاريخ : 8:10 ص

شرح التعديل على اجمل قالب بلوجر BMAG الشبيه للمحترف 2016
هل تريد تحميل افضل قالب بلوجر ؟
هل تريد الحصول على قالب المحترف الجديد ؟
هل تريد شرح التعديل على قالب BMAG ؟

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

مميزات قالب BMAG :

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

شرح التعديل على اجمل قالب بلوجر BMAG الشبيه للمحترف 2016

تحميل و شرح تعديل على اسرع واقوى قالب بلوجر BMAG

شرح طريقة التعديل و اضافة الاكواد على قالب بلوجر BMAG

ملاحظة هامة لم تشرح فى الفيديو : عند ثثبيث القالب يمكن للبعض لايظهر لهم الترقيب اسفل الصفحة الرئيسية لذلك قم بالدخول الى صفحة التخطيط فى مدونتك وفى خيرات تجد PageNav Posts Numbe : قم بالدخول اليها و اكتب رقم 10 ثم قم بالحفط ’ يبقى هذا الامر على حسب عدد مواضيعك ان مازال لم تظهر جرب تغيير قيم اخرى

1 - اكواد ايقونات الصفحات الاجتماعية - social-sec لقالب بلوجر BMAG

2 - تعديل على شريط الاقسام - menu لقالب بلوجر BMAG

3 - اضافة السلايدر - intro post لقالب بلوجر BMAG
recent : اخر المواضيع
random : مواضيع هشوائية

4 - اضافة عداد الصفحات الاجتماعية - social-counter

5 -اضافة اقسام التصنيفات فوق و اسفل المواضيع فى الصفحة الرئيسية

يمكنك الاستعانة بهذا الموقع للحصول على اكواد الالوان من : هنا

6 - نطام التعليقات - COMMENTS SYSTEM

7 - اضافات القائمة الجانبية
- مشاركات عشوائية : randomposts
- اخر المواضيع : recentposts
- اخر التعليقات : recentcomments

8 - اضافة صندوق الفيسبوك على قالب BMAG

9 - تغيير لغة الاشهر فى قالب BMAG

10 - اضافة الايقونات داخل المواضيع و الصفحات فى قالب BMAG

/*----ايقونات صغيرة-----*/   <a href='/' class="button small red">نص الايقونة</a>  <a href='/' class="button small pink">نص الايقونة</a>  <a href='/' class="button small orange">نص الايقونة</a>  <a href='/' class="button small yellow">نص الايقونة</a>  <a href='/' class="button small green">نص الايقونة</a>  <a href='/' class="button small turquoise">نص الايقونة</a>  <a href='/' class="button small blue">نص الايقونة</a>  <a href='/' class="button small purple">نص الايقونة</a>  <a href='/' class="button small midnight">نص الايقونة</a>  <a href='/' class="button small grey">نص الايقونة</a>  <a href='/' class="button small asbestos">نص الايقونة</a>  <a href='/' class="button small dark">نص الايقونة</a>   /*----ايقونات متوسطة-----*/   <a href='/' class="button medium red">نص الايقونة</a>  <a href='/' class="button medium pink">نص الايقونة</a>  <a href='/' class="button medium orange">نص الايقونة</a>  <a href='/' class="button medium yellow">نص الايقونة</a>  <a href='/' class="button medium green">نص الايقونة</a>  <a href='/' class="button medium turquoise">نص الايقونة</a>  <a href='/' class="button medium blue">نص الايقونة</a>  <a href='/' class="button medium purple">نص الايقونة</a>  <a href='/' class="button medium midnight">نص الايقونة</a>  <a href='/' class="button medium grey">نص الايقونة</a>  <a href='/' class="button medium asbestos">نص الايقونة</a>  <a href='/' class="button medium dark">نص الايقونة</a>     /*----ايقونات كبيرة-----*/   <a href='/' class="button large red">نص الايقونة</a>  <a href='/' class="button large pink">نص الايقونة</a>  <a href='/' class="button large orange">نص الايقونة</a>  <a href='/' class="button large yellow">نص الايقونة</a>  <a href='/' class="button large green">نص الايقونة</a>  <a href='/' class="button large turquoise">نص الايقونة</a>  <a href='/' class="button large blue">نص الايقونة</a>  <a href='/' class="button large purple">نص الايقونة</a>  <a href='/' class="button large midnight">نص الايقونة</a>  <a href='/' class="button large grey">نص الايقونة</a>  <a href='/' class="button large asbestos">نص الايقونة</a>  <a href='/' class="button large dark">نص الايقونة</a>

11 - اضافة نصوص التنبيه داخل المواضيع و الصفحات فى قالب BMAG

12 - اضافة الاكواد داخل المشاركات فى قالب BMAG

13 - ادماج نمودح اتصل بنا فى المشاركات و الصفحات - قالب BMAG

حتى تفهم كيفية التعديل و اضافة الاكواد على قالب BMAG-v2.0.2 تابع معنا الفيديو

تحميل قالب : BMAG

إقرأ المزيد

الثلاثاء، 29 ديسمبر 2015

الدرس 58: طريقة اضافة مؤثر هطول الثلوج على مدونة بلوجر snow effect blogger

بواسطة : watani بتاريخ : 11:47 ص

شرح طريقة جعل مدونتك تسقط فيها الثلوج عبر اضافة سكريبت مؤثر هطول الثلج script snow effect blogger على مدونة بلوجر

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

طريقة اضافة مؤثر هطول الثلوج على مدونة بلوجر snow effect blogger

مميزات اضافة الثلج على مدونة بلوجر

- تعطي نظرة رائعة لزوار مدونتك
- يستجيب اتجاه هطول الثلج الى اتجاه مؤشر فارة حاسوب زائر مدونتك
- تزيد سرعة هطول الثلج كلما كانت سرعة مؤشر فارة حاسوب زائر مدونتك كبيرة

لاضافة السكريب على مدونتك :
- قم يالدخول الى القالب ثم الى تحرير Html
- بعدها ضع السكريب التالى اسفل الميتا الخاص بك او اسفل الكود ( تابع الفيديو لترى طريقة التركيب )

إقرأ المزيد

الأحد، 27 ديسمبر 2015

الدرس 57: كيفية منع فهرسة روابط التسميات والأرشيف لتفادي تكرار المحتوى على محركات البحث

بواسطة : watani بتاريخ : 7:52 ص

شرح كيفية منع فهرسة محركاث البحث لروابط الاقسام و التسميات labels والأرشيف archives لمنع تكرار المحتوى على مدونة بلوجر عبر اكواد ميتا تاج meta tags و ملف روبوتس robots.txt

السلام عليكم احبتي الكرام فى درس جديد على مدونة علوم و تقنيات و على قسم دورة بلوجر قامت جوجل مؤخر باتخاذ إجراءات صارمة ضد المحتوى المكرر ، فمثلا عندما يبحث مستخدمي محركات البحث مثل جوجل عن موضوع معين فانه ستظهر له مواضيع مكررة خاصة بارشيف مدونتك او روابط اقسامها
السؤال هو : كيف تارشف محركات البحث مواضيع مدونتى مرتين او تؤرشف روابط الاقسام ؟

1- مشكل ارشفة محركات البحث لصفحات أرشيف

من احد المشاكل التى يمكن ان تضر بمودنتك و انت لا تعلم بها هي المحتوى المكرر لمواضيعك و التى تتم فهرستها من طرف محركات البحث و السبب ان محركاث البحث عند الدخول و تفحص روابط مدونتك فانها فى الاغلب تقوم بالكشف عن جميع الروابط و منها روابط ارشيف المدونة مما يؤذي الى ارشفة مواضيع المدونة + ارشفة ارشيف المدونة و فى الاخير يؤذي الى ارشفة مكررة لرابطين لنفس الموضوع و محركات البحث لا يحبون ارشفة المحتوى المكرر

2 - مشكل ارشفة اقسام و تصنيفات مدونة بلوجر

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

منع, فهرسة, روابط, تسميات, أرشيف, منع, تكرار, محتوى, بلوجر

منع محركاث البحث من فهرسة روابط التسميات والأرشيف على مدونة بلوجر

حل مشكل ارشفة اقسام و ارشيف مدونة بلوجر من طرف محركات البحث

1- حل مشكل ارشفة محركات البحث لصفحات أرشيف ARCHIVES مدونة بلوجر

1- 1 - تحسين روابط الأرشيف

ابحث فى القالب عن هذا الكود :

وقم باستبدله بهذا الكود :

1- 2 - اضافة ميتا تاج meta tag لمنع ارشفة ارشيف المدونة
اضف هذا الكود تحت الوسم

1- 3 - تابع الخطوات الاخرى على الفيديو فى الاسفل
ملاحظة : تاثير هذه الخطوات لاتظهر الى بعد مرور شهر او اكثر

2 - حل مشكل ارشفة اقسام و تصنيفات LABEL مدونة بلوجر

1-2- اضافة ميتا تاج meta tag لمنع ارشفة اقسام وتصنيفات المدونة
اضف هذا الكود تحت الوسم

2 -2- منع ارشفة صفحات الاقسام و التصنيفات عبر ملف روبوتس robots.txt
قم باضفة هذا الكود

Disallow: /search/labels/

فى ملف روبوتس robots.txt

3- 3 - تابع الخطوات الاخرى على الفيديو فى الاسفل
ملاحظة : تاثير هذه الخطوات لاتظهر الى بعد مرور شهر او اكثر

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

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

إقرأ المزيد

الأحد، 20 ديسمبر 2015

الدرس 56: طريقة منع نسخ الصور وكيفية اخفائها من صفحة المواضيع و اظهارها فى الصفحة الرئيسية فقط

بواسطة : watani بتاريخ : 7:08 ص

شرح كيفية ارشفة صور بلوجر على محركات البحث , طريقة منع نسخ و سرقة الصور من مدونة بلوجر , كيفية اخفاء صور من المواضيع و اظهارها فى الصفحة الرئيسية لبلوجر

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

منع سرقة الصور من بلوجر وكيفية اخفائها من المواضيع و اظهارها فى الصفحة الرئيسية

ما سنتعلم فى هذه الحلقة - تابع الخطوات على الفيديو :
- طريقة الارشفة الصحيحة لصور مواضيع مدونة بلوجر على محركات البحث
- طريقة منع سرقة و نسخ صور مواضيع بلوجر
- طريقة اخفاء صور المواضيع و اظهارها على الصفحة الرئيسية فقط عل بلوجر

1- اضافة كود لمنع سرقة و نسخ صور المواضيع على بلوجر

انسخ كود السكريبت وضعه فوق الوسم

2 - اخفاء صور المواضيع من داخل مشاركات يلوجر و اظهارها على الصفحة الرئيسية فقط

انسخ كود التالي وضعه فوق الوسم

إقرأ المزيد

السبت، 12 ديسمبر 2015

الدرس 55: طريقة اضافة Gadget جديد فى تخطيط مدونة بلوجر Blogger

بواسطة : watani بتاريخ : 7:50 ص

شرح كيفية اضافة gadget جديد فى تخطيط مدونة بلوجر blogger لشعار المدونة او اعلان بجانب لوجو logo او gadget لاعلان فوق مواضيع الصفحة الرئيسية مع تعديل على مقاساتها و جعلها متناسقة مع التصميم

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

طريقة اضافة Gadget جديد فى تخطيط مدونة بلوجر

فى الشرح على الفيديو التعليمي سوف نتعلم كامثلة :
- اضافة gadget خاص بشعار المدونة او لوجو logo كان غير موجود من قبل على التخطيط
- اضافة gadget خاص بالاعلانات بجانب شعار المدونة " اللوجو logo " كان غير موجود من قبل على التخطيط
- اضافة gadget خاص بالاعلانات اسفل شريط الاقسام و فوق المواضيع فى الصفحة الرئيسية لمدونة بلوجر
- التعديل على مقاسات اللوجو و مكان الاعلان لتظهر بشكل منسق جنب على جنب فى الهيدر

الكود المستعمل فى الحلقة :

تابع شرح بالفيديو حول طريقة اضافة gadget جديد فى تخطيط مدونة بلوجر Blogger

إقرأ المزيد

الثلاثاء، 8 ديسمبر 2015

الدرس 54: شرح حلول المشاكل الشائعة لقالب بلوجر Blogger

بواسطة : watani بتاريخ : 5:58 ص

السلام عليكم احبتي الكرام فى حلقة جديدة على مدونة علوم و تقنيات و على قسم دورة بلوجر

فى هذه الحلقة ساقدم لكم بعض حلول لمشاكل الشائعة المتعلقة بقوالب بلوجر blogger و خاصة التى صادفها بعض المتابعين مع قالب مدونة علوم و تقنيات القديم التى رفعته و قدم لكم درس حول طريقة التعديل عليه لكن البعض صادفته مشاكل فى التركيب

و تجدون فى الدرس جميع الاسئلة التى تم ادراجها فى تعليقاتكم على الدورة

و الذي تجدونه هنا : تحميل قالب مدونة علوم وتقنيات الخفيف و المتوافق مع شاشات الاجهزة الذكية

حلول لاغلب المشاكل الشائعة لقالب بلوجر Blogger

شرح حلول المشاكل الشائعة لقالب بلوجر Blogger

من اهم حلول مشاكل بلوجر التى شرحناها على هذه الحلقة

- الطريقة الصحيحة لرفع قالب بلوجر

- طريقة اضافة ايقونات متابعة على الصفحات الاجتماعية

- كيفية اضافة معرف متابعة عبر البريد الالكتروني

- طريقة حذف slider show من قالب بلوجر

- كيفية حذف اضافة ' تدعمه بلوجر'

- كيفية حذف النافبار Navbar blogger او الشريط الخاص بتصماميم الافترضية لبلوجر

ارجوا ان ينال الشرح افادتكم

إقرأ المزيد

الثلاثاء، 24 نوفمبر 2015

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

بواسطة : watani بتاريخ : 5:36 ص

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

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

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

تحميل قالب مدونة علوم وتقنيات الخفيف و المتوافق مع شاشات الاجهزة الذكية

مميزات قالب مدونة علوم و تقنيات

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

شرح التعديل بالفيديو على قالب مدونة علوم و تقنيات

تحميل قالب مدونة علوم و تقنيات من : هنا

إقرأ المزيد

الثلاثاء، 17 نوفمبر 2015

الدرس 52: طريقة اضافة ازرار الصعود والنزول فى مدونة بلوجر

بواسطة : watani بتاريخ : 4:28 ص

شرح طريقة تركيب و اضافة زر الصعود "scroll to top" للانتقال الى اعلى المدونة و زر النزول "scroll to bottom" للانتقال الى اسفل المدونة او المواضيع على مدونة بلوجر blogger

السلام عليكم احبتي متتبعي دورة بلوجر على مدونة علوم و تقنيات فى هذا الدرس الذي سنشرح فيه طريقة اضافة زر الصعود "scroll to top" للانتقال الى اعلى المدونة و زر النزول "scroll to bottom" للانتقال الى اسفل المدونة او المواضيع على مدونة بلوجر , و ستكون هذه الازرار ظاهرة على بشكل ثابت على جانب الايمين للمدونة حتى تسهل على الزوار الانتقال صعودا و نزولا فى مدونتك .

كيفية اضافة ازرار الصعود والنزول scroll to top and to bottom فى مدونة blogger

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

طريقة تركيب زر الصعود "scroll to top" و زر النزول "scroll to bottom" فى مدونة بلوجر

1 - تدخل الى قالب مدونتك و نبحث عن الوسم و نضع كود CSS فوقه مباشرة

2- نبحث عن الوسم و نضع هذا كود SCRIPT فوقه مباشرة

3 - نبحث عن الوسم و نضع هذا كود HTML فوقه مباشرة

و مبروك عليك ثمت اضافة ازرار الصعود و النزول على مدونتك
ملاحظة : يمكن تغيير الالوان و حجم ازرار الصعود و النزول على حسب رغبتك و يتم هذا فى اكواد CSS

شرح بالفيديو حول كيفية تركيب زر الصعود "scroll to top" و زر النزول "scroll to bottom" فى مدونة بلوجر

إقرأ المزيد

الأربعاء، 11 نوفمبر 2015

الدرس 51: طريقة رفع ملفات CSS و JavaScript بلوجر على استضافة خارجية فى موقع جوجل درايف

بواسطة : watani بتاريخ : 4:10 ص

شرح طريقة رفع ملفات اكواد CSS وملفات الجافا JavaScript الخاصة ببلوجر Blogger على استضافة خارجية فى موقع جوجل درايف Goole Drive لتخفيف حجم القالب و تسريع مدونة بلوجر للارشفة السريعة على محركات البحث و SEO

السلام عليكم احبتي الكرام فى درس جديد على مدونة علوم و تقنيات و على القسم الخاص بدورة انشاء مدونة بلوجر احترافية , فى هذا الدرس المتقدم و المهم جدا ساشرح لكم طريقة رفع ملفات CSS و ملفات الجافا JavaScript على استضافة خارجية خاصة بك فى موقع جوجل درايف Goole Drive .

فوائد رفع ملفات CSS و الجافا JavaScript على موقع جوجل درايف Goole Drive

1 - تقليل من حجم قالب بلوجر

عندما تقوم برفع بعض اكواد قالب بلوجر فى استضافة خارجية يؤذي هذا الى التقليل من حجم الاكواد التى على قالبك

2- تسريع تصفح مدونة بلوجر

عند رفع ملفات ملفات CSS و الجافا JavaScript على استضافة خارجية يؤذي هذا الى تسريع تصفح مدونة بلوجر و تخفيف الضغط عليها

3 - تسريع فهرسة مواضيعك و رفع قيمة SEO لمدونة بلوجر

كما نعلم عندما تكون مدونة بلوجر سريعة فانك عبر هذا حققت احد الشروط الاساسية لـ SEO و بهذا تصبح مدونتك محببة للزوار و الى محركات البحث و ستصبح موثوقة مما يؤذي الى تسريع ارشفة مواضيعك و ظهورها على محركات البحث مثل : جوجل

4 - استضافة خاصة على جوجل درايف حتى لاتتعرض لتغيير اكواد مدونتك

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

طريقة رفع ملفات CSS و JavaScript بلوجر على استضافة خارجية فى موقع جوجل درايف

طريقة رفع ملفات CSS و الجافا JavaScript على موقع جوجل درايف Goole Drive

من الافضل متابعة الفيديو لفهم الطريقة بشكل جيد .
- نقوم بنسخ اكواد CSS او اكواد الجافا JavaScript المراد رفعها
- نقوم بلصقها فى ملف نصي TXT
- نقوم بحفظها باي تسمية لكن يجب ان يكون ترميزها UTF-8 و امتدادها .css مثلا : templat.css اما بالنسبة للجافا يكون الامتداد .js

- الان نقوم برفعها على موقع جوجل درايف , بعد الرفع اضغط بيمين الفارة على الملف ثم اذهب الى الاعدادت المتقدمة و تاكد من تحويل الملف من خاص Prive الى عام Public

- الان نقوم بنسخ الرابط المتحصل عليه لكود css او java
مثلا هذا رابط ملف css :
https://drive.google.com/file/d/0B0V2McsFaOhRakE1RzlKZC1XWGc/view?usp=sharing

- نقوم باخد الكود الملون بالازرق و ضع بجانب الكود : https://googledrive.com/host/
ليصبح هكذا : https://googledrive.com/host/0B0V2McsFaOhRakE1RzlKZC1XWGc
الطريقة نفسها مع ملفات الجافا java

- تبقي لنا طريقة اضافتها على قالب مدونة بلوجر
بالنسبة لملفات CSS نقوم باضافة الرابط المتحصل عليه داخل هذا الرابط

ليصبح فى الاخير هكذا :

-اما بالنسبة للجافا فنضيف الكود الخاص به الى هذا الرابط :
ليصبح هكذا :

ثم تضيفه فى قالب مدونتك

المواقع التى تم استخدامها فى الدرس :
- موقع جوجل درايف : Google Drive
- موقع ضغط ملفات : CSS
- موقع ضغط ملفات جافا سكريبت : JavaScript

إقرأ المزيد

السبت، 7 نوفمبر 2015

الدرس 50: دمج فيديوهات اليوتيوب فى بلوجر وجعلها متوافقة و متجاوبة مع الشاشات الذكية

بواسطة : watani بتاريخ : 3:42 ص

شرح طريقة دمج و اضافة و جعل فيديوهات اليوتيوب متوافقة و متجاوبة على شاشات الهواتف و الاجهزة اللوحية الذكية فى مواضيع مدونة بلوجر Making Embedded Videos youtube responsive in Blogger

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

اضافة فيديوهات اليوتيوب الى بلوجر وجعلها متجاوبة responsive مع الشاشات الذكية

دمج فيديوهات اليوتيوب فى بلوجر وجعلها متوافقة و متجاوبة مع الشاشات الذكية

فى هذا الفيديو التعليمي سنشرح :
- كيفية ادراج و اضافة فيديوهات اليوتيوب على مواضيع مدونة بلوجر
- طرق التعديل على مقاسات فيديوهات اليوتيوب فى مشاركات بلوجر
- طريقة جعل فيديوهات اليوتيوب متوافقة و متجاوبة مع شاشات الهواتف و الاجهزة اللوحية

كيف نجعل فيديو اليوتيوب متجاوب مع شاشات الاجهزة فى مواضيع بلوجر

- ندخل الى قالب المدونة
- نبحث عن الكود ]]> و نضع فوقه هذا الكود ونقوم بالحفظ

- الان يجب عليك فى كل مشاركة جديدة على مدونتك تريد اضافة او ادماج فيديو يوتيوب عليها ان تقوم بالتالي :
- فى مشاركة جديد اختر المكان الذي تريد ادماج الفيديو فيه , ثم اذهب الى صفحة HTML للموضوع

و قم باضافة هذا الكود :
رابط مشاركة الفيديو

- فى " رابط مشاركة الفيديو " ضع مكانه رابط المشاركة او الادماج الذي تجده تحت فيديو فى موقع اليوتيوب
- عندما تقوم بكل هذه الخطوات سيصبح الفيديو متجاوب مع كل شاشات الاجهزة الذكية يمكنك تجربتها
عبر هذا الموقع : mobiletest

إقرأ المزيد

الثلاثاء، 3 نوفمبر 2015

الدرس 49: طريقة جعل قالب بلوجر متجاوب و متوافق مع شاشات الهواتف و الاجهزة اللوحية الذكية

بواسطة : watani بتاريخ : 11:56 ص

شرح كيفية برمجة و جعل قالب مدونة بلوجر متجاوب Responsive design Blogger و متوافق مع جميع شاشات الاجهزة الذكية المحمولة SMARTPHONES مثل الهواتف SMALL MOBILES و اجهزة اللوحية TABLETS

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

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

كيفية جعل قالب بلوجر متجاوب و متوافق مع شاشات الاجهزة اللوحية الذكية Responsive design

طريقة جعل قالب بلوجر متجاوب و متوافق مع شاشات الهواتف و الاجهزة اللوحية الذكية

يمكن عبر اداة mobile friendly انت تعرف ان كان قالبك متجاوب مع شاشات المتعددة

1- اظهار الاضافات و اخفائها على شاشة المحمول المتجاوب للقالب الافترضي لمدونة بلوجر

طبعا هناك من يستعمل النسخة الافتراضية الخاصة ببلوجر للاجهزة المحمولة لكنها غير فعالة لاظهار الشكل و التصميم الحقيقي لمدونتك بل تصميم قالب بسيط الخاص ببلوجر
لذلك ان كنت تستعمل تلك النسخة اليك بعض الطرق لاظهار و اخفاء الاضافات الخاصة بمدونتك.
- الاضافات الافتراضية لمدونة بلوجر فى الاغلب تكون هكذا : Header - Blog - Profile - PageList - AdSense - Attribution
- ان اردت التحكم فى ظهور هذه الاضافات على شاشات الاجهزة المحمولة يجب عليك اضافة هذه الاكواد على كل اضافة widgets تريد التعديل عليها من القالب.
مثال : على اضافة ارشيف المدونة BlogArchive سيكون widget الخاص به هكذا :

الان تابع معي :
- ان اردت الاضافة تظهر فى شاشة الحاسوب و شاشة الاجهزة المحمولة اضف الكود 'mobile='yes هكذا :
mobile='yes' title='Blog Archive' type='BlogArchive'>
- ان اردت الاضافة تظهر فى شاشة الحاسوب و لا تظهر على شاشة الاجهزة المحمولة اضف الكود 'mobile='no هكذا :
mobile='no' title='Attribution' type='Attribution'>
- ان اردت الاضافة لا تظهر فى شاشة الحاسوب وتظهر على شاشة الاجهزة المحمولة اضف الكود 'mobile='only هكذا :
mobile='only' title='Blog Archive' type='BlogArchive'>

- يمكن عبر موقع responsinator ان ترى نتيجة عبر اظهار موقعك فى جميع شاشات متعددة خاصة بالهواتف الذكية و اللوحية

2 - كيفية برمجة قالب بلوجر عبر اكواد CSS ليصبح متجاوب مع كل شاشات الاجهزة الذكية المحمولة و اللوحية

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

1- يجب اضافة هذا الكود الى مدونتك تحت الوسم :

2 - المرحلة الثانية و هي التعديل على مقاسات مدونتك لتكون متجاوبة مع شاشات الاجهزة المحمولة يجب عليك اولا اخد فكرة عن العناصر الاساسية التى يجب اولا التعديل عليها و هي :
- body : وهو جسم أو بدن القالب الرئيسي.
- outer wrapper : وهو الغلاف الخارجي وداخله توجد كل العناصر.
- header : وهو الجزء العلوي من القالب.
- main wrapper : وهو الجزء المجمع للعناصر الرئيسية في الصفحات.
- post : وهو مكان المواضيع.
- sidebar : وهو الشريط الجانبي الذي يحتوي على العديد من العناصر.
- footer : وهو الجزء السفلي من القالب ويسمى أيضا بذيل الموقع .

3 - الان يجب التعديل على كل قياس خاص بالاجهزة الذكية لذلك يجب اضافة هذه الاكواد فوق الوسم : ]]>
و التعديل على كل منها :
مثال :
- الموقع الذي عملنا عليه الشرح فى الفيديو لاظهار مقاييس شاشات الهواتف و الاجهزة الذكية من هنا : mobiletest
ملاحظة : هناك من لدي مشكل في ظهور إعلانات أدسنس على الهواتف و الاجهزة اللوحية لذلك حتى تظهر الإعلانات في مدونتك على الأجهزة المحمولة اضغط خيار فى القالب :
No , Show desktop template on mobile devices.

حتى تفهم كل ما تم شرحه فى هذا الدرس تابع مثال عملي على هذا الفيديو التعليمي

إقرأ المزيد

الجمعة، 30 أكتوبر 2015

الدرس 48: طرق وضع اعلان ادسنس فوق واسفل و وسط مواضيع بلوجر و وضع اعلانين بجنب بعض

بواسطة : watani بتاريخ : 7:03 ص

شرح كيفية وضع اعلانات ادسنس adsense داخل مواضيع بلوجر Blogger فى اعلى او بداية المواضيع او اسفل و اخر المواضيع او فى وسط مشاركات مدونة بلوجر و ايضا طريقة وضع اعلان ادسنس بجانب اعلان اخر جنبا الى جنب

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

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

طرق وضع اعلان ادسنس فوق واسفل و وسط مواضيع بلوجر و وضع اعلانين بجنب بعض

اولا : كيفية وضع اعلانات جوجل ادسنس فى اعلى و اسفل المواضيع

- قم بالذهاب الى قالب مدونتك و لاتنسى اخد نسخة احتياطية منه .
- قم بالبحث فى قالبك عن الكود : او على حسب قالبك
- ستجد يمكن 3 او 4 من تلك الاكواد لذلك عليك التجربة على كل منها .. فى الاغلب يكون الكود 2 او 3
- الان قم بنسخ الكود الخاص بك من منصة ادسنس و يجب عليك تحويله عبر هذا الموقع : google adsense code converter
- بعد ان تقوم بتحويل الكود قم بنسخه ووضعه على حسب اين تريد ظهور الاعلان
-1- ان اردت ظهوره فى اول المواضيع اي فوقهم ضعه فوق الوسم
-2- ان اردت ظهوره فى اخر المواضيع اي تحتهم ضعه اسفل الوسم

ثانيا : كيفية وضع اعلانات جوجل ادسنس فى اي مكان وسط مواضيع بلوجر

1- اولا قم بنسخ هذا الكود

- وضع الكود مكان الكود السابق
- الان كيفية ادراج اعلانات ادسنس داخل المواضيع , عند كتابتك لاي موضع جديد فى مدونتك قم بتحديد مكان وضع الاعلان وسط التدوينة وعلى صفحة HTML لصفحة المشاركة قم فقط بوضع هذا الكود :
- موضع الكود : هو الذي سيظهر مكانه اعلانات ادسنس عند نشر الموضوع الجديد الذي انشاته
2- ان اردت ان يظهر اعلان ادسنس الذي وضعته وسط المواضيع فى الجهة اليمنى او اليسرى
قم بتغير الكود : clear:both بالتالي
- ان ادت الاعلان فى الوسط ان يظهر على اليمين استبدل كود clear:both بهذا الكود : float:right
- ان ادت الاعلان فى الوسط ان يظهر على اليسار استبدل كود clear:both بهذا الكود : float:left

ثالثا : كيفية اظهار اعلانين ادسنس جنبا الى جنبا

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

- و لصقه اما فوق الوسم او اسفله
وقم بوضع اكواد الاعلانات الخاصة بك مكان : الاعلان الاول و الاعلان الثاني
- يمكن التعديل على حجم الجدول بتغيير قيم width='80%
الى هنا انتهنينا من درسنا هذا ارجوا ان ينال اعجابكم كشكر لمجهوداتي من اجلكم ادعمنوا بتشجيعاتكم فى تعليق و لاتنسى مشاركته مع اصدقائك ... تابعونا على صفحاتنا الاجتماعية ليصلك اي جديد عن الدورة وشكـــرا.

شرح بالفيديو حول طرق وضع اعلان ادسنس فوق واسفل و وسط مواضيع بلوجر و وضع اعلانين بجنب بعض

إقرأ المزيد

تابعنا

الثلاثاء، 26 يناير 2016

تعريف ماهو الباك لينك Backlinks ؟

ماهي أهميه الباك لينك Backlinks ؟

ماهي أنواع الباك لينك Backlinks ؟

1 - نوع يسمى دوفولو Do follow :

2- نوع يسمى نو فولو No followed :

اولا : اضاقة روابط الداخلية فى مواضيع موقعك :

ثانيا : العمل بالروابط الخارجية : ومن اهم الطرق التى تضع فيها روابط خارجية

ماهي مضرات عمل الباك لينك Backlinks على موقعك ؟

شرح بالفيديو : حول كيف اجعل موقعي مشهور على محركات البحث عبر عمل روابط الباك لينك Backlinks

الخميس، 21 يناير 2016

- كيفية اضافة كود تاثير على الصور فى مدونة بلوجر

كيفية اضافة صندوق مخفي و منبيثق على مدونة بلوجر

تابع الشرح بالفيديو حول طريقة اضافة تاثيرات على الصور مع جعل صندوق اعجاب فيسبوك مثبث و مخفي على جانب مدونة بلوجر

الجمعة، 15 يناير 2016

1- طريقة اضافة ازرار المشاركة على الصفحات الاجتماعية للفيسبوك و التويتر و جوجل بلس اسفل مواضيع بلوجر

2- طريقة اضافة مواضيع ذات صلة اسفل مواضيع بلوجر

3 - طريقة اضافة ازرار المتابعة على الصفحات الاجتماعية للفيسبوك و التويتر و جوجل بلس مع صندوق الاشتراك فى القائمة البريدية

الثلاثاء، 12 يناير 2016

1 - طريقة منع نسخ مواضيع بلوجر و استناء منطقة يمكن النسخ منها

2 - طريقة منع تحديد نص و تعطيل زر يمين الفارة و منع نسخ عبر اختصار لوحة مفاتيح Ctrl + C فى بلوجر

فيديو : كيفية تعطيل زر يمين الفارة و تحديد نص و Ctrl +C لمنع نسخ و سرقة مواضيع بلوجر

الجمعة، 8 يناير 2016

تابع الفيديو : حول طريقة تثبيث اي اضافة او عنصر على مدونة بلوجر

السبت، 2 يناير 2016

مميزات قالب BMAG :

شرح طريقة التعديل و اضافة الاكواد على قالب بلوجر BMAG

تحميل قالب : BMAG

الثلاثاء، 29 ديسمبر 2015

مميزات اضافة الثلج على مدونة بلوجر

تابع الشرح بالفيديو لطريقة اضافة سكريبت هطول الثلج على مدونة بلوجر

الأحد، 27 ديسمبر 2015

1- مشكل ارشفة محركات البحث لصفحات أرشيف

2 - مشكل ارشفة اقسام و تصنيفات مدونة بلوجر

حل مشكل ارشفة اقسام و ارشيف مدونة بلوجر من طرف محركات البحث

1- حل مشكل ارشفة محركات البحث لصفحات أرشيف ARCHIVES مدونة بلوجر

2 - حل مشكل ارشفة اقسام و تصنيفات LABEL مدونة بلوجر

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

الأحد، 20 ديسمبر 2015

1- اضافة كود لمنع سرقة و نسخ صور المواضيع على بلوجر

2 - اخفاء صور المواضيع من داخل مشاركات يلوجر و اظهارها على الصفحة الرئيسية فقط

شرح بالفيديو حول كيفية منع سرقة الصور من بلوجر وكيفية اخفائها من المواضيع و اظهارها فى الصفحة الرئيسية فقط

السبت، 12 ديسمبر 2015

تابع شرح بالفيديو حول طريقة اضافة gadget جديد فى تخطيط مدونة بلوجر Blogger

الثلاثاء، 8 ديسمبر 2015

من اهم حلول مشاكل بلوجر التى شرحناها على هذه الحلقة

- الطريقة الصحيحة لرفع قالب بلوجر

- طريقة اضافة ايقونات متابعة على الصفحات الاجتماعية

- كيفية اضافة معرف متابعة عبر البريد الالكتروني

- طريقة حذف slider show من قالب بلوجر

- كيفية حذف اضافة ' تدعمه بلوجر'

- كيفية حذف النافبار Navbar blogger او الشريط الخاص بتصماميم الافترضية لبلوجر

الثلاثاء، 24 نوفمبر 2015

مميزات قالب مدونة علوم و تقنيات

شرح التعديل بالفيديو على قالب مدونة علوم و تقنيات

تحميل قالب مدونة علوم و تقنيات من : هنا

الثلاثاء، 17 نوفمبر 2015

طريقة تركيب زر الصعود "scroll to top" و زر النزول "scroll to bottom" فى مدونة بلوجر

شرح بالفيديو حول كيفية تركيب زر الصعود "scroll to top" و زر النزول "scroll to bottom" فى مدونة بلوجر

الأربعاء، 11 نوفمبر 2015

فوائد رفع ملفات CSS و الجافا JavaScript على موقع جوجل درايف Goole Drive

1 - تقليل من حجم قالب بلوجر

2- تسريع تصفح مدونة بلوجر

3 - تسريع فهرسة مواضيعك و رفع قيمة SEO لمدونة بلوجر

4 - استضافة خاصة على جوجل درايف حتى لاتتعرض لتغيير اكواد مدونتك

طريقة رفع ملفات CSS و الجافا JavaScript على موقع جوجل درايف Goole Drive

السبت، 7 نوفمبر 2015

كيف نجعل فيديو اليوتيوب متجاوب مع شاشات الاجهزة فى مواضيع بلوجر

الثلاثاء، 3 نوفمبر 2015

1- اظهار الاضافات و اخفائها على شاشة المحمول المتجاوب للقالب الافترضي لمدونة بلوجر

2 - كيفية برمجة قالب بلوجر عبر اكواد CSS ليصبح متجاوب مع كل شاشات الاجهزة الذكية المحمولة و اللوحية

الجمعة، 30 أكتوبر 2015

اولا : كيفية وضع اعلانات جوجل ادسنس فى اعلى و اسفل المواضيع

ثانيا : كيفية وضع اعلانات جوجل ادسنس فى اي مكان وسط مواضيع بلوجر

ثالثا : كيفية اظهار اعلانين ادسنس جنبا الى جنبا

شرح بالفيديو حول طرق وضع اعلان ادسنس فوق واسفل و وسط مواضيع بلوجر و وضع اعلانين بجنب بعض

أرشيف المدونة الإلكترونية

راسلنا

تابعوني وشكرا