Карта сайта

автор **Феникс** Ноябрь 24th 2016, 21:47

В таблицу стилей CSS :

Код:: /* SitemapForum by Mạc Lục Phàm */ body.hiddenOverflow{overflow:hidden;} .sitemapOpen{background:url('https://i57.servimg.com/u/f57/18/74/01/46/quickn10.png') no-repeat left center;display:inline-block;cursor:pointer;padding:4px;padding-left:24px;font-weight:700;} #sitemapOverlay{background:rgba(0,0,0,0.8);position:fixed;top:0;left:0;width:100%;height:100%;display:none;z-index:9999;} #sitemapSection{width:80%;margin:10%;background:#fafafa;border:10px solid #ddd;box-sizing:border-box;} #sitemapHeading{font-size:16px;line-height:normal;padding:5px 15px;background:#333;color:#fff;font-weight:700;} #sitemapMain{display:table;width:100%;} #sitemapMain .sitemapColumn{display:table-cell;} #sitemapMain .sitemapInhead{padding:5px 20px;background:#eee;} #sitemapMain .sitemapQuickLinks{display:block;list-style:none;border-bottom:1px solid #eee;} #sitemapMain .sitemapQuickLinks a{display:block;padding:5px 20px;} #sitemapMain .sitemapQuickLinks a:hover{background:#eee;} #zzSitemap{overflow:auto;height:237px;} #zzSitemap ul{list-style:none;} #zzSitemap ul li a{display:block;padding:5px 15px;} #zzSitemap ul li a:hover{background:#eee;} #zzSitemap ul > li > ul > li{padding-left:15px;} #sitemapOption{text-align:right;} #sitemapOption a{display:inline-block;margin:10px 25px;padding:5px 15px;background:#333;color:#fff;border:1px solid #aaa;box-shadow:0 1px 2px #eee;cursor:pointer;}

В основные скрипты с расположением на всех страницах :

Код:: $(function() { var $smOpen = $('.sitemapOpen'), $smClose = $('#sitemapClose'), $smMain = $('#sitemapOverlay'), $bodyOv = $('body'); $smOpen.click(function() { $smMain.fadeIn(); $bodyOv.addClas('hiddenOverflow'); }); $smClose.click(function() { $smMain.fadeOut(); $bodyOv.removeClas('hiddenOverflow'); }); /* Перенос программ на карту сайта */ var $cat = $("<ul>", { "data-level": 2, "class": "group-map" }); $("#zzSitemap").html($cat); var $link = ""; var $li = ""; var catLevel = 2; var currLevel = 0; $('option', '[name="selected_id"]').each(function() { var $this = $(this); var $val = $this.val(); if ($val != "-1") { var $html = $this.html(); var $name = $html.match(/^.*\|--(.*)/)[1]; currLevel = $html.split(/ |\|/).length; if (catLevel < currLevel) { $li.addClass("cat-map"); $("<ul>", { "data-level": currLevel, "class": "group-map" }).appendTo($li); } $link = $("<a>", { href: "/" + $val + "-jump", text: $name }); $li = $("<li>", { html: $link }); $li.appendTo('.group-map[data-level="' + currLevel + '"]:last'); catLevel = currLevel; } }); });

Найдите в шаблоне overall_footer_end строку :

Код::

Выше него вставьте код :

Код:: <div id="sitemapOverlay"> <div id="sitemapSection"> <h3 id="sitemapHeading"> Быстрая навигация </h3> <div id="sitemapMain"> <div class="sitemapColumn" style="width:30%;border-right:1px solid #ddd;"> <div class="sitemapInhead"> Общие ссылки </div> <ul class="sitemapQuickLinks"> <li><a href="/">Главная</a></li> <li><a href="/forum">Форум</a></li>  <li><a href="/register">Регистрация</a></li> <li><a href="/login">Вход</a></li>   <li><a href="/login?logout=1">Выход</a></li>  </ul>  <ul class="sitemapQuickLinks"> <li><a href="/profile?mode=editprofile">Редактирование профиля</a></li> <li><a href="/profile?mode=editprofile&page_profil=avatars">Аватар</a></li> <li><a href="/search?search_id=newposts">Новые сообщения</a></li> <li><a href="/privmsg?folder=inbox">Личные сообщения</a></li> </ul>  </div> <div class="sitemapColumn" style="width:70%"> <div class="sitemapInhead"> Список форумов </div> <div id="zzSitemap"></div> </div> </div> <div id="sitemapOption"> <a id="sitemapClose"> Закрыть </a> </div> </div> </div>

Результат :

Карта сайта Yeazua27

В любое место, где Вам нужна кнопочка, размещаете код :

Код:: <a class="sitemapOpen" href="#sitemap"> Быстрая навигация </a>

Появится такая кнопочка : Карта сайта Quickn10

Быстрая навигация

автор **Феникс** Ноябрь 25th 2016, 13:15

Сделал себе вот такую тему для "карты сайта", решил поделиться. smile

CSS-стиль для этой темы :

Код:: /* SitemapForum by Mạc Lục Phàm */ body.hiddenOverflow{overflow:hidden;} .sitemapOpen{background:url('https://i57.servimg.com/u/f57/18/74/01/46/quickn10.png') no-repeat left center;display:inline-block;cursor:pointer;padding:4px;padding-left:24px;font-weight:700;} #sitemapOverlay{background:rgba(0,0,0,0.8);position:fixed;top:0;left:0;width:100%;height:100%;display:none;z-index: 999;} #sitemapSection{width:70%;margin:15%;background:#fafafa; border-radius:20px;padding: 1em; box-shadow: 0 0 10px 5px rgba(221, 221, 221, 1);} #sitemapHeading{text-transform:none;font-size:16px;line-height:normal;padding:5px 15px;background: #005094;border-bottom: 1px solid #3373a9;border-top: 1px solid #003867;color:#fff;font-weight:700;} #sitemapMain{display:table;width:100%;} #sitemapMain .sitemapColumn{display:table-cell;} #sitemapMain .sitemapInhead{padding:5px 20px;background:#eee;} #sitemapMain .sitemapQuickLinks{display:block;list-style:none;border-bottom:1px solid #eee;} #sitemapMain .sitemapQuickLinks a{display:block;padding:5px 20px;} #sitemapMain .sitemapQuickLinks a:hover{background:#eee;} #zzSitemap{overflow:auto;height:237px;} #zzSitemap ul{list-style:none;} #zzSitemap ul li a{display:block;padding:5px 15px;} #zzSitemap ul li a:hover{background:#eee;} #zzSitemap ul > li > ul > li{padding-left:15px;} #sitemapOption{text-align:right;} #sitemapOption a{display:inline-block;color:#FFF!important;background:#2980b9;margin:6px 2px 2px 6px;padding:5px 10px;box-shadow:2px 2px 0 #CCC;cursor:pointer;} #sitemapOption a:hover{background:#444!important;box-shadow:initial;margin:6px 2px 2px 6px}

Карта сайта

Карта сайта

Re: Карта сайта