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

السلام عليكم ومرحبا بكم في مدونة عبدو تكنولوجي 

شرح اليوم على اضافة صفحة ارشيف للمدونة بشكل جديد وحصري و انيق

اولا معاينة الاضافة من هنا

نبدا الشرح على بركة الله

• اولا ابحث على </b:skin> وضه الكود التالي فوقه مباشرة

/* archive page*/ html[dir="rtl"] .abdoutech-com-archive{font-style:normal} html[dir="rtl"] .abdoutech-com-archive .item{overflow:hidden;margin-bottom:10px} html[dir="rtl"] .abdoutech-com-archive .archive-thumb{float:right;margin-left:20px;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px} html[dir="rtl"] .abdoutech-com-archive .archive-href{text-decoration:none;display:block;font-size:16px;font-weight:700;color:#444444} html[dir="rtl"] .abdoutech-com-archive .archive-qism:before{font-family:fontawesome;font-size:14px;display:inline-block;color:#fff;content:"\f02c";font-weight:400;background:#ce0a46;background:-webkit-linear-gradient(-15deg,#ce0a46,#e98125);background:-o-linear-gradient(-15deg,#ce0a46,#e98125);background:-webkit-linear-gradient(-75deg,#ce0a46,#e98125);background:-o-linear-gradient(-75deg,#ce0a46,#e98125);background:linear-gradient(-15deg,#ce0a46,#e98125);width:46px;height:100%;position:absolute;text-align:center;padding-top:12px;top:0;right:0;font-size:22px;-webkit-border-radius:0 100px 100px 0;border-radius:0 100px 100px 0} html[dir="rtl"] .abdoutech-com-archive .archive-qism{padding-right:60px;-webkit-border-radius:0 100px 100px 0;border-radius:0 100px 100px 0;border-left:5px solid #d0021b;display:block;font-size:20px;font-weight:700;margin-top:20px;background-color:#eeeeee;padding:5px 30px;margin-bottom:10px;height:57px;position:relative;line-height:1.5em} html[dir="rtl"] .abdoutech-com-archive .archive-qism b{font-size:19px;padding:0 27px;margin:7px auto;display:inline-table} html[dir="rtl"] .abdoutech-com-archive .archive-qism-num{position:absolute;font-size:14px;background-color:rgba(0,0,0,0.1);padding:5px 10px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;font-weight:700;top:-webkit-calc(50% - 20px);top:-moz-calc(50% - 20px);top:calc(50% - 20px);left:20px} html[dir="rtl"] .abdoutech-com-archive .archive-qism-num u{text-decoration:none;margin:0 2px} html[dir="rtl"] .abdoutech-com-archive .archive-date{display:inline-block;vertical-align:top;font-size:10px;padding:0 10px;-webkit-border-radius:300px;-moz-border-radius:300px;border-radius:300px;margin-bottom:8px;font-weight:700;line-height:2em} html[dir="rtl"] .abdoutech-com-archive .archive-date{color:#bdbdbd;margin-left:5px;font-size:12px} html[dir="rtl"] .abdoutech-com-archive .archive-date i{margin:0 4px} html[dir="rtl"] .abdoutech-com-archive .archive-href:hover{color:#d0021b} /*ltr*/ html[dir="ltr"] .abdoutech-com-archive{font-style:normal} html[dir="ltr"] .abdoutech-com-archive .item{overflow:hidden;margin-bottom:10px} html[dir="ltr"] .abdoutech-com-archive .archive-thumb{float:left;margin-right:20px;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px} html[dir="ltr"] .abdoutech-com-archive .archive-href{text-decoration:none;display:block;font-size:16px;font-weight:700;color:#444444} html[dir="ltr"] .abdoutech-com-archive .archive-qism:before{font-family:fontawesome;font-size:14px;display:inline-block;color:#fff;content:"\f02c";font-weight:400;background:#ce0a46;background:-webkit-linear-gradient(15deg,#ce0a46,#e98125);background:-o-linear-gradient(15deg,#ce0a46,#e98125);background:-webkit-linear-gradient(75deg,#ce0a46,#e98125);background:-o-linear-gradient(75deg,#ce0a46,#e98125);background:linear-gradient(15deg,#ce0a46,#e98125);width:46px;height:100%;position:absolute;text-align:center;padding-top:12px;top:0;left:0;font-size:22px;-webkit-border-radius:100px 0 0 100px;border-radius:100px 0 0 100px} html[dir="ltr"] .abdoutech-com-archive .archive-qism{padding-left:60px;-webkit-border-radius:100px 0 0 100px;border-radius:100px 0 0 100px;border-right:5px solid #d0021b;display:block;font-size:20px;font-weight:700;margin-top:20px;background-color:#eeeeee;padding:5px 30px;margin-bottom:10px;height:57px;position:relative;line-height:1.5em} html[dir="ltr"] .abdoutech-com-archive .archive-qism b{font-size:19px;padding:0 27px;margin:7px auto;display:inline-table} html[dir="ltr"] .abdoutech-com-archive .archive-qism-num{position:absolute;font-size:14px;background-color:rgba(0,0,0,0.1);padding:5px 10px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;font-weight:700;top:-webkit-calc(50% - 20px);top:-moz-calc(50% - 20px);top:calc(50% - 20px);right:20px} html[dir="ltr"] .abdoutech-com-archive .archive-qism-num u{text-decoration:none;margin:0 2px} html[dir="ltr"] .abdoutech-com-archive .archive-date{display:inline-block;vertical-align:top;font-size:10px;padding:0 10px;-webkit-border-radius:300px;-moz-border-radius:300px;border-radius:300px;margin-bottom:8px;font-weight:700;line-height:2em} html[dir="ltr"] .abdoutech-com-archive .archive-date{color:#bdbdbd;margin-right:5px;font-size:12px} html[dir="ltr"] .abdoutech-com-archive .archive-date i{margin:0 4px} html[dir="ltr"] .abdoutech-com-archive .archive-href:hover{color:#d0021b}

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

<b:if cond='data:view.isPage'><script type='text/javascript'>//<![CDATA[ var textmonth = ["يناير","فبراير","مارس","أبريل","مايو","يونيو"," يوليو"," أغسطس","سبتمبر","أكتوبر","نوفمبر"," ديسمبر"]; var noimg ="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjv1p9_t1JpQ0sREKH55ZWf3QO081aapbZ-uNvOV2iliQgyrV8VSNeJcYMC-7nUVAZ5ayAr676xzXw7FiuYoBALwQ79GOGqhZiyNkZhBGzXqCz5ZdEOf7zBRBKV3oi9FvPDHqmGT62pz0nD/s1600/noimg.png"; var textscript ="مشاركة"; !function(){var e=document.createElement("script") e.type="text/javascript",e.async=!0,e.src="https://cdn.jsdelivr.net/gh/abdelalilebbihi/abdou_tech/gadget/abdoutech-archive.js" var t=document.getElementsByTagName("script")[0] t.parentNode.insertBefore(e,t)}(); //]]></script></b:if>

• الان احفظ القالب و افتح صفحة الارشيف وضع الكود التالي عليها و انشرها 

<i class="abdoutech-com-archive"></i>

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

شارك الموضوع عبر :



free-blogger