إضافة سكربت عرض المواضيع حسب التسميات للفيديوهات

أهلا بكم متابعى البروفيسور الصغير فى درس قصير *-* هذه التدوينة تتكلم عن إضافة جميلة وهى إضافة الفيديوهات حسيب التسميات الأضافة كودها لتشبه الخاص بقالب المحترف ولكن مع إختلاف بسيط *-* : 

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

1. التكويد نظيف *-* 
2. متجاوبة بنسبة 60%
3. شكل جميل ومريح للعين
4. يمكنك إستخدامه لعرض الحلقات والفيديوهات 
5. حسب التسميات *-* 

طريقة الأضافة : 

ضع الأكواد الأتية فوق هذا الوسم : </head> 

<br /><script type='text/javascript'>//<![CDATA[ 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}('z y(1){d.8(\'<l 5="A">\');m(4 i=0;i<1.2.3.f;i++){m(4 j=0;j<1.2.3[i].9.f;j++){B(1.2.3[i].9[j].x==\'D\'){4 b=1.2.3[i].9[j].6;v}}4 e=1.2.3[i].w.$t;4 p=1.2.3[i].u[0].s.$t;4 n=1.2.3[i].C$F.M.N("O-c","E-c");4 7=1.2.3[i].G[0].I;d.8(\'<k><a 5="q-J" 6=\'+b+\'><r H=\'+n+\'></r></a><a 5="q-7"> \'+7+\' </a><h 5="K-L"><o><a 6=\'+b+\'>\'+e+\'</o></a><g>\'+p+\'</g></h></k>\')}d.8(\'</l>\')}',51,51,'|json|feed|entry|var|class|href|tag|write|link||postUrl||document|postTitle|length|span|div|||li|ul|for|postImg|h3|postAuthor|elprof|img|name||author|break|title|rel|mycallback|function|poosts|if|media|alternate|s900|thumbnail|category|src|term|over|post|info|url|replace|s72'.split('|'),0,{})) //]]></script><br /><style> div#elprof-rec h2 { overflow: hidden; clear: both; background: #D03F42; color: #fff; padding: 10px; font-size: 29px; } div#elprof-rec h2:before { content: '\f16a'; font-family: fontawesome; width: 32px; background: #BD383A; height: 32px; text-align: center !important; line-height: 32px; display: inline-block; font-size: 17px; border-radius: 3px; margin-left: 6px; } ul.poosts { overflow: hidden; padding: 18px 0; border: 1px solid #E2E2E2; background: #fff; border-radius: 0 0 3px 3px; margin-bottom: 14px; padding-right: 8px; } ul.poosts li img { display: block; width: 100%; border-radius: 4px; border: 1px solid transparent; height: 206px; } ul.poosts li { float: right; width: 31%; position: relative; margin-bottom: 10px; padding-bottom: 3px; border-bottom: 1px solid #ECECEC; margin-right: 1.4%; } a.elprof-over:after { content: '\f01d'; font-family: fontawesome; position: absolute; top: 5px; text-align: center; left: 0; color: rgba(255, 255, 255, 0.88); right: 0; bottom: 0; padding-top: 78px; font-size: 56px; border-radius: 0px; width: 100%; height: 206px; background: rgba(49, 70, 90, 0.51); transition: 0.21s; font-weight: 300; } .poosts li:hover a.elprof-over:after { padding-left: 170px; padding-top: 13px; padding-bottom: 27px; padding-right: 0; margin-right: 0; width: 101%; color: #D03F42; font-size:38px; background: rgba(255, 255, 255, 0.65); font-weight: 300; } .post-info h3 a { font-size: 15px; position: relative; color: #3C2E2E; font-weight: 900; } .post-info span { position: absolute; top: 13px; left: 8px; color: #fff; display:none; } a.elprof-tag { position: relative; bottom: 29px; right: 0px; background: #fff; padding: 10px; } *:before, *:after { box-sizing: border-box; } </style><br />

ثم ضع هذه الأكواد فى المكان الذى تريده أن تظهر به الأضافة *-*

يمكنك إختيار المكان ثم تنسخ هذه الأكواد وتضعها :) 

يمكنك الحصول على الكود من هنا :

ثم تذهب إلى التخطيط وتضع القسم أو التسمية التى تريد تظهر مواضيعها :

مثال : 

إن حصلت معك مشكلة ما أو لم تفهم خطوة ما أو لم تعرف إضافة الأكواد أتمنى أن تقول لى *-*