قالب بلوجر أبيض و أخضر Android app

تحميل معاينة

قالب لمدونات بلوجر بعمود على اليسار وثلاثة أعمدة في الأسفل . به قائمة في الاعلى . الاضافات الموجودة فيه :

• مساحة إعلانية بحجم 728x90
•  مواضيع ذات صلة
• أزرار المشاركة الإجتماعية
• قائمة منسدلة

لمشاهدة باقي الاضافات و التعديلات و اعدادات القالب  في الموضوع الأصلي . صورة كاملة للقالب
 

تعريب كن مدون

أدوات آخر التعليقات واكثر المعلقين تفاعلا لنظام DISQUS

لقد تطرقنا مسبقاً عن تفعيل نظام تعليقات DISQUS لكن ما لم نتطرق له هو الأدوات المساعدة في التفاعل مع هذا النظام , لنظام تعليقات بلوجر كثير من الأدوات وأضفنا كثير منها لكن نظام تعليقات DISQUS له أدوات خاصة من برمجة الشركة نفسها بفضل الله قمت بعمل بعض التعديلات على بعضها لتحسينا وستعرض عليكم في هذا الموضوع سنعرض كل آداة وشرح التعامل معها لكن في البداية هناك عامل مشترك بين كل الادوات وهو معرف الموقع كل موقع يضاف الى DISQUS له معرف خاص به أنت من يكتبه عند تسجيل الموقع لكن عموما يمكن أن تحصل عليه بالطريقة التالية قم بالدخول لموقع DISQUS ولوحة التحكم ثم قم بإختيار إسم موقعك وانسخ المعرف كما في الصورة التالية

أول آدة أكثر المعلقين تفاعلاً

قم بوضع الكود التالي في آداة HTML/Java Script

<style>
#topcommenters {
  text-align: right;
  padding: 10px;
  background: #fff;
  border: 2px solid #bbb;
  border-radius: 10px;
}
#topcommenters ul {text-align: right;}
#topcommenters img {float: right;padding: 0 5px;}

li.dsq-widget-item:hover{background:#E1F4FE;}
</style>
<div id="topcommenters" class="dsq-widget">
<script type="text/javascript" src="http://cnmu.disqus.com/top_commenters_widget.js?num_items=5&hide_mods=1&hide_avatars=0&avatar_size=48"></script>
</div>

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

هذا اللون #fff  هو لون خلفية الآداة

وهذا لون الإطار #bbb

هذا اللون الذي يظهر عند تمرير الماوس #E1F4FE

قم بتغير الرقم 0 الى 1 إن أردت إخفاء صور المعلقين

الرقم 5 هو عدد المعلقين الظاهرين

الرقم 48 هو حجم الصور يمكنك تصغيرها بوضع الرقم 32

الرقم 1 غيره الى 0 إن أردت أن تظهر تعليقات المدير في الآداة

وطبعا إستبدل cnmu بمعرف مدونتك في DISQUS

ثاني آداة آخر التعليقات

نفس طريقة التركيب

<style>
#recentcomments {
  text-align: right;
  padding: 10px;
  background: #fff;
  border: 2px solid #bbb;
  border-radius: 10px;
}
#recentcomments ul {text-align: right;}
#recentcomments img {float: right;padding: 0 5px;}

