Адаптивная карта сайта
Сегодня мы собираемся узнать, как создать адаптивную карту сайта в Blogger Возможно, вы заметили, что Blogger имеет XML-карту сайта по умолчанию. Карта сайта является основной частью SEO. Это используется сканером для идеального сканирования и индексации вашего сайта. Почти каждый блог использует XML-карту сайта, чтобы сделать сайт более удобным для SEO. Но в этой статье речь идет о HTML-карте сайта Blogger. HTML карта сайта в основном помогает пользователю легче понять ваш блог.
Я уже говорил вам, что Blogger генерирует XML-карту сайта по умолчанию для вашего блога. Так что вам не нужно беспокоиться об этом. Но вы должны создать страницу HTML-карты для своего пользователя самостоятельно. Возможно вы видели, что во многих блогах есть страница с именем sitemap. Где вы найдете все сообщения в блоге которые сгруппированы по ярлыках. Эта страница помогает пользователям понять ваш блог с первого взгляда.
Если пользователю нужно найти какую-либо тему, он может воспользоваться картой сйта вашего блога. Так как все ваши посты будут перечислены там, пользователь найдет нужную информацию очень легко. Таким образом, страница HTML-карты сайта улучшает взаимодействие с пользователем. Многие люди говорят, что эта HTML-карта сайта также улучшает общую SEO вашего сайта. Итак не теряя времени, давайте посмотрим как создать эту важную страницу для вашего блога Blogger.
Создать адаптивную страницу HTML-карты в Blogger
Как и некоторые другие важные страницы, такие как «О нас», «Контакты», «Конфиденциальность», это также важная страница которую вы должны создать. Если вы создавали когда-либо контактную страницу в своем блоге Blogger, то это очень похоже на этот процесс. Чтобы добавить HTML-страницу карты сайта, вам просто нужно создать страницу и добавить код карты сайта на эту страницу. Вот пошаговый процесс
Шаг 1: Войдите в свой аккаунт блогера и перейдите в « Обзор ». В левом меню нажмите на раздел « Страницы ». Теперь нажмите на кнопку « Новая страница ».
Шаг 2: Здесь вы увидите страницу, которую собираетесь создать и опубликовать. В поле заголовка страницы введите « Sitemap », это имя вашей страницы.
Шаг 3: По умолчанию страница находится в режиме создания. Но мы должны вставить код карты сайта в режиме HTML. Поэтому нажмите на режим « HTML ».
Код карты сайта:
<div id=»toc»>
<script type=’text/javascript’>
//<![CDATA[
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?»:e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!».replace(/^/,String)){while(c—)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return’\\w+’};c=1};while(c—)if(k[c])p=p.replace(new RegExp(‘\\b’+e(c)+’\\b’,’g’),k[c]);return p}(‘2 3=F H();2 u=F H();2 w=F H();2 q=F H();2 6=F H();2 y=F H();2 7=»L»;2 17=1s;2 27=2P;2 E=»»;2 1a=0;r 1Q(a){r b(){4(«A»1H a.1i){2 d=a.1i.A.v;1a=d;D=0;B(2 h=0;h<d;h++){2 n=a.1i.A[h];2 e=n.O.$t;2 m=n.23.$t.1x(0,10);2 j;B(2 g=0;g<n.M.v;g++){4(n.M[g].18==»2c»){j=n.M[g].s;U}}2 o=»»;B(2 g=0;g<n.M.v;g++){4(n.M[g].18==»1Z»){o=n.M[g].s;U}}2 c=»»;4(«16″1H n){B(2 g=0;g<n.16.v;g++){c=n.16[g].28;2 f=c.1v(«;»);4(f!=-1){c=c.1x(0,f)}6[D]=c;3[D]=e;q[D]=m;u[D]=j;w[D]=o;4(h<10){y[D]=13}I{y[D]=1s}D=D+1}}}}}b();7=»L»;P(7);19();17=13;1r();9.x()}r 1O(a){1F(0,0);E=a;K(E)}r 1n(){19();E=»»;K(E)}r P(d){r c(e,g){2 f=3[e];3[e]=3[g];3[g]=f;2 f=q[e];q[e]=q[g];q[g]=f;2 f=u[e];u[e]=u[g];u[g]=f;2 f=6[e];6[e]=6[g];6[g]=f;2 f=w[e];w[e]=w[g];w[g]=f;2 f=y[e];y[e]=y[g];y[g]=f}B(2 b=0;b<3.v-1;b++){B(2 a=b+1;a<3.v;a++){4(d==»L»){4(3[b]>3[a]){c(b,a)}}4(d==»15″){4(3[b]<3[a]){c(b,a)}}4(d==»1g»){4(q[b]>q[a]){c(b,a)}}4(d==»R»){4(q[b]<q[a]){c(b,a)}}4(d==»1w»){4(6[b]>6[a]){c(b,a)}}}}}r 19(){7=»1w»;P(7);2 a=0;2 b=0;S(b<3.v){J=6[b];T=a;1p{a=a+1}S(6[a]==J);b=a;1j(T,a);4(b>3.v){U}}}r 1j(d,c){r e(f,h){2 g=3[f];3[f]=3[h];3[h]=g;2 g=q[f];q[f]=q[h];q[h]=g;2 g=u[f];u[f]=u[h];u[h]=g;2 g=6[f];6[f]=6[h];6[h]=g;2 g=w[f];w[f]=w[h];w[h]=g;2 g=y[f];y[f]=y[h];y[h]=g}B(2 b=d;b<c-1;b++){B(2 a=b+1;a<c;a++){4(3[b]>3[a]){e(b,a)}}}}r K(a){2 l=0;2 h=»»;2 e=»25 Z»;2 m=»11 12 2p 2s 2A»;2 d=»2L»;2 k=»11 12 1I 1J 1K»;2 c=»1L»;2 j=»»;4(7==»L»){m+=» (1N)»;k+=» (14 V)»}4(7==»15″){m+=» (1l)»;k+=» (14 V)»}4(7==»1g»){m+=» (1l)»;k+=» (14 V)»}4(7==»R»){m+=» (1l)»;k+=» (1S V)»}4(E!=»»){j=»11 12 1Y 31″}h+=»<1t>»;h+=»<N>»;h+=\'<5 8=»i-W-1b»>\’;h+=\'<a s=»1c:1o();» O=»\’+m+\'»>\’+e+»</a>»;h+=»</5>»;h+=\'<5 8=»i-W-1d»>\’;h+=\'<a s=»1c:1q();» O=»\’+k+\'»>\’+d+»</a>»;h+=»</5>»;h+=\'<5 8=»i-W-1e»>\’;h+=\'<a s=»1c:1n();» O=»\’+j+\'»>\’+c+»</a>»;h+=»</5>»;h+=\'<5 8=»i-W-1f»>\’;h+=»X 1M»;h+=»</5>»;h+=»</N>»;B(2 g=0;g<3.v;g++){4(a==»»){h+=\'<N><5 8=»i-A-1b»><a s=»\’+u[g]+\'»>\’+3[g]+\'</a></5><5 8=»i-A-1d»>\’+q[g]+\'</5><5 8=»i-A-1e»>\’+6[g]+\'</5><5 8=»i-A-1f»><a s=»\’+w[g]+\'»>X</a></5></N>\’;l++}I{z=6[g].1v(a);4(z!=-1){h+=\'<N><5 8=»i-A-1b»><a s=»\’+u[g]+\'»>\’+3[g]+\'</a></5><5 8=»i-A-1d»>\’+q[g]+\'</5><5 8=»i-A-1e»>\’+6[g]+\'</5><5 8=»i-A-1f»><a s=»\’+w[g]+\'»>X</a></5></N>\’;l++}}}h+=»</1t>»;4(l==3.v){2 f=\'<C 8=»i-1u»>1h 1R \’+3.v+» Z<G/></C>»}I{2 f=\'<C 8=»i-1u»>1h \’+l+» 1T 1U 1V \'»;f+=E+»\’ 1W «+3.v+» 1X Z<G/></C>»}2 b=9.Y(«i»);b.1k=f+h}r 1r(){2 a=0;2 b=0;S(b<3.v){J=6[b];9.x(«<p/>»);9.x(\'<C 8=»20″><a s=»/21/22/\’+J+\'»>\’+J+»</a></C><1y 8=\’24\’>»);T=a;1p{9.x(«<1z>»);9.x(\'<a s=»\’+u[a]+\'»>\’+3[a]+»</a>»);4(y[a]==13){9.x(\’ — <C 8=»F»>26!</C>\’)}9.x(«</1z>»);a=a+1}S(6[a]==J);b=a;9.x(«</1y>»);1j(T,a);4(b>3.v){U}}}r 1o(){4(7==»L»){7=»15″}I{7=»L»}P(7);K(E)}r 1q(){4(7==»R»){7=»1g»}I{7=»R»}P(7);K(E)}r 1A(){4(17){K(E);2 a=9.Y(«1B»)}I{29(«2a 2b… 1C 2d 2e»)}}r 2f(){2 a=9.Y(«i»);a.1k=»»;2 b=9.Y(«1B»);b.1k=\'<a s=»#» 2g=»1F(0,0); 1A(); 2h.2i(\\\’i-2j\\\’,\\\’2k\\\’);»>?? 1h 2l 2m</a> <2n 2o=»1D://2q.2r.1E/2t.2u»/>\’}r 2v(){B(2 a=0;a<1a;a++){9.x(«<G>»);9.x(\’2w 2x : <a s=»\’+u[a]+\'»>\’+3[a]+»</a><G>»);9.x(\’X 2y : <a s=»\’+w[a]+\'»>\’+3[a]+»</a><G>»);9.x(«<G>»)}};9.x(«<C 2z=\’Q-2B:2C;2D:2E;Q-2F:2G;2H:2I 2J 0 0;\’><a O=\’2K 1C 1G 2M 2N — 2O 1G 1m.2Q.2R\’ s=\’1D://1m.2S-2T.1E\’ 2U=\’2V\’ 18=\’2W\’><Q 2X=\’#2Y\’>2Z 30 1P!</Q></a></C>»);’,62,188,’||var|postTitle|if|td|postLabels|sortBy|class|document|||||||||toc||||||||postDate|function|href||postUrl|length|postMp3|write|postBaru||entry|for|span|ii|postFilter|new|br|Array|else|temp1|displayToc|titleasc|link|tr|title|sortPosts|font|datenewest|while|firsti|break|first|header|Download|getElementById|Artikel||Klik|untuk|true|newest|titledesc|category|tocLoaded|rel|sortlabel|numberfeed|col1|javascript|col2|col3|col4|dateoldest|Menampilkan|feed|sortPosts2|innerHTML|ascending|www|allPosts|toggleTitleSort|do|toggleDateSort|displayToc2|false|table|note|lastIndexOf|orderlabel|substring|ol|li|showToc|toclink|TOC|http|com|scroll|by|in|Sortir|bedasarkan|tanggal|Kategori|MP3|descending|filterPosts|widget|loadtoc|Semua|oldest|artikel|dengan|kategori|dari|Total|menampilkan|enclosure|labl|search|label|published|postname|Judul|New|numChars|term|alert|Just|wait|alternate|is|loading|hideToc|onclick|Effect|toggle|result|blind|Daftar|Isi|img|src|sortir|radiorodja|googlepages|berdasarkan|new_1|gif|looptemp2|Post|Link|mp3|style|judul|size|0px|float|right|family|arial|margin|20px|5px|Blogger|Tanggal|Abu|Farhan|Style|250|intert3chmedia|net|abu|farhan|target|_blank|nofollow|color|ff5f00|Grab|this|semua’.split(‘|’),0,{}))
//]]>
</script>
<script src=»https://www.technoblogger.ru/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc»>
</script></div>
Примечание. Замените выделенный https://www.technoblogger.ru/ URL своего блога.
Шаг 4. Теперь скопируйте код Sitemap сверху и вставьте его на страницу. Это код JavaScript, который необходимо добавить на страницу карты сайта в режиме HTML.
Шаг 5. После вставки кода карты сайта на страницу карты сайта и замены указанного URL-адреса адресом блога опубликуйте страницу в режиме HTML кнопка в верхнем правом углу.
Просмотрите свою недавно созданную страницу карты сайта, и вы увидите, что она работает отлично. Теперь пришло время доработать этот HTML- карты сайта, чтобы сделать его более красивым. Итак, давайте добавим CSS.
Добавление CSS страницы HTML Sitemap:
Код:
/* Sitemap
———————————————— */
#toc{margin:5px auto;width:100%;}
.labl{background: url(http://4.bp.blogspot.com/-RX5GvndV7GI/WBnIzcW86II/AAAAAAAAD7s/JzrxQwJ3sRoDFmlzbEOYiDt5IhgJL66lgCPcB/s1600/bg-login.gif) repeat-x;margin:0 -5px;text-align:center;text-transform:uppercase;font-size:18px;font-weight:bold;padding:2px 0 2px 0;border:1px solid #2D96DF;border-radius:2px;display:block;}
.labl a{color:#fff;}
.labl:first-letter{text-transform:uppercase;}
.new{color:#FF5F00;font-style:italic;font-weight:bold;}
.postname{font-weight:normal;}
.postname li{margin-right:5px;border-bottom: #ddd 1px dotted;}
Чтобы добавить CSS этой карты сайта, перейдите на панель инструментов Blogger. Нажмите на раздел « Тема »> « Редактировать HTML ». Теперь найдите код «]]></b:skin>». Скопируйте код CSS сверху и вставьте его прямо перед строкой « ]]></b:skin> ».
Нажмите на кнопку « Сохранить шаблон ». Вы сделали. Перейдите на страницу карты сайта, обновите страницу и посмотрите, работает она или нет.
Это был полный процесс добавления HTML-страницы в Blogger. Эта карта сайта протестирована, поэтому у вас не должно быть никаких проблем. Если у вас возникли проблемы, чтобы добавить это, вы можете спросить меня через комментарий. Я вернусь к вам очень скоро. Если вам нравится эта карта сайта, не забудьте поделиться ею