إضافة مواضيع ذات صلة الشكل الثالث

الموضوع

اقرأ ايضًا

التعليقات

عن الكاتب

تعليمات

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

أيضاً لا تفوت الأشكال الآخرى من هنا

معاينة

شرح طريقة التركيب

* ملاحظة إذ كنت تتوفر على إضافة آخرى فمن الأفضل حذف أكوادها

1 . توجه لقالب >> تحرير

2. ابحث بإستعمال CTRL+F عن : ]]></b:skin>

3. ضع الكود فوقه

#related-posts{height:132px;border-top:1px solid #fff;}
#relpost_img_sum img{width:110px;height:110px;border:double #565050;margin:0 -75px}
#relpost_img_sum img:hover{opacity:.6}
#relpost_img_sum li{list-style:none;width:120px;height:120px;position:relative;float:left;margin-right:5px}
#relpost_img_sum li:hover .isirelated{visibility:visible;opacity:1;left:35px}
.isirelated h3{color:#FAC51B;font-size:13px;text-align:center;margin-bottom:3px}
.isirelated{width:205px;z-index:2;padding:10px;color:#fff;font-size:10px;text-align:justify;background:rgba(68, 68, 68, 0.91);position:absolute;top:70%;left:150px;visibility:hidden;opacity:0;transition:all 0.3s cubic-bezier(1,1,0,0) 0s;-moz-transition:all 0.3s cubic-bezier(1,1,0,0) 0s;-webkit-transition:all 0.3s cubic-bezier(1,1,0,0) 0s;-o-transition:all 0.3s cubic-bezier(1,1,0,0) 0s}
#relpost_img_sum {color: #FFF;background: #413E3C;display: inline-block;position: absolute;margin-right: -50px;width: 753px;font-family: droid arabic kufi;padding-top: 5px;}

4. ابحث عن <div class='post-footer-line post-footer-line-3'> أو <data:post.body/>

5. ضع الكود التالي أسفل أحد الكودين

<div id='related-posts'>
<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=30&quot;' type='text/javascript'/>
</b:loop>
<span class='glap'><ul id='relpost_img_sum'>
<script type='text/javascript'>artikelterkait();</script>
</ul></span>
  </div>
<script type='text/javascript'>
//<![CDATA[
function resizeThumb(e,b){var c=document.getElementById(e),d=c.getElementsByTagName("img");for(var a=0;a<d.length;a++){d[a].src=d[a].src.replace(/\/s72\-c/,"/s"+b+"-c");d[a].width=b;d[a].height=b}}resizeThumb("related-posts",110);
//]]>
</script>

6. إبحث عن </head> ضع الكود التالي فوقه

<script type='text/javascript'>
//<![CDATA[
var relnojudul=0,relmaxtampil=5,numchars=150,reljudul=[],relurls=[],relcuplikan=[],relgambar=[];function saringtags(b,e){for(var a=b.split("<"),c=0;c<a.length;c++)-1!=a[c].indexOf(">")&&(a[c]=a[c].substring(a[c].indexOf(">")+1,a[c].length));a=a.join("");return a=a.substring(0,e-1)}
function relpostimgcuplik(b){for(var e=0;e<b.feed.entry.length;e++){var a=b.feed.entry[e];reljudul[relnojudul]=a.title.$t;postcontent="";"content"in a?postcontent=a.content.$t:"summary"in a&&(postcontent=a.summary.$t);relcuplikan[relnojudul]=saringtags(postcontent,numchars);postimg="media$thumbnail"in a?a.media$thumbnail.url:"https://lh5.googleusercontent.com/-FP5c5mIlvNo/UPfM0KitJYI/AAAAAAAABZk/q_7FhZh9izs/s0/no-image.jpg";relgambar[relnojudul]=postimg;for(var c=0;c<a.link.length;c++)if("alternate"==a.link[c].rel){relurls[relnojudul]=a.link[c].href;
break}relnojudul++}}function contains(b,e){for(var a=0;a<b.length;a++)if(b[a]==e)return!0;return!1}
function artikelterkait(){for(var b=[],e=[],a=[],c=[],d=0;d<relurls.length;d++)contains(b,relurls[d])||(b.length+=1,b[b.length-1]=relurls[d],e.length+=1,e[e.length-1]=reljudul[d],a.length+=1,a[a.length-1]=relcuplikan[d],c.length+=1,c[c.length-1]=relgambar[d]);reljudul=e;relurls=b;relcuplikan=a;relgambar=c;for(d=0;d<reljudul.length;d++){var b=Math.floor((reljudul.length-1)*Math.random()),e=reljudul[d],a=relurls[d],c=relcuplikan[d],f=relgambar[d];reljudul[d]=reljudul[b];relurls[d]=relurls[b];relcuplikan[d]=
relcuplikan[b];relgambar[d]=relgambar[b];reljudul[b]=e;relurls[b]=a;relcuplikan[b]=c;relgambar[b]=f}d=0;e=b=Math.floor((reljudul.length-1)*Math.random());for(c=document.URL;d<relmaxtampil&&!(relurls[b]!=c&&(a="<li class='news-title clearfix'>",a+="<a href='"+relurls[b]+"' rel='nofollow'  target='_top''><img src='"+relgambar[b]+"' /></a>",a+="<div class='isirelated'><h3>"+reljudul[b]+"</h3>",a+="<span class='news-text'>"+relcuplikan[b]+" ... </span></div>",a+="</li>",document.write(a),
d++,d==relmaxtampil))&&!(b<reljudul.length-1?b++:b=0,b==e););};
//]]>
</script>

أيّ إستفسار تغيير ملاحظة ضمن الإضافة، فباب التعليقات مفتوح

ملحوظة:

يسعدنا تفاعلكم بالتعليق، لكن يرجى مراعاة الشروط التالية لضمان نشر التعليق
1أن يكون التعليق خاص بمحتوى التدوينة
2أن لا تضع أي روابط خارجية
3لإضافة كود حوله أولاً بمحول الأكواد
4أي سؤال خارج محتوى التدوينة يرجى استخدام ركن الأسئلة
5😊😉😀😁😎😍😜😑😇💖😯😱😭👍❓🍻

هناك 9 تعليقات:

l'inconnu Dz3/23/2015
ممكن إضافة

صندوق التدوينة و شكرا
ردحذف
الردود
Th3web3/24/2015
السلام عليكم ورحمة الله وبركاته
شكرا لك ^^
http://www.th3web.gq/

بالفيديو، اضافة لوحة مفاتيح عربية "Clavier Arabe" الى مدونتك

http://www.th3web.gq/2015/03/clavier-arabe-clavier-english.html

اندرويد يدعم ميزة ايجاد الهواتف الضائعة عبر الساعات الذكية

http://www.th3web.gq/2015/03/android-wear-findmyphone.html

إضافة "uBlock" على فايرفوكس لإزالة إعلانات أندرويد

http://www.th3web.gq/2015/03/uBlock.html

سيو Seo: كيف تجعل تدويناتك الأولى في محركات البحث؟

http://www.th3web.gq/2015/03/post-and-keywords.html

تغيير رقمك في الواتس اب دون خسارة أي بيانات

http://www.th3web.gq/2015/03/Changing-your-number-in-whatsApp.html

تطبيق جديد على الهاتف لمساعدة المرضى النفسيين

http://www.th3web.gq/2015/03/new-app.html

تطبيق "Prime" لعمل تأثيرات على الصور لأجهزة الآيفون

http://www.th3web.gq/2015/03/New-Iphone-App.html

شركة سوني تعتزم اطلاق هاتفها الذكي Xperia Z4 بشاشة Quad HD

http://www.th3web.gq/2015/03/xperia-z4-quad-hd.html

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

http://www.th3web.gq/2015/03/writer-blogger.html

كيف تجد جهازك الايفون في حال نفاذ البطارية

http://www.th3web.gq/2015/03/find-my-iphone.html
ردحذف
الردود
Zied Zaabi3/24/2015
أنا عندي كيف تضيفها فقط تفضل على مدونتي
www.zyedweb.blogspot.com
ردحذف
الردود
0nenet4/19/2015
أخي ممكن اداة ودجت أخر تعليقات disqus
ردحذف
الردود
Houssam Baha4/22/2015
هل تريد الخاصة بديسكس أم كما التي بالمدونة فحمل هذا القالب وستجد به الأداة
http://www.ar1web.com/2015/01/template-realmag.html
ردحذف
الردود
ahmad jan4/23/2015
شكرآ اخي تم تحميل كود ولكن كيف اقوم بتخصيصه

ul.kangismet_recent{list-style:none;margin:0;padding:0;}

.kangismet_recent li{background:transparent;margin:0 0 6px!important;padding:3px

!important;display:block;clear:both;overflow:hidden;list-style:none; border: 1px solid transparent;

border-radius:9px; max-height: 100px;}

.kangismet_recent li:hover{background:#fff;border: 1px solid #e9e9e9;}

.kangismet_recent a {text-decoration:none;}

.avatarImage{padding:3px;background:#fefefe;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}

.avatarRound{border-radius:100px;width:35px;height:35px}

.kangismet_recent li span{margin-top:4px;color: #444;display: block;font-size: 12px;line-height: 1.4;}

//
ردحذف
الردود
Houssam Baha4/24/2015
أي ديسكس؟! الكود ليس له علاقة بتعليقات Disqus تابع فقط الشرح كما هو لا غير
ردحذف
الردود
Unknown1/11/2016
اخى لا يوجد لدى فى القالب هذا الوسم ( <[[ )
فما هو الوسم البديل شكراا
ردحذف
الردود

إضافة تعليق

عن الكاتب : Hussam

إرشادات

تحميل الملفات

نستخدم بمدونتنا مواقع مختلفة في رفع الملفات ونوفر منها إثنان:

موقع : Mediafire
موقع :file-upload
باسوورد فك الضغط للملفات المضغوطة : Ar1web2014
تجدون روابط التحميل في القوالب والملحقات بجانب التدوينة أي بالسيدبار
كل ملحق أو قالب يوجد بالمدونة هو للإستعمال الشخصي فقط
إن تواجد رابط معطوب فالمرجو التبليغ عنه هنا، شكرا.

أين تجدنا؟

كلمة الختام

أخر تعديل كان في يوم السبت 20 يونيو من سنة 2020 ، هذه الصفحة قابلة للتعديل وقت اللزوم

إعلان

إضافة مواضيع ذات صلة الشكل الثالث

هناك 9 تعليقات:

إرشادات

تحميل الملفات

أين تجدنا؟

كلمة الختام

نموذج الاتصال

النشرة البريدية

🏆 الأكثر زيارة