Webflow
April 8, 2023

Динамичная смена года в копирайте на сайте + бонус

Каждый Новый Год сопровождается просьбами заменить год в подвале сайта, знакомо? Теперь об этом можно забыть, рассказываю как это сделать на примере Webflow.

Присваиваем класс

Присваиваем текстовому элементу класс «.current-year». Если внутри текстового элемента есть другое содержание за исключением года, то можно выделить исключительно цифру и заключить ее в Span.

Добавляем скрипт в Footer Code

Переходим в Dashboard > Settings (Project) > Custom code.

<script>
  document.addEventListener("DOMContentLoaded", function() {
    const yrSpan = document.querySelector('.current-year');
    const currentYr = new Date().getFullYear();
    yrSpan.textContent = currentYr;
  });
</script>

Добавляем следующий скрипт:

Результат

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

p.s. Спасибо за идею Али

Бонус

С этим же скриптом можно и добавить виджет времени, только переименовать класс в «.current-time» и код:

<script>
  document.addEventListener("DOMContentLoaded", function() {
    const tmSpan = document.querySelector('.current-time');
    const options = { hour: 'numeric', minute: 'numeric'};
    const currentTm = new Date().toLocaleTimeString([], options);
    tmSpan.textContent = currentTm;
  });
</script>