إضافة مواضيع ذات صلة متحركة لمدونات بلوجر بطريقة إحترافية

زوار ومتابعي المدونة  أسعد الله أوقاتكم جميعا بكل خير ومحبة .

اليوم سوف نتعرف على إضافة معروفة لدى الجميع ولكن فريق عمل مدونة هوم بلوجر قد عدّل عليها .

الأضافة في غاية الروعة شباب  ، لمن يريد مشاهدة الأضافة اضغط على زر مشاهدة الأضافة

لمشاهدة الإضافة

- طريقة التركيب :

1- أدخل إلى مدونتك | ثم أختر تحرير قالب .

2- إبحث عن الوسم :  </head>

3- ضع الكود التالي فوقه :

</script>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts {float:center;height:100%;min-height:100%;padding-top:5px;padding-left:5px;}
#related-posts h2{font-size: 1.6em;font-weight: bold;color:#000;font-family:Arial, Georgia;margin-bottom:0.75em;margin-top: 0em;padding-top: 0em;}
#related-posts a{-webkit-transition: background 1s ease, color 1s ease;-moz-transition: background 1s ease, color 1s ease;-o-transition: background 1s ease, color 1s ease;}
#related-posts a:hover{background-color:#1194F9;-webkit-transition: background 1s ease, color 1s ease;-moz-transition:background 1s ease, color 1s ease;-o-transition:background 1s ease, color 1s ease;-webkit-border-radius: 5px;-moz-border-radius:5px;border-radius:5px;-o-border-radius:5px;}
.tooltip{width: 115px; color:#000;font:lighter 12px/1.3 Arial,sans-serif;text-decoration:none;text-align:left}
.tooltip span.top{padding:20px 5px 0;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgX-zUSEBWEHelqNxQz4HhjtSikuCSzy_2EDt4bn2QfSBAW0yud4R23Q79BM7tLlaIgmS_E7Hhmx4tHK_0Z-NtcJGnjvC6cmzc07-lAn9fdTqTu69vZPMHe83rUUDdDSFrwpPugS5iY59d9/s1600/BloggerSpice+bubble.png) no-repeat top;}
.tooltip b.bottom{padding:2px 5px 6px;color:#548912;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgX-zUSEBWEHelqNxQz4HhjtSikuCSzy_2EDt4bn2QfSBAW0yud4R23Q79BM7tLlaIgmS_E7Hhmx4tHK_0Z-NtcJGnjvC6cmzc07-lAn9fdTqTu69vZPMHe83rUUDdDSFrwpPugS5iY59d9/s1600/BloggerSpice+bubble.png) no-repeat bottom;}
</style>
<script type='text/javascript'>window.onload=function(){enableTooltips(&quot;calcList&quot;)};imgBT=new Image();imgBT.src=&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpdMGGFQFfVlU908IvQoW25KhJwG6Hr8j8FcIrK-BHZzmav9m6XILOsw9oH_w9xpiHA-poMcWhCmKW2ZAoCqbcq3w9psafFHzNvQuFHqrvzUyy8UB0YtaQTWT8mfTwASs_VHb-dwNmSEqZ/s1600/BS+No+Image+White.png&#39;;</script>
<script type='text/javascript'>
//<![CDATA[
//Script by HOME BLOGGER of www.homeblog7.blogspot.com
//Released on April 5th 2015
//http://www.homeblog7.blogspot.com/
eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('4 8=B z();4 n=0;4 m=B z();4 o=B z();g 2u(e){u(4 i=0;i<e.1o.1i.6;i++){4 f=e.1o.1i[i];8[n]=f.I.$t;1K{o[n]=f.1y$R.1T}23(1S){s=f.25.$t;a=s.16("<1c");b=s.16("1b=\\"",a);c=s.16("\\"",b+5);d=s.1O(b+5,c-b-5);7((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){o[n]=d}q{7(1q(1v)!==\'1u\')o[n]=1v;q o[n]="1g://3.1Q.22.1r/-2x/2p/26/2q/2r/2v+2k+2j+2b.2a"}}7(8[n].6>35)8[n]=8[n].29(0,35)+"...";u(4 k=0;k<f.M.6;k++){7(f.M[k].1D==\'28\'){m[n]=f.M[k].S;n++}}}}g 2d(){4 a=B z(0);4 b=B z(0);4 c=B z(0);u(4 i=0;i<m.6;i++){7(!1F(a,m[i])){a.6+=1;a[a.6-1]=m[i];b.6+=1;c.6+=1;b[b.6-1]=8[i];c[c.6-1]=o[i]}}8=b;m=a;o=c}g 1F(a,e){u(4 j=0;j<a.6;j++)7(a[j]==e)K 2e;K 2f}g 2n(a){4 b;7(1q(1h)!==\'1u\')b=1h;q b="#2h";u(4 i=0;i<m.6;i++){7((m[i]==a)||(!8[i])){m.w(i,1);8.w(i,1);o.w(i,1);i--}}4 r=1a.2i((8.6-1)*1a.2c());4 i=0;7(8.6>0)2.v(\'<1n>\'+27+\'</1n><y Z="2t"><H 9="p-12:2s;1k:2w;p-2m:2l;1j:-2o 1M 0 0"><a I="1N 1p 1e 1P R u 1R" S=" 1g://1L.21.1r/24/1Z/1Y-1U-1p-1e-R-1V-u-1W-1X.2g" 2B="37"><p 38="#39">3a 1J+</p></a></H><36/>\');2.v(\'<y 9="34: 30;"/>\');2Z(i<8.6&&i<20&&i<31){2.v(\'<a 9="1G-32:P;17:18;1k:N;\');7(i!=0)2.v(\'13-N:33 0.18 \'+b+\';"\');q 2.v(\'"\');2.v(\' S="\'+m[r]+\'" I="\'+8[r]+\'"><1c 9="1t:1f;T:1f;13:3b;" 1b="\'+o[r]+\'"/><3c/><y 9="1s-1t:3j;17-N:1l;3k:3l;1s-T:3n;13: Y P ; 1j: 1l Y 18 0; 17: Y; p-9: F; p-3i: F; p-2y: F; p-12: 3h; 3d-T: F; p-12-3e: P; p-3f: F;">\'+8[r]+\' ...</y></a>\');i++;7(r<8.6-1){r++}q{r=0}}2.v(\'</y></y>\');m.w(0,m.6);o.w(0,o.6);8.w(0,8.6)}g 2Y(a){4 b,i,h;7(!2.C||!2.J)K;1H();h=2.1A("H");h.Z="D";h.O("Z","D");h.9.2X="2G";2.J("W")[0].A(h);7(a==V)b=2.J("a");q b=2.C(a).J("a");u(i=0;i<b.6;i++){1d(b[i])}}g 1d(a){4 c,t,s,b,l;t=a.2J("I");7(t==V||t.6==0)K;a.2F("I");c=E("H","11");s=E("H","19");s.A(2.2E(t));c.A(s);b=E("b","2z");c.A(b);1w(c);a.11=c;a.2D=1E;a.2K=1C;a.2L=14}g 1E(e){2.C("D").A(1J.11);14(e)}g 1C(e){4 d=2.C("D");7(d.2T.6>0)d.2U(d.2N)}g 1w(a){a.9.2M="2O(1B:L)";a.9.2P="0.L";a.9.2Q="0.L";a.9.1B="0.L"}g E(t,c){4 x=2.1A(t);x.3m=c;x.9.2V="2I";K(x)}g 1H(){4 l=E("M");l.O("3g","1G/2H");l.O("1D","2W");l.O("1y","2R");2.J("2S")[0].A(l)}g 14(e){4 a=0,G=0;7(e==V)e=2C.2A;7(e.1x||e.1I){a=e.1x;G=e.1I}q 7(e.15||e.X){7(2.U.Q){a=e.15+2.U.1z;G=e.X+2.U.Q}q{a=e.15+2.W.1z;G=e.X+2.W.Q}}2.C("D").9.19=(G+10)+"1m";2.C("D").9.N=(a-20)+"1m"}',62,210,'||document||var||length|if|relatedTitles|style|||||||function||||||relatedUrls|relatedTitlesNum|thumburl|font|else||||for|write|splice||div|Array|appendChild|new|getElementById|btc|CreateEl|normal|posy|span|title|getElementsByTagName|return|90|link|left|setAttribute|none|scrollTop|thumbnail|href|height|documentElement|null|body|clientY|0pt|id||tooltip|size|border|Locate|clientX|indexOf|padding|5px|top|Math|src|img|Prepare|with|100px|http|splittercolor|entry|margin|float|3px|px|h2|feed|post|typeof|com|max|width|undefined|defaultnoimage|setOpacity|pageX|media|scrollLeft|createElement|opacity|hideTooltip|rel|showTooltip|contains_thumbs|text|AddCss|pageY|this|try|www|33px|Related|substr|bubbled|bp|Blogger|error|url|related|widget|blogger|template|scrolling|04||homeblog7|blogspot|catch|2015|content|AAAAAAAAFIs|relatedpoststitle|alternate|substring|png|White|random|removeRelatedDuplicates_thumbs|true|false|html|d4eaf2|floor|Image|No|arial|family|printRelatedLabels_thumbs|15px|UoCtFhXRBuI|9FbIqQZ3KfU|s1600|9px|calcList|related_results_labels_thumbs|BS|right|ciCUurobkhg|weight|bottom|event|target|window|onmouseover|createTextNode|removeAttribute|absolute|css|block|getAttribute|onmouseout|onmousemove|filter|firstChild|alpha|KHTMLOpacity|MozOpacity|screen|head|childNodes|removeChild|display|stylesheet|position|enableTooltips|while|both|maxresults|decoration|solid|clear||nobr|_blank|color|ff5f00|Get|0px|br|line|adjust|stretch|type|11px|variant|95px|overflow|hidden|className|20px'.split('|'),0,{}))

//]]>
</script>
</b:if>

4- بعد ذلك إبحث عن الوسم : <data:post.body/> هذا الوسم مكرر المقصود الثاني  أو الثالث .

5- ضع الكود التالي تحته :

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=12&quot;' type='text/javascript'/></b:if></b:loop>
<h3>مواضيع ذات صلة</h3>
<marquee align='center' behavior='alternate' direction='left' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' width='100%'>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=10;
var relatedpoststitle=&quot;&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script></marquee>
</div><div style='clear:both'/>
</b:if>

6- إحفظ القالب .