Как в Блоггер заменить кнопки соцсетей

 Не нравятся стандартные блогспотовские кнопки? Заводим новый блог и обнаруживаем, что основная масса советов в интернете по замене кнопок не работают? Нет никаких галочек по расширению шаблона, а коды, которые предлагают найти в шаблоне и вовсе отсутствуют? Куда вставлять кнопки?

  Да... Проблемка.

  Пример, который приводят многие блоггеры, подходит не всем. Это вставить код кнопок в виджет и перенести сам виджет в удобное место. Такой виджет не будет отправлять ссылки на нужное сообщение, а просто разместит ссылку на главную страницу блога. Кому интересно потом выискивать нужную информацию? Но, кто хочет так - может попробовать:

  Заходим в Дизайн, Добавить гаджет, ищем гаджет HTML/JavaScript и вставляем туда код понравившихся кнопок. После переносим гаджет в нужное место и вуаля - проверяем работоспособность. Мне, честно,такой способ не нравится.

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

  Итак. сначала надо убрать неприметные блогспотовские кнопки:

Дизайн-Сообщения блога-Изменить. Убираем галочки и избавляемся от ненужного в посте.

   Теперь заходим в Шаблон - изменить HTML. Жмем кнопку Форматировать шаблон. Нажимаем комбинацию CTRL + F. Внутри шаблона выпадает окно, куда нужно вставить этот код:

post-share-buttons goog-inline-block

  В самом шаблоне код высветится желтым цветом. Вот после него и вставляем наш код кнопок. Получаем красивую кнопочку внизу каждого сообщения.

  Коды кнопочек соцсетей можно найти на многих ресурсах, например http://share.pluso.ru/?new. Получится, как у меня. При желании добавить свои кнопочки или удалить ненужные, изменить размер, форму, добавить или убрать фон можно прямо на этом ресурсе. Код для кнопок формируется автоматически. Регистрироваться там не обязательно. Ваша задача - только взять его у них и вставить себе.

  Удачи! Работы на 5 секунд!

Заголовок блога на blogspot в поисковой выдаче

Продолжаю тему настроек блога на Blogger. Что отличает почти все блогспотовские блоги в выдаче поисковой системы? Правильно. Сначала идет название блога, и только потом заголовок статьи. В поисковике это выглядит так:

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

Оптимально, если ваша статья выдается на первой странице поисковой системы, - дальше первой страницы редко кто из посетителей заходит. К тому же, заголовок статьи должен максимально отражать суть вашей статьи, тогда шансы на успех увеличиваются в несколько раз (это немного не по теме). 

Итак, вы решили изменить выдачу заголовков ваших статей в поисковой системе. Придется чуть-чуть покопаться в шаблоне. Заходим в административную панель Blogger. Вкладка Шаблон -> Изменить HTML. Жмем на эту кнопку и видим шаблон, написанный на незнакомом нам языке. Ничего страшного! 

Находим в шаблоне этот код. 

<title><data:blog.pageTitle/></title>

Чтобы найти быстро, с помощью комбинации кнопок CTRL и F вызываем окно быстрого поиска на странице (на картинке видно это окно в правом верхнем углу) и вводим код в это окно. Найденный код выделяется оранжевым цветом.

Рис.1 

Смело заменяем найденный код на такой:

<b:if cond='data:blog.url == data:blog.homepageUrl'>
     <title>
          <data:blog.pageTitle/>
     </title>
<b:else/>
     <title>
          <data:blog.pageName/>
          <b:if cond='data:blog.pageName'> ~ </b:if>
          <data:blog.title/>
     </title>
</b:if>

Строчка <b:if cond='data:blog.pageName'> ~ </b:if> может быть немного изменена, например:   <b:if cond='data:blog.pageName'> - </b:if> 

или                <b:if cond='data:blog.pageName'> : </b:if> 

Значок "~" или "-" будет присутствовать в выдаче вашего заголовка.

Код будет выглядеть так:

Рис.2

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

Рис.3

Вот так выглядит выдача блога в поисковике после правки шаблона. Сначала название статьи, а потом название блога. Удачи Вам!

Как настроить шаблон Blogger

Привет друзья мои!

Как и обещала, сегодня рассказываю подробно о том, как настроить шаблон Blogger. Удивительные 8 стандартных шаблонов могут превратиться в тысячи уникальных и неповторимых дизайнерских шедевров. Требуется всего лишь несколько щелчков компьютерной мышкой плюс фантазия, оптимизм  и доля хорошего авантюризма, чтобы получить такой шаблон, от которого Ваши посетители будут в восторге! (Прошу на мой шаблон не ориентироваться.  Это шпаргалка, а шпаргалка должна быть неприметной, серой и безликой.  Примеры хорошо оформленных блогов можно посмотреть в Blogger.)

