Узнайте Как Сделать Свой блог Посещаемым и Денежным!


') var scrollerinstance=this if (window.addEventListener) //run onload in DOM2 browsers window.addEventListener("load", function(){scrollerinstance.initialize()}, false) else if (window.attachEvent) //run onload in IE5.5+ window.attachEvent("onload", function(){scrollerinstance.initialize()}) else if (document.getElementById) //if legacy DOM browsers, just start scroller after 0.5 sec setTimeout(function(){scrollerinstance.initialize()}, 500) } // ------------------------------------------------------------------- // initialize()- Initialize scroller method. // -Get div objects, set initial positions, start up down animation // ------------------------------------------------------------------- pausescroller.prototype.initialize=function(){ this.tickerdiv=document.getElementById(this.tickerid) this.visiblediv=document.getElementById(this.tickerid+"1") this.hiddendiv=document.getElementById(this.tickerid+"2") this.visibledivtop=parseInt(pausescroller.getCSSpadding(this.tickerdiv)) //set width of inner DIVs to outer DIV's width minus padding (padding assumed to be top padding x 2) this.visiblediv.style.width=this.hiddendiv.style.width=this.tickerdiv.offsetWidth-(this.visibledivtop*2)+"px" this.getinline(this.visiblediv, this.hiddendiv) this.hiddendiv.style.visibility="visible" var scrollerinstance=this document.getElementById(this.tickerid).onmouseover=function(){scrollerinstance.mouseoverBol=1} document.getElementById(this.tickerid).onmouseout=function(){scrollerinstance.mouseoverBol=0} if (window.attachEvent) //Clean up loose references in IE window.attachEvent("onunload", function(){scrollerinstance.tickerdiv.onmouseover=scrollerinstance.tickerdiv.onmouseout=null}) setTimeout(function(){scrollerinstance.animateup()}, this.delay) } // ------------------------------------------------------------------- // animateup()- Move the two inner divs of the scroller up and in sync // ------------------------------------------------------------------- pausescroller.prototype.animateup=function(){ var scrollerinstance=this if (parseInt(this.hiddendiv.style.top)>(this.visibledivtop+5)){ this.visiblediv.style.top=parseInt(this.visiblediv.style.top)-5+"px" this.hiddendiv.style.top=parseInt(this.hiddendiv.style.top)-5+"px" setTimeout(function(){scrollerinstance.animateup()}, 50) } else{ this.getinline(this.hiddendiv, this.visiblediv) this.swapdivs() setTimeout(function(){scrollerinstance.setmessage()}, this.delay) } } // ------------------------------------------------------------------- // swapdivs()- Swap between which is the visible and which is the hidden div // ------------------------------------------------------------------- pausescroller.prototype.swapdivs=function(){ var tempcontainer=this.visiblediv this.visiblediv=this.hiddendiv this.hiddendiv=tempcontainer } pausescroller.prototype.getinline=function(div1, div2){ div1.style.top=this.visibledivtop+"px" div2.style.top=Math.max(div1.parentNode.offsetHeight, div1.offsetHeight)+"px" } // ------------------------------------------------------------------- // setmessage()- Populate the hidden div with the next message before it's visible // ------------------------------------------------------------------- pausescroller.prototype.setmessage=function(){ var scrollerinstance=this if (this.mouseoverBol==1) //if mouse is currently over scoller, do nothing (pause it) setTimeout(function(){scrollerinstance.setmessage()}, 100) else{ var i=this.hiddendivpointer var ceiling=this.content.length this.hiddendivpointer=(i+1>ceiling-1)? 0 : i+1 this.hiddendiv.innerHTML=this.content[this.hiddendivpointer] this.animateup() } } pausescroller.getCSSpadding=function(tickerobj){ //get CSS padding value, if any if (tickerobj.currentStyle) return tickerobj.currentStyle["paddingTop"] else if (window.getComputedStyle) //if DOM2 return window.getComputedStyle(tickerobj, "").getPropertyValue("padding-top") else return 0 }

понедельник, 28 ноября 2011 г.

Выделение цитаты в тексте на Blogspot