li.dsq-widget-item:hover{background:#E1F4FE;}
</style>
<div id="recentcomments" class="dsq-widget">
<script type="text/javascript" src="http://cnmu.disqus.com/recent_comments_widget.js?num_items=5&hide_avatars=0&avatar_size=48&excerpt_length=100&hide_mods=1"></script>
</div>

والتنسيق بنفس الطريقة هناك إختلاف واحد فقط وهو الرقم 100

قم بزيادته او إنقاصه فهو عدد الاحرف التي تظهر من التعليقات

الآداة الثالثة التبويبات المجمعة

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

<style>
#dsq-combo-widget.blue #dsq-combo-content .dsq-combo-box {border: 1px solid #bbb;}
#dsq-combo-widget.blue #dsq-combo-tabs li{border:1px solid #bbb; border-bottom:0;}
#dsq-combo-widget.blue #dsq-combo-tabs li{border:1px solid #bbb; border-bottom:0;}
#dsq-combo-widget.blue #dsq-combo-tabs li{border:1px solid #bbb; border-bottom:0;}
</style>
<script type="text/javascript" src="http://cnmu.disqus.com/combination_widget.js?num_items=5&hide_mods=1&color=blue&default_tab=people&excerpt_length=30"></script>

تنسيق هذه الآداة مختلف قليلاً

اللون الأحمر هو لون الإطار إستبدله في الأربع مرات

أما كلمة blue هي لون الآداة وهي تأتي بخمس الوان اختر ما يناسبك منهم فقط انسخ كلمة اللون الذي تريد واستبدلها باللون الموجود

هذه هي الخمس الوان

 blue grey green red orange

 اختلاف أخر وهو كلمة people

وهي تخص تبويب المعلقين الأكثر تفاعلاً وهو التبويب الاساسي الذي ستظهره الآداة عند دخول الموقع إن اردت اختيار تبويب آخر

يمكن إستبدال الكلمة بكلمة recent إن أردت تبوبي آخر التعليقات أن يصبح الأساسي

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

وباقي التنسيق بنفس الطريقة

الرقم 5 هو عدد المعلقين والتعليقات الظاهرين

الرقم 1 غيره الى 0 إن أردت أن تظهر تعليقات المدير في الآداة
وفقكم الله جميعاً
تحياتي

القالب المميز أندرويد آب Android App Blogger Template

قالب أندرويد آب Android App Blogger Template من القوالب المميزة ذات الشكل الجذاب وايضا خفيف وصديق لمحركات البحث تتكون بنية الرسائل في القالب الى عمودين وهو ما يجعله عملي لمدونات البرامج والتقنية او المدونات الإخبارية وطبعا سيكون مميز للمدونات الخاصة بتطبيقات أندرويد فهو أساسا صمم لهذا الأمر تم تعريب وضبط القالب وتلافي الأخطاء البرمجية في النسخة الاجنبية ومن ضمن تلك الأخاطء تفاوت الحجم بين الرسائل وهذا الخطأ تم إصلاحه بفضل الله وهناك أخطاء أخرى وطبيعا يمكنك النظر لعاينة القالب والتحميل عبر الروابط التالية

معاينة     تحميل

الإضافات التي يحتوي عليها القالب

يحتوي القالب على مساحة إعلانية أفقية بحجم 728x90 

يحتوي على إضافة مواضيع ذات صلة

يحتوي على أزرار المشاركة الإجتماعية

مركب به نظام التعليقات التفاعلية

يحتوي على أربع أعمدة في الفوتر

يحتوي على أزرار متابعة إجتماعية يمكنك إستبدال اكوادها

<div class='social-box'>
 <a href='http://www.facebook.com'><img border='0' height='48' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSJ5pryCp9PRVdd2Q95RLOPP89V4O0mlqjL1MQBLwjBBy5g206kdqzdjnMDJj2LKjs9Glor3p7-XJyRwbWiG9UHSCdVJjuDYRq0hM3ThDHd605e77Npv5cLNjwm_gubLlk6T7CcQiVsWI/s48/facebook.png' width='48'/></a>

<div class='social-box'>
 <a href='http://twitter.com/'><img border='0' height='48' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmltaU8QCi-E3qkEKV3OPWq60RTwoUzHzu1G0Af955z_jJEh2J8CTDn0ZoyviDMJuP17IrlXCdQiDopij4RnFLqu4nAH_PcOdP6wiGAHJzCcn2z7pZH2jJqdvEuSyP_cH-cb1oxJ_G8S0/s48/twitter.png' width='48'/></a>

إستبدل الرابط الأزرق برابط صفحتك على الفيس بوك
والاحمر برابط حساب تويتر الخاص بك

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

<div id='navigation'>
 <ul class='menu' id='menu-main'>
 <li><a expr:href='data:blog.homepageUrl'>الرئيسية</a></li>
 <li><a href='#'>تعديل</a></li>
 <li><a href='#'>تعديل</a></li>
 <li><a href='#'>تعديل</a></li>
 <li><a href='#'>تعديل</a></li>
 <li><a href='#'>تعديل</a></li>
 <li><a href='#'>قائمة فرعية</a>
<ul class='sub-menu'>
 <li><a href='#'>تعديل</a></li>
 <li><a href='#'>تعديل</a></li>
 <li><a href='#'>تعديل</a></li>
 <li><a href='#'>تعديل</a></li>
 <li><a href='#'>تعديل</a></li>
</ul>
</li>
 <li><a href='#'>قائمة فرعبة 2</a>
<ul class='sub-menu'>
 <li><a href='#'>تعديل</a></li>
 <li><a href='#'>تعديل</a></li>
 <li><a href='#'>تعديل</a></li>
 <li><a href='#'>تعديل</a></li>
</ul>
</li>
</ul>
</div>

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

تنسيق آداة شريط الفديو في بلوجر

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

معاينة

أولا نقوم بتركيف الإضافة والدخول لصفحة الإضافات وإختيارها ويمكن تنسيقها بإضافة أسم قناتك او كلمات دلائلية كما تحب

والآن مع طريقة التنسيق

ندخل الى تحرير القالب نقوم بتوسيع عناصر الستايل بالضغط على السهم المخصص لذلك

ثم فوق الوسم ]]></b:skin> نضيف الكود التالي

