مساحة إعلانية

الأربعاء، 2 يوليو، 2014

الأربعاء، 2 يوليو، 2014

مواضيع ذات صلة مع ملخصات

Related Posts with Thumbnails and Summary
عرضنا اكثر من موضوع حول إضافة مواضيع ذات صلة وكل واحده تختلف وتتميز عن الأخرى واضافتنا هذه أكثر ما يميزها هي الملخصات فقليل من إضافات مواضيع ذات صلة تسمح بعرض الملخصات إضافة الى مظهرها المميز والعملي وطبعا سيتم شرح كيفية تنسيقها بالألوان التي تناسب قالبك وايضاً طريقة الإختيار بين طريقة العرض والتقسيم ويمكنك معاينة الإضافة من الرابط التالي

تركيب الإضافة الكود الأول

أضف هذا الكود فوق الوسم </head>
<script type='text/javascript'>
//<![CDATA[
/*Related Post*/
var relnojudul = 0;
var numpost = 4;
var numchars = 88;
//]]>
</script>
<script src='https://cnmu.googlecode.com/svn/trunk/2014/Related-summ.js'/>
مع مراعاة ان الرقم 4 هو عدد المواضيع
والرقم 88 هو طول احرف الملخص

تركيب الإضافة الكود الثاني

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related_posts'>
          <h4>مواضيع ذات صلة</h4>
          <b:loop values='data:post.labels' var='label'>
               <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=relpostimgcuplik&amp;max-results=50&quot;' type='text/javascript'/>
          </b:loop>
          <ul id='relpost_img_sum'>
               <script type='text/javascript'>artikelterkait();</script>
          </ul>
<div style='clear: both;'/>
</div>
</b:if>
أضف الكود السابق بعد أحد الاكواد التالية
<div class='post-footer'>
<div class='post-footer-line post-footer-line-1'>
<div class='post-footer-line post-footer-line-2'>

تركيب الإضافة الكود الثالث مرحلة التنسيق

أضف الكود التالي فوق الوسم]]></b:skin>
/*Related cnmu.blogspot.com Posts*/
#related_posts {
  display: block;
  padding: 0 5px 5px;
  width: 100%;
}
#related_posts h4 {
  background: #777;
  color: #FFFFFF;
  display: block;
  font: bold 18px tahoma;
  margin: 5px -15px 10px -5px;
  padding:10px;
  position: relative;
}
#related_posts ul {
  margin-right: -50px;
  width: 102%;
}
#related_posts li {
  background:#eee;
  border: 1px solid #bbb;
  display: block;
  float: right;
  line-height: 1.4em;
  list-style: none outside none;
  margin: 0 10px 10px 0;
  max-height: 80px;
  min-height: 80px;
  padding: 3px;
  width: 46%;
  transition: all 0.8s ease 0s;
}
#related_posts li:hover {background:#ddd;}
#related_posts li a {
  display: block;
}
#related_posts span {
  font-size: 12px;
}
ul#relpost_img_sum li img {
  background:#fff;
  border: 1px solid #777;
  float: right;
  height: 60px;
  margin-left: 5px;
  padding: 2px;
  width: 60px;
 هذا #777 هو لون خلفية كلمة مواضيع ذات صلة
وهذا #FFFFFF هو لون الكلمة
هذا #eee هو لون خلفية المواضيع
هذا #bbb هو لون الإطار
أما الرقم 46% هو مقاس الموضوعات ان جعلته أ:ثر مثلا 90% أو 100% سيصبح في كل سطر موضوع واحد وليس مقسم
وان صغرته مثلاً لـ 29% سيصبح في السطر ثلاث مواضيع
هذا #ddd هو لون خلفية المواضيع عند تمرير الماوس
هذا #fff لون خلفية الصور
وهذا #777 لون اطار الصور
 أما الرقم 60 والمتكرر مرتين هو عرض وارتفاع الصور
في حالة وجدت الإضافة مزاحة لليمين قم بتقليل هذا الرقم -50  او اجعله 0 
هذه اكثر النقاط أهمية في التنسيق ويمكنك بقليل من الدراية بالـ CSS أن تغير الكثير بمظهر الإضافة
دمتم في امان الله
 

