С Новым Годом Блоггер!

среда, 31 декабря 2008 г.

Happy New Year Blogger
"В Москве 15 часов,.. в Петропавловске-Камчатском полночь"


На Дальнем Востоке люди уже начинают встречать, пожалуй самый широко любимый праздник: "Новый Год".


От своего лица хочу поздравить всех блоггеров, да и вообще всех людей с этим чудесным праздником, который, надеюсь, несет Вам только радость, счастье и любовь!


Хотелось бы чтоб в Новом 2009м Году исполнились все наши желания и ожидания, чтоб Ваши блоги пробились в топы, а посты цитировались тысячами ;-)


С НОВЫМ ГОДОМ!!!

Ярлыки:

Иконка сайта или Favcon для Blogger

понедельник, 29 декабря 2008 г.

На сколько известно практически каждый сайт в интернете имеет свою иконку, так называемую favicon, которая отображается в адресной строке, в списке закладок и.т. делая каждый сайт немного индивидуальнее. Все же блоге на blogspot.com имеют стандартное лого Блоггера. И при этом не каждый знает что каждый пользователь может сделать свою favicon для блога.


Favicon


Это достаточно просто и потребует от Вас скорее навыков в использовании графических редакторов, нежели знаниq web-программирования ;-)


Во-первых в любом графическом редакторе (Adobe Photoshop, Paint.net, GIMP и т.д.) необходимо создать изображение размером 16X16 или 22x22 пикселя. Использовать можно что угодно, ограничения лишь в размере иконки, поэтому изображение должно быть простым, но и в тоже время оригинальным.


Сохранить ваше тварение необходимо с расширением .png или .ico : Блоггер поддерживает оба формата.


Далее необходимо загрузить иконку на хостинг в сети. Или прям в плоггер, в черновике и взять оттуда прямую ссылку на favicon


Теперь через панель инструментов Blogger переходим в "Изменить HTML" и в коде шаблона находим строчку: </head> и перед ней добавляем следующий код:
<link href='http://your-icon-url.png' rel='shortcut icon'/>
<link href='http://your-icon-url.png' rel='icon'/>
Теперь необходимо заменить в обоих стоках http://your-icon-url.png на адрес вашей иконки, которую Вы ранее загрузили в сеть и сохранить шаблон.


Примечание: если Вы используете Internet Explorer, то favicon не измениться до тех пор пока не добавите сайт в закладки не перезгрузите браузер.

Ярлыки: ,

"Читайте также" в постах Blogger

воскресенье, 28 декабря 2008 г.

Думаю Вы уже заметили, что после каждого поста (на его странице) моего блога есть список ссылок на сообщения похожей тематики - так называемое поле "Читайте также". Оно позволяет пользователям быстро найти похожие записи блога, не используя поиск ;-)
Related Posts
Если есть желание добавить на страницы своего Blogger'a подобный элемент, тогда предлагаю дочитать этот пост до конца и узнать, как это сделать =)


Прежде всего необходими, как всегда, сделать бэкап шаблона Вашего блога (как это сделать читайте в предыдущих постах)


теперь в коде тег </head> шаблона находим и вставляем непосредственно перед ним:
<style>


#related-posts {
float : left;
width : 540px;
margin-top:20px;
margin-left : 5px;
margin-bottom:20px;
font : 11px Verdana;
margin-bottom:10px;
}
#related-posts .widget {
list-style-type : none;
margin : 5px 0 5px 0;
padding : 0;
}
#related-posts .widget h2, #related-posts h2 {
color : #940f04;
font-size : 20px;
font-weight : normal;
margin : 5px 7px 0;
padding : 0 0 5px;
}
#related-posts a {
color : #054474;
font-size : 11px;
text-decoration : none;
}
#related-posts a:hover {
color : #054474;
text-decoration : none;
}
#related-posts ul {
border : medium none;
margin : 10px;
padding : 0;
}
#related-posts ul li {
display : block;
background : url("http://i263.photobucket.com/albums/ii150/mohamedrias/newconcept_bullet.png") no-repeat 0 0;
margin : 0;
padding-top : 0;
padding-right : 0;
padding-bottom : 1px;
padding-left : 16px;
margin-bottom : 5px;
line-height : 2em;
border-bottom:1px dotted #cccccc;
}


