БелиберDA

Часто читатели задают не вопрос: "Как добавить часы на свой блог? и как можно изменить их внешний вид?"

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

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

Какие Вам нравятся больше? Думаю коллекция будет пополняться новыми экземплярами в дальнейшем!

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

Именно для таких, как я был написан виджет "Последние записи", который отображает заголовки последних постов блога.

По-моему это очень удобно и значительно экономит время при серфинге =)
Ознакомиться с виджетом Вы можете в правой колонке этого блога.

Если хотите такой же просто нажмите кнопочку ниже ;)

Пробуйте и не забывайте про комментарии!

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


Посмотреть как это выглядит можно на Наизнанке или же на этом блоге (справа под архивом).


Виджет очень просто добавить на свой блог, для этого просто нажмите кнопку ниже:

и после добавления в содержании виджета найдите "ваш_блог" и замените на имя вашего блога (например для моего блога нужно заменить на beliber-da).


Жду ваших комментариев ;)

Если ваш блог уже набрал обороты, то ваши записи обязательно будут комментировать, задавая вопросы, споря, критикуя или же просто выражая благодарность за предоставленную информацию или материал.
Думаю многим хотелось бы знать кто же самый активный читатель и комментатор на блоге? Для этого был написан плагин "Самые активные читатели". Виджет будет отображать пользователей, которые оставили наибольшее количество комментариев к вашим записям и число их комментариев.
Для того чтобы добавить виджет на Ваш блог просто нажмите на кнопку ниже:

После чего необходимо внести некоторые изменения в содержание кода виджета:

1. в строке var baseUrl = "http://beliber-da.blogspot.com/"; - то, что выделенно красным замените на адрес своего блога (обязательно с /на конце)
2. var maxList = 5; - этот параметр указывает число комментаторов, которых будет указывать виджет.
3. var sFilter = ""; - тут между ковычками можно указать людей, которых не будет учитывать виджет. Ники нужно указывать через запятую БЕЗ пробелов вообще (например "вася,ваня")
   

Позвольте вашим читателям перевести блог на различные языки мира, используя компактный и простой в использовании виджет.
Выбрав один из восьми (Китайский, Французкий, Немецкий, Японский, Корейский, Английский, Испанский или Итальянский) языков и нажав соответствующий ему флажок блог будет автоматически переведен с использованием технологии Google Translate.
Чтобы добавить виджет на Ваш блог необходимо просто нажать на кнопку ниже и следовать подсказкам системы Blogger.

надеюсь Вам виджет будет полезен. Жду комментариев ;)

В одной из предыдущих статей я описывал как можно сделать облако тегов для блоггера, которое бы содержала ярылки ваших постов.
Мы снова обновили облако тегов для Blogger, теперь его можно установит за пару кликов: Читайте инструкцию в новой записи тут! Сегодня я бы хотел описать способ, который позволит Вам добавить в свой блог Flash Облако тегов (которое в отличии от аналогов поддерживает кириллицу) . При этом Темы будут отображаться разными цветами - в зависимости от количества сообщений, которые будут им соответствовать ;)


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


Далее из макета Блога переходим к изменению "HTML" шаблона, ставим галочку "Расширить шаблоны виджета"
С помощью поска в браузере находим следующий код:

<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='Label99' locked='false' title='Темы' type='Label'>
  <b:includable id='main'>
    <b:if cond='data:title'>
      <h2><data:title/></h2>
    </b:if>
    <div class='widget-content'>
      <script type="text/javascript" src="http://forum.wafl.ru/files/freeman/swfobject.js"></script>
      <script type="text/javascript">
        var flashvars = {};
        flashvars.mode = "tags";
        flashvars.minFontSize = "8";
        flashvars.maxFontSize = "22";
        flashvars.tcolor = "0x0988ff";
        flashvars.tcolor2 = "0x000000";
        flashvars.hicolor = "0xd95800";
        flashvars.distr = "true";
        flashvars.tspeed = "100";
        flashvars.tagcloud = "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' expr:style='data:label.count'><data:label.name/></a></b:loop></tags>";
        var params = {};
        params.wmode = "transparent";
        params.bgcolor = "#333333";
        params.allowscriptaccess = "always";
        var attributes = {};
        attributes.id = "b-cumulus";
        attributes.name = "tagcloud";
        swfobject.embedSWF("http://forum.wafl.ru/files/freeman/tagcloud.swf", "b-cumulus", "300", "250", "9.0.0", false, flashvars, params, attributes);
      </script>
      <div id="b-cumulus">
        <a href="http://www.adobe.com/go/getflashplayer">
          <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
        </a>
      </div>
      <b:include name='quickedit'/>
    </div>
  </b:includable>
</b:widget>

Облако тегов можно настроить в соответствии с оформлением вашего блога. Для этого в выше указанном коде можно изменять следующие параметры:

• в строке "swfobject.embedSWF("http://FILE_HOST_NAME/tagcloud.swf", "b-cumulus", "300", "250", "9.0.0", false, flashvars, params, attributes); " 300 - это ширина виджета в пикселях. 250 - это высота виджета в пикселях.
• flashvars.minFontSize = “8“; - минимальный размер шрифта.
• flashvars.maxFontSize = “22“; - максимальный размер шрифта.
• flashvars.tcolor = “0xffffff“; - цвет самого редкого ярлыка.
  
• flashvars.tcolor2 = “0×0be4f8“; - цвет самого популярного ярлыка. Для остальных ярлыков будет выбран цвет между этими двумя.
• flashvars.hicolor = “0xd95800“; - цвет текста при наведении курсора на ярлык.
  
• flashvars.tspeed = “100“; - скорость вращения Flash Облака тегов
• //params.wmode = “transparent“; - этот параметр обозначает прозрачный фон.
• params.bgcolor = “#333333“; - цвет фона Flash Облака тегов.

Пробуйте на своих блогах, в случае чего оставляйте сообщения в комментариях.

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


Так вот в сегодняшней статье хотелось бы рассказать, как путем некоторых манипуляций с шаблоном Вашего блога можно добавить подобный виджет и на страницы 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) показывает, что теги выводятся без указания количества статей с одинаковым тегом.


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

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

Так как мы будем вносить изменения непосредственно в код шаблона очень важно сделать резервную копию рабочего шаблона Вашего блога. В последующем, если Вы допустите критическую ошибку будет возможность вернуть все к изначальному состоянию ;)
Для этого в "Панели инструментов" перейдите в "Макет" >>> "Изменить 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" на номер Вашего блога, который мы записали ранее.
После всего сохраните шаблон и просмотрите блог.
Учтите Панель Администратора появится на на самом верху боковой панели.