Георгиевская ленточка

Как настроить цвета карты сайта по ярлыкам

18.09.2016

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


Вот код карты сайта, с которым мы будем работать:



Если вдруг код не будет отображаться - пишите в комментариях.

Так она выглядит с моими настройками:



Сразу скажу, что я меняла не все цвета (серые оставила). Также не меняла цвет текста. Поэтому покажу только основные настройки, кардинально меняющие внешний вид карты.

Скриншоты даю с номерами строк кода, чтобы удобнее было искать. Я пользуюсь программой Notepad++, где также видны №№ строк, а сам код в статью вставляла при помощи сервиса.

О том, как выбрать цвета для блога, я писала в нескольких статьях
В коде карты менять будем только 6 символов после знака #, обозначающие код того или иного цвета.

Итак, поехали.

В строке 48 настраивается цвет узкой верхней горизонтальной полосы.



В строке 49 Вы можете настроить цвет фона под текстом "Загрузка, подождите...", который появляется при загрузке карты сайта. Также цвет в этой строке отвечает за фон всего левого столбца с ярлыками.



Если сделать цвет прямоугольного блока под выбранным ярлыком (который меняется в строке 87) более светлым, чем весь столбец слева, то эта полоса даже кажется немного объемной.



И еще можно настроить цвет прямоугольного блока под заголовком статьи при наведении курсора (скриншот карты с другого блога). В строке 162.



Вот так всего за 4 шага меняется внешний вид карты сайта для Blogger по ярлыкам

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

Вот, например, пока писала эту статью, настроила карту в зеленых тонах:



И даже кодом такой карты сайта с моими настройками могу поделиться :)
(Как установить карту смотрите в предыдущей статье).




Ну и пожелаем, чтобы эта карта устанавливалась и работала нормально еще долго-долго.

4 комментария:

  1. Здравствуйте, Мария! Обязательно попробую сделать!

    ОтветитьУдалить
  2. Добрый вечер, Мария! Всё получилось! Вот только у меня вопрос - а куда подевались сообщения? Проверила, а некоторые ярлыки словно пустые, не дают результаты. Проверила сообщения - всё на месте, ярлыки в конце сообщения срабатывают верно. Заметила, что не показываются в списке сообщения, которым больше года. А как это убрать?
    http://geografo4ka.blogspot.ru/p/2.html

    ОтветитьУдалить
    Ответы
    1. Мария, Вы уж простите за назойливость, и ещё один вопрос: как сделать расстояние между строчками в правой колонке поменьше???

      Удалить
  3. A very interesting article, A variety of apps will provide additional opportunities for the user and replace basic functionality, update your Android with the latest APPs, expand the utilities installed on your mobile,Messenger,WhatsApps, Antivirus, Games, Music, watch TV, Tools.
    A very good and interesting article, Browsing the internet looking for general culture information, I find CULTURAL BLOGS have Literary information, Books, novels, Latin American culture, Magazines.etc I recommend the page of the writer Manuel Sosa Madrid Writer of Black Novels and Stories that will make you think.

    ОтветитьУдалить

Загляните и на другие страницы ^