Карта на блога с изображения и брой коментари

Pepa Tabakova

петък

Здравейте скъпи мои читатели и гости. Днес искам да ви предложа за вашите блогове вариант на карта на блог. Ще разгледаме два вида на представянето на картата: с публикации в една или две колони, както ви харесва.
Скъпи читатели, този скрипт вече не работи. Извинете за неудобството, което ви причиних.
Недостатъкът тук е, че картата не представя разделянето на публикации според етикетите. Първата възможност е да се показват най-новите публикации по датата, като последните са написани по-рано.
По принцип, този от вас, който има малко публикации, може да постави този вариант. Но за тези, които имат написани повече от сто публикации, за читателите им със сигурност е по-удобна за използване картата, в която материалите са разделени по категории или етикети. Решението е ваше.
Вижте скриншот: карта на блога, в която публикациите са в една колона

Копирайте кода по-долу.

#toc-outer {

color:black;

font:normal 11px/14px Arial,Sans-Serif;

height:auto;

margin:0 auto;

overflow:hidden;

padding:0;

text-align:left;

}

#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: left;

height: 157px;

overflow: hidden;

width: 47%;

box-shadow: 1px 1px 5px #C3C3C3;

background: none repeat scroll 0% 0% #F9F9F9;

border: 1px solid #ссс;

margin: 3px 5px 8px;

padding: 0px 3px;

}

.itemposts h6 {

border-bottom: 1px solid #CCC;

color: #333;

font: bold 12px Arial;

height: 15px;

overflow: hidden;

text-transform: none;

margin: 0px 0px 5px;

padding: 2px 6px !important;

}

.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:left;

height:65px;

margin:0 7px 5px 0;

padding:3px;

width:65px;

z-indent:99999px;

}

.itemposts .iteminside {}

.itemposts .itemfoot {

border-top: 1px solid #CCC;

clear: both;

overflow: hidden;

padding: 4px 5px;

}

.itemposts .itemfoot a.itemrmore {

color:#333;

float:right;

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:bold 10px Verdana,Arial,Sans-Serif;

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>

var showPostDate = true,

showComments = true,

idMode = true,

sortByLabel = false,

labelSorter = "JQuery",

loadingText = "Loading...",

totalPostLabel = "Number of posts:",

jumpPageLabel = "page",

commentsLabel = "comment",

rmoreText = "Прочети повече►",

prevText = "previous",

nextText = "next",

siteUrl = "####",

postPerPage = 8,

numChars = 150,

imgBlank = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC";

</script>

</div>

Създайте страница, по начин, който вече знаете. В HTML режим поставете копирания код. Вие ще трябва да промените само адреса на блога си, и да регулирате ширината на картата. Преди публикуването на страница няма да виждате на дисплея си картата. Този код е за карта на блога с две колони.
Означенията са:

➤в червено-височина на блока;

➤в синьо - ширината на блока;

➤в лилаво - размерът на изображенията;

➤в зелено-URL адрес на вашия блог;

➤в оранжево-брой публикациите на страницата.

За да бъде картата в една колона, регулирайте ширината width: 47% на 97%.

Както можете да видите нищо трудно няма в това да се инсталира такава карта на блога ви. Аз я тествах на всички мои блогове и нестандартни шаблони също. Инсталира се без проблеми. Регулирах само ширината, защото размера на страниците е различна в различните блогове.

Споделете с приятелите си в социалните мрежи, а аз не за дълго ви казвам довиждане.

Здраве за всички вас! Не забравяйте да правите добро на други хора!

Ще съм благодарна да оцените моя труд и кликнете върху звездичките по-долу. Или гласувайте за блога на:

Cancel

PEPA TABAKOVA