اضافة صفحة الفهرس لمدونات بلوجر النسخة الاولى

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

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

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

الان ننتقل لشرح اضافة الاضافة

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

<b:if cond='data:view.isPage'>
<style type='text/css'>
/*<![CDATA[*/
/* Sitemap */
.abdoutech-sitemap{position:relative;margin:30px auto}.abdoutech-toc-wrap{display:inline-block;width:100%}.abdoutech-toc-wrap .abdoutech-cat{background:#2e3543;border-radius:2px;color:#fff;font-size:16px;font-weight:500;padding:10px 20px;border-radius:3px;text-transform:capitalize}.abdoutech-toc::before{background:#2e3543;bottom:0;content:"";right:19.9%;margin-right:-10px;position:absolute;top:0;width:4px}.abdoutech-toc{margin:0;padding:30px 20px;position:relative}.abdoutech-sitemap ul.abdoutech-toc{margin:0;padding:30px 0;list-style-type:none}.abdoutech-toc li{list-style:none;margin:0;padding:0;position:relative;list-style-type: none!important;}.abdoutech-toc >li .toc-date{color:#999;display:block;font-size:14px;font-weight:500;position:absolute;text-transform:uppercase;top:25px;width:15%}.abdoutech-toc >li .abdoutech-icon{background:#fff;border-radius:50%;box-shadow:0 0 0 4px #2e3543;color:#fff;font-size:1.4em;font-style:normal;font-variant:normal;font-weight:normal;height:10px;right:21.2%;line-height:10px;margin:0 -25px 0 0;position:absolute;text-align:center;text-transform:none;top:30px;width:10px}.abdoutech-toc >li .abdoutech-post::after{border-color:transparent transparent transparent #f5f5f5;border-style:solid;border-width:10px;content:"";height:0;pointer-events:none;position:absolute;left:100%;top:auto;width:0}.abdoutech-toc >li .abdoutech-post{background:#f5f5f5;border-radius:5px;display:block;font-size:15px;margin:0 23% 15px 0;padding:25px 30px;position:relative}.abdoutech-toc >li .abdoutech-post a{text-decoration: none!important;color:#2e3543;font-weight:500}.abdoutech-toc >li:last-child .abdoutech-post{margin:0 23% 0 0}.abdoutech-toc >li .abdoutech-post a:hover{color:#999}
@media (max-width:768px){.abdoutech-toc > li .abdoutech-icon{display:none}}
/*]]>*/
</style>
</b:if>

الان ضع الكود هذا فوق ال </body> مباشرة

الان احفظ القالب واذهب الى صفحات و افتح صفحة وضع فيها هذا الكود الصغير

[sitemap]

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

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

Djihad Tech 21 يناير 2019 في 10:10 ص

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

AHMED 21 يناير 2019 في 10:20 ص

تسلم وردة

AHMED 21 يناير 2019 في 10:33 ص

الكود ماكو
الان ضع الكود هذا فوق ال مباشرة

عبدو تكنولوجي - Abdou Technologie 21 يناير 2019 في 11:17 ص

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

maher 21 يناير 2019 في 12:08 م

رائع جدا

سلمت يداك

Unknown 21 يناير 2019 في 1:06 م

نريد شريط الأخبار لبلوجر

Unknown 21 يناير 2019 في 1:07 م

x-)

Khalid Nouri 10 مارس 2019 في 5:08 ص

السلام اخي اين الكود الدي سوف اضعه في الصفحة الفهرس التي سأنشأها
- عبدو تكنولوجي - Abdou Technologie 10 مارس 2019 في 5:41 ص
  
  [sitemap]

يسعدنا تفاعلكم بالتعليق ولكن نرجو منكم أن يكون خاص بالموضوع