Утилита Blogger Backup - создание резервной копии блога на Blogspot

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

На помощь приходит утилита - Blogger Backup.
Качаем последний релиз, распаковываем и устанавливаем на свой копмьютер.

При первом запуске программа будет абсолютно пустая, все настройки закрыты, для начала потребуется добавить блог. Напротив поля Available blogs выбираем единственный пункт Add/Update/Remove Blogs. После этого появится диалоговое окно:
Утилита Blogger Backup
Здесь есть 2 варианта добавления новых блогов в список – автоматический (первая закладка) и ручной (вторая). При автоматическом способе потребуется указать пароль и логин к вашей учетной записи в Blogger, после чего нажать кнопку «Log into Blogger and Get Blogs». Ваши ресурсы будут добавлены. Во втором случае вам придется самим заполнить поля с названием блога, ссылкой на него и загрузить RSS канал. Советую для этого воспользоваться соответствующей кнопкой (пункт 2 на рисунке выше). Далее просто жмем «Add/Update Blogs» и затем «Ок».

Теперь в списке Available blogs появятся добавленные блоги. Выбираем нужный из них:
Утилита Blogger Backup
Далее нужно указать некоторые настройки для бекапа. В принципе, ничего сложного здесь нет, рекомендую лишь в поле «Save posts as (format)» поставить вариант «One file per post» - то есть для каждого поста отдельный файл. Восстановить из бекапа, где все посты хранятся в одном файле у меня лично не получилось.
После установки параметров жмем кнопку «Backup Posts». Если все настроено правильно – посты вашего блога будут сохранены на локальный диск.

Слева от кнопки создания бекапа есть «Restore Posts» - нажимаем ее для восстановления блога. В специальном окне добавляем все файлы (посты), которые хотим опубликовать на сайте:
Утилита Blogger Backup
Далее в соответствующих полях указываем логин и пароль для вашей учетной записи. Авторы программы гарантируют, что данная информация никак не будет использована и нигде не сохраняется, хотя 100% гарантии, конечно, никто не даст.

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

Есть еще один нюанс – комментарии сохраняются в бекапе, но в данной версии программы их восстановление невозможно. Поэтому нужно либо ждать обновлений софта, либо публиковать вручную.

Если вам известны какие-то еще способы как можно сделать бекап блога на Blogger – делимся опытом в комментариях. На написание поста меня вдохновил заметка в блоге Дмитрия Наумова - резервная копия блога на blogspot. Утилита Blogger Backup. Я более подробно рассмотрел саму программу и как с ней работать.

P.S. После очередного апдейта блог удостоился о Яндекса тИЦ 40, чему я очень рад. Предлагаю купить постовые или спонсорские ссылки по цене $3 за штуку. При оптовых покупках – скидки. Блог активно живет и развивается, поэтому показатели будут лишь расти, а ссылка остается здесь навсегда!

Блоггерам, просто предлагаю обменяться постовыми.

Спасибо спонсорам блога:
Понравился пост? Подпишись на обновления блога по BlogoHelp RSSRSS, BlogoHelp по EmailEmail или twitter!
Как вам пост?   

Эффект lightbox2 для изображений в Blogspot

воскресенье, 14 сентября 2008 г.
Эффект lightbox2  для изображенийВ прошлом посте я рассказывал, как можно вставить изображение на Blogger таким образом, чтобы в посте отображалась небольшое превью, а при клике на нем картинка выводилась в полном размере. Кроме открытия фотографии в новом окне (вкладке) браузера есть возможно выводить ее в так называемом popup (всплывающем) окне. Год назад или даже более того был создан специальный эффект lightbox для вывода всплывающего окна. Он выглядел просто потрясающе, поэтому быстро обрел популярность. Сейчас существует несколько вариаций и модификаций оригинальной версии, кроме изображений доступен даже вывод видео! Реализовывается все с помощью JavaScript.

Сегодня я хочу рассмотреть вторую версию данного эффекта под названием lightbox2. Вот как выглядит рабочий пример:



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



Кстати, работы, которые вы видите принадлежат лондонскому дизайнеру Питу Харисону (Pete Harrison).

Теперь рассмотрим как же сделать столь эффектное увеличение изображений для блога.

Подключение скрипта

