خريطة الموقع sitemap
طريقة و كيفية اضافة صفحة خريطة المدونة او خريطة الموقع داخل مدونتك لتسهيل امر التنقل بين صفحات مدونتك .
عنوان الدرس : كيفية اضافة صفحة خريطة الموقع بشكل انيق وجميل .
بسم الله الرحمان الرحيم
السلام عليكم و رحمة الله وبركاته مرحبا بكم في درس جديد في هذا الدرس
ان شاء الله
سنتحدث عن طريقة و كيفية اضافة صفحة خريطة الموقع sitmap داخل المدونة لتسهيل الامر على الزائر للتنقل بين مواضيع مدونتك .
<div dir="rtl" style="text-align: right;" trbidi="on">
style
="text-align: justify;"><div dir="rtl" style="text-align: right;" trbidi="on">
style
="text-align: justify;"><br /></div>
style
="text-align: justify;"><style>
style
="text-align: justify;">/* Skin for Blogger Tabbed Layout TOC */
style
="text-align: justify;">#tabbed-toc {
style
="text-align: justify;"> margin: 0 auto;
style
="text-align: justify;"> background-color: #FFFFFF;
style
="text-align: justify;"> border: 4px dashed rgb(48, 167, 229);
style
="text-align: justify;"> -webkit-box-shadow: 0 1px 3px rgba(0,0,0,.4);
style
="text-align: justify;"> -moz-box-shadow: 0 1px 3px rgba(0,0,0,.4);
style
="text-align: justify;"> box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.55);
style
="text-align: justify;"> overflow: hidden;
style
="text-align: justify;"> position: relative;
style
="text-align: justify;"> color: #333;
style
="text-align: justify;">}
style
="text-align: justify;">#tabbed-toc .loading {
style
="text-align: justify;"> display:block;
style
="text-align: justify;"> padding:5px 10px;
style
="text-align: justify;"> font:normal bold 10px/normal Helmet,Freesans,Sans-Serif;
style
="text-align: justify;"> color:white;
style
="text-align: justify;">}
style
="text-align: justify;">#tabbed-toc ul,
style
="text-align: justify;">#tabbed-toc ol,
style
="text-align: justify;">#tabbed-toc li {
style
="text-align: justify;"> margin:0 0;
style
="text-align: justify;"> padding:0 0;
style
="text-align: justify;"> list-style:none;
style
="text-align: justify;">}
style
="text-align: justify;">#tabbed-toc .toc-tabs {
style
="text-align: justify;"> width:20%;
style
="text-align: justify;"> float:right;
style
="text-align: justify;">}
style
="text-align: justify;">#tabbed-toc .toc-tabs li a {
style
="text-align: justify;"> display:block;
style
="text-align: justify;"> font:normal bold 10px/28px Helmet,Freesans,Sans-Serif;
style
="text-align: justify;"> height:28px;
style
="text-align: justify;"> overflow:hidden;
style
="text-align: justify;"> text-overflow:ellipsis;
style
="text-align: justify;"> color: #434B50;
style
="text-align: justify;"> text-transform:uppercase;
style
="text-align: justify;"> text-decoration:none;
style
="text-align: justify;"> padding:0 12px;
style
="text-align: justify;"> cursor:pointer;
style
="text-align: justify;">}
style
="text-align: justify;">#tabbed-toc .toc-tabs li a:hover {
style
="text-align: justify;"> background-color:rgba(110, 193, 255, 0.68);
style
="text-align: justify;"> color:white;
style
="text-align: justify;">}
style
="text-align: justify;">#tabbed-toc .toc-tabs li a.active-tab {
style
="text-align: justify;"> background-color: #6EC1FF;
style
="text-align: justify;"> color:white;
style
="text-align: justify;"> -webkit-box-shadow:-2px 2px 2px rgba(0,0,0,.5);
style
="text-align: justify;"> -moz-box-shadow:-2px 2px 2px rgba(0,0,0,.5);
style
="text-align: justify;"> box-shadow:-2px 2px 2px rgba(0,0,0,.5);
style
="text-align: justify;"> position:relative;
style
="text-align: justify;"> z-index:5;
style
="text-align: justify;"> margin:0 0 0 -1px;
style
="text-align: justify;"> /* cursor:text; */
style
="text-align: justify;">}
style
="text-align: justify;">#tabbed-toc .toc-content,
style
="text-align: justify;">#tabbed-toc .divider-layer {
style
="text-align: justify;"> width: 80%;
style
="text-align: justify;"> float: left;
style
="text-align: justify;"> background-color: white;
style
="text-align: justify;"> border-right: 2px dotted #30A7E5;
style
="text-align: justify;"> -webkit-box-sizing: border-box;
style
="text-align: justify;"> -moz-box-sizing: border-box;
style
="text-align: justify;"> box-sizing: border-box;
style
="text-align: justify;">}
style
="text-align: justify;">#tabbed-toc .divider-layer {
style
="text-align: justify;"> float:none;
style
="text-align: justify;"> display:block;
style
="text-align: justify;"> position:absolute;
style
="text-align: justify;"> top:0;
style
="text-align: justify;"> left:0;
style
="text-align: justify;"> bottom:0;
style
="text-align: justify;"> -webkit-box-shadow:0 0 7px rgba(0,0,0,.7);
style
="text-align: justify;"> -moz-box-shadow:0 0 7px rgba(0,0,0,.7);
style
="text-align: justify;"> box-shadow:0 0 7px rgba(0,0,0,.7);
style
="text-align: justify;">}
style
="text-align: justify;">#tabbed-toc .panel {
style
="text-align: justify;"> position:relative;
style
="text-align: justify;"> z-index:5;
style
="text-align: justify;"> font:normal normal 10px/normal Helmet,Freesans,Sans-Serif;
style
="text-align: justify;">}
style
="text-align: justify;">#tabbed-toc .panel li a {
style
="text-align: justify;"> display: block;
style
="text-align: justify;"> position: relative;
style
="text-align: justify;"> font-weight: bold;
style
="text-align: justify;"> font-size: 14px;
style
="text-align: justify;"> color: #434B50;
style
="text-align: justify;"> line-height: 40px;
style
="text-align: justify;"> height: 35px;
style
="text-align: justify;"> padding: 0 12px;
style
="text-align: justify;"> text-decoration: none;
style
="text-align: justify;"> outline: none;
style
="text-align: justify;"> overflow: hidden;
style
="text-align: justify;">}
style
="text-align: justify;">#tabbed-toc .panel li time {
style
="text-align: justify;"> display:block;
style
="text-align: justify;"> font-style:italic;
style
="text-align: justify;"> font-weight:normal;
style
="text-align: justify;"> font-size:10px;
style
="text-align: justify;"> color:#666;
style
="text-align: justify;"> float:left;
style
="text-align: justify;">}
style
="text-align: justify;">#tabbed-toc .panel li .summary {
style
="text-align: justify;"> display:block;
style
="text-align: justify;"> padding:10px 12px 10px;
style
="text-align: justify;"> font-style:italic;
style
="text-align: justify;"> border-bottom:4px solid #275827;
style
="text-align: justify;"> overflow:hidden;
style
="text-align: justify;">}
style
="text-align: justify;">#tabbed-toc .panel li .summary img.thumbnail {
style
="text-align: justify;"> float:right;
style
="text-align: justify;"> display:block;
style
="text-align: justify;"> margin:0 0 0 8px;
style
="text-align: justify;"> padding:4px 4px;
style
="text-align: justify;"> width:72px;
style
="text-align: justify;"> height:72px;
style
="text-align: justify;"> border:1px solid #dcdcdc;
style
="text-align: justify;"> background-color:#fafafa;
style
="text-align: justify;">}
style
="text-align: justify;">#tabbed-toc .panel li:nth-child(even) {
style
="text-align: justify;"> background-color: #CAE6F2;
style
="text-align: justify;">}
style
="text-align: justify;">#tabbed-toc .panel li a:hover,
style
="text-align: justify;">#tabbed-toc .panel li a:focus,
style
="text-align: justify;">#tabbed-toc .panel li a:hover time,
style
="text-align: justify;">#tabbed-toc .panel li.bold a {
style
="text-align: justify;"> background-color:#333;
style
="text-align: justify;"> color:white;
style
="text-align: justify;"> outline:none;
style
="text-align: justify;">}
style
="text-align: justify;">#tabbed-toc .panel li.bold a:hover,
style
="text-align: justify;">#tabbed-toc .panel li.bold a:hover time {
style
="text-align: justify;"> background-color:#222;
style
="text-align: justify;">}
style
="text-align: justify;">@media (max-width:700px) {
style
="text-align: justify;"> #tabbed-toc {
style
="text-align: justify;"> border:2px solid #333;
style
="text-align: justify;"> }
style
="text-align: justify;"> #tabbed-toc .toc-tabs,
style
="text-align: justify;"> #tabbed-toc .toc-content {
style
="text-align: justify;"> overflow:hidden;
style
="text-align: justify;"> width:auto;
style
="text-align: justify;"> float:none;
style
="text-align: justify;"> display:block;
style
="text-align: justify;"> }
style
="text-align: justify;"> #tabbed-toc .toc-tabs li {
style
="text-align: justify;"> display:inline;
style
="text-align: justify;"> float:right;
style
="text-align: justify;"> }
style
="text-align: justify;"> #tabbed-toc .toc-tabs li a,
style
="text-align: justify;"> #tabbed-toc .toc-tabs li a.active-tab {
style
="text-align: justify;"> background-color:#224C19;
style
="text-align: justify;"> -webkit-box-shadow:2px 0 7px rgba(0,0,0,.4);
style
="text-align: justify;"> -moz-box-shadow:2px 0 7px rgba(0,0,0,.4);
style
="text-align: justify;"> box-shadow:2px 0 7px rgba(0,0,0,.4);
style
="text-align: justify;"> }
style
="text-align: justify;"> #tabbed-toc .toc-tabs li a.active-tab {
style
="text-align: justify;"> background-color:white;
style
="text-align: justify;"> color:#333;
style
="text-align: justify;"> }
style
="text-align: justify;"> #tabbed-toc .toc-content {
style
="text-align: justify;"> border:none;
style
="text-align: justify;"> }
style
="text-align: justify;"> #tabbed-toc .divider-layer,
style
="text-align: justify;"> #tabbed-toc .panel li time {
style
="text-align: justify;"> display:none;
style
="text-align: justify;"> }
style
="text-align: justify;">}
style
="text-align: justify;"></style>
style
="text-align: justify;"><br>
style
="text-align: justify;"><div id="tabbed-toc">
style
="text-align: justify;"><span class="loading">Loading...</span></div>
style
="text-align: justify;"><br>
style
="text-align: justify;"><br>
style
="text-align: justify;"><br>
style
="text-align: justify;"><br>
style
="text-align: justify;"><br>
style
="text-align: justify;"><script type="text/javascript">
style
="text-align: justify;">var tabbedTOC = {
style
="text-align: justify;"> blogUrl: "<font color="#ff0000">http://alkhayro.blogspot.com</font>", // Blog URL
style
="text-align: justify;"> containerId: "tabbed-toc", // Container ID
style
="text-align: justify;"> activeTab: 1, // The default active tab index (default: the first tab)
style
="text-align: justify;"> showDates: false, // `true` to show the post date
style
="text-align: justify;"> showSummaries: false, // `true` to show the posts summaries
style
="text-align: justify;"> numChars: 200, // Number of summary chars
style
="text-align: justify;"> showThumbnails: false, // `true` to show the posts thumbnails (Not recommended)
style
="text-align: justify;"> thumbSize: 40, // Thumbnail size
style
="text-align: justify;"> noThumb: "http://3.bp.blogspot.com/-vpCFysMEZys/UOEhSGjkfnI/AAAAAAAAFwY/h1wuA5kfEhg/s72-c/grey.png", // A "no thumbnail" URL
style
="text-align: justify;"> monthNames: [ // Array of month names
style
="text-align: justify;"> "يناير",
style
="text-align: justify;"> "فبراير",
style
="text-align: justify;"> "مارس",
style
="text-align: justify;"> "ابريل",
style
="text-align: justify;"> "ماي",
style
="text-align: justify;"> "يونيو",
style
="text-align: justify;"> "يوليوز",
style
="text-align: justify;"> "غشت",
style
="text-align: justify;"> "شتنبر",
style
="text-align: justify;"> "اكتوبر",
style
="text-align: justify;"> "نونبر",
style
="text-align: justify;"> "دجنبر"
style
="text-align: justify;"> ],
style
="text-align: justify;"> newTabLink: true, // Open link in new window?
style
="text-align: justify;"> maxResults: 99999, // Maximum post results
style
="text-align: justify;"> preload: 0, // Load the feed after 0 seconds (option => time in milliseconds || "onload")
style
="text-align: justify;"> sortAlphabetically: true, // `false` to sort posts by published date
style
="text-align: justify;"> showNew: 7, // `false` to hide the "New!" mark in most recent posts, or define how many recent posts are to be marked
style
="text-align: justify;"> newText: " - <em style='color:red;'>جديد</em>" // HTML for the "New!" text
style
="text-align: justify;">};
style
="text-align: justify;"></script>
style
="text-align: justify;"><script src="http://dte-project.googlecode.com/svn/trunk/tabbed-toc.js" type="text/javascript"></script></div>
style
="text-align: justify;">
ليست هناك تعليقات: