Мы пытаемся понять, как работает шаблон блогера. Разберём минимальный код, который нужно поместить в редактор HTML шаблонов блогера. Мы можем получить доступ к редактору шаблонов блогеров, нажав «Изменить HTML в панели управления blogger, Тема>> Изменить HTML ».
- Минимальный код для Blogger
- 1. Мы не можем сохранить пустой шаблон
- 2. В шаблоне должен быть тег <b:skin>
- 3. Шаблон должен содержать тег <head>
- 4. Шаблон должен содержать тег <body>
- 5. Для шаблона Blogger требуется хотя бы один тег b: section
- 6. b: тег раздела должен иметь уникальный идентификатор
- 7. Это работает. Теперь у нас есть шаблон блога, который можно сохранить
- 8. Обновите блогер в режиме редактора HTML.
Минимальный код для Blogger
Blogger уведомляет нас о каждой существующей в шаблоне блогера ошибке. Сохраняя шаблон, мы видим уведомление об ошибке. Например, после удаления всего кода при попытке сохранить шаблон появляется уведомление«Ошибка синтаксического анализа XML, строка 1, столбец 1: преждевременный конец файла»
Чтобы понять минимальный код шаблона блогера, я попытался удалить HTML-код один за другим и увидел уведомление об ошибке, выданное блогером.
1. Мы не можем сохранить пустой шаблон
Ошибка появилась, когда мы устали сохранять пустой шаблон
XML — это язык разметки, расширенный язык разметки. Синтаксис почти одинаков с HTML. Есть некоторые различия между XML и HTML. Мы узнаем об этом позже.
Когда мы попытались сохранить шаблон с кодом который вы видите ниже, возникла еще одна ошибка.
Вставьте код ниже и сохраните:
<html>
</html>
2. В шаблоне должен быть тег <b:skin>
Тег используется для оформления блога. Блогер
Когда мы попытаемся сохранить шаблон с кодом который вы добавили, возникла еще одна ошибка.
Вставьте код ниже и сохраните:
<html>
<b:skin> </b:skin></html>
3. Шаблон должен содержать тег <head>
Теги <b:skin> </b:skin> должны быть помещены внутрь тега <head>
Когда мы попытались сохранить приведенный выше код, появилось уведомление о том, что <b:skin> </b:skin> должен находиться внутри тега <head> </head>. Вот почему мы должны добавить тег <head> перед <b:skin> </b:skin>.
Вставьте код ниже и сохраните:
<html>
<head><b:skin></b:skin>
</head></html>
4. Шаблон должен содержать тег <body>
Когда мы попытались сохранить приведенный выше код, мы получили уведомление о том, что мы должны добавить тег <body>. Здесь находится содержимое блога.
Вставьте код ниже и сохраните:
<html>
<head>
<b:skin></b:skin>
</head>
<body></body>
</html>
5. Для шаблона Blogger требуется хотя бы один тег b: section
Такие элементы Blogger, как верхний и нижний колонтитулы, область публикации и боковая панель, будут разделены с помощью тега b:section внутри тега <body>.Вот почему нам нужен хотя бы тег b:section.
Вставьте код ниже и сохраните:
<html>
<head>
<b:skin></b:skin>
</head>
<body>
<b:section></b:section></body>
</html>
6. b: тег раздела должен иметь уникальный идентификатор
Поставьте идентификатор для раздела, который был создан.
Вставьте код ниже и сохраните:
<html>
<head>
<b:skin></b:skin>
</head>
<body>
<b:section id=»header»></b:section>
</body>
</html>
7. Это работает. Теперь у нас есть шаблон блога, который можно сохранить
Теперь мы понимаем минимальный код для шаблона блогера. Давайте рассмотрим внешний вид этого шаблона.
У меня есть один пример этого шаблона по ссылке ниже:
Мы видим, что там ничего нет. Это только пустой белый фон. Таким образом, с шаблоном, который мы только что создали, мы получили только пустой экран.
Если перейти в дизайн, то увидим макет минимального шаблона блогер
Картинка выше говорит нам об элементе блогера. Мы видим раздел заголовка , который мы создали ранее. Помимо этого, есть Favicon Box, который будет содержать логотип для блога.
8. Обновите блогер в режиме редактора HTML.
Blogger добавляет элементы XML в код HTML
Итак, наконец, минимальный код шаблона блога состоит из 9 строк, как показано выше.
После сохранения шаблона блогер добавит декларацию документа и элемент HTML. Ниже приведен полный код шаблона блога, который можно сохранить.
<?xml version=»1.0″ encoding=»UTF-8″ ?>
<html xmlns=’http://www.w3.org/1999/xhtml’ xmlns:b=’http://www.google.com/2005/gml/b’ xmlns:data=’http://www.google.com/2005/gml/data’ xmlns:expr=’http://www.google.com/2005/gml/expr’>
<head>
<b:skin></b:skin>
</head>
<body>
<b:section id=»header»></b:section>
</body>
</html>
Вот и все чему мы научились за этот урок.