Amp-dynamic-css-classes добавляет динамические классы в тег body. В этой главе давайте узнаем подробности этого тега.
Для работы с amp-dynamic-css-classes нам нужно добавить следующий скрипт:
<script asynccustom-element="amp-dynamic-css-classes" src = "https://cdn.ampproject.org/v0/amp-dynamic-css-classes-0.1.js"> </script>
Есть два важных класса, о которых заботятся amp-dynamic-css-classes —
- усилитель-referrer- *
- усилитель-зритель
Давайте обсудим каждый из них подробно.
усилитель-referrer- *
Эти классы устанавливаются в зависимости от того, как приходят пользователи. Это означает, что если пользователь пришел из Google, будет установлен класс реферера, связанный с Google. То же самое относится и к Twitter и Pinterest.
Классы доступны в зависимости от типа реферера.
Например, для Google будут добавлены следующие классы, если пользователь щелкает ампер-страницы в поисковой системе Google.
- Усилитель-реферер-WWW-Google-ком
- Усилитель-реферер-Google-ком
- Усилитель-реферер-ком
Точно так же есть классы, доступные для Twitter, Pinterest, Linkedin и т. Д.
усилитель-зритель
Amp Viewer в основном собирается изменить URL-адрес усилителя, чтобы получить информацию из кеша Google. Если вы что-то ищете в поиске Google, отображаемая карусель будет иметь все страницы усилителя.
Когда вы нажимаете на них, они перенаправляются на URL с префиксом Google URL. Класс amp-viewer будет установлен, когда пользователь просматривает страницу в amp-viewer и использует динамические классы.
Когда вы нажимаете страницу усилителя, URL, который вы получаете в адресной строке, выглядит следующим образом: