[ هام جداً ] الموقع للبيع أعضاء وزوار موقع جزائري ويب



مرحباً بكم زوار ومتابعين موقع جزائري ويب أفضل مدونة جزائرية وأفضل مدونة من حيث التصميم الرائع في الوطن العربي

موقعنا للبيع كما تعرفون الموقع مخصص لتطوير منصة التدوين ومواقع بلوجر لدينا زوار للموقع أوفياء يومياً بإستمرار

من يريد شراء الموقع ومهتم بالأمر برجاء التواصل معي علي حسابي في الفيسبوك ترك تعليق بالأسفل لمعرفة التفاصيل

أكونت الفيسبوك للأتصال بي من هنا
شاهد الدرس

اضافة اداة مواضيع عشوائية فى السايدبار



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


شرح طريقة التركيب + معاينة الاضافة من هنا  :

  1. ادهب الى لوحة التحكم ثم تحرير "HTML"  
  2. ابحث عن كلمة  <head/>  واضف فوقه مباشراً الكود التالي
<script type='text/javascript'> /*<![CDATA[* function jazairiwebgrid(a){for(var t=a.feed.entry||[],e=['<div class="recent-gallery">'],i=0;i<t.length;++i){for(var l=t[i],r=l.title.$t,n=l.media$thumbnail?l.media$thumbnail.url:"http://2.bp.blogspot.com/-4fCf53FqYKM/Vccsy7apoZI/AAAAAAAAK4o/XJkv3RkC0pw/s1600/default%2Bimage.png",s=n.replace("s72-c","s"+jazairiweb_thumbs+"-c"),h=l.link||[],c=0;c<h.length&&"alternate"!=h[c].rel;++c);var d=h[c].href,m='<img src="'+s+'" width="'+jazairiweb_thumbs+'" height="'+jazairiweb_thumbs+'"/>',p=jazairiweb_title?'<span class="ptitle">'+r+"</span>":"",g='<a href="'+d+'" target="_blank" title="'+r+'">'+m+p+"</a>";e.push('<div class="gallerytem">',g,"</div>")}e.push("</div>"),document.write(e.join(""))} /*]]>*/</script>

  1. ابحث عن كلمة  <b:skin/>  واضف فوقه مباشراً الكود التالي
 .recent-gallery {padding:0;clear:both;} .recent-gallery:after {content:&quot;&quot;;display:table;clear:both;} .recent-gallery .gallerytem{width: 80px;display:block;float:right;position:relative;margin:2px;overflow:hidden;padding:0} .recent-gallery .gallerytem a{position:relative;float:right;margin:0;overflow:hidden;text-decoration:none} .recent-gallery .gallerytem .ptitle{background:rgba(255,255,255,.95);display:block;clear:right;font-size:11px;line-height:1.3em;position:absolute;text-align:right;bottom:0;left:0;right:0;top:0;color:#444;padding:5px;word-wrap:break-word;overflow:hidden;visibility:hidden;transform:translate(-79px,0);backface-visibility:hidden;transition:all .2s} .recent-gallery .gallerytem:hover .ptitle{visibility:visible;transform:translate(0,0)} .recent-gallery a img{background:#fdfdfd;float:right;transition:all .3s} #HTML2 .widget-content {text-align:center;}

  1. اضف الكود التالي في التخطيط داخل ادات html  
<script> var jazairiweb_thumbs = 80; var jazairiweb_title = true; </script> <script src="/feeds/posts/summary?max-results=10&amp;alt=json-in-script&amp;callback=jazairiwebgrid"/></script>
شاهد الدرس

صفحة خطأ أحترافيه للموقع ( متحركة )



بسم الله الرحمن الرحيم السلام عليكم ورحمة الله وبركاته .
 صفحة خطأ أحترافيه للموقع | متحركة صفحة الخطأ صفحة مهمه في كل موقع ولابد من تواجدها , فكل اصحاب المواقع لا يستغنون عن هذه الصفحة حيث انها اما تقوم بتحويل الزائر مباشره الى الصفحة الصحيحه او الرئيسيه


طريقة التركيب :
    1. ادخل تحرير القالب HTML.
    2. ابحث عن <head> وضع هذا الكود اسفله :
<b:if cond='data:blog.pageType != &quot;error_page&quot;'> <title><data:blog.pageName/><data:blog.title/></title> </b:if> <b:if cond='data:blog.pageType == &quot;error_page&quot;'> <title>الصفحة غير موجودة ~ <data:blog.title/></title> </b:if>


    1. الان ابحث عن <body> وضع هذا الكود اسفله :
<b:if cond='data:blog.pageType == &quot;error_page&quot;'> <div id='oopss'> <div id='error-text'> <span>4<i class='fa fa-frown-o'/>4</span> <p> هل أنت(ي) تائه(ة)!</p> <div class='er-jazairiweb'>نعتذر إن لم تجد(ي) الصفحة</div> <p><a class='back' href='/'><i class='fa fa-toggle-on'/> العودة للرئيسية</a></p> </div> </div> </b:if>

    1. الان ابحث عن </head> وضع هذا الكود فوقه :
<b:if cond='data:blog.pageType == &quot;error_page&quot;'> <style type='text/css'> .sidebar,.ct-wrapper, .header-wrapper, #header, #post-wrapper, #outer-wrapper, #footer-wrapper, #credit,.topwrapper,::-webkit-scrollbar,.banner,.topwrapper{display:none!important;margin:0;padding:0;overflow:hidden;} /* CSS Error Page */ #oopss {background:#222;text-align:center;margin-bottom:50px;font-weight:400;font-size:30px;font-family:&#39;Roboto Condensed&#39;,sans-serif;position:fixed;width:100%;height:100%;line-height:1.5em;z-index:9999;} #error-text {top:30%;position:relative;font-size:30px;color:#aaa;} #error-text a{color:#aaa;} #error-text p {margin:0!important; font-family: droid arabic kufi;} #error-text span {color:#aaa;font-size:120px;font-weight:700;letter-spacing:0.1em;} #error-text a.back { display: inline-block;margin: 10px auto;background: #F23D3D;color: #fff;padding: 6px 10px 3px;font-size: 10px;font-weight: 700;line-height: normal;border-radius: 3px;transform: scale(1);transition: all 0.5s ease-out;} #error-text a.back:hover {background:#181818;color:#fff;} #error-text a.back:active {-webkit-transform:scale(0.95);-moz-transform:scale(0.95);transform:scale(0.95);background:#F23D3D;color:#fff;} .fa-frown-o:before {content: &quot;\f119&quot;;color: #F23D3D;} .er-jazairiweb {font-size: 18px!important;font-family: droid arabic kufi;} /* CSS Error Page Responsive */ @media only screen and (max-width:640px){ #error-text {color:#aaa;font-size:20px;} #error-text span {font-size:60px;} #error-text a.back {padding:5px 10px;font-size:12px;} #error-text a.back:hover,#error-text a.back:active {border:0;}} </style> </b:if>
شاهد الدرس

الطريقة الصحيحة والفعالة من اجل اعادة توجيه المواقع تلقائيا



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

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


  1. طريقة التركيب ابحث عن <head/>  وأضف الكود التالي فوقها
<script> location.replace("رابط الموقع الجديد") </script>
شاهد الدرس

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



 مرحبا بكم اخواني في كل جديد من مدونة جزائري ويب
 اليوم باذن الله سوف اشرح لكم كيفية اضافة سلايد شو احترافي
 (سلايدرشو المحترف) لمدونات بلوجر بطريقه سهله ومضمونه
هذا السلايدرشو يعرض لك اخر المواضيع المضافه في قسم معين بطريقه تلقائيه
 حيث يتم تحديد هذا القسم او التسميه حسب رغبتك 

كيفية اضافة هذا السلايدر شو الى مدوناتكم
    1. من لوحة التحكم -> قالب -> تحرير HTML
    2. خذ نسخه احتياطيه لـ قالب المدونه قبل إجراء أية تغييرات
    3. ابحث عن الوسم  ]]></b:skin> و اضف الكود التالي فوقه:
