아이온2피디아 툴팁 위젯
길드 사이트, 커뮤니티 위키, 블로그에 아이온 2 아이템, 스킬, 세트, 상태 이상의 상세 툴팁을 단 한 줄의 코드로 손쉽게 추가하세요.
빠른 시작: 1줄 HTML 스니펫
아래 스크립트 태그를 웹페이지의 <head> 또는 </body> 직전에 붙여넣기만 하면, 아이온2피디아로 향하는 모든 링크에 자동으로 풍부한 플로팅 툴팁이 활성화됩니다.
<script src="https://aion2pedia.com/tooltip.js" async></script>설정 옵션 및 속성
| 속성명 | 타입 | 기본값 | 설명 |
|---|---|---|---|
src | string | "https://aion2pedia.com/tooltip.js" | 스크립트 URL. Aion2pedia 공식 CDN 또는 자체 호스팅 지원. |
data-lang | enum | 자동 감지 (또는 ko) | 표시 언어 강제 지정: en, ko, ja, de, fr. |
data-theme | string | dark | 게임 클라이언트 인터페이스 스타일에 맞춘 어두운 테마. |
data-base-url | url | "https://aion2pedia.com" | 아이템 데이터베이스 JSON 및 아이콘 리소스의 기본 루트 URL. |
실시간 인터랙티브 데모
아래의 링크나 배지에 마우스를 올리거나 탭하여 실시간 툴팁을 직접 체험해보세요:
커스텀 속성
No anchor tag required. Simply add data-aion2-item, data-aion2-skill, or data-aion2-effect to any HTML element (buttons, pills, spans):
플랫폼별 연동 가이드
자주 사용되는 웹 환경 및 CMS 플랫폼에서의 간단한 설치 방법:
🌐일반 HTML / 정적 웹사이트
닫는 </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>📝마크다운 & MDX (Astro, VitePress, Hugo)
Astro, Docusaurus, VitePress, Next.js, Hugo 등 마크다운 기반 사이트에서 링크가 자동 변환됩니다:
[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: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');핵심 기술 사양
의존성 제로 (Zero Dependencies)
15 KB 미만의 순수 바닐라 JS. jQuery나 무거운 외부 라이브러리 없이 독립 동작합니다.
초고속 엣지 CDN
Cloudflare 글로벌 CDN 및 브라우저 메모리 캐시를 통해 즉각적인 호버 반응 속도를 제공합니다.
철저한 개인정보 보호
외부 추적기, 애널리틱스 스크립트, 서드파티 쿠키를 일절 사용하지 않습니다.
스마트 뷰포트 반전
화면 경계를 자동으로 감지하여 툴팁이 화면 밖으로 잘리지 않고 유연하게 위치를 전환합니다.