</style>
<script src='http://forum.wafl.ru/files/freeman/relatedposts.js' type='text/javascript'/>
Сохраните Шаблон!
теперь ставим галку в поле "расширить шаблон" и находим кусок кода: <p><data:post.body/></p>
и между фрагментами body/>_и_</p> (т.е. вместо "_и_") вставляем:
<b:if cond='data:blog.pageType == "item"'>
<div id="related-posts">
<font face='Arial' size='3'><b>Читайте также: </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if><b:if cond='data:blog.pageType == &quot;item&quot;'>


<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>
Снова сохраняем шаблон и смотрм наличие "Читайте также" в постах ;-)


Если у Вас есть желание, по можно заменить иконку перед каждой ссылко на свою.
Для этого в первой части кода заменитье адресс http://i263.photobucket.com/albums/ii150/mohamedrias/newconcept_bullet.png на адрес своей иконки

Праздник к нам приходит . . .

пятница, 26 декабря 2008 г.

До наступления Нового Года осталось 5 дней и предпраздничное настроение немного испорченно сессией , которая, как всегда, "подкралась незаметно" :-)
И время для подготовки к наступлению НГ совсем не остается. А некоторые сделали это еще летом.
Предлагаю Вам посмотреть достаточно необычное видео в котором Наши умельцы вытворяют чудеса, необычным способом поглощая "Русскую"

Ярлыки: ,

Облако тегов для Blogger

среда, 24 декабря 2008 г.

Уже на притяжении долгого времени блоггеры, использующие в качестве платформы для постинга "WordPress" имеют на своих страницах так называемые "Облака Тегов", которые по своей сути являются обыкновенном списком тем, только в более оригинальном и привлекательномом исполнении.


tagcloud
Так вот в сегодняшней статье хотелось бы рассказать, как путем некоторых манипуляций с шаблоном Вашего блога можно добавить подобный виджет и на страницы Blogger ;-)


Процесс это довольно таки кропотливый и трудоемкий =/ Но результат обязательно порадует Вас и ваших читателей ;-)


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


Теперь необходимо добавить виджет "Ярлыки" (Labels) на блог, если у Вас уже есть этот виджет, то повторять этого, конечно же, не стоит). Для этого переходим в "Макет" >>> "Элементы страницы" и добавляем видеж "Ярлыки" подобно тому, как мы добавляли "HTML/JavaScript", когда "заснеживали" Blogger.


Теперь приступаем к самому важно, тут уже ошибаться не стоит, инече последуют неприятные последствия(


Из макета Блога переходим к изменению "HTML" шаблона (не забудьте поставить галочку "Расширить шаблоны виджета)":
С помощью поска в браузере находим следующий код:
]]></b:skin>
и непосредственно перед ним вставляем:
/* Label Cloud Styles
----------------------------------------------- */
#labelCloud {text-align:center;font-family:arial,sans-serif;}
#labelCloud .label-cloud li{display:inline;background-image:none !important;padding:0 5px;margin:0;vertical-align:baseline !important;border:0 !important;}
#labelCloud ul{list-style-type:none;margin:0 auto;padding:0;}
#labelCloud a img{border:0;display:inline;margin:0 0 0 3px;padding:0}
#labelCloud a{text-decoration:none}
#labelCloud a:hover{text-decoration:underline}
#labelCloud li a{}
#labelCloud .label-cloud {}
#labelCloud .label-count {padding-left:0.2em;font-size:9px;color:#000}
#labelCloud .label-cloud li:before{content:"" !important}
а уже после кода ]]></b:skin> вставьте:
<script type='text/javascript'> 
// Label Cloud User Variables
var cloudMin = 1;
var maxFontSize = 20;
var maxColor = [0,0,255];
var minFontSize = 10;
var minColor = [0,0,0];
var lcShowCount = false;
</script>
теперь предстоит заменить старый виджет Ярлыков на новый, для этого в коде шаблона найдите код подобный тому что ниже:
<b:widget id='Label1' locked='false' title='Ярлыки' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'>
<data:label.name/>
</span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'>
<data:label.name/>
</a>
</b:if>
<span dir='ltr'>(<data:label.count/>)</span>
</li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
и заменить его весь на:
<b:widget id='Label1' locked='false' title='Label Cloud' type='Label'>
<b:includable id='main'>
  <b:if cond='data:title'>
    <h2><data:title/></h2>
  </b:if>

  <div class='widget-content'>
  <div id='labelCloud'/>