/* CSS Slider */ #alwansd{height: 273px; margin: 10px 0px; background: #34495e;width: 666px;} .alwanw{position: relative;height: 254px;} .alwanw .contentdiv{visibility: hidden;position: absolute;opacity: 1;} .alwan-ps{text-align: right; float: right; padding: 0 4px; margin: 6px auto;} .alwan-ps .toc{width: 95px; font-size: 0; border-radius: 0.5px; height: 6px; float: right;background: #fff; margin-right: 10px;} .alwan-ps a.selected{background:#18629C;} .alwan-ps .prev, .alwan-ps .next {display:none;} .alwanip{width: 646px; padding: 10px !important; bottom: 0; float: left !important; position: absolute; background: rgba(32, 45, 59, 0.85);} .alwanip a{color: #dcdcdc; font: 16px GESSTwoMediumRegular,tahoma; line-height: 10px; display: block; padding: 12px 0; margin: 0 0px;} .alwanip h6{margin: 0;} .alwanip h6 a:hover {color:#18629C;} .alwanip .alwand{font:12px GESSTwoMediumRegular,tahoma; margin:4px 0; color:#a5a5a5;display: none; } .alwanip p{font-size: 13px; margin: 0; font: normal 12px GESSTwoMediumRegular,tahoma; color: #f1f1f1; line-height: 19px;} .alwansf a img{float: right !important; width: 666px; height: 251px;} .alwansf {float: right !important; width:666px!important;} .column-center-outer {width: 666px;}