Поскольку у Blogger`а нет непосредственного доступа к хостингу и невозможно разместить на нем свои файлы, вам потребуется использовать подходящий интернет сервис или вас собственный хостинг от другого проекта.

1. Скачиваем архив скрипта, распаковываем и заливаем на хостинг.

2. Добавляем 3 Javascript файла в блок header вашего блога (в таком же порядке!):
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
3. Подключаем дополнительный файл стилей для эффекта (можно добавить их в существующий CSS):
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
4. Посмотрите CSS файл и удостоверьтесь, что пути к файлам prev.gif и next.gif указаны правильно. Я использовал прямой путь чтобы наверняка не возникло никаких ошибок. Точно также проверьте пути к loading.gif и close.gif в файле скрипта lightbox.js.

Активация эффекта

1. Чтобы активировать использование эффекта для конкретного изображения нужно добавить в тег IMG строку rel="lightbox":
<a href="http://www.blogger.com/images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>
Необязательный атрибут title выводит заголовок картинки.

2. Если вы хотите установить эффект для группы изображений, выполняйте те же условия, что и в шаге 1, только добавьте имя группы в квадратных скобках в атрибут rel:
<a href="http://www.blogger.com/images/image-1.jpg" rel="lightbox[roadtrip]">image #1</a>
<a href="http://www.blogger.com/images/image-2.jpg" rel="lightbox[roadtrip]">image #2</a>
<a href="http://www.blogger.com/images/image-3.jpg" rel="lightbox[roadtrip]">image #3</a>
Все, проверяйте, что у вас получилось:)
Кстати, нет никаких ограничений на количество изображений в группе и количество групп на одной странице – используйте сколько хотите.

P.S. Хочу напомнить, что я провожу конкурс для блоггеров с призовым фондом более 300 долларов - приглашаю всех принять участие!
Вы можете купить обогреватель для своего дома в нашем интернет магазине.
Теперь можно смотреть бесплатно онлайн фильмы.
Понравился пост? Подпишись на обновления блога по BlogoHelp RSSRSS, BlogoHelp по EmailEmail или twitter!
Как вам пост?   

Вставка изображений в блог на Blogspot, увеличение в новом окне

суббота, 6 сентября 2008 г.
Вставка изображений в блогВ данном посте отвечу на вопрос как добавлять в блог изображения с превью – чтобы в тексте картинка была маленькая, а при клике открывалась увеличенная и в новом окне.

Для начала расскажу о том как вставить изображение в пост. Есть несколько способов. Во-первых, в самим текстовом редакторе существует специальная кнопка для вставки картинок:


После клика на ней появляется всплывающее окно с настройками вставляемого изображения. Выбираем источник – либо это локальный компьютер, либо картинка из Интернета, далее определяем расположение ее в тексте (справа, слева, по центу) и указываем размер (малый, средний, большой). Затем нажимаем на кнопку «Загрузить изображение».



Картинка будет сохранена в ваш персональный альбом сервиса Picasa от Google, который предоставляет возможность хранения изображений. Вместе с этим картинка появится в самом посте. Причем в тексте статьи она будет такого размера, как вы выбрали в настройках при ее добавлении, а после клика на ней, откроется в полный размер в новом окне.

Метод второй – вставка изображения вручную.
Здесь также фигурирует сервис Picasa. Перед тем как добавить картинку в блог, загружаем ее в галерею. Есть возможность группировать фотки в категории, чем лично я и пользуюсь – изображения с разных блогов хранятся в разных разделах. Итак, находим нужную нам фотографию, кликаем на ней и попадаем на страницу с подробным описанием, где можно добавить теги, переместить в другой альбом, а также получить ссылку на изображение.



Для начала нам потребуется выбрать какой размер картинки мы хотим получить. В системе есть несколько форматов – миниатюра (ширина = 144 пикселя), маленький (288 пикс.), средний (400 пикс.) и большой (800 пикс.). Признаться, не знаю как сервис ведет себя с фотками больше 800 пикселей, есть ли возможность их загружать. Мне для блога размера 800 хватает с головой. Далее копируем ссылку. Обратите внимание, что я использую поле «Вставить изображение», а не «Ссылка», поскольку последнее ссылается на картинку внутри Picasa, то есть отображаться она будет в интерфейсе галереи. Поэтому я выбираю поле с кодом и получаю что-то вроде такого:



В третьей версии Picasa добавляет к изображению просто уйму ненужного кода, включая ссылку на автора альбома. Берем из всего текста лишь тэг с изображением (img), который можно вставить в блог. Удостоверьтесь, что в текстовом редакторе установлен режим HTML.

Для тех, кто не знает HTML и CSS данный метод, конечно, мало применим, но мне нравится больше первого. Здесь есть больше возможностей по управлению расположением картинки. Для каждого поста я публикую небольшое изображение по теме дабы добавить немного красоты, причем устанавливаю выравнивание по правому краю. Кроме того, добавляю в код свойство alt – которое выводит на странице альтернативный текст, если в браузере отключены фотки. Это, во-первых, дополнительный плюс для читателей блога, а, во-вторых, возможность получить немного трафика с поиска по изображениям Google. Все эти действия осуществляю с помощью примерно следующего текста:
style="float: right; margin-left: 5px;" alt="Список Google гаджетов в Blogspot"
Как это выглядит на сайте можете посмотреть в коде страницы для любого поста. По-моему, намного красивее и компактнее стандартной вставки, причем более функционально.

Чтобы заставить увеличенное изображение открываться в новом окне, сделаем следующее. Обратите, пожалуйста, внимание на ссылки:



Это одно и то же изображение, но передается с разным размером – первый вариант 800 пикселей, второй - 144. Зная данную особенность, можно легко для каждой картинки вставлять следующий код:

<a target="_blank" href="изображение-800-пикселей"><img src="изображение-144-пикселя " /></a>
В следствии чего получим в посте миниатюрное изображение, при клике на которое будет открываться его большой вариант в новом окне. Например:



Кстати, это работа Джонатана Вонга (Jonathan Wong) - восемнадцатилетнего ирландского дизайнера.

Если есть какие-то вопросы, прощу задавать их в комментариях. В следующий раз я расскажу об одном интересном эффекте для изображений в новом окне. Смотрится просто потрясающе. Не пропустите – подписывайтесь на RSS блога или по e-mail!

P.S. Интересно и полезно почитать:
Понравился пост? Подпишись на обновления блога по BlogoHelp RSSRSS, BlogoHelp по EmailEmail или twitter!
Как вам пост?   
Related Posts with Thumbnails