اضافة فهرس / ارشيف الي بلوجر بشكلين مختلفين

<

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

صور للأرشيف

طريقة التركيب

1.تتجه الي لوحة التحكم
2.نختار الصفحات
3.صفحة جديدة
4.نضغط علي html ونضع الكود

صورة توضيحية

الشكل الاول للمعاينة اضغط هنا

الكود

<div dir="rtl" style="text-align: right;" trbidi="on"><br /><div dir="rtl" style="text-align: right;" trbidi="on"><style type="text/css"> #toc{ width:99%; margin:5px auto; border:1px solid #2D96DF; -webkit-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2); -moz-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2); box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2); } .labl{ color:#FF5F00; font-weight:bold; margin:0 -5px; padding:1px 0 2px 11px; background:-moz-linear-gradient(right,#C2EAFE 0%,#055A85 40%); background:-webkit-gradient(linear,left 10,right 80,color-stop(0.20,#055A85),color-stop(1,#C2EAFE)); border:1px solid #2D96DF; border-radius:4px;-moz-border-radius:4px; -webkit-border-radius:4px;box-shadow:3px 3px 1px #bbb; -moz-box-shadow:3px 3px 1px #bbb;-webkit-box-shadow:3px 3px 1px #bbb;display:block; } .labl a{ color:#fff; } .labl:first-letter{t ext-transform:uppercase; } .new{ color:#FF5F00; font-weight:bold; font-style:italic; } .postname{ font-weight:normal; background:-moz-linear-gradient(right,#C2EAFE 0%,#fff 40%); background:-webkit-gradient(linear,left 80,right 10,color-stop(0.60,#fff),color-stop(1,#C2EAFE)); } .postname li{ border-bottom: #ddd 1px dotted; margin-right:5px } </style> <br /><div id="toc"><script src="https://googledrive.com/host/0ByNodV_m9cVLR0pmWFgwZ1NmdW8/" type="text/javascript"></script> <script src="http://alshabh4download.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"> </script></div></div></div>

 مع تغير رابط http://alshabh4download.blogspot.com/ برابط مدونتك

______________________________________________

الشكل الثاني للمعاينة اضغط هنا

الكود

<div dir="rtl" style="text-align: right;" trbidi="on"><br /></div><div dir="rtl" style="text-align: right;" trbidi="on"><style scoped="" type="text/css">#toc-outer { color:black; font:normal 11px/15px Arial,Sans-Serif; height:auto; margin:0 auto; overflow:hidden; padding:0; text-align:right; } #loadingscript { padding:0px 0px; height:37px; text-indent:-9999px; color:transparent; background:white url('data:image/gif;base64,R0lGODlhEAALALMMAOXp8a2503CHtOrt9L3G2+Dl7vL0+J6sy4yew1Jvp/T2+e/y9v///wAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQFCwAMACwAAAAAEAALAAAEK5DJSau91KxlpObepinKIi2kyaAlq7pnCq9p3NZ0aW/47H4dBjAEwhiPlAgAIfkECQsADAAsAAAAAAQACwAABA9QpCQRmhbflPnu4HdJVAQAIfkECQsADAAsAAAAABAACwAABDKQySlSEnOGc4JMCJJk0kEQxxeOpImqIsm4KQPG7VnfbEbDvcnPtpINebJNByiTVS6yCAAh+QQJCwAMACwAAAAAEAALAAAEPpDJSaVISVQWzglSgiAJUBSAdBDEEY5JMQyFyrqMSMq03b67WY2x+uVgvGERp4sJfUyYCQUFJjadj3WzuWQiACH5BAkLAAwALAAAAAAQAAsAAAQ9kMlJq73hnGDWMhJQFIB0EMSxKMoiFcNQmKjKugws0+navrEZ49S7AXfDmg+nExIPnU9oVEqmLpXMBouNAAAh+QQFCwAMACwAAAAAEAALAAAEM5DJSau91KxlpOYSUBTAoiiLZKJSMQzFmjJy+8bnXDMuvO89HIuWs8E+HQYyNAJgntBKBAAh+QQFFAAMACwMAAIABAAHAAAEDNCsJZWaFt+V+ZVUBAA7') no-repeat 50% 50%; } .itemposts { float: right; height: auto; overflow: hidden; width: 47%; box-shadow: 1px 1px 5px #C3C3C3; background: none repeat scroll 0% 0% #F9F9F9; border: 1px solid #FFF; margin: 3px 5px 8px; padding: 0px 3px; } .itemposts h6 { border-bottom: 1px solid #CCC; color: #333; height: 15px; overflow: hidden; text-transform: none; margin: 0px 0px 5px; padding: 2px 6px !important; font:bold 13px GE SS two medium; } .itemposts h6 a:hover { color:#38f; text-decoration:none; } .itemposts img { background-color:#fff; border:1px solid #ccc; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; float:right; height:65px; margin:0 0 5px 7px; padding:3px; width:65px; z-indent:99999px; } .itemposts .iteminside { font-family: GE SS two medium; } .itemposts .itemfoot { border-top: 1px solid #CCC; clear: both; overflow: hidden; padding: 4px 5px; font:12px GE SS two medium; } .itemposts .itemfoot a.itemrmore { color:#333; float:left; font-weight:bold; text-decoration:none; } .itemposts .itemfoot a.itemrmore:hover {text-decoration:underline} #itempager { clear:both; padding:10px 0; } #pagination, #totalposts { color:#000; display:block; font:12px GE SS two medium; margin-bottom:10px; text-align:center; padding:0; } #pagination span, #pagination a { color: #FFF; display: inline; margin: 0px 1px; padding: 2px 5px; text-indent: 0px; background-color: #068BC9; background-image: linear-gradient(#068BC9 0%, #3161C2 50%, #3059AB 51%); border: 1px solid #3161C2; text-decoration: none; border-radius: 10px; } #pagination a:hover {background-color:#333} #pagination span.actual {background-color:black} #pagination span.hidden {display:none}</style><script>var showPostDate = true, showComments = true, idMode = true, sortByLabel = false, labelSorter = "JQuery", loadingText = "Loading...", totalPostLabel = "عدد المواضيع:", jumpPageLabel = "الصفحة", commentsLabel = "التعليقات", rmoreText = "الموضوع كامل ►", prevText = "Sebelumnya", nextText = "Berikutnya", siteUrl = "http://alshabh4download.blogspot.com/", postPerPage = 10, numChars = 150, imgBlank = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC"; </script><script src="http://yourjavascript.com/1183493241/rifan-pagination.js"></script></div>

 مع تغير رابط http://alshabh4download.blogspot.com/ برابط مدونتك

<

12:34 م