Редактируем шаблон Blogger от Artisteer

Дата: 26 июня 2012

Редактирование шаблона блога

  1. Если у вас появились страницы после загрузки нового шаблона вида
    1
    то избавиться от ненужного гаджета можно во вкладке «Дизайн», просто удалите его.
    2
    3
  2. Как изменить шапку в блоге видеоурок
    Создать новую шапку в графическом редакторе размерами 988 x 312
    Загрузите новую шапку на фотохостинг без оптимизации и изменения размеров
    Скопируйте ссылку на изображение новой шапки в оригинальном размере
    Меню → Шаблон → Изменить HTML
    Ctrl + F – поиск по коду
    Найти ссылку на изображение шапки http://img825.imageshack.us/img825/8153/headerqqr.jpg (она встречается в шаблоне 4 раза) и замените ее 4 раза на ссылку на новую шапку.
  3. Точно также измените фон блога. Ссылка на фон встречается в шаблоне лишь 1 раз. Ссылку на фон http://img254.imageshack.us/img254/417/bottomtextureop.jpg измените на ссылку на новый фон. Если фон бесшовный, то нужно заменить отрезок кода no-repeat на X-repeat, Y-repeat
    Пример кода фона после изменения его на новый бесшовный фон:

    background-image: url('https://img-fotki.yandex.ru/get/4310/flashtuchka.258/0_49931_6b0d52f3_L');
    background-repeat: X-repeat, Y-repeat;

     

  4. Изменение шрифта в блоге. Видеоурок http://www.youtube.com/watch?v=0diEacunFes
    В редакторе шаблона Html снова активируйте быстрый поиск по шаблону (Ctrl + F) и найдите font
    Увидите код:

    #main, table
    {
    font-family: Arial, Helvetica, Sans-Serif;
    font-style: normal;
    font-weight: normal;
    font-size: 13px;
    }
    h1, h2, h3, h4, h5, h6, p, a, ul, ol, li
    {
    margin: 0;
    padding: 0;
    }
    .postcontent,
    .postheadericons,
    .postfootericons,
    .blockcontent-body,
    ul.vmenu a
    {
    text-align: left;
    }
    .postcontent,
    .postcontent li,
    .postcontent table,
    .postcontent a,
    .postcontent a:link,
    .postcontent a:visited,
    .postcontent a.visited,
    .postcontent a:hover,
    .postcontent a.hovered
    {
    font-family: "Times New Roman", Georgia, Times, Serif;
    font-style: italic;
    font-weight: normal;
    font-size: 16px;
    }

    Нас интересует последняя часть кода, выделенная желтым, которая идет сразу после postcontent, Здесь находится стиль шрифта сообщений блога.
    Измените Times New Roman на другой шрифт. Именно первый шрифт будет преимущественным образом отображаться в блоге. Можете изменить font-style (italic – курсив, normal – нормальный, bold – жирный)

  5. Как изменить ширину сайдбара
    В редакторе html с помощью быстрого поиска найдите sidebar. Код:

    /* begin LayoutCell, sidebar1 */
    .content-layout .sidebar1
    {
    width: 250px;
    }

    Замените 250px на нужную ширину сайдбара.

  6. Использование списков
    Списки выглядят так:
    4
    Списки — это своего рода перечисление.
    Для того, чтобы создать такой список в простом редакторе сообщения нужно воспользоваться иконкой создания маркированного списка:
    5
  7. Создание цитаты
    Выглядит цитата так:
    6
    Создать цитату — выделите цитируемый фрагмент текста (или текст, который хотите выделить по-особенному) в простом редакторе сообщений и нажмите кнопку с кавычками:
    7
  8. Создание кнопок.
    В сообщение блога можно вставить дополнительные кнопки. В редакторе сообщений Режим Html вставьте код

    <span class="button-r"> </span>
    <a class="button" href="http://какая то ссылка">Текст кнопки</a></span>

  9. Ни в коем случае не изменяйте никакие параметры вкладки Страницы! Можно только добавлять и удалять страницы.
  10. Как добавить ссылку «Ответить» в комментариях
  11. Как вставить код Adsense в сообщение blogger
Ссылка на основную публикацию