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

ملاحظة : المرجوا عدم حذف حقوق التصميم والتعريب جزاكم الله ألف خير.

 تحميل القالب            معاينة القالب

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

Résuméabuiyad

 قامت بلوجر اليوم بإطلاق 5 قوالب ديناميكية جديدة تعتمد بالأساس على اللغة البرمجية AJAX, CSS3, HTML5 و مما يؤكد عزم إدارة بلوجر على التطوير من خصائصها ،ما عليك سوى كتابة رابط مدونتك على هذا الشكل http://www.abu-iyad.com/view  ومن تم إختيار نوع القالب الذي تريد.

ولعمل هذه الإضافة على مدونتك يجب توفر 3 شروط أساسية .
1.يجب أن تكون مدونتك الإلكترونية مفتوحة لكافة القراء بشكل افتراضي.

• وذلك من "إعدادات" ثم "سماحات" ثم وضع علامة (نقطة) في الإختيار "أي شخص"

2.يجب أن تكون تغذية رسائل المدونة الإلكترونية على الإختيار "كامل".أو "حتى الفاصل"

•  وذلك من "إعدادات" ثم "تغذية الموقع" من خيار السماح بمواجز المدونة اختر " كامل " أو "حتى الفاصل"

3.  .يجب أن تكون تمكين طرق العرض الديناميكية على الإختيار "نعم".

•   وذلك من "إعدادات" ثم "التنسيق" من خيار تمكين طرق العرض الديناميكية اختر"نعم"

وهذه نمادج للقوالب 5 الجديدة ، يمكنك كذلك تصفحها مباشرة من الموضوع  .


القالب1 :   إضغط على الصورة لمعاينة القالب FLIPCARD

القالب2 :  إضغط على الصورة لمعاينة القالب MOSAIC

 القالب3 :  إضغط على الصورة لمعاينة القالب SIDEBAR

القالب4 : SNAPSHOT إضغط على الصورة لمعاينة القالب

القالب5  : إضغط على الصورة لمعاينة القالب  TIMESLIDE

إذا سارعوا في إكتشاف مدوناتكم بتصميم القوالب الجديدة ،وبالتوفيق للجميع.

Résuméabuiyad

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

ولأول مرة سوف أقوم بشرح هذه الطريقة بالفيديو والتي سوف أظهر فيها كيفية تحديدي للمدونات الخاصة بي والتي إريد إظهارها وإخفاء المدونات الأخرى,(لمشاهدة الفيديو إضغط على الصورة أسفله  )
1.مدونة أبو إياد
2.مدونة Comment Fabriquer
3.مدونة Couches Bebe

أتمنى أن تتركو إنطباعاتكم وآرائكم حول الفيديو لأن آراءكم تهمنا ،بالتوفيق للجميع

Résuméabuiyad

السلام عليكم ورحمة الله تعالى وبركاته ، مرحبا بكم أحباءنا الكرام في تدوينة جديدة بعد هذا الغياب عن تقديم كل ما هو جديد في عالم التدوين ،تلقيت عدة رسائل تسألني عن طريقة تركيب خاصية الصور المنبثقة Jquery Lightbox والآن أتيت لكم بالجديد ،فكثير منكم من قام بتطبيق العديد من المحاولات لهذه الإضافة في مدونته لكن بدون فائدة وما يزيد الطين بلة هو يجب تعديل كودHTML  لكل صورة علي حدة ووضع الجملة rel="lightbox" title="Your image Caption"  بعد الوسم" a>" الذي يخص الصورة ،أما الآن مع الخاصية الجديدة التي أتيت لكم بها  تقوم بتفعيل الصور المنبثقة لجميع الصور التي تحتوي عليها المدونة بصفة تلقائية ولا داعي لإضافة أي شيء على كود الصورة ,ولمعاينة هذه الإضافة قم بالضغط على الصورة أسفله .

والآن بعد أن قمت بمعاينة الإضافة سوف نتوجه إلى التطبيق على المدونة ما عليك سوى البحث عن الوسم :

</body>

ثم قم بلصق الكود التالي قبله مباشرة :

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/>
<style type='text/css'>
    /* jQuery lightBox plugin - Gallery style */
    #gallery {
        background-color: #444;
        padding: 10px;
        width: 520px;
    }
    #gallery ul { list-style: none; }
    #gallery ul li { display: inline; }
    #gallery ul img {
        border: 5px solid #3e3e3e;
        border-width: 5px 5px 20px;
    }
    #gallery ul a:hover img {
        border: 5px solid #fff;
        border-width: 5px 5px 20px;
        color: #fff;
    }
    #gallery ul a:hover { color: #fff; }
    </style>
