السبت، 5 يوليو 2014
السلام عليكم ورحمة الله و بركاته "رمضان كريم"
تعتبر الإضافة المسمات "مواضيع ذات صلة" أو"مواضيع مشابهة" من بين الإضافات التي تضمن لك بقاء الزائر أكبر وقت ممكن بمدونتك شأنها شأن المشاركات الشائعة فمن عندما يتصفح أحد المواضيع إلى نهايته تجعله هذه الإضافة التي يكون موقعها أسفل التدوينة ينتقل إلى موضوع جديد بلا شك وهذا يعتمد على جمالية وتناسق الإضافة و مدى جاذبية العنوان الذي يعتبر من بين أهم الركائز سأشرح في تدوينة أخرى إنشاء الله, واضافتنا هذه أكثر ما يميزها هي الملخصات فقليل من إضافات مواضيع ذات صلة تسمح بعرض الملخصات إضافة الى مظهرها المميز والعملي وطبعا سيتم شرح كيفية تنسيقها بالألوان التي تناسب قالبك وايضاً طريقة الإختيار بين طريقة العرض والتقسيم ننتقل إلى شرح التركيب :
تعتبر الإضافة المسمات "مواضيع ذات صلة" أو"مواضيع مشابهة" من بين الإضافات التي تضمن لك بقاء الزائر أكبر وقت ممكن بمدونتك شأنها شأن المشاركات الشائعة فمن عندما يتصفح أحد المواضيع إلى نهايته تجعله هذه الإضافة التي يكون موقعها أسفل التدوينة ينتقل إلى موضوع جديد بلا شك وهذا يعتمد على جمالية وتناسق الإضافة و مدى جاذبية العنوان الذي يعتبر من بين أهم الركائز سأشرح في تدوينة أخرى إنشاء الله, واضافتنا هذه أكثر ما يميزها هي الملخصات فقليل من إضافات مواضيع ذات صلة تسمح بعرض الملخصات إضافة الى مظهرها المميز والعملي وطبعا سيتم شرح كيفية تنسيقها بالألوان التي تناسب قالبك وايضاً طريقة الإختيار بين طريقة العرض والتقسيم ننتقل إلى شرح التركيب :
أولا نقوم بالبحث عن أحد هذه الأكواد التالية:
<div class='post-footer'>
أو
<div class='post-footer-line post-footer-line-1'>
أو
<div class='post-footer-line post-footer-line-2'>
ثم نضع هذا الكود بعده مباشرة.
<b:if cond='data:blog.pageType == "item"'>
<div id='related_posts'>
<h4>مواضيع ذات صلة</h4>
<b:loop values='data:post.labels' var='label'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=relpostimgcuplik&max-results=50"' type='text/javascript'/>
</b:loop>
<ul id='relpost_img_sum'>
<script type='text/javascript'>artikelterkait();</script>
</ul>
<div style='clear: both;'/>
</div>
</b:if>
نأتي ونبحث أيضا عن الوسم : </head>
ونضيف هذا الكود فوقه هذا الكود:
<script type='text/javascript'>
//<![CDATA[
/*Related Post*/
var relnojudul = 0;
var numpost = 4;
var numchars = 88;
var reljudul=new Array();var relurls=new Array();var relcuplikan=new Array();var relgambar=new Array();function saringtags(g,h){var e=g.split("<");for(var f=0;f<e.length;f++){if(e[f].indexOf(">")!=-1){e[f]=e[f].substring(e[f].indexOf(">")+1,e[f].length)}}e=e.join("");e=e.substring(0,h-1);return e}function relpostimgcuplik(h){for(var e=0;e<h.feed.entry.length;e++){var g=h.feed.entry[e];reljudul[relnojudul]=g.title.$t;postcontent="";if("content" in g){postcontent=g.content.$t}else{if("summary" in g){postcontent=g.summary.$t}}relcuplikan[relnojudul]=saringtags(postcontent,numchars);if("media$thumbnail" in g){postimg=g.media$thumbnail.url}else{postimg="http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s1600/grey.GIF"}relgambar[relnojudul]=postimg;for(var f=0;f<g.link.length;f++){if(g.link[f].rel=="alternate"){relurls[relnojudul]=g.link[f].href;break}}relnojudul++}}function contains(a,e){for(var f=0;f<a.length;f++){if(a[f]==e){return true}}return false}function artikelterkait(){var v=new Array(0);var w=new Array(0);var x=new Array(0);var A=new Array(0);for(var u=0;u<relurls.length;u++){if(!contains(v,relurls[u])){v.length+=1;v[v.length-1]=relurls[u];w.length+=1;w[w.length-1]=reljudul[u];x.length+=1;x[x.length-1]=relcuplikan[u];A.length+=1;A[A.length-1]=relgambar[u]}}reljudul=w;relurls=v;relcuplikan=x;relgambar=A;for(var u=0;u<reljudul.length;u++){var B=Math.floor((reljudul.length-1)*Math.random());var i=reljudul[u];var s=relurls[u];var y=relcuplikan[u];var C=relgambar[u];reljudul[u]=reljudul[B];relurls[u]=relurls[B];relcuplikan[u]=relcuplikan[B];relgambar[u]=relgambar[B];reljudul[B]=i;relurls[B]=s;relcuplikan[B]=y;relgambar[B]=C}var r=0;var D=Math.floor((reljudul.length-1)*Math.random());var z=D;var q;var t=document.URL;while(r<numpost){if(relurls[D]!=t){q="<li class='news-title clearfix'>";q+="<a href='"+relurls[D]+"' rel='nofollow' target='_top' title='"+reljudul[D]+"'><div class='overlayb'></div><img src='"+relgambar[D]+"' /></a>";q+="<a class='relinkjdulx' href='"+relurls[D]+"' target='_top'>"+reljudul[D]+"</a>";q+="<span class='news-text'>"+relcuplikan[D]+"</span>";q+="</li>";document.write(q);r++;if(r==numpost){break}}if(D<reljudul.length-1){D++}else{D=0}if(D==z){break}}};
//]]>
</script>
الرقم 4 هو عدد المواضيع
والرقم 88 هو طول أحرف الملخص
و كخطوة أخيرة نضع أكواد css التالية فوق الوسم : ]]></b:skin>
/*Related warch-mo.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;
}
لون كلمة مواضيع ذات صلة #FFFFFF
لون خلفية كلمة مواضيع ذات صلة #777
لون إطار الصور #777
لون خلفية الصور #fff
لون خلفية المواضيع #eee
لون إطار المواضيع #bbb
لون خلفية المواضيع عند تمرير الفأرة #ddd
46% هو مقاس الموضوعات فإن جعلته %100 سيصبح كل موضوع في سطر
الرقم 60 المكرر مرتين فهو عرض و إرتفاع الصور
يمكنك التعديل على جميع هذه المعطيات
مع كامل الشكر للأخ مصطفى عمرو مدير مدونة كن مدون الذي أفادنا بالإضافة الرئعة.
الاشتراك في:
تعليقات الرسالة (Atom)
مميزة
-
السلام عليكم ورحمة الله تعالى وبركاته أصدقائي و أحبائي متابعي ورشة مدون الأوفياء، أولا أحب أن أعتذر منكم بسبب طول غيابي هذا و توقفي عن ط...
-
السلام عليكم و رحمة الله وبركاته . هل تريد كسب مهتمين ومتابعين ؟! هل تريد نشر مواضيعك بأكبر نسبة ممكنة في مواقع التواصل الإجتماعية، اليو...
-
السلام عليكم ورحمة الله إنشاء الله سنتعلم كيف نعدل الصفحات الثابتة في البلوجر " Blogger Static Pages " وجعلها بعرض المدون...
-
أداة إقرأ المزيد أو ما يسمى read more، من الإضافات الضرورية في المدونات أو المواقع مهما كان نوعها، فهي تتحكم في حجم المحتوى الذي يظهر في...
-
السلام عليكم ورحمة الله وبركاته متابعي ورشة مدون الأوفياء، أعتذر عن مدة غيابي التي كانت بسبب بعض المشاكل التقنية الخارجة عن إرادتي، الم...
-
السلام عليكم ورحمة الله وبركاته. يعتبر إنشاء صفحة الفهرس من بين الأداوت التي تسهل على الزوار التنقل بين مواضيع المدونة ، خصوصا الاصناف ...
-
السلام عليكم و رحمة الله وبركاته. متابعي ورشة مدون الأوفياء في تدوينة اليوم سنتطرق إلى كيفية جعل خلفية مدونتك "background website...
-
سلام الله عليكم، نلتقي من جديد في ورشة مدون اليوم أحبابي فالله بعد أن طلب مني بعض الاخوة في الصفحة أنهم يريدون قوالب رمضانية فقمت بج...
-
السلام عليكم ورحمة الله وبركاته أولا أحب أن أعتذر عن الإنقطاع جراء بعض مشاكل مع شركة الإتصال ,,, المهم كأول لقاء مع متابعي ورشة مدون الأ...
-
السلام عليكم و رحمة الله و بركاته، مجال التدوين يعتبر من الأولويات التي على المدون إختيارها بعناية ، لبناء مشروعه على الويب، فأغلب المد...
تعليقات الزوار
أرشيف المدونة الإلكترونية
-
▼
2014
(100)
-
▼
يوليو
(21)
- إضافة "هل أعجبك الموضوع؟" أسفل كل تدوينة
- شرح تحميل و تركيب قالب عرب تيك الإحترافي للمدونة ا...
- إضافة صندوق التبادل الإعلاني بتقنية css لمدونة بلوجر
- طريقة إضافة slader show المحترف بشكل صحيح
- تعرف على الفرق بين السمة "dofollow" و "nofollow" و...
- أفضل أكواد الميتا تاج ستجعل مدونتك في الصدارة
- إضافة أخر المواضيع للبلوجر بشكل متحرك
- تغير شكل و مظهر تعليقات بلوجر
- إضافة صندوق الإشترك بالبريد الإلكتروني و المواقع ا...
- إضافة قائمة منسدلة جانبية للصفحات الإجتماعية
- تحميل قالب "APOLLO" المعرب حصريا للوجر
- إضافة زر التمرير نحو الأعلى و الأسفل بتقنية Jquery
- إضافة المشاركات الشائعة بشكل أنيق و جذاب
- كيفية تنسيق قائمة و سحابة التسميات
- تحميل النسخة 2 من قالب "قالب الرائع"
- تحميل قالب بلوجر"Flat Mag" الأكثر إحترافية
- وضع رسالة ترحيبية أسفل القائمة الرئيسية
- تميز تعليقات صاحب المدونة عن تعليقات الزوار
- شرح أداة firebug لتسهيل إستخراج أكواد واجهات المواقع
- إضافة شريط أخر الأخبار لمدونة بلوجر
- إضافة مواضيع ذات صلة تحت كل موضوع
-
▼
يوليو
(21)
تواصل معنا على الفيسبوك
أهم المواضيع
-
السلام عليكم ورحمة الله تعالى وبركاته أصدقائي و أحبائي متابعي ورشة مدون الأوفياء، أولا أحب أن أعتذر منكم بسبب طول غيابي هذا و توقفي عن ط...
-
السلام عليكم و رحمة الله وبركاته . هل تريد كسب مهتمين ومتابعين ؟! هل تريد نشر مواضيعك بأكبر نسبة ممكنة في مواقع التواصل الإجتماعية، اليو...
-
السلام عليكم ورحمة الله إنشاء الله سنتعلم كيف نعدل الصفحات الثابتة في البلوجر " Blogger Static Pages " وجعلها بعرض المدون...
-
أداة إقرأ المزيد أو ما يسمى read more، من الإضافات الضرورية في المدونات أو المواقع مهما كان نوعها، فهي تتحكم في حجم المحتوى الذي يظهر في...
-
السلام عليكم ورحمة الله وبركاته متابعي ورشة مدون الأوفياء، أعتذر عن مدة غيابي التي كانت بسبب بعض المشاكل التقنية الخارجة عن إرادتي، الم...
-
السلام عليكم ورحمة الله وبركاته. يعتبر إنشاء صفحة الفهرس من بين الأداوت التي تسهل على الزوار التنقل بين مواضيع المدونة ، خصوصا الاصناف ...
-
السلام عليكم و رحمة الله وبركاته. متابعي ورشة مدون الأوفياء في تدوينة اليوم سنتطرق إلى كيفية جعل خلفية مدونتك "background website...
-
سلام الله عليكم، نلتقي من جديد في ورشة مدون اليوم أحبابي فالله بعد أن طلب مني بعض الاخوة في الصفحة أنهم يريدون قوالب رمضانية فقمت بج...
-
السلام عليكم ورحمة الله وبركاته أولا أحب أن أعتذر عن الإنقطاع جراء بعض مشاكل مع شركة الإتصال ,,, المهم كأول لقاء مع متابعي ورشة مدون الأ...
-
السلام عليكم و رحمة الله و بركاته، مجال التدوين يعتبر من الأولويات التي على المدون إختيارها بعناية ، لبناء مشروعه على الويب، فأغلب المد...
ليست هناك تعليقات:
إرسال تعليق
يسعدنا تفاعلكم بالتعليق , أما لو لديك سؤال خارج الموضوع يرجى استخدام ركن الأسئلة ولإضافة كود قم بتحويله أولابمحول الأكواد , ويمكنك ان تستخدم الإبتسامات بالوقوف عليها لمعرفة الكود
=q =w =s =d =f =g =h =t =y =u =z =x =c =v =b =n =m =a =e =r