Предполагая, что у вас есть блог Blogger со всеми базовыми настройками, а также вы добавили замечательно выглядящий шаблон либо из стандартных шаблонов Blogger, либо загрузили собственный шаблон и использовали его для своего блога, в этой главе я собираюсь научить вас для редактирования шаблона, который вы используете на сайте.
Выбор подходящего шаблона для вашего блога - одна из самых важных и сложных задач. Вам могут не понравиться шаблоны по умолчанию, представленные в Blogger, поэтому вы обязательно будете искать собственные шаблоны. Вам может понравиться макет нескольких шаблонов, но не используемые в них цвета, и наоборот. Зачем так чесать затылок? Я говорю, просто выберите шаблон с хорошим макетом, а также оптимизированный для SEO. Редактировать цвета и вносить небольшие изменения в шаблон намного проще! Это еще раз докажет, насколько простой может быть работа с Blogger.
Я выбрал Шаблон блогера ATBe, чтобы подробно объяснить вам, как редактировать шаблон blogger. Вы можете получить этот шаблон здесь!
ШАБЛОН БЛОГЕРА ATB
Перед редактированием кода HTML или CSS я рекомендую вам загрузить файл резервной копии. Так что если что-то пойдет не так, вы можете загрузить xml-файл и восстановить предыдущий шаблон.
Понимание редактора
Перейти к виджету
Используя это, вы можете перейти к любому виджету, который вы установили в своем блоге. Просто откройте раскрывающийся список «Перейти к виджету» и выберите виджет, который нужно отредактировать. Это упрощает работу, поскольку вам не нужно искать по всему коду небольшой виджет.
Расширяемые сегменты кода
В редакторе Blogger есть расширяемые сегменты кода, благодаря которым редактор выглядит чище и менее громоздким.
Предварительный просмотр шаблона
Вы можете предварительно просмотреть шаблон в том же окне, используя эту опцию. Используя это, вы можете убедиться, делаете ли вы правильное редактирование или нет.
Форматировать шаблон
Как вы можете видеть код в первый раз, редактировать такой шаблон может быть кошмаром. Щелчок по шаблону формата приведет к отступу в вашем коде в наиболее удобочитаемой форме, как показано на изображении ниже.
Примечание. Для сильно измененного шаблона это может вызвать некоторые проблемы, поэтому просмотрите перед сохранением любых изменений.
Шаги по редактированию стандартного или настраиваемого шаблона в Blogger:
Шаг 1. Откройте Blogger
Откройте Blogger.com и войдите в свою учетную запись. Выберите блог, над которым вы работаете, и откройте панель управления.
Шаг 2: отредактируйте HTML
Как только вы окажетесь на панели инструментов, вам нужно перейти к «Шаблону» и щелкнуть по нему. Вы найдете две опции: «Настроить» и «Редактировать HTML». Нажмите «Редактировать HTML».
Шаг 3. Отметьте, где вы хотите отредактировать
Все браузеры имеют функцию под названием «Проверить элемент», которая расскажет вам о различных функциях выбранного вами элемента, таких как HTML-код, CSS-код и т. Д.
Если вы хотите узнать адрес, цвет, отступы, шрифт и т. Д. Любого элемента, вам просто нужно щелкнуть его правой кнопкой мыши и выбрать «Проверить элемент». В небольшом окне в нижней части браузера вы можете найти ahrefs, стили, сеть, источники и другую информацию. Вы будете использовать любой из них и редактировать шаблон, как захотите.
Шаг 4: изменение цвета; Редактирование CSS
Редактировать CSS очень легко, если вы понимаете его. Базовое кодирование, которое включает в себя тип функции, отступы, шрифт, цвет, фон и т. Д., Можно изменить, как только вы сможете определить местоположение того, что вы собираетесь изменить, и где это повлияет на шаблон.
Как упоминалось в предыдущем шаге, элемент Inspect играет в этом важную роль. Все, что вам нужно сделать, это просто навести курсор на элемент, который вы хотите отредактировать, и щелкнуть по элементу проверки.
В правом нижнем окне вы сможете увидеть цвета, фон, отступы, поля, стили шрифтов, цвета при наведении курсора и т. Д. Измените соответствующие характеристики выбранного элемента и проверьте, подходит ли он вашему шаблону.
Если вам нравится, как вы изменили шаблон, перейдите в окно «Редактировать HTML» и нажмите «Ctrl + F». Вставьте стиль элемента или все, что связано с выбранным элементом, и нажимайте ENTER, пока не найдете его точное местоположение.
Найдя его, внесите необходимые изменения и сохраните шаблон. Обновите свой блог и проверьте, внесены ли изменения или нет.
Примечание. Если вы ошиблись при редактировании HTML-кодов, загрузите файл резервной копии, который вы скачали ранее, или просто используйте Ctrl + Z, чтобы отменить изменения.
Шаг 4: изменение меню навигации
На предыдущем шаге вы узнали, как редактировать код CSS в Blogger. Теперь предположим, что все редактирование выполнено и ваш шаблон выглядит потрясающе. Но вам нужно изменить ссылки на панели навигации как в верхнем, так и в нижнем колонтитуле.
Например, давайте изменим вкладку «SEO» в меню навигации на «Ведение блога». Перейдите в окно редактирования HTML и нажмите Ctrl + F. В поле найдите SEO и нажимайте ENTER, пока не найдете точное местоположение слова в навигационном меню.
Вы найдете такой код, как
SEO
Просто замените https://www.alltechbuzz.net/search/label/GOOGLE%2FSEO любой ссылкой, по которой вы хотите перейти. А также замените «SEO» на «Blogging». Это оно!
Сохраните шаблон и обновите свой блог. Проверьте, изменилось ли меню навигации и указывает ли оно на правильный веб-адрес.