الآن قم بالبحث عن:   <head/> 
والصق الكود التالي قبله مباشره (فوقه)
<script type='text/javascript'> /* Script from:http://jazairiweb.blogspot.com */ imgr = new Array(); imgr[0] = &quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhEOnJ_VAHzQfp19JRGZtEMdiziQS-Jkb9XNniuWHNwPqNbs3FfoGwg929f6HRHQuRzKMeqSALy5KzafVxczOhSZeELE2rO5IPn8oH9QILb1o9Tzz3U5177X1Be9FIyE0isyb7RLgX61I/w618-h509-no/Vinage_Logos.png&quot;; showRandomImg = true; aBold = true; summaryPost = 150; numposts1 = 6; label1 = &quot;خدماتنا&quot;; function removeHtmlTag(strx,chop){var s=strx.split(&quot;&lt;&quot;);for(var i=0;i&lt;s.length;i++){if(s[i].indexOf(&quot;&gt;&quot;)!=-1){s[i]=s[i].substring(s[i].indexOf(&quot;&gt;&quot;)+1,s[i].length)}}s=s.join(&quot;&quot;);s=s.substring(0,chop-1);return s} function showrecentposts1(json){j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();for(var i=0;i&lt;numposts1;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var pcm;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k&lt;entry.link.length;k++){if(entry.link[k].rel==&#39;alternate&#39;){posturl=entry.link[k].href;break}}for(var k=0;k&lt;entry.link.length;k++){if(entry.link[k].rel==&#39;replies&#39;&amp;&amp;entry.link[k].type==&#39;text/html&#39;){pcm=entry.link[k].title.split(&quot;&quot;)[0];break}} if (&quot;content&quot; in entry) { var postcontent = entry.content.$t;} else if (&quot;summary&quot; in entry) { var postcontent = entry.summary.$t;} else var postcontent = &quot;&quot;; postdate = entry.published.$t; if(j&gt;imgr.length-1) j=0; img[i] = imgr[j]; s = postcontent ; a = s.indexOf(&quot;&lt;img&quot;); b = s.indexOf(&quot;src=\&quot;&quot;,a); c = s.indexOf(&quot;\&quot;&quot;,b+5); d = s.substr(b+5,c-b-5); if((a!=-1)&amp;&amp;(b!=-1)&amp;&amp;(c!=-1)&amp;&amp;(d!=&quot;&quot;)) img[i] = d; var month=[1,2,3,4,5,6,7,8,9,10,11,12];var month2=[&quot;Jan&quot;,&quot;Feb&quot;,&quot;Mar&quot;,&quot;Apr&quot;,&quot;May&quot;,&quot;Jun&quot;,&quot;Jul&quot;,&quot;Aug&quot;,&quot;Sep&quot;,&quot;Oct&quot;,&quot;Nov&quot;,&quot;Dec&quot;];var day=postdate.split(&quot;-&quot;)[2].substring(0,2);var m=postdate.split(&quot;-&quot;)[1];var y=postdate.split(&quot;-&quot;)[0];for(var u2=0;u2&lt;month.length;u2++){if(parseInt(m)==month[u2]){m=month2[u2];break; }} var daystr = day+ &#39; &#39; + m + &#39; &#39; + y ; var trtd = &#39;&lt;div class=&quot;contentdiv&quot;&gt;&lt;div class=&quot;alwansf&quot;&gt;&lt;a href=&quot;&#39;+posturl+&#39;&quot;&gt;&lt;img width=&quot;617&quot; height=&quot;385&quot; class=&quot;alignnone&quot; src=&quot;&#39;+img[i]+&#39;&quot;/&gt;&lt;/a&gt;&lt;div class=&quot;sliderPostInfo&quot;&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=&quot;alwanip&quot;&gt;&lt;h6&gt;&lt;a href=&quot;&#39;+posturl+&#39;&quot;&gt;&#39;+posttitle+&#39;&lt;/a&gt;&lt;/h6&gt;&lt;div class=&quot;alwand&quot; &gt;&#39;+daystr+&#39;&lt;/div&gt;&lt;p&gt;&#39; +removeHtmlTag(postcontent,summaryPost)+&#39;...&lt;/p&gt;&lt;/div&gt;&lt;/div&gt;&#39;; document.write(trtd); j++; }} </script>
ملاحظة:
    1. قم بتغيير كلمة خدماتنا باسم القسم الذي سيتم عرض مواضيعه
    2. بعد ذلك قم بالبحث عن  <body/>  والصق الكود التالي قبله مباشره (فوقه)
<script src='https://googledrive.com/host/0B2v7cH8soLJraTNUTkhtRWtIMTA'></script> <script> featuredcontentslider.init({ id: "slider1", //id of main slider DIV contentsource: ["inline", ""], //Valid values: ["inline", ""] or ["ajax", "path_to_file"] toc: "#increment", //Valid values: "#increment", "markup", ["label1", "label2", etc] nextprev: ["Previous", "Next"], //labels for "prev" and "next" links. Set to "" to hide. enablefade: [true, 0.5], //[true/false, fadedegree] autorotate: [true, 6000], //[true/false, pausetime] onChange: function(previndex, curindex){ //event handler fired whenever script changes slide //previndex holds index of last slide viewed b4 current (1=1st slide, 2nd=2nd etc) //curindex holds index of currently shown slide (1=1st slide, 2nd=2nd etc) } }) </script>
وبالاخير قم بالبحث عن  <div id='main-wrapper'> 
واذا لم تجده قم بوضعه في المكان الدي يناسبك
<b:if cond='data:blog.url == data:blog.homepageUrl'> <div id='alwansd'> <div class='alwanw' id='slider1'> &lt;script&gt; document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/&quot;+label1+&quot;?max-results=&quot;+numposts1+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts1\&quot;&gt;&lt;\/script&gt;&quot;); &lt;/script&gt; </div> <div class='alwan-ps' id='paginate-slider1'> </div> </div> </b:if>
شاهد الدرس

أضافة محرك بحث احترافي من جزائري ويب



السلام عليكم ورحمه الله وبركاته اللهم صلى على سيدنا محمد وعلى ال محمد اهلا بكم متابعي موقع جزائري ويب وزواره الكرام في هذه تدوينة جديدة وحصرية على موقع جزائري ويب راح اقدم لكم اضافة احترافية ورائعة للمدونات جميعا وبتقنية jquery وهي عبارة عن محرك بحث احترافي وجميل من تكويدي وانشاءي.



شرح و كيفية تركيب الاضافة :
    1. داخل القالب ابحث عن  <b:skin/><[[  وضع الكود التالي اسفله
    2. أو ضعه بين   <style> و <style/>  فوق  <head/>  

.recherche { height: 16px; width: 320px; margin: 0 auto;margin-bottom: 50px; } .shea { margin-top: -64px; } #b-query { width: 276px;border-radius: 0px 2px 2px 0px; padding: 0px 4px 0px; margin: 0; background: rgba(255, 255, 255, 0.86); font-family:Electrolize,GESSTwoLight, sans-serif;border: none; float: right; text-align: right; color: #34495e; height: 48px; } #b-searchbtn { float: left;border-radius: 2px 0px 0px 2px; width: 36px; height: 48px; font: 13px Electrolize,GESSTwoLight, sans-serif; background: rgba(8, 148, 216, 0.91) url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcSGUlrDrmwknXVrrerG4hnrA-bILrgjLQdR8KOR6bycbKpqg0K9wq0dc8d6u5gC13Ec81QWekCBMYtrlYSKVGAZz84-6YpbMMB78ur9380nZc0sHAdA_Yk-m8m3ZS8pKRvoo9DVKDebc/s1600/srch.png) center no-repeat; cursor: pointer; border: none; margin: 0; padding: 0; } #b-searchbtn:hover { backgccround: rgba(252, 84, 0, c0.9) url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcSGUlrDrmwknXVrrerG4hnrA-bILrgjLQdR8KOR6bycbKpqg0K9wq0dc8d6u5gC13Ec81QWekCBMYtrlYSKVGAZz84-6YpbMMB78ur9380nZc0sHAdA_Yk-m8m3ZS8pKRvoo9DVKDebc/s1600/srch.png) center no-repeat; }

    1. ضع الكود التالي في المكان الدي يناسك
<div class="recherche"> <!-- recherche --> <div class="shea"> <form action="http://jazairiweb.blogspot.com/search" id="searchthis" method="get" style="display: inline;"> <input id="b-searchbtn" type="submit" value="" /> <input id="b-query" name="q" onblur="if (this.value == &quot;&quot;) {this.value = &quot;هل تبحث عن شئ....&quot;;}" onfocus="if (this.value == &quot;هل تبحث عن شئ....&quot;) {this.value = &quot;&quot;;}" type="text" value="هل تبحث عن شئ...." /> </form> </div> </div>
شاهد الدرس

اضافة شكل تعليقات موقع جزائري ويب المذهله





اضافت شكل تعليقات موقع جزائري ويب 2016
اليوم اشرح ان شاء الله كود CSS لتجديد شكل صندوق التعليقات الخاص بالمدونة إضافة الى ADMIN ,
وخاصة صندوق التعليقات الذي يعتبر واجهة وعلاقة الزائر بالمدونة. الصورة فى أول التدوينة 
هى النتيجة لهذا الكود اذا أعجبتك قم بإضافتها


شرح و كيفية تركيب الاضافة :
    1. داخل القالب تحرير html
    2. فوق هذا الوسم  <b:skin/>  نضع الكود التالي
/* CSS Comments */ #comments{background:#fff;clear:both;margin:20px 10px;line-height:1em;padding:20px;border:1px solid #e9e9e9;} #comments h3{ font-size: 20px; background: #128DC4; color: #FFF; padding: 11px 0px; width: 766px;} #emo-box {clear: both;margin: 0 30px;}#comments .click-comment{background:#fff;color:#fff;float:left;text-decoration:none;display:inline;line-height:20px;margin-bottom:20px;margin-top:-20px;margin-left:-20px;font-family:Lobster,ge_dinar_tworegular,sans-serif;font-size:14px;font-weight:700;text-transform:uppercase;padding:10px 0;border:1px solid #e9e9e9;border-top:none;border-left:none;} .fa-arrow-circle-down:before {content: "\f0ab";color: #999999;margin-left: 35px;font-size: 18px;} .comment_avatar_wrap{ height: 60px;} #comments .comment_avatar {position: absolute; overflow: hidden; top: 0;} .comment_avatar img{ height: 60px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWVj80IBp-uSGI3LMTnSwLkbbtE_c-FMnYmzIFkuerlQvZlxk39Cy9E-ON0i7rOUV53PrC-42FkweRrWzykLMQXO-rK6qGb8tqelgUOIpns3XI2CwoFiXVSJ637pEeN8ruW_SKPSoexUq6/s1600/avatwisted.png) no-repeat; overflow: hidden;} .comment_name a{color: #39465F; text-decoration: none;} .comment_child .comment_name a{color:#39465F;} .comment_child .comment_name a:hover {color:#128DC4;} .comment_name{ font-size: 16px; position: absolute; top: 0; padding: 20px; right: 70px; display: inline;} .comment_name:hover,.comment_name a:hover,.comment_admin .comment_name a:hover,.comment_admin .comment_name:hover{color:#F74047;} .comment_service{ position: absolute; left: 0; top: 0; padding: 22px; background: #F5F5F5;} .item-control {display:block;} .comment_date a{ font-size: 15px; color: #F74047!important; text-align: center;} .comment_date a:hover{color:#F74047!important;} .comment-delete{position:absolute;display:inline-block;top:-2px;left:50px; color:#666!important;text-align:center;font-family:Lobster,ge_dinar_tworegular;font-size:11px;padding:2px 6px;opacity:0.9;transition:all .3s ease-out;} .comment-delete:hover{color:#128DC4!important;} .comment_body{margin:20px 0;padding:0;position:relative;} .comment_body p{ line-height: 1.6em; color: #666; font-size: 13px; font-family: cursive,Lobster,ge_dinar_tworegular; word-wrap: break-word; background: #fafafa; margin-top: 0px; padding: 30px 20px; position: relative; box-shadow: 0 0 0 1px #e9e9e9; transition: all .3s ease-out; text-align: right;} .comment_child .comment_body p{color:#666;} .comment_body p img{vertical-align:middle;margin:0 5px;} .comment_body p:hover{box-shadow:0 0 0 1px #ccc;} .comment_body p:hover:before {border-bottom-color:#aaa;} .comment_inner{padding-bottom:5px;margin:5px 0} .comment_child .comment_wrap{padding-right:7%} .comment_child .comment_body{margin-top:-15px;} .comment_reply{display: inline-block; background: #446FAA; color: #fff!important; text-align: center; font-family: Lobster,ge_dinar_tworegular; font-size: 14px; padding: 6px 20px 5px 16px; opacity: 0.9; border-radius: 0px 9px 0 0; float: left; margin-top: -30px;} .comment_reply:hover{text-decoration:none!important;background:#128DC4;color:#fff!important;} .comment-form{width:100%;max-width:100%;margin-bottom:10px;padding:0;} .comment_form a{text-decoration:none;text-transform:uppercase;font-weight:700;font-family:Lobster,ge_dinar_tworegular,sans-serif;font-size:15px;color:#F74047} #comment-editor{width:103%!important;background:url(//4.bp.blogspot.com/-jSUS8v5kwpQ/U8Z_6Ufr-PI/AAAAAAAAEYY/o4cQPKvt8vQ/s1600/loading.gif) no-repeat 50% 25%;position:relative;margin-right:-8px;margin-top:-15px} .comment-form p:after {display: inline-block; content: ''; position: absolute; margin-top: 7px; height: 0; width: 0; border: 9px solid transparent; border-top-color: #555454;} .comment-form p:before {border-color:rgba(221,221,221,0);border-top-color:transparent;border-width:11px;margin-right:-11px;transition:all .3s ease-out;} .comment_reply_form{padding:0 0 0 7%} .comment_reply_form .comment-form{width:100%} .comment_emo_list .item{float: right; margin: 15px;} img.comment_emo {width: 16px; height: 16px;} .comment_emo_list span{display:block;font-weight:400;font-size:11px;letter-spacing:1px;color:#666} .comment_youtube{max-width:100%!important;width:400px;height:225px;display:block;margin:auto} .comment_img{max-width:100%!important} #respond{overflow:hidden;padding-right:10px;clear:both} .unneeded-paging-control,.comment_author_flag{display:none} .comment_admin .comment_author_flag { display: inline-block; font-size: 9px; color: #FFF; text-align: center; top: 0; background: #128DC4; padding: 5px; border-radius: 2px;;} .comment_child .comment_admin .comment_author_flag {color:#fff;left:-40%;} .spammer-detected{font-size:14px!important;color:#fff!important;background:#5cb0d8!important;margin:25px; display:inline-block;padding:10px 15px!important;} .deleted-comment{display:inline-block;color:#999;word-wrap:break-word;background:#f9f9f9;margin-top:20px;padding:10px;font-size:13px;font-family:Lobster,ge_dinar_tworegular,sans-serif;border-radius:3px;opacity:1;} iframe{border:none;overflow:hidden} .paging-control-container{text-align:center;margin:0 0 0 25%;} .paging-control-container a{text-align:center;margin:0 auto;background:#666;padding:5px 10px; color:#fff;transition:all .3s ease-out} .paging-control-container a:hover{background:#e6ae48;color:#fff;} .comment_header { background: #FAFAFA;} .comment_child .comment_header {padding:0;}

      1. ملاحظة: ادا قمت من قبل بوضع كود تعليقات بلوجر
      2. يجب عليك حدف الاكواد السابقة اولا
      3. ثم ضع كود هده الاضافة, و التعديلات سهلة جدا
    شاهد الدرس

    اضافة كود منع النسخ ماعدا داخل الاقتباس و التعليقات




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


    شرح طريقة التركيب :
    1. ادهب الى لوحة التحكم ثم تحرير "HTML"  
    2. ابحث عن كلمة  <b:skin/>  والصق الاكواد التالية اسفلها :
    <style> blockquote,.blockquote { /*** مجال النسخ داخل الاقتباس متاح ***/ -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text;} comment_body,.comment_body p { /*** مجال النسخ داخل التعليقات ***/ -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text;} body{ /*** النسخ ممنوع في كامل المدونة ***/ -webkit-user-select: none; -moz-user-select: -moz-none; -ms-user-select: none; user-select: none;} </style>
    شاهد الدرس

    تغيير شكل القوائم المرقمة داخل المشاركات حصريا



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

    شرح طريقة التركيب, معاينة توجد في التدوينة :

    1. ادا وضعت هده الاضافة من قبل قم بحدفها اولا
    2. ادهب الى لوحة التحكم ثم تحرير "HTML"  
    3. ابحث عن كلمة  <b:skin/>  واضف فوقه مباشراً الكود التالي:
    /* CSS PostStyle by JazairiWeb*/ .post ul{list-style:inherit}.post ol{counter-reset:li; list-style: none;*list-style: decimal;margin-top:6px;padding-left:0} .post ol li{position:relative;margin:0 0 8px 15px !important;padding:4px 30px 8px 5px !important;list-style:none; *list-style: decimal;background: rgba(245, 245, 245, 1); /* background color of each element */ border:1px solid #EBEBEB;text-indent:14px;} .post ol li:before{content: counter(li); counter-increment: li; position: absolute; right: 5px; width: 20px; margin: 0 0 10px 0; padding: 4px !important; color: #fff; background: #446FAA; text-indent: 6px; -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-radius: 2px;} .post ol li:after{content: ''; border: 10px solid transparent; border-left-color: #446FAA; float: left; margin-top: 3px;} .post ol li:hover:after {margin-left: 5px;border-left-color: #446FAA;transition: all 0.3s ease-out;}
    شاهد الدرس

    اضافة جميلة لمدونات بلوجر من تصميم جزائري ويب بشكل جديد



    عادة هذه الاضافة تجدونها في المواقع التي تقدم اضافات بلوجر بصفة عامة واليوم ساتكلم عن طريقة اضافتها، لن أشارككم فقط السكربت الذي يجعل الاضافة لها تاثير جميل جدل في ,بل ايضا يرافقه خط اجنبي اكثر من رائع, فانا صممت الاضافة و قمت بتطويرها و جعلها افضل من السابق وبناء على طلباتكم وضعت تدوينة .
    الآن يمكنكم رؤية المعاينة قبل أن ندخل للشرح




    شرح طريقة التركيب + معاينة الاضافة من هنا  :
    1. اذهب الى لوحة التحكم ثم تحرير "HTML"  
    2. وابحث عن كلمة  <head/>  والصق الاكواد التالية فوقها :
    <style> #header-wrap_slider {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnwEcBZdPf7Dlq4P0vH3oyccEiZwlScoyiR-IAkfLItZg2KiRXpFTC1YzKfp_l-geIbZzRUNeZ8bsooFfeBw7vt8VOD_OFI66ZWeqU3SArWCZytE_IjzqZVVUtIfoYRg3MZqY3Mywag6g/s1600/home.jpg); background-repeat: repeat; background-attachment: fixed; background-position: center center!important; background-size: cover;margin: auto 0; height: 250px; margin-bottom: 5px; margin-top: 10px; border: 5px solid #fff; overflow: hidden;}.titlewrapper-jazairiweb {margin: 20px; text-align: center; font-weight: normal; color: rgb(255, 255, 255); background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%,rgba(255, 255, 255, 0.01) 1%,rgba(255, 255, 255, 0.35) 50%,rgba(255, 255, 255, 0) 100%); font-size: 26.3px; font-family: Electrolize,ge_dinar_tworegular; }#header-wrap_info { background: #fff; margin: auto 0; height: auto; overflow: hidden;margin-top: 15px; } </style> <style> .letter-jazairiweb { height: 215px; margin: 0; z-index: 99999; margin-top: 48px;}.letter-jazairiweb h2 {font-weight: normal; font-family: Niconne,ge_dinar_tworegular; letter-spacing: 3px; text-align: center; }.letter-jazairiweb h2 a:first-child { font-family: Niconne,ge_dinar_tworegular; } .letter-jazairiweb h2 a { display: block; font-size: 130px; line-height: 122px;margin-bottom: -34px;}.letter-jazairiweb h2 a span:nth-child(1) { animation-delay: 0s; moz-animation-delay: 0s; ms-animation-delay: 0s; webkit-animation-delay: 0s; } .letter-jazairiweb h2 a span { animation: sharpen .9s linear backwards; color: #fff; moz-animation: sharpen .9s linear backwards; moz-transition: all .3s linear; ms-animation: sharpen .9s linear backwards; ms-transition: all .3s linear; opacity: 1; o-transition: all .3s linear; text-shadow: 0 0 2px #fff,1px 1px 4px rgba(0,0,0,.7); transition: all .3s linear; webkit-animation: sharpen .9s linear backwards; webkit-transition: all .3s linear; }.letter-jazairiweb h2 a span:nth-child(2) { animation-delay: .1s; moz-animation-delay: .1s; ms-animation-delay: .1s; webkit-animation-delay: .1s; }.letter-jazairiweb h2 a span:nth-child(4) { animation-delay: .3s; moz-animation-delay: .3s; ms-animation-delay: .3s; webkit-animation-delay: .3s; }.letter-jazairiweb h2 a span:nth-child(3) { animation-delay: .2s; moz-animation-delay: .2s; ms-animation-delay: .2s; webkit-animation-delay: .2s; }.letter-jazairiweb h2 a:last-child { font-family: Niconne,ge_dinar_tworegular; font-size: 35px!important; } </style>

    1. وهدا كود الاضافة ضعه في المكان الدي يناسبك :
    <header class='jazairiweb_wrap_jazairiweb wow bounceIn animated' id='header-wrap_slider'> <div id='poster'> <div class='letter-jazairiweb' id='letter-jazairiweb'> <h2> <a href='/'><span class='char1'>JazairiWeb</span><span class='char2'> </span> <span class='char3' style='color:#F74047;font-family: Clicker Script;font-weight: normal;'>2016</span> <span class='char4'> </span> </a><a href='/' style='font-size:52px;style='color:#f74047;font-family: clicker script;font-weight: normal;'> <span class='char1'>افضل موقع </span> <span class='char2'/> <span class='char3'>جزائري </span> <span class='char4'/> <span class='char5'>لتصبح </span> <span class='char6'/> <span class='char7'>مدون </span> <span class='char8'/> <span class='char9'>محترف </span> </span></span></span></span></a></h2></div></div> </header>

     لتشغيل تاثير اللمعان و الخط المزخرف فقط ضع الكود التالي اسفل  <b:skin/>  
    <link href='https://googledrive.com/host/0B2v7cH8soLJrOWlYOG9LSEY0eGs' rel='stylesheet' type='text/css'/><link href='http://fonts.googleapis.com/css?family=Clicker+Script' rel='stylesheet' type='text/css'/>
    شاهد الدرس

    إضافة أداة النشرة البريدية وعمل الخلاصة RSS



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


    شرح طريقة التركيب + معاينة الاضافة من هنا  :

    1. ادهب الى لوحة التحكم ثم تحرير "HTML"  
    2. ابحث عن كلمة  <b:skin/>  واضف فوقه مباشراً الكود التالي
    /* Subscribe Box */ #subscribe-css{position:relative;padding:20px 0;background:#374760;overflow:hidden;border-top:4px solid #eee;} .subscribe-wrapper{color:#fff;font-size:16px;line-height:normal;margin:0;text-align:center;text-transform:none;font-weight:400;width:100%} .subscribe-form{clear:both;display:block;overflow:hidden} form.subscribe-form{clear:both;display:block;margin:0;width:auto;overflow:hidden} .subscribe-css-email-field{background:#415471;color:#ccc;margin:10px 0;padding:15px 20px;width:35%;border:0;font-family: Electrolize,ge_dinar_tworegular;} .subscribe-css-email-button{ background: #E74C3C;color: #fff;cursor: pointer;font-weight: 700;padding: 11px 30px;text-transform: none;font-size: 16px;border: 0;border-radius: 3px;transition: all .6s;font-family: Electrolize,ge_dinar_tworegular;margin-right: 15px;} .subscribe-css-email-button:hover{background:#37b185;} #subscribe-css p.subscribe-note{margin:16px;text-align:center;color:rgba(255,255,255,.6);font-size:180%;font-weight:400;line-height:normal;font-family: Electrolize,ge_dinar_tworegular;} #subscribe-css p.subscribe-note span {position:relative;overflow:hidden;font-weight:700;transition:all .5s} #subscribe-css p.subscribe-note span.itatu {font-weight:400;font-style:italic;color:rgba(255,255,255,.6);text-transform:lowercase} #subscribe-css p.subscribe-note span.itatu:before,#subscribe-css p.subscribe-note span.itatu:after{display:none} #subscribe-css p.subscribe-note span:before{content:'';position:absolute;bottom:-2px;left:0;width:0;height:3px;margin:10px 0 0;background:rgba(255,255,255,.1);transition:all .5s} #subscribe-css:hover p.subscribe-note span:before{width:100%;}

    1. ضع الكود التالي في المكان الدي يناسبك
    <div id='subscribe-css'> <p class='subscribe-note'><span>إشترك</span> <span class='itatu'> فى </span>النشرة البريدية</p> <div class='subscribe-wrapper'> <div class='subscribe-form'> <form action='http://feedburner.google.com/fb/a/mailverify?uri=jazairiweb' class='subscribe-form' method='post' onsubmit='window.open (&apos;http://feedburner.google.com/fb/a/mailverify?uri=jazairiweb&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'> <input name='uri' type='hidden' value='jazairiweb'/><input name='loc' type='hidden' value='en_US'/><input autocomplete='off' class='subscribe-css-email-field' name='email' placeholder='ضع بريدك الأكلترونى هنا'/><input class='subscribe-css-email-button' title='' type='submit' value='إشترك'/></form> </div> </div> </div>
    يوجد فى هذا الكود الأخير كلمة jazairiweb مكرره ثلاث مرات
     سوف تقوم بتغييرها برابط الخلاصة التى سوف تقوم بعملها لموقعك.
    شاهد الدرس

    اضافة هيدر جزائري ويب بشكل انيق لمدونة بلوجر



    بسم الله الرحمن الرحيم السلام عليكم
    اليوم اقدم لكم هيدر جزائري ويب احترافى و هو يعتبر هيدر اضافى وليس هيدر اساسى ولكنه يعطى مدونتك جاذبية واحترافية ويفضل وضعه بعد القوائم والهيدر الاصلى يحتوى الهيدر على 4 خانات الخانة الاولى تكتب فيها نبذة مختصرة عن موقعك وعمود يحتوى على وسائل التواصل وعمود يحتوى على الكتاب الخاصين بالمدونة و عمود للنشرة البريدية, والان دعونا ندخل فى شرح التركيب كى لا اطيل عليكم.



    شرح طريقة التركيب + معاينة الاضافة من هنا  :

    1. ادهب الى لوحة التحكم ثم تحرير "HTML"  
    2. ابحث عن كلمة  <b:skin/>  واضف فوقه مباشراً الكود التالي
    #header-wrap_JW {width: 1170px;background: #4A5667 url(); background-size: cover; margin: 0 auto; height: 240px; margin-bottom: 5px; margin-top: 10px; border: 5px solid #fff; overflow: hidden;}.titlewrapper-jazairiweb {margin: 20px; text-align: center; font-weight: normal; color: rgb(255, 255, 255); background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%,rgba(255, 255, 255, 0.01) 1%,rgba(255, 255, 255, 0.35) 50%,rgba(255, 255, 255, 0) 100%); font-size: 26.3px; font-family: ge_dinar_tworegular; } #pb-footer { margin: auto; background: none; } #pb-footer h2 { margin-bottom: 20px; font-size: 16px; color: #fff; font-family: ge_dinar_tworegular; } #pb-footer h2:before {content: none; position: none; padding:none; background: none; color: none; line-height: none; } .footer-section { padding: 10px; border-left: 1px dashed #BFBFBF; font-weight: normal;float: right;width: 250px; } .footer-section:last-child { border: none; } .footer-section p { width: 160px; color: #BFBFBF;direction: rtl; text-align: justify; font-family: ge_dinar_tworegular; font-size: 12px; line-height: 16px; } .footer-section h4 { font-family: ge_dinar_tworegular;text-align: right; width: 300px; margin-bottom: 5px; margin-top: 5px; font-size: 13px; font-weight: normal; direction: ltr;color: #BFBFBF;} .pdn--vm { padding-top: 10px; padding-bottom: 21px; } .text-center { text-align: center; } .mrg--an { margin: 0;font-family: ge_dinar_tworegular;color: #fff;} #team { margin: 0 auto;text-align: center; }#team img {height: 60px;width: 60px;border-radius: 30px; border: 1px solid #ddd; margin-left: 15px; -o-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #team img:hover { border-color: #3A4755; opacity: 0.80;box-shadow: 0px 0px 18px 18px rgba(80, 80, 80, 0);-webkit-transform: translateY(-4px); transform: translateY(-4px);}

    1. اضف الكود التالي في المكان الدي تراه مناسب لمدونتك
    <header class='jazairiweb_wrap_jazairiweb' id='header-wrap_JW'> <div class='titlewrapper-jazairiweb '> جزائري ويب | تجمع لافضل القوالب و الملحقات المتنوعة</div> <div id='pb-footer'> <div class='footer-section'> <h2>موقع جزائري ويب!</h2> <p>مرحبا بزوار الكرام أتمنى أن تجدوا ما تبحثون عنه في | جزائري ويب</p></div> <div class='footer-section'> <h2>الدعم التقني</h2> <h4>jazairiweb@gmail.com</h4> <h4>skype : jazairiweb</h4></div> <div class='footer-section'> <h3 class='profile-name mrg--an'> فريق العمل: مدير الموقع فقط </h3> <div id='team'> <a href='https://www.facebook.com/jazairiweb.ok' target='_blank'><img alt='avatars-000116083896-j1l4i3-t500x500' src='http://a.top4top.net/p_104oqh53.png'/></a> <a href='http://jazairiweb.blogspot.com/p/join.html'><img alt='unknown-person' src='http://a.top4top.net/p_104oqh53.png' title='unknown-person'/></a> <a href='http://jazairiweb.blogspot.com/p/join.html'><img alt='unknown-person' src='http://a.top4top.net/p_104oqh53.png' title='unknown-person'/></a></div></div> <div class='footer-section'> <h2>اشترك الآن</h2> <h4>اشترك لتصلك كل المسابقات! أفضل وأرقى القوالب من بلوجر و اضافات و تصاميم وصولا للملفات المفتوحة&#1548; منها كذلك ملحقات متنوعة, كما اقدم هدايا عديدة</h4> </div></div> <div class='descriptionwrapper'> <p class='description'><span> </span></p></div> </header>
    شاهد الدرس
    الاشتراك في: الرسائل (Atom)

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

    برمجة: ماهرسافوح "
    مدونة جزائري ويب © جميع الحقوق محفوظة 2023