Итак, продолжим! Заходим в нашу административную панель Blogger, жмем Мои блоги -> Название блога -> Шаблон -> Кнопка Настроить (оранжевая под картинкой вашего блога). Попадаем в Дизайнер шаблонов Blogger!

Рис.1 Дизайнер шаблонов Blogger

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

Рис.2 Изменить фон в блоге на Blogger

Вкладка Фон. На самом деле можно поменять не только фон, но и всю цветовую гамму блога. Примеры цветовых решений, подходящих к вашему блогу будут предложены Дизайнером шаблонов Bloggerа, - выбирайте любой, какой приглянулся или подберите цвета на свой вкус.

Рис.3 Изменить  ширину колонок в блоге на Blogger

Вкладка Регулировка ширины. Это все просто. Передвигаем бегунок в шкале до нужного нам значения. Запоминаем ширину всего блога или даже записываем это значение! Пригодится для вставки своей картинки в шапку. Подробно об этом написано в конце статьи.

Рис.4 Изменить количество колонок в шаблоне Blogger

Вкладка Дизайн. Это самая важная деталь для юзабилити (удобство перемещения по блогу)! Продумайте, сколько и какой информации вы планируете размещать у вас в блоге, от этого зависит количество колонок и их расположение.  В шаблонах Blogger можно выбрать от 1-й до 4-х колонок, одна из которых будет содержать ваши записи, а боковые предназначены для вставки гаджетов (виджетов), то есть вывода популярных и важных статей, рубрик, меток, опросов, рекламы, баннеров, нужных ссылок, приглашений, всяких развлекушек , завлекушек и прочего, поэтому постарайтесь выбрать оптимальное количество, чтобы вашим читателям было удобно и комфортно.  После подбора количества колонок можно отрегулировать их ширину так, как вам надо (для этого переходим обратно на вкладку Регулировка ширины).

Рис.5 Вкладка Дополнительно

 

Это самая интересная вкладка для тех, кто хочет под себя настроить все шрифты и цвета блога. Настройка шрифтов идентична редактору Word, правда выбора стилей написания поменьше, но зато с цветами и оттенками проблем никаких. Даю подсказку тем, кто планирует работать в фотошопе для оформления своего блога и хочет не ошибиться с цветом! При просмотре и выборе цвета в верхнем окошечке есть код, в котором зашифрован ваш выбранный цвет.  Эти коды пригодятся вам в работе с фотошопом, чтобы ваши кнопочки, рамки и баннеры точь в точь соответствовали цветовому дизайну вашего блога.  Конечно, есть красивые попугаи, но очень часто их расцветки слишком режут глаза.

Рис.6 Найти код цвета в шаблоне Blogger

Для тех кому сложно ориентироваться в названиях, а нужно изменить шрифт или цвет заголовка. Жмем, например «Название блога». Видим шрифты и цвета

Рис 7 Изменить название блога 

Рис.7 Подсказка (что вообще это такое?) выделена красным

Все! Все изменения сохраняем  - жмем кнопку «Применить к блогу» и переходим опять в административную панель. Просматриваем нашу работу, любуемся, а если что-то не понравилось, то бежим обратно в Шаблоны и исправляемся. Не забываем кнопку «Применить  к блогу» или, если передумали, то там есть ссылка "назад  в Blogger". Ничего страшного, если получившийся дизайн не совсем устроил. Всегда есть возможность исправить все, что нужно или, в крайнем случае, вернуться в стандартные настройки и сделать все заново и по-другому.

Ну, вроде бы закончили работать с дизайнером. Теперь можно поменять шапку блога, то есть вместо безликого пустого места вверху блога нарисовать туда картинку. Берем желаемую картинку размером ровно по ширине вашего блога (то значение в пикселях, что мы записывали или запоминали во вкладке Регулировка ширины), высота может быть любой, но оптимально, чтобы она не заслоняла половину вебстраницы!  Если ваша картинка меньше или больше – редактируем в фотошопе под нужный размер. Можно в фотошопе онлайн или в любом другом графическом редакторе, в котором вы обычно работаете.

Вставить картинку в шапку очень просто. Заходим  во вкладку Дизайн в административной панели Blogger

Рис.8 Изменить дизайн блога. Ищем гаджет (что это такое?) с названием вашего блога и нажимаем Изменить. 

Открывается это окно

Рис.9 Окно редактирования названия блога

Загружаем нужную картинку, сохраняем, смотрим на свой новенький красивый блог и радуемся проделанной работе!

В следующий раз пишу о том, что такое фавикон и с чем его едят! Кому интересно, жду!