О Карте Блога для Blogspot

Рабочая Карта Блога для Blogspot или Sitemap на странице

 Карта Блога (Sitemap) для посетителей - присутствует практически на каждом Блоге на Blogspot. Иногда ее называют «Содержание Блога» или «Все статьи Блога», однако сущность содержимого от этого не меняется. К великому сожалению Блогеров, подавляющее число предлагаемых в Интернете скриптов уже не работают по разным причинам. А жаль, ибо среди них были вполне достойные повторения экземпляры.
 Но мы установим работающую (пока) карту на страницу вашего Блога. Как она выглядит – смотрим страничку «Содержание» этого блога.
Преимущество подобной карты Блога перед другими заключается в том, что весь ее код устанавливается сразу на определенную статичную страницу блога.


И нам не нужно, как в других предлагаемых вариантах, редактировать код шаблона, что немаловажно для начинающих Блогеров.
В случае возникшей неработоспособности этой карты в будущем, можно просто удалить саму созданную статичную страницу или заменить весь старый код на новый работоспособный.

Чтобы установить такую карту сайта для Blogspot , нужно:

1. В настройках блога зайти в пункт - «Страницы».

2. Далее нажать кнопку - «Создать страницу».

3. Вписать название страницы: "Карта блога" или "Карта сайта", или "Содержание".

4. Перейти в режим редактирования страницы HTML.

5. Вставить скопированный ниже код на страницу

КОД КАРТЫ

<style>
/* CSS Full Sitemap */
#bp_toc {background:#1B9A0C;color:#666;margin:0 auto;padding:5px;}
span.toc-note {padding:20px;margin:0 auto;display:block;text-align:center;color:#F5F2F2;font-family:'Open Sans';font-weight:700;text-transform:uppercase;font-size:30px;line-height:normal;}
.toc-header-col1 {padding:10px;background-color:#f5f5f5;width:250px;}
.toc-header-col2 {padding:10px;background-color:#f5f5f5;width:75px;}
.toc-header-col3 {padding:10px;background-color:#f5f5f5;width:125px;}
.toc-header-col1 a:link, .toc-header-col1 a:visited, .toc-header-col2 a:link, .toc-header-col2 a:visited, .toc-header-col3 a:link, .toc-header-col3 a:visited {font-size:13px;
text-decoration:none;color:#aaa;font-family:'Open Sans';font-weight:700;letter-spacing: 0.5px;}
.toc-header-col1 a:hover, .toc-header-col2 a:hover, .toc-header-col3 a:hover {
text-decoration:none;}
.toc-entry-col1, .toc-entry-col2, .toc-entry-col3 {background:#fdfdfd;padding:5px;padding-left:5px;font-size:89%}
.toc-entry-col1 a, .toc-entry-col2 a, .toc-entry-col3 a{color:#666;font-size:13px;}
.toc-entry-col1 a:hover, .toc-entry-col2 a:hover, .toc-entry-col3 a:hover{color:#e76e66;}
#bp_toc table {width:100%;margin:0 auto;counter-reset:rowNumber;}
.toc-entry-col1 {counter-increment:rowNumber;}
#bp_toc table tr td.toc-entry-col1:first-child::before {content: counter(rowNumber);min-width:1em;margin-right:0.5em;}
td.toc-entry-col2 {background:#fafafa;}
</style>
<div id="bp_toc">
</div>
<script src="https://cdn.rawgit.com/Arlina-Design/redvision/master/sitemap-content.js" type="text/javascript"></script> <script src="/feeds/posts/summary?alt=json-in-script&amp;max-results=9999&amp;callback=loadtoc" type="text/javascript"></script>
<style scoped="" type="text/css">
#comments {display:none;}
</style>

Теперь готовую страницу можно опубликовать.

В результате на страничке вы получите такой вид своей Карты Блога.

В коде, между строчек <style> и </style> - можно изменить оформление карты, размер шрифта и так далее. А вот, к сожалению, чтобы поменять английские слова на русские, вам придётся серьезно поработать. Для этого, нужно скопировать скрипт расположенный по этому адресу -  https://cdn.rawgit.com/Arlina-Design/redvision/master/sitemap-content.js,затем отредактировать его, заменив несколько слов на русские, а далее - загрузить его на свой хостинг (например, на Диск Гугл) и вставить в код ссылку на отредактированный скрипт.
Но если вас устраивает и такой вид Карты Блога, то ничего делать не нужно!
Теперь вы можете продолжить реорганизацию своего Блога и заняться изменением «Кнопок Навигации», руководствуясь статьей Преобразование Кнопок Навигации.
Удачи вам!