Оформление футера. Как я исполняю желания.

Вот я и добралась до исполнения желания победителя конкурса! Еще раз дружно поздравляем @commodore:

Мои картинки с кнопочками выглядят вот так:

Чтобы сделать аналогичный футер надо подобрать картинки/иконки и расположить их определенным образом в коде. Я все свои посты пишу через редактор html, поэтому и код для футера будет в этой разметке.

Итак, для начала подбираем картинки для кнопок. У меня 5 похожих, отличающихся только цветом и надписями, поэтому разберем на одной:

Чтобы сделать вот такую надпись я использовала фотошоп. Создала файл размерами 200х100 пикселей, сделала заливку светлофиолетовым цветом и текстом написала название. Думаю, с этой частью проблем не должно быть.

Теперь надо сделать так, чтобы эта «кнопочка» вела на какие-то посты в поиске. Для этого в каждый свой пост по этой тематике я проставляю определенный тег: исполнениежеланий. Я прекрасно понимаю, что тег не личный, т.к. кто угодно может сейчас взять и заняться тем же самым на Голосе, а именно исполнять желания. И ставить этот тег. Тогда все посты с этим тегом будут «открываться» по моей кнопочке. Для рисунков у меня личный тег, который вряд ли кто-то поставит случайно. Ну от тех, кто «специально» захочет попасть в поиск по моим тегам я ничего не могу сделать. Все-таки блокчейн общий.

После того, как у нас есть картинка и есть тег, надо объединить их в кликабельную ссылку, вот как значок ниже:

Для этого перейдем к коду:

<a href="ссылка на поиск по тегу" targer="_blank"><img src="ссылка на картинку в интернете"></a>

Ссылка на поиск по тегу выглядит вот так:

https://golos.io/created/ru--ispolneniezhelaniij

Назовем это Блок. Когда все картинки-ссылки будут собраны в подобный блок, можно переходить к созданию таблицы. В моем случае она выглят вот так:

<table> // открываем таблицу
<tr><td> // первая ячейка первого столбца
Блок 1 ссылки
</td><td> //закрываем первую ячейку и открываем следующую
Блок 2 ссылки
</td><td> //закрываем вторую ячейку и открываем следующую
Блок 3 ссылки
</td><td>//закрываем третью ячейку и открываем следующую
Блок 4 ссылки
</td><td>//закрываем четвертую ячейку и открываем следующую
Блок 5 ссылки
</td></tr>//закрываем пятую ячейку
</table> // закрываем таблицу

Теперь под каждый свой пост можно копировать вот такой футер, где читатель может перейти по одной из кнопок и посмотреть посты по другим темам. Количество кнопок может быть разное, так же как и ссылки, на которые они будут вести.

Если еще остались вопросы, или нашли у меня неточности – то я рада вам в комментариях. Сама только недавно стала осваивать разметку и придумала «содержание» своего блога «на коленке».