Динамические цвета на основе контента с AMP - PullRequest
Новая
       13

Динамические цвета на основе контента с AMP

0 голосов
/ 05 июля 2019

Я недавно создал блог Ghost, и основной частью дизайна блога является цвет фона, который меняется в зависимости от заголовка сообщения в блоге. Вот живая демонстрация .

В настоящее время я генерирую этот цвет путем хэширования заголовка сообщения, чтобы получить значение для оттенка (от 0 до 360), которое затем я использую для изменения цвета фона с помощью: hsl(HASH_VALUE, 100%, 93%). Когда страница отображает, Javascript применяет этот цвет к нужным элементам на странице.

Учитывая, что с AMP я больше не могу запускать свой JS-код для выполнения этого стиля при рендеринге, как я могу достичь этого?

1 Ответ

1 голос
/ 08 июля 2019

Вы должны «подражать» функциональности вашему языку на стороне сервера.

Пример с PHP:

Рассчитать значение хеш-функции в переменной, и поскольку вы применяете только цвет к header Сделайте что-то вроде этого: 

<header style="background-color:hsl(<?php echo $HASH_VALUE; ?>, 100%, 93%)">

Примечание: В любом случае, будет быстрее менять цвета на бэкэнде, чем с JS.

...