<script src='http://lightboxabuiyad.googlecode.com/svn/jquery.lightbox-0.4.js' type='text/javascript'/>
<link href='http://dinhquanghuy.110mb.com/lightbox/jquery.lightbox-0.5.css' media='screen' rel='stylesheet' type='text/css'/>
<script type='text/javascript'>
$(function() {
$(&#39;a[href$=jpg], a[href$=JPG], a[href$=jpeg], a[href$=JPEG], a[href$=png], a[href$=gif], a[href$=bmp]:has(img)&#39;).lightBox();
});
</script>

هل ترون كم الأمر بسيط ،ومبروك عليكم جميعا مع متمنياتي لكم بمتابعة ممتعة  .

Résuméabuiyad

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

معلومات عن القالب :

• إسم القالب الأصلي :convergence
• تم تحويله من وورد بريس إلى بلوجر
• تطوير وتعريب القالب  : أبو إياد

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

• قالب  مميز و بسيط في شكله لكنه قوي  ويدعم خصائص عدة منها:
•  مناسب لعرض الفيديو والصور
•  صديق لمحركات البحث حيث يدعم Meta Tag كاملة
•  عرض الصويرات على الرئيسية مع خاصية" إقرأ المزيد" التلقائية
•  مناسب لعرض الوصلات الإشهارية كأدسنس Google Adsense ...
• لون الخلفية هاديء وخفيف على رؤية العين  .
• يدعم خاصية التدوين المصغر .
• يدعم خاصية تحريك الصور بشكل مائل .
• يضم خاصية Ifram .
• يحتوي على 3 أعمدة في أسفل القالب
•  و الكثير من المميزات الهامة ...

الإضافات والأدوات :

• إضافة إقرأ المزيد التلقائية
• الأزرار الإجتماعية فيسبوك ،تويتر والخلاصات
• ترقيم الصفحات
• مواضيع ذات صلة
• إضافة إخفاء وإظهار التعليقات
• إضافة السمايلات على التعليقات
• إضافة تعريف كاتب الموضوع " بقلم فلان"
• إضافة زر الرد على التعليقات
• حذف خاصية " إقرأ المزيد من الصفحات الثابتة 
• خاصية الروابط التلقائية
• فتح جميع الروابط الخارجية في صفحة جديدة 
• أيقونة Favicon 

• تعديل الميتا تاج

توجه إلى صفحة تحرير Html و في أعلى محرر القالب ستجد الأكواد الآتية، عدل ما أشير إلى إمكانية تعديله وفق بيانات مدونتك ثم احفظ قالبك.

 <head>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta content='ضع هنا وصف المدونة' name='description'/>
<meta content='ضع هنا الكلمات الدلالية بين كل كلمة فاصلة ' name='keywords'/>
<meta content='10 days' name='revisit'/>
<meta content='10 days' name='revisit-after'/>
<meta content='document' name='resource-type'/>
<meta content='all' name='audience'/>
<meta content='general' name='rating'/>
<meta content='all' name='robots'/>
<meta content='index, follow' name='robots'/>
<meta content='أبو إياد' name='author'/>
<meta content='ar' name='language'/>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:blog.pageName + data:blog.title' name='Description'/>
<meta expr:content='data:blog.pageName + data:blog.title' name='Keywords'/>
</b:if>
    <b:include data='blog' name='all-head-content'/>
    <b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.title/> |ضع هنا وصف مختصر للمدونة 4 أو 5 كلمات </title>
<b:else/>
<title><data:blog.pageName/> | <data:blog.title/></title>
</b:if>

الآن سوف نتطرق للأشياء  يجب عملها بعد رفع القالب على مدونتك
1.تغير صورة الهيدر .
2.تغيير التسميات والروابط للقائمة الأفقية العلوية (التي توجد في الشريط الأزرق)
3.تغيير روابط الأزرار الإجتماعية (التي توجد في الشريط الأزرق)
4.تغيير التسميات والروابط للقائمة الأفقية الرئيسية

 1.1لتغيير صورة الهيدر قم بالبحث عن الرابط التالي ثم قم بإستبداله برابط صورة الهيدر الخاص بك

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhH-P-4Sg2AykpXR747UAr9zcDXGXbesH1az1DuXS8TIBSJS-x7g_C0-dMZcRZnYMwqdSxmEchfh4yqMy-AKhEeDPqgqfLD18U4UYBVmQqfge2jgnz3dr1CTV5INQhChdQ89YJBksucAzYE/s1600/logo+abuiyad.png

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

<div class='topnav'>
<div class='menu-top-menu-container'>
<ul class='menu' id='menu-top-menu'>
<li><a href='http://www.abu-iyad.com/'>الرئيسية </a></li>
<li><a href='http://www.abu-iyad.com/p/sitmap.html'>الفهرس</a></li>

<li><a href='http://www.abu-iyad.com/feeds/comments/default?alt=rss'>خلاصات التعليقات</a></li>

<li><a href='http://feeds.feedburner.com/feedburner/simo'>خلاصات المواضيع</a></li>

<li><a href='http://www.abu-iyad.com/2010/09/blog-post_09.html'>الأسئلة المتكررة</a></li>

<li><a href='http://carte-visite-abu-iyad.blogspot.com/'>بطاقة التعريف</a></li>

<li><a href='http://www.abu-iyad.com/p/blog-page_17.html'>إتصل بنا </a></li>

</ul>
</div>           

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

<!-- Social Network Section -->
    <div id='sidebar_social'>
    <ul>
      <li>
               <a href='http://twitter.com/abuiyad007' target='_blank'>
          <img alt='Twitter' src='http://videonoob.fr/wp-content/themes/headlines/images/ico-social-twitter.png'/>
        </a>
      </li>
      <li>
         <a href='http://feeds.feedburner.com/feedburner/simo' target='_blank' title='rss'><img alt='RSS' src='http://img2.savourclub.com/picto/picto_rss.png'/>
 </a>
      </li>
 <li>
<a href='http://www.facebook.com/abuiyad007' target='_blank'>
          <img alt='digg' src='http://img2.savourclub.com/picto/picto_facebook.png'/>
              </a>
      </li>
      <li class='last'>
        <a href='http://delicious.com/chardo007' target='_blank'>
          <img alt='delicious' src='http://www.singlemaltsdirect.com/media/social/delicious.png'/>
</a>
      </li>
    
      <li>
        <a href='http://www.youtube.com/simochardo#p/u' target='_blank'>
          <img alt='Youtube' src='http://www.ufsc.com/images/youtube.png'/>
            </a>
      </li>
      <li>
       </li></ul>
    </div>
    <!-- /Social Network Section -->

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

<!--/header -->
    <div id='nav1'>

<div class='menu-main-menu-container'>

<ul class='sf-menu'>

<li><a href='http://www.abu-iyad.com/'>الرئيسية </a></li>

<li><a href='http://www.abu-iyad.com/2010/07/widget-for-blogger-blogspot.html'>إضافات بلوجر</a></li>

<li><a href='http://www.abu-iyad.com/p/blog-page_16.html'>أرشيف المدونة</a></li>

<li><a href='http://www.abu-iyad.com/2010/09/blog-post_09.html'>الأسئلة المتكررة</a></li>

<li><a href='http://carte-visite-abu-iyad.blogspot.com/'>بطاقة التعريف</a></li>

<li><a href='http://www.abu-iyad.com/p/blog-page_17.html'>إتصل بنا </a></li>

</ul></div>           
    </div>
    <!--/nav1-->

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

<b:if cond='data:blog.pageType == &quot;item&quot;'>
 <b:if cond='data:post.author == &quot;إسم الكاتب &quot;'>
<div class='postauthor'>
   <img alt='' height='80' src='https://sites.google.com/site/lightbox007/photo/readby.jpg' width='80'/>
   <h3>بقلم <a href='http://www.abu-iyad.com/'> إسم الكاتب </a></h3>
   <p>

تكتب هنا نبذة تعريفية عنك

</p>
 </div>
</b:if>
<!-- تعريف الكاتب الثاني -->
<b:if cond='data:post.author == &quot;إسم الكاتب 2&quot;'>
<div class='postauthor'>
   <img alt='' height='80' src='https://sites.google.com/site/lightbox007/photo/zakir.JPG' width='80'/>
   <h3>بقلم <a href='http://xxxxxxx.blogspot.com'> إسم الكاتب الثاني</a></h3>
   <p>

تكتب هنا نبذة تعريفية عن ا لكاتب الثاني

</p>
 </div>
</b:if>
</b:if>

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

<div class='partagerAbonnement'>
   <h3>إذا أعجبك الموضوع &#1548;شاركه مع أصدقائك</h3>
    <ul>
      <li class='partagerEmail'><a href='http://feedburner.google.com/fb/a/mailverify?uri=feedburner/simo' rel='nofollow' target='_blank'>توصل بالمواضيع الجديدة عبر بريدك الإلكتروني</a></li>
      <li class='partagerRSS'><a href='http://feeds.feedburner.com/feedburner/simo' rel='nofollow' target='_blank'> إشترك عبر الخلاصات RSS</a> </li>
      <li class='partagerTwitter'><a href='http://twitter.com/abuiyad007' rel='nofollow' target='_blank'>تابعني  على التويتر</a></li>

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

 <b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == &quot;true&quot;'>
<b:if cond='data:label.name != &quot;مصغرات تدوينية&quot;'>


( تم تحميل القالب : مرة )

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

إذا كانت هناك أسئلة حول القالب ،المرجوا ترك تعليقاتكم للإجابة عليها في أقرب وقت ،أتمنى لكم التوفيق

Résuméabuiyad

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

عند تحديدك للون سوف يلزمك نسخ الكود الخاص به من البرنامج ،لذلك يجب الضغط على زر  التثبيت الذي يمكنك إختياره من الزر Touche  ثم إختر الزر الذي تريد من F2 حتى الزرF12 ،فمثلا إذا إخترت F2،قم بالضغط على الزر  F2من لوحة مفاتيح جهازك لتثبيت الكود  ولمعاودة تشغيل البرنامج مرة ،أخرى إضغط علي الزر Remise à Zero الموجودة تحت اللون في الإطار المربع.

لتحميل البرنامج 

أتمنى أن تستفيدو من هذا البرنامج رغم بساطته ،لكنه تختصر عليك الكثير من الوقت والجهد

Résuméabuiyad