هناك 58 تعليقًا:

  1. شرح واضافة اكثر من رائع كل عام اونت بخير

    ردحذف
    الردود
    1. وأنت بخير أخي الحبيب أحمد ربي يبارك فيك يا طيب
      =r

      حذف
  2. =q شكرا أخي مصطفى على الإضافة الجميلة , و لكن كيف يمكنني إضافة الأيقونات قبل عناوين الإضافات مثل مدونتك ؟؟

    ردحذف
    الردود
    1. قم أخي بإستبدال هذا الكود
      #related_posts h4 {
      background: #777;
      color: #FFFFFF;
      display: block;
      font: bold 18px tahoma;
      margin: 5px -15px 10px -5px;
      padding:10px;
      position: relative;
      }
      بهذا
      #related_posts h4 {
      background: url("https://lh6.googleusercontent.com/-SBbfNyje7jI/Uxu0ReQBcFI/AAAAAAAADhs/etPbFr-wfmk/s1444/bigic.png") no-repeat scroll 100% 10px #0062C4;
      color: #FFFFFF;
      display: block;
      font: bold 16px droid arabic kufi;
      margin: 5px -15px 10px -5px;
      padding: 10px 50px 10px 10px;
      position: relative;
      }
      وان اردت تغيير الأيقونه غير هذا الرابط
      https://lh6.googleusercontent.com/-SBbfNyje7jI/Uxu0ReQBcFI/AAAAAAAADhs/etPbFr-wfmk/s1444/bigic.png
      وهذا يخص اللون
      #0062C4

      حذف
  3. شكرا اخى عمرو على الاضافة وتم تصميم القالب الخاص بمدونتى شبه مدونتك وارجو المراجع عن القالب واذا تم اى خط ارجو الابلغ بيها كل عام اونت بخير
    http://bilokr.blogspot.com

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

      حذف
    2. شكرا يا اخ عمرو على ردك السريع
      اما بعد انا لا انقل موضوع من مدونتك ام عن هذا القالب فقض احببت القالب الخاص بيك ولا يجوز اى سرقه بل اعجبنى وهذا لا يوجد اى شياء الى ان يكون القالب من حقق مع حزف حقوق الملكيه اسفه جداا اخى ولو اعرف ان هذا القالب يزعجج كونت اود ان لا اريد القالب منع للزعل والاحراج واسفه جدا اما عن الموضوع الزاى تتكلم عنه وهو نقل الموضوع بدون زكر المصدر انا لا انقل منك اى موضو اما الموضوع المتاشبه هو الموضوع التالى وارجو التركيز فى الموضوع هو الموضوع ذات صله بس مش بنفس تصميمك ارجو اتباع الموضوع جديد http://bilokr.blogspot.com/2014/07/2015.html تحياتى

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

      حذف
  4. يعطيك العافية اخي عمرو موضوع اكثر من رائع

    و كل سنة و انت طيب

    ردحذف
    الردود
    1. ربي يحفظك أخي وكل عام وانت بخير يا طيب

      حذف
  5. السلام عليكم اخي عمرو كل عام وانت بخير رمضان كريم
    انا عاوز اضع المواضيع ذات صلة اسف الخط الفاصل بين الموضوع وتعليقات
    مع تذكير مدونة بوزوم

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

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

    ردحذف
    الردود
    1. ان كنت تقصد الأيقونة
      فستجد كودها بالشكل التالي
      url("https://lh6.googleusercontent.com/-SBbfNyje7jI/Uxu0ReQBcFI/AAAAAAAADhs/etPbFr-wfmk/s1444/bigic.png") no-repeat scroll 100% 10px #007CDD
      قم بتعديل 100% الى رقم بالبكسل مثل 600px وقم بالزيادة والنقصان بحسب ما تريد
      أما لو تقصد الخلفية بأكملها
      فلديك margin: 5px -15px 10px -5px;
      قم بتعديل رقم -15 و -5 حتى يضبط معك

      حذف
    2. شكرا اخي عمرو تقبل تحياتي

      حذف
  7. السلام عليكم ورحمة الله وبركاته وكل عام وانتم بخير
    اخى الحبيب ما شاء الله على مدونتك نسال الله ان يبارك
    وجد فى مدونتك كل ما احتاجه لكن للاسف كلما حاولت ان اركب الاكواد لا تفلح معى ولا تظهر النتيجة
    المشكلة عندى لكن لا اعرف ما الحل
    للعلم هذه أول تصميم لى فى المدونة مع انى أتقن لغة php
    نرجوا الافاده
    والسلام عليكم

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

      حذف
  8. السلام عليكم اخي
    في البداية اشكرك على مواضيعك الرائعة
    انا لدي مشكة هي اي كود اضيفه في القالب يضهر لي هذا الخطأ
    More than one widget was found with id: HTML2. Widget IDs should be unique.
    وارجوا منك المساعدة

    ردحذف
    الردود
    1. وعليكم السلام ورحمة الله وبركاته
      أهلا بك أخي الكريم
      الواضح من الرسالة التنبيهية هي ان لديك اضافتين يحملان نفس المعرف
      يعني لديك اضافة معرفها HTML2 وأنت تحاول اضافة آداة بها نفس الإسم التعريفي HTML2
      غير المعرف لـ 3 أو 4 أو 11 أو اى رقم يضبط معك

      حذف
    2. شكراً لك ياطيب لقد تم حل المشكلة ...
      انا احببت مدونتك الرائعه .. واريد ان اعمل لك اعلان لها في مدونتي ...
      اعطني رابط وصوره مدونتك ... لأضعها في مدونتي وهذا رابط مدونتي يمكك ان تراها
      http://tagem3.blogspot.fr/

      حذف
    3. اشكرك أخي الكريم على هذا الدعم
      وهذا رابط صفحة البنرات الإعلانية
      http://cnmu.blogspot.com/p/blog-page_11.html
      ------------------------------------
      ملاحظة بخصوص نشرك رابط مدونتك بنطاق fr
      راجع هذا الموضوع سيفيدك وبالتوفيق
      http://cnmu.blogspot.com/2013/01/alexa.html

      حذف
  9. السلام عليكم
    رمضان كريم وكل عام وانت بخير عمرو

    شكرا لك يا غالي على الإضافة الأكثر من رائعة , لاكن هل يمكن جعل الصور تظهر حتى لو لم يتم تحميلها على موقع بيكاسا ؟

    وشكرا لك على ابداعك

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

      حذف
  10. السلام عليكم
    اخي عمرو انا اضفت هذه الإضافة الرائععة الي قالب قيد التطوير ولكن بها مشكلة
    معاينة http://qaalbe.blogspot.com/
    ارجو الحل وشكرا

    ردحذف
    الردود
    1. وعليكم السلام ورحمة الله وبركاته
      أخي محمد ابحث عن هذا الكود #related_posts ul {
      بعده ستجد الجزء التالي احذف الجزء
      margin-right: -50px;
      أما بالنسبة لخروج الكلمات عن مساحة المواضيع يمكنك تقليل عدد كلمات الملخص بقليل الرقم 88 كما هو موضح بالشرح وبالتوفيق

      حذف
  11. اخي عمرو مازالت الكلمات خارج عن المساحة مع العلم اني لم اجد الرقم 88 ولكمني وجدت 80 متكررة مرتان وقمت
    بتقليلها وزيادتها ولم تفلح

    ردحذف
    الردود
    1. أخي محمد الرقم 88 موجود في الكود الاول وليس كود الستايل راجع اول كود بالموضوع

      حذف
  12. السلام عليكم و رحمة الله
    اخي عمرو لم استطع اضافة هذه الاضافة الى مدونتي و اضن ان المشكلة في القالب هذه مدونتي http://i-can213.blogspot.com/
    اذا امكن تشوفلي حل بارك الله فيك اخي

    ردحذف
    الردود
    1. وعليكم السلام ورحمة الله وبركاته
      جرب اخي الكريم أن تركبها مرة ثانية وجرب ان تضيف الكود الثاني فوق هذا الكود او كود ستجده يشبهه
      <div class="postmeta-secondary">
      ان لم ينفع جرب على قالب آخر ان عملت على القالب الآخر فكما قلت المشكلة ستكون من القالب استخدم قالب آخر
      وبالتوفيق

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

    ردحذف
    الردود
    1. أخي في إضافة خيارات التنقل ستجد أسفل هذا الجزء .cnmu-pager
      margin-bottom: 20px;
      استبدله بهذا
      margin-bottom: 20px !important;
      مع العلم ان الرقم 20 هو الفرق يمكنك زيادته او انقاصه

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

    ردحذف
    الردود
    1. وعليكم السلام ورحمة الله وبركاته
      راجع هذا الموضوع أخي لعله ما تريد
      http://cnmu.blogspot.com/2013/12/related-posts.html

      حذف
  15. تم تركيب الاضافة ولكنها لا تعمل الا اذا اضفت ( www ) قبل الرابط وان ادخلت الرابط بدونها لا تظهر
    رابط المعاينة : http://tqmap.blogspot.com

    ردحذف
    الردود
    1. ما علاقة الرابط اخي بالاضافة ؟

      حذف
    2. لا أعلم لكنى اكتشفت ان السبب ان المواضيع مرتبطة بالقسم فقط لأنى اذا قمت باضافة تدوينة بدون تحديد قسم تظهر الاضافة وعندما اضيف تدوينة تحمل اسم قسم تختفى الاضافة
      وهذا مثال اخر : http://v4eg.blogspot.com

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

      حذف
  16. الاضافه لا تعمل معى يا اخى

    ردحذف
    الردود
    1. ان لم تظهر نهائيا اذا المشكلة في الكود الثاني المكان الذي اضفته به ليس هو المكان الصحيح فاحيانا تكون تلك الاكواد متكررة

      حذف
  17. اخي انا ماطلع الي اسم المواضيع والصور المرجوا المساعدة

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

      حذف
  18. شكرا اك ...تم التركيب والتفعيل بنجاح

    ردحذف
  19. السلام عليكم ورحمة الله وبركاته
    ___
    أخي الكريم بعد التحيه الطيبه أريد فقط معرفة شيئ أريد أعرف أزاي بتخليها نبزة يعني التفاصيل معه رابط الكلمة بمعني أنت لديك الموضوع وتحته مباشر تفاصيل حول الموضوع وشكرا أخي الكريم معه العلم شيئ بسيط مكنتش لاقي الثلاث أكواد ثم بحثت عن هذا الكود : تحته مباشر هذا الكود مواضيع ذات صلة الي هوة رقم 2

    نجح معاية =r
    http://ashb7a.blogspot.com
    =d

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

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

      حذف
    3. وعليكم السلام ورحمة الله وبركاته
      جرب البحث عن الكود التالي واحذفه
      #relpost_img_sum .news-text {
      display: none;
      }

      حذف
  20. جزاكم الله خيرا على هذا المجهود الرائع. لقد قمت بالتطبيق لكن يظهر لي بدلا من ملخصات المواضيع شئ كهذا : NORMAL 0 FALSE FALSE FALSE EN-US X-NONE AR-SA . فما هو الحال؟؟؟

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

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

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

      حذف
  22. لا توجد أجزاء منسوخة لدى مواضيعي بفضل الله. و ما معنى الكتابة الافتراضية؟
    آسف على كثرة الاستفسارات

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

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

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

      حذف
  24. جزاكم الله خيرا. أرهقناكم معنا.

    ردحذف

نسعد ونتشرف بتعليقاتكم
لكن هناك شروط يجب اتباعها لضمان نشر التعليقات
1ان يكون التعليق يخص محتوى الموضوع
2ان لا يحتوي التعليق اى روابط دون داعي
3إن أردت إضافة كود حوله اولا بمحول الأكواد
4أن لا يحتوي التعليق اي الفاظ او اساءات لاى احد
5أى سؤال بعيد عن محتوى الموضوع يرجى استخدام ركن الأسئلة

جميع الحقوق محفوظة لــ كن مدون 2013-2015 ©