Videlenie citati na BlogspotДрузья всем привет. В сегодняшней статье я продолжаю делиться полезностями для блоггеров, которые ведут свои блоги на Blogspot. И это будет выделение цитаты. Например в своём посте вы хотите выделить какую-то важную часть текста, что бы она бросалась в глаза вашим читателям и не сливалась с основным текстом. Или процетировать какого-либо автора, или ещё что-нибудь на ваше усмотрение.

Как выглядит это выделение вы увидите у меня на блоге, в нём будет размещён код данного цитатника.
И так приступим:

1) Заходим в "Панель управления"
2) Нажимаем "Дизайн"
3) Далее нажимаем "Изменить Html"
На всякий случай сохраните копию шаблона, прежде чем вносить в него изменения.

Затем с помощью кнопок Ctrl+F находите  .post blockquote и удаляете его. В большинстве шаблонов код выглядит следующим образом:
.post-body blockquote { line-height:1.3em; }
или
.post blockquote{ }
выделение цитаты в тексте на Блоггер
4) Если вы не смогли найти этот код, то это тоже нормально, у меня в шаблоне его тоже не было.
5) Теперь опять при помощи кнопок Ctrl+F находим ]]> и над ним вставляете код который я разместил ниже в цитатнике о котором собственно и идёт сегодня речь:

.post blockquote {
margin : 0 20px;
padding: 20px 20px 20px 20px;
background : #DCDCDC url(https://i027.radikal.ru/1111/d9/c6fa504d1a1f.png) no-repeat top left;
font: bold 1em Helvetica, verdana, Georgia, "Times New Roman", Times, serif;
color : #000;
border-bottom : 4px solid #696969; }
.post blockquote p {
margin: 0;
padding-top:10px;
}

Далее нажимаете на кнопку просмотр, и если всё нормально, сохраняете шаблон.

Вы так же можете настроить цитатник под дизайн своего блога:

padding: 20px 20px 20px 20px;    отступы текста от рамки
background : #DCDCDC    фон цитатника, у меня он светло серый
solid #696969;        нижняя рамка.
url(https://i027.radikal.ru/1111/d9/c6fa504d1a1f.png) это верхняя рамка, вы её тоже можете поменять на свою, или вставить какое нибудь изображение, например вот так:
Или так:

Хочу предложить вам ещё один вариант цитатника. При наведении на него курсора, текст и фон будет менять свой цвет. Как это выглядит вы можете посмотреть здесь.
выделение цитаты в тексте на Блоггер
И так повторяем всё то же самое, что и в предыдущем варианте:

1) Заходим в "Панель управления"
2) Нажимаем "Дизайн"
3) Далее нажимаем "Изменить Html"
На всякий случай сохраните копию шаблона, прежде чем вносить в него изменения.
4) Теперь опять при помощи кнопок Ctrl+F находим ]]> и выше него вставляете этот код:
blockquote {
background: FFFFFF url() no-repeat right bottom ;
margin: 0 20px;
padding: 20px 70px 20px 20px;
color:000000;
font: bold 0.9em "comic sans ms", "Times New Roman", Times, serif;
border:1px solid #DDD;
}
blockquote:hover {
background: #DCDCDC url() no-repeat right bottom ;
color:#B22222;
}
blockquote p {
margin: 0;
padding-top:10px;
}
Здесь вы так же можете поменять цвет текста и фона. Я думаю с этим вы и сами сможете разобраться по аналогии первого варианта цитатника.

Да ещё, код в шаблоне устанавливается один раз и всё. Теперь каждый раз когда вы пишите статью и выделяете часть текста нажав на кнопку "цитата", он будет заключаться в тот цитатник который вы установили.

Ну вот друзья на сегодня и всё. Надеюсь кому-то эта информация выделение цитаты в тексте на Блоггер была полезной. Так же хочу предложить вам прочитать статью о том как установить кнопку автоматической прокрутки страницы вверх на Blogspot. А я с вами прощаюсь и желаю удачи.

Хотите получать свежие статьи?

0 коммент.:

Отправить комментарий

Как раскрутить блог
Создание эффективной страницы

Посещаемость сайта