خريطه الموقع الالكتروني
صفحة الفهرس أو ما يعرف بالأرشيف أو خريطة الموقع هي صفحة ضرورية , حيث تساعد الزوار في الوصول إلى المحتوى أو القسم الذي يبحثوا عنه بسهولة.
صفحة الفهرس التي سنقوم بشرح طريقة إنشاءها على المدونة , هي صفحة تعرض جميع
المقالات أو المشاركات حسب التسميات والأقسام وبشكل منتظم ، سواء كنت تستخدم قالب
مجاني أو مدفوع فإن هذه الإضافة سوف تعمل على جميع قوالب بلوجر بشكل أنيق ومميز
وبدون أي أخطاء برمجية.
طريقة تركيب صفحة الفهرس في بلوجر....
- توجه إلى الواجهة الرئيسية في Blogger.
- إنتقل إلى الصفحات من القائمة المنسدلة.
- قم بإنشاء صفحة جديدة.
- أعطي إسم للصفحة مثلا ”Sitemap”.
- نقوم بتحويل الصفحة من عرض وضع الإنشاء إلى عرض Html.
- حدد على الكود التالي بالكامل وقم بنسخه , تم ألصقه بداخل الصفحة.
<style scoped="" type="text/css">
.post-body table tr:nth-of-type(even):hover td, .post-body table tr:nth-of-type(odd):hover td { background-color: transparent!important;}
.post-body table tr:nth-of-type(odd) td { background-color: transparent!important; } .post-body table td, .post-body table caption { padding: 0 10px!important;}
#table-outer table{width:100%;margin:0 auto; box-shadow: none;}#table-outer form{font:inherit}#table-outer label{text-align:left}#table-outer select[disabled]{opacity:.4}#post-searcher{display:block;margin:0;padding:0}#table-outer input,#table-outer select{font-family:Roboto,sans-serif!important;font-size:16px!important;font-weight:500!important;text-transform:capitalize!important;outline:0;color:#333!important;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;border:1px solid #dedede;border-radius:5px;margin:0 0 5px;padding:5px}#table-outer select option{min-height:1.4em!important}#table-outer input#feed-q{padding:5px 10px!important}#feed-container{overflow:hidden;position:relative;border-top:none;display:block;clear:both;margin:10px;padding:0;list-style:none;}#feed-container li{list-style:none;margin:0 0 10px;padding:0 10px 0 0;color:#555;width:33%;text-align:center;float:right;display:inline;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}#feed-container li .inner{position: relative; overflow: hidden; word-wrap: break-word; border-radius: .3em; background: #fff; color: #555; margin: 0; padding: 50px; height: 200px; line-height: 1.2em; box-shadow: 0 1px 5px 0 rgba(0,0,0,0.1);}#feed-container li a{color:#333;font-weight:500}#feed-container li a.toc-read{text-decoration:none;color:#fff;margin-top:30px}#feed-container li .inner:hover a.toc-read{-webkit-animation-name:fadeInRight;animation-name:fadeInRight;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}#feed-container li .news-text{font-size:14px;margin-top:10px}#feed-container li .news-text div{display:none!important}#feed-container li img{margin:0;padding:0;width:100%!important;height:100%!important;position:absolute;top:0;left:0}#feed-container li .inner:hover img{transition:all 1s ease-in-out;-webkit-animation-name:fadeOutLeft;animation-name:fadeOutLeft;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;left:-500px;animation-fill-mode:both}
@-webkit-keyframes fadeOutLeft{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes fadeOutLeft{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}#result-desc{margin:0;padding:0;text-align: center;margin-top: -40px;}#result-desc div,#result-desc span{display:block;margin:0;padding:5px 0 7px;color:#D64D52}#result-desc div{color:inherit}#feed-nav{margin:10px 0 30px;text-align:center;font-weight:500}#feed-nav span{cursor:wait}@media screen and (max-width:1024px){#main-wrapper{padding:0 30px!important}#feed-container{display:block;clear:both;margin:0 -30px 0 0}#feed-container li{list-style:none;margin:0 0 30px;padding:0 30px 0 0}#feed-container li .inner{padding:20px}}@media screen and (max-width:960px){#main-wrapper{padding:0 20px!important}#feed-container{display:block;clear:both;margin:0 -20px 0 0}#feed-container li{list-style:none;margin:0 0 20px;padding:0 20px 0 0}#feed-container li .inner{padding:20px}}@media screen and (max-width:800px){#feed-container li{width:50%}}@media screen and (max-width:640px){#feed-container li .inner{height:150px}}@media screen and (max-width:414px){#table-outer table,#feed-container li{width:100%}#table-outer table,#table-outer label{text-align:center}#table-outer table td{display:block;margin:0 auto 5px;clear:both;float:none}#table-outer label{margin:0}#table-outer{padding:0}}@media (max-width:414px){#table-outer table td{text-align:center;display:block}#table-outer label{text-align:center;display:block;margin:0;padding:4px 0 0}#table-outer input,#table-outer select{margin:0 0 10px}}a.btn-default{color:#333}#feed-nav a{color:#fff}#feed-nav a{background-image:none}#feed-nav a{font-weight:400}#feed-nav a{border-radius:4px;margin-bottom:5px;font-size:14px;line-height:1.42857143;text-align:center;white-space:nowrap;vertical-align:middle;-ms-touch-action:manipulation;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;touch-action:manipulation;cursor:pointer;user-select:none;display:inline-block;padding:6px 12px}
#feed-nav { text-align: center; font-weight: 500; margin: 0 auto; }
#feed-nav a:focus,#feed-nav a:hover,#feed-nav a:hover{text-decoration:none;color:#eee;outline:0;background: #322d2b;}.btn-default{background:#fff;color:#333;border-color:#ccc}.btn-default:focus{background:#e6e6e6;color:#333;border-color:#8c8c8c}.btn-default:active,.btn-default:hover{background:#e6e6e6;color:#333;border-color:#adadad}#feed-nav a{background:#FF5722;color:#fff;}.btn-success{background:#5cb85c;color:#fff;border-color:#4cae4c}.btn-success:focus{background:#449d44;color:#fff;border-color:#255625}
a.btn.btn-primary.btn-sm.toc-read { background: #F44336; }
#feed-nav a{font-size:18px;padding:10px 16px;border-radius:6px;line-height:1.3333333}.parser,.btn-sm,.btn-xs{border-radius:3px;font-size:12px;line-height:1.5}.btn-sm{padding:5px 10px}.comments .paging-control-container .paging-control,.parser,.btn-xs{padding:1px 5px}#feed-nav a{display:block;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;width:100%;box-sizing:border-box}.btn-block+.btn-block{margin-top:5px}.comment_form>a+a{border-color:#fff;padding:0;margin-bottom:0;background:#fff}
</style>
<div id="table-outer">
<table><tbody>
<tr> <td>
<label> تصنيف المنشورات : </label>
</td> <td>
<select id="feed-order">
<option selected="" value="published">المشاركات الأخيرة</option>
<option value="updated">التدوينات التي تم تحديثها مؤخرا</option>
</select>
</td> </tr>
<tr> <td>
<label>تصنيف الأقسام : </label>
</td> <td>
<select disabled="" id="label-sorter">
<option selected="">الأقسام...</option>
</select>
</td> </tr>
<tr> <td>
<label>البحث عن التدوينات بحسب الكلمة الرئيسية : </label>
</td> <td>
<form id="post-searcher">
<input id="feed-q" placeholder="ابحث هنا..." type="text" />
</form>
</td> </tr>
</tbody> </table>
</div>
.
<header id="result-desc"></header>
<ul id="feed-container"></ul>
<div id="feed-nav">
</div>
<script src="//raw.githack.com/iHussam/ar1web/master/sit.js"></script><div id="gtx-trans" style="left: 688px; position: absolute; top: 69px;"><div class="gtx-trans-icon"></div></div>
بعد إضافة السكربت الخاص بإنشاء صفحة الأرشيق في بلوجر. يجب عليك تغيير رابط
مدونتي "mr-medo.net" برابط المدونة الخاص بك , والذي يظهر لك باللون الأحمر.
ينتهي هنا موضوعنا عن "إضافة صفحة فهرس في مدونة بلوجر – صفحة ارشيف احترافيه 2022"، ونلتقي في موضوع جديد على مدونة مستر ميدو. دمتم في امان الله :)