<script type='text/javascript'>

// Don't change anything past this point -----------------
// Cloud function s() ripped from del.icio.us
function s(a,b,i,x){
      if(a&gt;b){
          var m=(a-b)/Math.log(x),v=a-Math.floor(Math.log(i)*m)
             }
      else{
          var m=(b-a)/Math.log(x),v=Math.floor(Math.log(i)*m+a)
          }
      return v
   }


var c=[];
var labelCount = new Array(); 
var ts = new Object;
<b:loop values='data:labels' var='label'>
var theName = &quot;<data:label.name/>&quot;;
ts[theName] = <data:label.count/>;
</b:loop>

for (t in ts){
     if (!labelCount[ts[t]]){
           labelCount[ts[t]] = new Array(ts[t])
           }
        }
var ta=cloudMin-1;
tz = labelCount.length - cloudMin;
lc2 = document.getElementById('labelCloud');
ul = document.createElement('ul');
ul.className = 'label-cloud';
for(var t in ts){
    if(ts[t] &lt; cloudMin){
       continue;
       }
    for (var i=0;3 &gt; i;i++) {
             c[i]=s(minColor[i],maxColor[i],ts[t]-ta,tz)
              }     
         var fs = s(minFontSize,maxFontSize,ts[t]-ta,tz);
         li = document.createElement('li');
         li.style.fontSize = fs+'px';
         li.style.lineHeight = '1';
         a = document.createElement('a');
         a.title = ts[t]+' Posts in '+t;
         a.style.color = 'rgb('+c[0]+','+c[1]+','+c[2]+')';
         a.href = '/search/label/'+encodeURIComponent(t);
         if (lcShowCount){
             span = document.createElement('span');
             span.innerHTML = '('+ts[t]+') ';
             span.className = 'label-count';
             a.appendChild(document.createTextNode(t));
             li.appendChild(a);
             li.appendChild(span);
             }
          else {
             a.appendChild(document.createTextNode(t));
             li.appendChild(a);
             }
         ul.appendChild(li);
         abnk = document.createTextNode(' ');
         ul.appendChild(abnk);
    }
  lc2.appendChild(ul);   
</script>

<noscript>
    <ul>
    <b:loop values='data:labels' var='label'>
      <li>
        <b:if cond='data:blog.url == data:label.url'>
          <data:label.name/>
        <b:else/>
          <a expr:href='data:label.url'><data:label.name/></a>
        </b:if>
        (<data:label.count/>)
      </li>
    </b:loop>
    </ul>
</noscript>
    <b:include name='quickedit'/>
  </div>

</b:includable>
</b:widget>

Теперь сохраниет шаблон и посмотрите наличие Облака тегов на странице блога.


Ниже для тех, кто хочет поэкспериментировать с цветами, шрифтами и прочеми параметрами привожу основные данные в введенном нами коде.

var maxFontSize = 20;
var maxColor = [0,0,255];
var minFontSize = 10;
var minColor = [0,0,0];
эти значения указывают на максимальны и минимальный размер шрифта в облаке, а также на градации его цвета в формате RGB.
var cloudMin= 1;
данная переменная указывает на необходимое количество статей с одним и тем же тегом, что бы он попал в облако.
var lcShowCount = false;
это параметр (false - по умолчание, изменимо на true) показывает, что теги выводятся без указания количества статей с одинаковым тегом.


есть еще несколько не столь важных параметров, которые можно изменить, если пожелаете узнать о них поподробнее, я обязательно о них расскажу ;)

Backup блога. Делаем резервные копии

вторник, 23 декабря 2008 г.

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

Единственным встроенным средством резервного копирования средствами Blogspot является возможность сохранения шаблона. Для этого необходимой зайти в меню «Макет» - «Изменить HTML», после нажать на ссылку «Загрузить весь шаблон» и и сохранить копию на локальный диск вашего ПК.

Но таким образом мы по прежнему рискуем потерей постов и комментарием наших читателей.
Вот тут-то на помощь и приходит замечательная утилита Blogger Backup.

