вторник, 28 декабря 2010 г.
вторник, 21 декабря 2010 г.
Кнопки добавления в социалки и закладки.
В блоггере вставляем либо в шаблон (где-то после строчек <div class='post-footer'> или <div class='post-footer-line post-footer-line-1'> ,это с галочкой на "Расширить шаблоны виджетов") или в Настройках-Форматирование-Шаблон сообщения.
воскресенье, 19 декабря 2010 г.
Как использовать шрифты Google Custom в Blogger
Как известно есть некоторое количество общепринятых шрифтов,которые именуются web-шрифтами.
Этим летом команда Гугл запустила новый сервис Google web fonts,это позволяет применять нестандартные шрифты из каталога Google без каких-либо регистраций,бесплатно и возможностью применять как в личных,так и в коммерческих целях.
Такое нововведение позволит сделать блог более привлекательным и разнообразным.
Действия следующие:
Идём в редактирование шаблона,сохраняем копию шаблона,на всякий случай.
Теперь идём по этой ссылке ,выбираем нужный шрифт,настраиваем его,и получаем код.
Ищем у себя в шаблоне код <head> и сразу (!!!) после него вставляем полученный код вида:
Теперь добавим к коду слэш "/" перед закрывающим тегом >,это важно!
Получим так:
Теперь шрифт сохранён и его можно применить .
Чтобы использовать его где-то в постах,добавляем этот код:
Ищем код того,к чему применим шрифт,например:
.post h3 (или .post-title ) -Заголовок поста
.post-body -сообщения
.title -заголовок блога
.sidebar -виджеты
Ну и добавляем:
Демо можно посмотреть здесь.
Этим летом команда Гугл запустила новый сервис Google web fonts,это позволяет применять нестандартные шрифты из каталога Google без каких-либо регистраций,бесплатно и возможностью применять как в личных,так и в коммерческих целях.
Действия следующие:
Идём в редактирование шаблона,сохраняем копию шаблона,на всякий случай.
Теперь идём по этой ссылке ,выбираем нужный шрифт,настраиваем его,и получаем код.
Ищем у себя в шаблоне код <head> и сразу (!!!) после него вставляем полученный код вида:
<link href='http://fonts.googleapis.com/css?family=Tangerine' rel='stylesheet' type='text/css'>Теперь добавим к коду слэш "/" перед закрывающим тегом >,это важно!
Получим так:
<link href='http://fonts.googleapis.com/css?family=Tangerine' rel='stylesheet' type='text/css'/>Вставляем готовый код после <head> и сохраняем шаблон.Теперь шрифт сохранён и его можно применить .
Чтобы использовать его где-то в постах,добавляем этот код:
<div style="font-family: 'FontName', serif;">Your text</div>Ну а чтобы добавить шрифт к заголовкам виджетов,тексту поста,заголовку блога и т.п,то надо добавить CSS код (он также у гугла получается по ссылке выше).Ищем код того,к чему применим шрифт,например:
.post h3 (или .post-title ) -Заголовок поста
.post-body -сообщения
.title -заголовок блога
.sidebar -виджеты
Ну и добавляем:
.post h3 {
font-family: 'Your Font Name';
}Демо можно посмотреть здесь.
понедельник, 13 декабря 2010 г.
Xenu's Link Sleuth: программа проверки веб-сайта на "битые" ссылки
Программа Xenu's Link Sleuth позволяет найти битые ссылки, изображения, фреймы, дополнительные модули (plug-ins), фоновые рисунки (backgrounds), графические карты сайта (local image maps), таблицы стилей (style sheets), скрипты и Java-апплеты. Программа выводит список проверенных ссылок с сортировкой по различным параметрам. Также она позволяет создавать отчет с результатами проверки.
Скачать (current version: 1.3.8 from September 4th, 2010)
Дополнительная и полная информация на русском языке здесь.
воскресенье, 12 декабря 2010 г.
Как добавить цифровой счётчик количества сообщений и комментариев в Blogger
Просто вставляете как виджет этот скрипт:
<script style="text/javascript">
function totalPosts(json) {
document.write('Total Posts: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');
}
function totalComments(json) {
document.write('Total Comments: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');
}
</script>
<script src=" /feeds/posts/default?alt=json-in-script&callback=totalPosts"></script>
<script src=" /feeds/comments/default?alt=json-in-script&callback=totalComments"></script>
Как сделать фоновое изображение к сообщению.
Чтобы добавить картинку к сообщению надо:
Если хотите на каждый пост иметь разный фон,то надо сделать вот что,идём в Настройки-Форматирование и в Шаблон сообщения вписываем <div style="background:url(LINK_OF_PICTURE) no-repeat;"></div>
Потом при создании нового поста,пишем ссылку на картинку,задаём ей повтор (repeat) или не задаём (no-repeat) и перед </div>пишем тест сообщения.
Ну а можно просто каждый раз вставлять этот код в режиме Изменить HTML при написании нового поста.
Как отображать виджеты только на главной странице или на заданных определённых.
По умолчанию,если добавить виджет,то он виден на всех страницах блога. Но с помощью не хитрого действия,можно заставить виджет отображаться только на главной странице,или только на определённой,например в архиве,или на какой-то конкретной странице.
Панель админа в Blogger
Навбар убрали а как теперь быстро написать пост,или там порыться в коде?
Для этого кто-то умный придумал Админ-панель,которая видна только Вам.
Для этого кто-то умный придумал Админ-панель,которая видна только Вам.
Простое раздвижное меню с картинками
Простая менюшка.При наведении на картинку,она сдвигается и показывается пункт меню.
Оформляем внешнюю ссылку иконкой
Чтобы посетитель блога видел,что ссылка ведёт на другой сайт/блог,можно добавить к ссылке картинку.
Добавляем в CSS пару строк:
.post a[href^="http://"]:not([href*="nuzhdiki.blogspot.com"]):not([href*="1.bp.blogspot.com"]):not([href*="2.bp.blogspot.com"]):not([href*="3.bp.blogspot.com"]):not([href*="4.bp.blogspot.com"])after {
content: " " url(http://dl.dropbox.com/u/5453630/external.png);
}
Чтобы у вас каждая ссылка не была отмечена,добавляем адреса-исключения (синие строчки),в данном примере первый адрес,это свой домен,остальные это картинки Пикасы.Адреса можно добавить любые.
.post a[href^="http://"]:not([href*="nuzhdiki.blogspot.com"]):not([href*="1.bp.blogspot.com"]):not([href*="2.bp.blogspot.com"]):not([href*="3.bp.blogspot.com"]):not([href*="4.bp.blogspot.com"])after {
content: " " url(http://dl.dropbox.com/u/5453630/external.png);
}
Чтобы у вас каждая ссылка не была отмечена,добавляем адреса-исключения (синие строчки),в данном примере первый адрес,это свой домен,остальные это картинки Пикасы.Адреса можно добавить любые.
Как убрать значки "Быстрого редактирования" в Blogger
Лезем в шаблон,ставим галочку на "расширить шаблоны виджетов",ищем такие строки:
<b:include name='quickedit'/> и удаляем их.
Фоторедактор-онлайн ( аналог Фотошопа )
Нажми на ссылку и редактор откроется в новом окне.В браузере должны быть включены JavaScript и Flash.
Как убрать навбар (Navbar) в шаблонах Blogger
Перед ]]></b:skin> ставим этот кусок кода:
#navbar-iframe { display: none !important;}
#navbar-iframe { display: none !important;}
Заменить фразы "Предыдущее","Следующее","Главная" на картинки в Blogger
Ищем и добавляем к каждому элементу код на картинку.
<data:olderPageTitle/>
<img alt='Предыдущие' src='ссылка фото' title='Предыдущее'/>
<data:homeMsg/>
<img alt='Главная страница' src='ссылка' title='Главная страница'/>
<data:newerPageTitle/>
<img alt='Следующие' src='ссылка' title='Следующие'/>
<data:olderPageTitle/>
<img alt='Предыдущие' src='ссылка фото' title='Предыдущее'/>
<data:homeMsg/>
<img alt='Главная страница' src='ссылка' title='Главная страница'/>
<data:newerPageTitle/>
<img alt='Следующие' src='ссылка' title='Следующие'/>
Подписаться на:
Сообщения (Atom)