.videoBar-container {float:right;}
div.resultDiv_gsvb {
  background:transparent;
  border:0;
  height: 100px;
  margin-bottom: 5px;
  text-align: center;
  width: 130px;
margin-right:10px;
}

div.resultDiv_gsvb img {
  cursor: pointer;
  display: inline;
  height: 90px;
  width: 120px;
border:3px solid #fff;
outline:1px solid #000;
}

div.resultDiv_gsvb img:hover {
border: 3px solid #C53E08;
outline: 1px solid #F90004;
transition: all 0.9s ease 0s;}

table.resultTable_gsvb {width:300px;}
table.gsc-branding, table.gcsc-branding{display:none}

.videoBar-container {float:right;}
table.resultTable_gsvb td {float:right; padding:0;}

الأرقام المعلمة باللون الأزرق هي عرض صورة الفديو ويجب ان يتم تغييرها بنفس القيم يعني ان زدت الأول 5 تزيد الآخر 5

والأرقام المعلمة بالأحمر هي طول صورة الفديو وتعامل بنفس الطريقة

هاذين اللونين هما الوان حدود والإطار الخارجي للصورة

#fff

 #000

اما هاذين فهما نفس الشئ الحدود والإطار الخارجي ولكن عند تمرير الماوس

#C53E08

#F90004

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

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

حصرياً تعلم أسهل طريقة لتصميم سكويز بيج

 ما هي سكويز بيج Squeeze Page ؟

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

 يمكن معاينة سكويز بيج من هنا

كيفية تصميم سكويز بيج ؟

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

الخطوات بإختصار

أنشئ مدونة جديدة

قم بتركيب القالب

قم بعمل موضوع واحد تكتب فيه ما تريد فتصبح السكويز بيج جاهزة

حمل القالب من هنا

هذا القالب ستركبه بالطريقة التالية

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

تعديلات القالب

هناك تعديلات يمكن عملها على القالب تخص الألوان بحيث تجعل السكويز بيج باللون الذي يناسب

وهي كالتالي

 body {background:#fff;font-size:30px;}

اللون المحدد هو لون خلفية القالب

.post {background:#E2E2E2;

 اللون المحدد هو لون خلفية الموضوع

border:8px solid #000;

أما هذا هو لون الإطار الخارجي

غيرهم بالألوان المناسبة لك وبالتوفيق للجميع

وطبعاً انوه على حفظ حقوق القالب

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

قالب بلوجر معرب New Focus Point

تحميل معاينة

قالب خاص بمدونات بلوجر بعمود على اليسار . بلون أبيض . به قائمة في الاعلى و أربعة أعمدة في الأسفل . الاضافات الموجودة فيه :

• عرض الصور بتقنية الـ lightbox
• زر الاعجاب الخاص بفيسبوك
• تمييز تعليقات صاحب المدونة
•  خاصية الرد على التعليق

لمشاهدة باقي الاضافات و التعديلات و اعدادات القالب  في الموضوع الأصلي . صورة كاملة للقالب
 

تعريب و تطوير أسماء أم نضال

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