Её возможности позволяют создавать резервные копии сообщений и комментариев со страниц Blogspot. Статус программы "Freeware", что позволяет пользоваться ей абсолютно бесплатно. Также разработчики постоянно ведут работу над совершенноствованием и исправление ошибок в их продукте, поэтому если намериваетесь использовать данный софт, не забывайте заглядывать на официальную страницу с целью получения новой версии программы ;) Резервные копии для надежности и оперативного доступ можно хранить в одном из облачные сервисов, например Google Диск.

Убираем "Atom" из ссылки подписки

понедельник, 22 декабря 2008 г.

kill atomСегодня небольшой, я бы даже сказал очень скромный мануальчик снова в отношении оформления страниц наших любимых блогов =)


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


Для этого в коде шаблона (Изменить HTML) находим следубщий фрагмент:


(<data:f.feedType/>)


удаляем его, сохраняем шаблон и радуемся отсутсвию назойливого "атома" =)

Ярлыки: , ,

КризисOFF

пятница, 19 декабря 2008 г.

Уже на протяжении нескольких месяцев большинство web-ресурсов, все СМИ и бабушки у подъездов только и говорят о кризисе. Если честно порядком поднадоело >=(



Ярлыки:

Кот Саймона и Пёс сестры Саймона

четверг, 18 декабря 2008 г.

Думаю стоит отвлечься от страниц своего блога и немного посмеяться (=
Все же помнят ролики про голодного котэ Саймона =)
и вот, художник выпустил новый мульт - про пса сестры Саймона.
Ниже все 3 ролика про котэ Саймона и последний про Пса.
Рекомендую к просмотру - мульты позитивные и смешные, особенно понравится любителям кошек ;)
не забываем про комментарии ;)

Ярлыки:

Как сделать "Панель Администратора" для вашего блога

Скрытие или удаление навигационной панели Blogger, которое мы рассмотрели в предыдущем посте одно из самых популярных и полезных изменений в оформлении страниц Blogger. Преимущество подобного изменеия в том, что вы можете не беспокоиться за оформление и внешний вид Вашей персональной странички.
Но есть и ряд недостатков, которые выражаются в последующем отсутсвии на экране кнопок: "Новое сообщение | Настроить | Выйти". Когда они были видимы владелец блога одним кликом мог написать новое сообщение, произвести необходимые настройки или же покинуть блог.
В этом посте я бы хотел рассказать, как добавить виджет "Панели Администратора", откроет Вам быстрый доступ ко всем основным разделам и панели инстраментов Blogger ;)Admin panel

Так как мы будем вносить изменения непосредственно в код шаблона очень важно сделать резервную копию рабочего шаблона Вашего блога. В последующем, если Вы допустите критическую ошибку будет возможность вернуть все к изначальному состоянию ;)
Для этого в "Панели инструментов" перейдите в "Макет" >>> "Изменить HTML" и там выбирите "Загрузить весь шаблон" и сохраните его на Вашем компютере!


Перед тем как приступить к внесению изменений также необходимо выяснить идентификационный номер (id) Вашего блога/
Для этого Войдите на Blogger под своей учетной записью и перейдите на любую страницу из панели инструментов, посмотрите ее адрес в адресной строке браузера:
в ссылке будет присутствовать
blogID=XXXXXXXXXX

где XXXXXXXXXX - номер Вашего блога

Запишите этот номер в отдельном месте, позже он нам пригодится ;)

"Панель Администратора" будет доступна только когда Вы войдете на Blogger под учетной записью авотра блога. Она не доступна обычным читателям блога.

Чтож приступим к непосредственно к добавлению нужного нам кода в шаблон:

Для этого из "Панели инструментов" перейдите на вкладку "Макет", там выберите "Изменить HTML"
Убедитесь, что поле "Расширить шаблоны виджета" НЕ выбрано!

С помощью поиска браузера найдите следующую (или подобную) строку в коде шаблона
<b:section class='sidebar' id='sidebar' preferred='yes'>

