How to Add CSS in Blogger

05 September 2023, 16:30 / Last update: 06.09.2023, 15:38

Как добавить сторонний CSS код в свой шаблон Blogger?

Способ 1: через стандартное меню  Тема  --->  Настроить  в панели управления.

(Изображения под спойлером прилагаются)

1. Нажмите  Тема  в меню слева, в панели управления вашим блогом.
2. Затем, перейдите в меню  Настроить , которое находится вверху, в центре.
3. В меню слева выбираем вкладку  Расширенные , нажимаем серый треугольник в маленьком раскрывающемся подменю с надписью "Текст страницы" и прокручиваем до конца, до пункта  Добавить CSS , выбираем этот пункт.
4. В поле «Добавить свой код CSS» скопируйте или введите свой CSS код.
5. В правом, нижнем углу нажмите «Сохранить» (значок дискеты), ваш CSS добавлен.

1. Перейдите в меню "Тема", в панели управления блогом.

2. Нажмите кнопку "Настроить" в верхней части панели управления.

3. Откройте раскрывающуюся вкладку "Расширенные" в меню слева.

4. Выберите подменю, нажав на серый треугольник.

5. Прокрутите пункты меню вниз, до самого конца
и выберите "Добавить CSS".

6. Введите или скопируйте свой код CSS в текстовую область.

7. Не забудьте сохранить свои изменения.
Ваш CSS код будет применён.

 

Примечание: добавление CSS стандартным способом в Blogger имеет свои недостатки, главный из них - невозможность визуально контролировать куда, в какое место в шаблоне вы добавили свой код, возникает ощущение беспорядка, путаницы и полного безумия!
Во втором способе, код будет добавлен в режиме редактирования HTML шаблона, где все шаги строго контролируются пользователем, а CSS код будет добавлен именно в то место в шаблоне, которое выберет пользователь.
Кроме того, второй способ намного проще и визуально понятнее предыдущего.

Способ 2: через меню  Тема  --->  Настроить  --->  Изменить HTML  в панели управления.

(Изображения под спойлером прилагаются)

1. Нажмите  Тема  в меню слева, в панели управления вашим блогом.
2. Затем, перейдите к меню  Настроить , справа от слова "Настроить" есть маленький белый треугольник, нажимаем его - появится меню.
3. В меню выбираем и нажимаем пункт  Изменить HTML , после этого мы попадём в ад непосредственно в режим редактирования HTML кода нашего шаблона.
4. Теперь, нам нужно понять и определить, где кончается оригинальный CSS код нашей темы (тот, что уже присутствовал в нашем шаблоне по умолчанию), вот в конец этого оригинального CSS мы и будем добавлять свои блоки с CSS кодом, заботливо отделённые от оригинального CSS закомментированной строкой!
   Определим конец оригинального CSS на примере темы Blogger Contempo (смотрим на изображения под спойлером):

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

В этот конец вы и будете добавлять / удалять свои блоки кода с CSS.

 

Просто помните - вам нужно найти в своём шаблоне область с CSS кодом (обычно, она вся усыпана фигурными скобками и сплошь синего цвета), затем определить окончание этой зоны с оригинальным CSS, а после этого, вы сможете без труда добавлять в конец оригинального CSS свой код - блоками, строками и даже лесенками, жать кнопку "Сохранить" и дивиться результату!

Перед любыми изменениями, которые вы вознамерились осуществить, вам нужно в обязательном порядке сделать резервную копию вашего шаблона, это очень легко в Blogger:  Тема  --->  Настроить  (белый треугольник справа) --->  Сохранить резервную копию 
Скачайте и сохраните предлагаемый .XML файл, он содержит весь HTML код вашего шаблона, при восстановлении вам будет предложено загрузить этот файл.
Позднее, если "операция пошла не по плану", вы легко сможете восстановить свою тему, выбрав из того же меню пункт  Восстановить .