Виджет подсказок Aion2pedia
Добавь на сайт гильдии, фанатскую вики, страницу дискорд-бота или в блог быстрые всплывающие подсказки для предметов, умений, комплектов и эффектов Aion 2.
Быстрый старт: 1 строчка HTML-кода
Просто вставь этот тег скрипта в <head> страницы или перед закрывающим тегом </body>. Любая ссылка на Aion2pedia автоматически превратится во всплывающую подсказку при наведении.
<script src="https://aion2pedia.com/tooltip.js" async></script>Интерактивная демонстрация
Наведи курсор или нажми на любую ссылку или значок ниже, чтобы увидеть виджет подсказок Aion2pedia в действии:
Предметы
Наведи курсор на оружие, броню и расходники:
Умения
Наведи курсор на классовые умения, навыки перемещения и стигмы:
Комплекты
Наведи курсор на полные комплекты брони и бонусы резонанса:
Негативные эффекты
Наведи курсор на дебаффы контроля и баффы персонажа:
Пользовательские data-атрибуты
No anchor tag required. Simply add data-aion2-item, data-aion2-skill, or data-aion2-effect to any HTML element (buttons, pills, spans):
Интерактивная проверка ID
Введи любой ID предмета, умения, комплекта или эффекта Aion 2, чтобы проверить подсказку:
Введи любой ID предмета, умения, комплекта или эффекта Aion 2, чтобы проверить подсказку:
Инструкции по интеграции
Пошаговые руководства для популярных CMS и платформ документации:
Чистый HTML / статические сайты
Подключи тег script перед закрывающим тегом </body> и ставь ссылки на любые страницы базы:
<!-- Include script -->
<script src="https://aion2pedia.com/tooltip.js" async></script>
<!-- Standard anchor link -->
<a href="https://aion2pedia.com/db/item/110130013/">Artisan's Greatsword</a>
<!-- Or data attribute on any element -->
<span data-aion2-skill="1001">Glide Skill</span>Markdown и MDX (Astro, Docusaurus, VitePress, Hugo)
В документациях на Astro, Docusaurus, VitePress, Next.js или Hugo стандартные markdown-ссылки обогащаются автоматически:
[Artisan's Splendent Greatsword](https://aion2pedia.com/db/item/110130013/)
[Glide Ability](https://aion2pedia.com/db/skill/1001/)
[Stun Debuff Effect](https://aion2pedia.com/db/status-effect/100/)MediaWiki (игровые вики и вики гильдий)
В вики на базе MediaWiki (Fandom, Miraheze или свой сервер) добавь эту строку на страницу MediaWiki:Common.js:
// Add to MediaWiki:Common.js
mw.loader.load('https://aion2pedia.com/tooltip.js');
// Then in your Wiki articles:
[https://aion2pedia.com/db/item/110130013/ Artisan's Greatsword]WordPress и порталы гильдий
В WordPress добавь скрипт через плагин Header and Footer Scripts или прямо в файл functions.php дочерней темы:
function aion2pedia_enqueue_tooltips() {
wp_enqueue_script(
'aion2pedia-tooltips',
'https://aion2pedia.com/tooltip.js',
array(),
'1.0.0',
true
);
}
add_action('wp_enqueue_scripts', 'aion2pedia_enqueue_tooltips');Главные преимущества архитектуры
Без зависимостей
Чистый ванильный JavaScript (< 15 KB). Никаких jQuery, React или внешних CSS-стилей.
Мгновенный Edge CDN
Кэшируется на серверах Cloudflare по всему миру и сохраняется в памяти браузера.
Полная конфиденциальность
Никакого трекинга, аналитических скриптов и сторонних cookie.
Умное позиционирование
Плавное следование за курсором и авторазворот у границ экрана: подсказка никогда не улетит за пределы окна.