Сразу после этой строки добавьте следующий код:
<span class='item-control blog-admin'>
<h2>Панель Администратора</h2>
&lt;a href='http://www.blogger.com/post-create.g?blogID=XXXXXXXXXX'>Новое Сообщение</a>
|
<a href='http://draft.blogger.com/blog-options-basic.g?blogID=
XXXXXXXXXX'>Настройки</a>
|
<a href='http://www.blogger.com/rearrange?blogID=
XXXXXXXXXX'>Изменить Шаблон</a>
|
<a href='http://www.blogger.com/html?blogID=
XXXXXXXXXX'>Изменить HTML</a>
|
<a href='http://www.blogger.com/moderate-comment.g?blogID=
XXXXXXXXXX'>Модерировать Комментарии</a>
|
<a href='http://www.blogger.com/logout.g'>Выход</a>
</span>

После Этого замените все "XXXXXXXXXX" на номер Вашего блога, который мы записали ранее.
После всего сохраните шаблон и просмотрите блог.
Учтите Панель Администратора появится на на самом верху боковой панели.

Жду Ваших комментариев!

Скрываем или удаляем навигационную панель Blogger

воскресенье, 7 декабря 2008 г.

Панель навигации Blogger появляется автоматически в каждом блоге размещенном на сервисе Blogspot.com. Несмотря на то, что есть возможность изменить ее цвета в "Макет >>> Элементы страницы" иногда они не соответсвеют оформлению Вашего блога.
Но существует несколько способов скрыть эту панель или же убрать вовсе, добавив некоторый код в ваш шаблон :)
панель навигации
Для этого переходим в "Макет >>> Изменить HTML" и добавляем следующий код:
#navbar {
height: 0px;
visibility: hidden;
display: none;
}
примерно в следующем месте:
После чего Сохраняем шаблон и просматриваем блог.
и не забываем оставлять комментарии ;)

* Виджет простого снежного эффекта *

суббота, 6 декабря 2008 г.

снежный эффект
На дворе 6 декабря, а присутствие зимы совсем не чувствуется. Пугает абсолютное отсутствие снега на улицах и небывало высакая температура воздуха =/


Поэтому представляю Вашему вниманию простой, но в тоже время очень симпатичный виджет Снега на страницах вашего блога ;)


Его установка не займет у вас много времени.
  • Во первых заходим в Вашу "Панель управления" аккаунтом Blogger.Blogger panel
  • Находим там свой блог, к которому ходим добавить виджет и переходим в "Макет"layout
  • В открывшемся окне с макетом Вашего блога добавляем новый элемент/гаджетadd gadget
  • В открывшемся окне элементов для страницы Blogger находим и выбираем "HTML/JavaScript"edit HTML
  • Поле "Заголовок" оставляем пустым. В содержание вписываем следующий код:
    <script src="http://snow-effect.googlecode.com/files/snow.js" type="text/javascript">
    </script>
  • add javascriptЖмем "Сохранить" и просматриваем свой блог на наличие летающих снежинок ;)
  • Внимание: Данный виджет работает не со всеми шаблонами оформления для страниц Blogger =( а некоторые попросту разъезжаются %)


Если у Вас возникли какие-либо вопросы или пожелания, оставляйте в комментариях.

Что и зачем?

Привет блоггерЗдравствуйте Блоггеры
Хотелось бы начать с того почему этот блог появился и с какой целью создавался:

Несколько месяцев назад я задался целью сделать обычный интернет дневник/блог для очень близкого человека. Выбор пал на гугловский сервис "Blogger")
Задача передо мной стояла совсем не сложная, ибо настройка блога довольно таки простой процесс. НО хотелось чего-то особенного, небанального, симпатичного, но и в то же время простого. Вот тут-то и начались проблемы =/
Blogger предоставляет пользователям достаточно обширные возможности для работы с оформлением и содержанием персональных страниц, но как ими воспользоваться с полной отдачей для меня было вопросом не совсем простым. Начались скитания про просторам сети в поисках того, что могло бы мне помочь, чего-то интересно для меня и конечно же для читателей. Практически все ресурсы на данную тематику оказались далеко не русскоязычными =( и это вызвало немало проблем.

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

Данный блог не претендует ни в коей мере на роль первоисточника всей информации, которая будет публиковаться, т.к. многое было найдено на просторах необъятной сети, что-то на закрытых для широких масс ресурсах, а кое-что было выяснено опытным путем и методом проб и ошибок лично мной.

Надеюсь Вам понравится, то о чем я буду писать и Вы найдете что-то интересное для себя.

Ярлыки: ,