<!DOCTYPE html>
<html lang="th">
<head>
<meta charset="{{charset}}" />
<link rel="preconnect" href="https://cloudcdn.pro" crossorigin />
<title>{{title}}</title>
{{primary}}
{{opengraph}}
<meta name="accessibility" content="ARIA" />
<meta name="accessibility" content="fullKeyboardControl" />
<meta name="accessibility" content="noFlashingHazard" />
{{apple}}
<meta name="mobile-web-app-capable" content="yes" />
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' 'unsafe-inline'; connect-src 'self'; img-src 'self' data: https:; style-src 'self' 'unsafe-inline'; font-src 'self'; media-src 'self';" />
{{microsoft}}
{{twitter}}
<link rel="alternate" href="{{url}}" hreflang="{{hreflang}}" />
<link rel="canonical" href="{{url}}" />
<link rel="icon" type="image/x-icon" href="{{cdn}}/{{short_name}}/images/favicon.ico" />
<link rel="apple-touch-icon" href="{{cdn}}/{{short_name}}/images/icons/{{apple_touch_icon_sizes}}.png" sizes="{{apple_touch_icon_sizes}}" />
<link rel="icon" type="image/png" href="{{cdn}}/{{short_name}}/images/icons/16x16.png" sizes="16x16" />
<link rel="icon" type="image/png" href="{{cdn}}/{{short_name}}/images/icons/32x32.png" sizes="32x32" />
<meta name="theme-color" content="rgb({{theme-color}})" />
<link rel="manifest" href="/th/manifest.json" />
<link rel="alternate" type="application/rss+xml" href="/th/rss.xml" />
<style>
:root{--vp-bg:#fff;--vp-bs:#f6f6f7;--vp-ba:#f6f6f7;--vp-t1:#3c3c43;--vp-t2:#4a4a52;--vp-t3:#595960;--vp-br:#166534;--vp-bl:#14532d;--vp-bd:rgba(60,60,67,.24);--vp-nh:64px}
[data-theme="dark"]{--vp-bg:#1b1b1f;--vp-bs:#202127;--vp-ba:#161618;--vp-t1:#f5f5f7;--vp-t2:#cccccf;--vp-t3:#a1a1a8;--vp-br:#86efac;--vp-bl:#bbf7d0;--vp-bd:rgba(180,180,190,.32)}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--vp-bg:#1b1b1f;--vp-bs:#202127;--vp-ba:#161618;--vp-t1:#f5f5f7;--vp-t2:#cccccf;--vp-t3:#a1a1a8;--vp-br:#86efac;--vp-bl:#bbf7d0;--vp-bd:rgba(180,180,190,.32)}}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important;scroll-behavior:auto!important}}
body{font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;font-size:16px;line-height:1.7;color:var(--vp-t1);background:var(--vp-bg)}
a{color:var(--vp-br);text-decoration:none}
a:hover{color:var(--vp-bl)}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4,h5,h6{font-weight:600;color:var(--vp-t1)}
h1{font-size:clamp(1.75rem,4vw,2.5rem);margin:1.5rem 0 1rem}
h2{font-size:clamp(1.35rem,3vw,1.75rem);margin:2rem 0 .75rem;padding-bottom:.75rem;border-bottom:1px solid var(--vp-bd)}
h3{font-size:1.25rem;margin:1.5rem 0 .5rem}
p{margin:.75rem 0}
strong{font-weight:600}
code,pre{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.875em}
pre{background:var(--vp-bs);border:1px solid var(--vp-bd);border-radius:8px;color:var(--vp-t1);overflow-x:auto;padding:1rem 1.25rem}
code{background:var(--vp-bs);border-radius:4px;padding:.15em .35em}
pre code{background:none;padding:0}
.skip-link{position:absolute;top:-100%;left:1rem;background:var(--vp-br);color:#fff;padding:.5rem 1rem;border-radius:8px;z-index:1000;font-weight:600}
.skip-link:focus{top:1rem;outline:none}
.nav{position:fixed;top:0;left:0;right:0;z-index:100;height:var(--vp-nh);background:var(--vp-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--vp-bd)}
.nav-inner{display:flex;align-items:center;height:var(--vp-nh);max-width:1376px;margin:0 auto;padding:0 24px}
.nav-brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--vp-t1);font-weight:600;flex-shrink:0}
.nav-brand img{width:28px;height:28px}
.nav-search{display:flex;align-items:center;gap:8px;border:1px solid var(--vp-bd);border-radius:8px;padding:6px 14px;cursor:pointer;background:none;color:var(--vp-t3);font-size:14px;margin-left:auto;margin-right:16px}
.nav-search:hover{border-color:var(--vp-br)}
.nav-search svg{width:16px;height:16px;stroke:currentColor;stroke-width:2;fill:none}
.nav-search kbd{font-size:11px;border:1px solid var(--vp-bd);border-radius:4px;padding:1px 5px;margin-left:8px;background:var(--vp-bs);color:var(--vp-t3)}
.nav-links{display:flex;align-items:center;gap:4px}
.nav-links a{padding:4px 12px;color:var(--vp-t1);font-size:14px;font-weight:500}
.nav-links a:hover{color:var(--vp-br)}
.nav-controls{display:flex;align-items:center;gap:8px;margin-left:16px;flex-shrink:0}
.lang-btn{position:relative;background:none;border:none;cursor:pointer;color:var(--vp-t2);padding:4px;display:flex;align-items:center}
.lang-btn svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.5;fill:none}
.lang-dropdown{display:none;position:absolute;top:calc(100% + 8px);inset-inline-end:0;background:var(--vp-bg);border:1px solid var(--vp-bd);border-radius:8px;padding:8px;min-width:480px;max-height:70vh;overflow-y:auto;z-index:200;box-shadow:0 8px 24px #00000026}.lang-menu-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2px}.lang-menu-grid a{display:flex;align-items:center;gap:6px;padding:6px 10px;color:var(--vp-t1);font-size:12px;border-radius:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lang-menu-grid a:hover{background:var(--vp-bs)}.lang-menu-grid .flag{font-size:14px;flex-shrink:0}.lang-btn{gap:4px;font-size:13px;font-weight:500}.lang-btn .lang-code{font-variant:all-small-caps;letter-spacing:.5px}.mobile-menu{display:none}.mobile-lang{display:grid;grid-template-columns:repeat(2,1fr);gap:4px;padding-top:12px;border-top:1px solid var(--vp-bd);margin-top:12px}.mobile-lang a{display:flex;align-items:center;gap:6px;padding:8px;color:var(--vp-t1);font-size:13px;border-bottom:none}@media(max-width:768px){.lang-dropdown{min-width:280px;inset-inline-end:8px}.lang-menu-grid{grid-template-columns:repeat(2,1fr)}}
.lang-dropdown.open{display:block}
.lang-dropdown a{display:block;padding:6px 12px;color:var(--vp-t1);font-size:13px;border-radius:4px}
.lang-dropdown a:hover{background:var(--vp-bs)}
.theme-switch{position:relative;width:40px;height:22px;background:var(--vp-bs);border:1px solid var(--vp-bd);border-radius:11px;cursor:pointer;padding:0;flex-shrink:0}
.theme-switch::before{content:'';position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--vp-t2);transition:transform .25s}
[data-theme="dark"] .theme-switch::before,.theme-switch.dark::before{transform:translateX(18px)}
.theme-switch .sun-svg,.theme-switch .moon-svg{position:absolute;top:3px;width:14px;height:14px;stroke:var(--vp-t3);stroke-width:2;fill:none}
.theme-switch .sun-svg{left:3px}
.theme-switch .moon-svg{right:3px}
.menu-toggle{display:none;background:none;border:1px solid var(--vp-bd);border-radius:6px;padding:4px 6px;cursor:pointer;color:var(--vp-t1)}.lang-btn,.menu-toggle{min-width:44px;min-height:44px}.theme-switch{position:relative}.theme-switch::after{content:'';position:absolute;inset:-11px;}
.menu-toggle svg{width:20px;height:20px;stroke:currentColor;stroke-width:2;fill:none}
.hero{padding:calc(var(--vp-nh) + 60px) 24px 80px;text-align:center;max-width:960px;margin:0 auto}
.hero-name{font-size:clamp(2rem,5vw,3.5rem);font-weight:700;line-height:1.1;background:linear-gradient(120deg,var(--vp-br) 30%,#4ade80);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:1rem}
.hero-tagline{font-size:clamp(1rem,2vw,1.25rem);color:var(--vp-t2);line-height:1.6;max-width:560px;margin:0 auto 2rem}
.hero-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.btn-brand,.btn-alt,.btn-submit{display:inline-flex;align-items:center;padding:10px 24px;border-radius:20px;font-size:15px;cursor:pointer;border:none}
.btn-brand,.btn-submit{background:var(--vp-br);color:#fff;font-weight:600}
.btn-brand:hover,.btn-submit:hover{background:var(--vp-bl)}
.btn-alt{background:transparent;color:var(--vp-t1);border:1px solid var(--vp-bd);font-weight:500}
.btn-alt:hover{border-color:var(--vp-br)}
.hero-banner{margin:2rem auto 0;max-width:720px;border-radius:12px;overflow:hidden;box-shadow:0 8px 28px rgba(0,0,0,.12)}
.hero-banner img{width:100%;display:block}
.content-wrap{max-width:740px;margin:0 auto;padding:48px 24px;margin-top:var(--vp-nh)}
.content{font-size:16px;line-height:1.7;color:var(--vp-t1)}
.content ul,.content ol{padding-left:1.25rem;margin:.75rem 0}
.content li{margin:.25rem 0}
.breadcrumb{font-size:14px;color:var(--vp-t3);margin-bottom:24px}
.breadcrumb a{color:var(--vp-br)}
.breadcrumb span{margin:0 6px}
.article-meta{font-size:14px;color:var(--vp-t2);margin-bottom:2rem;display:flex;gap:12px;align-items:center}
.footer{background:var(--vp-ba);padding:48px 24px 24px}
.footer-inner{max-width:1152px;margin:0 auto}
.footer-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-bottom:32px}
.footer-heading{font-size:14px;font-weight:700;color:var(--vp-t1);margin-bottom:12px;text-transform:uppercase;letter-spacing:.5px}
.footer-col a{display:block;color:var(--vp-t2);font-size:14px;padding:3px 0}
.footer-col a:hover{color:var(--vp-br)}
.footer-bottom{border-top:1px solid var(--vp-bd);padding-top:20px;text-align:center;color:var(--vp-t3);font-size:13px}
.form-card{background:var(--vp-bs);border:1px solid var(--vp-bd);border-radius:12px;padding:2rem;max-width:520px;margin:2rem auto 0}
.form-group{display:flex;flex-direction:column;gap:6px;margin-bottom:1.25rem}
.form-group label{font-weight:600;font-size:14px;color:var(--vp-t1)}
.form-group input,.form-group select,.form-group textarea{background:var(--vp-bg);color:var(--vp-t1);border:1px solid var(--vp-bd);border-radius:8px;padding:8px 12px;font-family:inherit;font-size:15px}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--vp-br);outline:2px solid var(--vp-br);outline-offset:1px}
.form-group textarea{resize:vertical;min-height:120px}
:focus-visible{outline:2px solid var(--vp-br);outline-offset:2px}
.navbar-nav{display:flex;align-items:center;gap:0;list-style:none;margin:0;padding:0}
.nav-item{display:inline-flex}
.nav-item a{display:block;padding:4px 12px;color:var(--vp-t1);font-size:14px;font-weight:500;text-decoration:none;text-transform:none}
.nav-item a:hover{color:var(--vp-br)}
.nav-item a.text-uppercase{text-transform:none}
.nav-item a.p-2{padding:4px 12px}
.ms-auto{margin-left:auto}.mb-2{margin-bottom:0}.mb-lg-0{margin-bottom:0}
#ssg-search-btn{display:none!important}
.content{overflow:hidden}
.content img{max-width:100%;height:auto;border-radius:8px;margin:1.5rem 0;display:block}
.content .img-fluid{max-width:100%;height:auto;border-radius:8px}
.content .w-50{max-width:50%}
.content .float-start{float:left;margin:0 1.5rem 1rem 0}
.content .float-end{float:right;margin:0 0 1rem 1.5rem}
.content .p-5{padding:0}
.content .mb-3{margin-bottom:1rem}
.content .fw-bold{font-weight:600}
.content .text-danger{color:var(--vp-br)}
.content .display-1{font-size:2rem;font-weight:600}
.content::after{content:"";display:table;clear:both}
@media(max-width:768px){.content .w-50{max-width:100%}.content .float-start,.content .float-end{float:none;margin:1rem 0}.nav-links,.nav-search,.navbar-nav{display:none}.menu-toggle{display:flex}.nav-controls{margin-left:auto}.nav-controls .lang-btn{display:none}.mobile-menu{display:none;position:fixed;top:var(--vp-nh);left:0;right:0;bottom:0;background:var(--vp-bg);padding:24px;z-index:99;overflow-y:auto}.mobile-menu.open{display:block}.mobile-menu a,.mobile-menu .nav-item a{display:block;padding:10px 0;font-size:15px;color:var(--vp-t1);border-bottom:1px solid var(--vp-bd)}.mobile-menu .navbar-nav{display:block}.mobile-menu .nav-item{display:block}.hero{padding:calc(var(--vp-nh) + 32px) 16px 48px}.hero-name{font-size:clamp(1.75rem,6vw,2.5rem)}.content-wrap{padding:32px 16px}.footer-cols{grid-template-columns:1fr;gap:24px}}
</style>
</head>
<body id="page-top" itemscope itemtype="http://schema.org/WebPage">
<a class="skip-link" href="#main">ข้ามไปที่เนื้อหา</a>
<nav class="nav" id="mainNav" itemscope itemtype="http://schema.org/SiteNavigationElement" aria-label="เมนูหลัก">
<div class="nav-inner">
<a class="nav-brand" href="/th/" aria-label="{{logo_alt}} - หน้าแรก">
<img width="{{logo_width}}" height="{{logo_height}}" src="{{logo}}" alt="{{logo_alt}}" loading="lazy" decoding="async" />
<span itemprop="name">{{name}}</span>
</a>
<button class="nav-search" type="button" aria-label="ค้นหา">
<svg aria-hidden="true" viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>
<span>ค้นหา</span>
<kbd>⌘K</kbd>
</button>
<div class="nav-links" id="navLinks">
<ul class="navbar-nav ms-auto mb-2 mb-lg-0"><li class="nav-item"><a class="text-uppercase p-2" title="คุณสมบัติ" aria-label="คุณสมบัติ" href="/features/index.html">คุณสมบัติ</a></li><li class="nav-item"><a class="text-uppercase p-2" title="บทความ" aria-label="บทความ" href="/posts/index.html">บทความ</a></li><li class="nav-item"><a class="text-uppercase p-2" title="สำรวจตามแท็ก" aria-label="สำรวจตามแท็ก" href="/tags/index.html">สำรวจตามแท็ก</a></li><li class="nav-item"><a class="text-uppercase p-2" title="ติดต่อเรา" aria-label="ติดต่อเรา" href="/contact/index.html">ติดต่อเรา</a></li></ul>
</div>
<div class="nav-controls">
<div style="position:relative">
<button class="lang-btn" type="button" aria-label="Select language" id="langToggle"><span aria-hidden="true">🌐</span> <span class="lang-code">TH</span></button>
<div class="lang-dropdown" id="langDropdown">
<div class="lang-menu-grid">
<a href="/" hreflang="en" lang="en"><span class="flag">🇬🇧</span> English</a>
<a href="/fr/" hreflang="fr" lang="fr"><span class="flag">🇫🇷</span> Français</a>
<a href="/ar/" hreflang="ar" lang="ar"><span class="flag">🇸🇦</span> العربية</a>
<a href="/bn/" hreflang="bn" lang="bn"><span class="flag">🇧🇩</span> বাংলা</a>
<a href="/cs/" hreflang="cs" lang="cs"><span class="flag">🇨🇿</span> Čeština</a>
<a href="/de/" hreflang="de" lang="de"><span class="flag">🇩🇪</span> Deutsch</a>
<a href="/es/" hreflang="es" lang="es"><span class="flag">🇪🇸</span> Español</a>
<a href="/ha/" hreflang="ha" lang="ha"><span class="flag">🇳🇬</span> Hausa</a>
<a href="/he/" hreflang="he" lang="he"><span class="flag">🇮🇱</span> עברית</a>
<a href="/hi/" hreflang="hi" lang="hi"><span class="flag">🇮🇳</span> हिन्दी</a>
<a href="/id/" hreflang="id" lang="id"><span class="flag">🇮🇩</span> Indonesia</a>
<a href="/it/" hreflang="it" lang="it"><span class="flag">🇮🇹</span> Italiano</a>
<a href="/ja/" hreflang="ja" lang="ja"><span class="flag">🇯🇵</span> 日本語</a>
<a href="/ko/" hreflang="ko" lang="ko"><span class="flag">🇰🇷</span> 한국어</a>
<a href="/nl/" hreflang="nl" lang="nl"><span class="flag">🇳🇱</span> Nederlands</a>
<a href="/pl/" hreflang="pl" lang="pl"><span class="flag">🇵🇱</span> Polski</a>
<a href="/pt/" hreflang="pt" lang="pt"><span class="flag">🇵🇹</span> Português</a>
<a href="/ro/" hreflang="ro" lang="ro"><span class="flag">🇷🇴</span> Română</a>
<a href="/ru/" hreflang="ru" lang="ru"><span class="flag">🇷🇺</span> Русский</a>
<a href="/sv/" hreflang="sv" lang="sv"><span class="flag">🇸🇪</span> Svenska</a>
<a href="/th/" hreflang="th" lang="th"><span class="flag">🇹🇭</span> ไทย</a>
<a href="/tl/" hreflang="tl" lang="tl"><span class="flag">🇵🇭</span> Filipino</a>
<a href="/tr/" hreflang="tr" lang="tr"><span class="flag">🇹🇷</span> Türkçe</a>
<a href="/uk/" hreflang="uk" lang="uk"><span class="flag">🇺🇦</span> Українська</a>
<a href="/vi/" hreflang="vi" lang="vi"><span class="flag">🇻🇳</span> Tiếng Việt</a>
<a href="/yo/" hreflang="yo" lang="yo"><span class="flag">🇳🇬</span> Yorùbá</a>
<a href="/zh/" hreflang="zh" lang="zh"><span class="flag">🇨🇳</span> 简体中文</a>
<a href="/zh-tw/" hreflang="zh-tw" lang="zh-tw"><span class="flag">🇹🇼</span> 繁體中文</a>
</div>
</div>
</div>
<button class="theme-switch" type="button" aria-label="สลับโหมดมืด" id="themeToggle">
<svg aria-hidden="true" class="sun-svg" viewBox="0 0 24 24"><circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M4.93 4.93l1.41 1.41M17.66 17.66l1.41 1.41M2 12h2M20 12h2M4.93 19.07l1.41-1.41M17.66 6.34l1.41-1.41"/></svg>
<svg aria-hidden="true" class="moon-svg" viewBox="0 0 24 24"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/></svg>
</button>
</div>
<button class="menu-toggle" type="button" aria-controls="mobileMenu" aria-expanded="false" aria-label="สลับเมนูนำทาง">
<svg aria-hidden="true" viewBox="0 0 24 24"><line x1="3" y1="6" x2="21" y2="6"/><line x1="3" y1="12" x2="21" y2="12"/><line x1="3" y1="18" x2="21" y2="18"/></svg>
</button>
</div>
</nav>
<div class="mobile-menu" id="mobileMenu" role="navigation" aria-label="เมนูนำทางบนมือถือ">
<ul class="navbar-nav ms-auto mb-2 mb-lg-0"><li class="nav-item"><a class="text-uppercase p-2" title="คุณสมบัติ" aria-label="คุณสมบัติ" href="/features/index.html">คุณสมบัติ</a></li><li class="nav-item"><a class="text-uppercase p-2" title="บทความ" aria-label="บทความ" href="/posts/index.html">บทความ</a></li><li class="nav-item"><a class="text-uppercase p-2" title="สำรวจตามแท็ก" aria-label="สำรวจตามแท็ก" href="/tags/index.html">สำรวจตามแท็ก</a></li><li class="nav-item"><a class="text-uppercase p-2" title="ติดต่อเรา" aria-label="ติดต่อเรา" href="/contact/index.html">ติดต่อเรา</a></li></ul>
<div class="mobile-lang">
<a href="/" hreflang="en" lang="en"><span class="flag">🇬🇧</span> English</a>
<a href="/fr/" hreflang="fr" lang="fr"><span class="flag">🇫🇷</span> Français</a>
<a href="/ar/" hreflang="ar" lang="ar"><span class="flag">🇸🇦</span> العربية</a>
<a href="/bn/" hreflang="bn" lang="bn"><span class="flag">🇧🇩</span> বাংলা</a>
<a href="/cs/" hreflang="cs" lang="cs"><span class="flag">🇨🇿</span> Čeština</a>
<a href="/de/" hreflang="de" lang="de"><span class="flag">🇩🇪</span> Deutsch</a>
<a href="/es/" hreflang="es" lang="es"><span class="flag">🇪🇸</span> Español</a>
<a href="/ha/" hreflang="ha" lang="ha"><span class="flag">🇳🇬</span> Hausa</a>
<a href="/he/" hreflang="he" lang="he"><span class="flag">🇮🇱</span> עברית</a>
<a href="/hi/" hreflang="hi" lang="hi"><span class="flag">🇮🇳</span> हिन्दी</a>
<a href="/id/" hreflang="id" lang="id"><span class="flag">🇮🇩</span> Indonesia</a>
<a href="/it/" hreflang="it" lang="it"><span class="flag">🇮🇹</span> Italiano</a>
<a href="/ja/" hreflang="ja" lang="ja"><span class="flag">🇯🇵</span> 日本語</a>
<a href="/ko/" hreflang="ko" lang="ko"><span class="flag">🇰🇷</span> 한국어</a>
<a href="/nl/" hreflang="nl" lang="nl"><span class="flag">🇳🇱</span> Nederlands</a>
<a href="/pl/" hreflang="pl" lang="pl"><span class="flag">🇵🇱</span> Polski</a>
<a href="/pt/" hreflang="pt" lang="pt"><span class="flag">🇵🇹</span> Português</a>
<a href="/ro/" hreflang="ro" lang="ro"><span class="flag">🇷🇴</span> Română</a>
<a href="/ru/" hreflang="ru" lang="ru"><span class="flag">🇷🇺</span> Русский</a>
<a href="/sv/" hreflang="sv" lang="sv"><span class="flag">🇸🇪</span> Svenska</a>
<a href="/th/" hreflang="th" lang="th"><span class="flag">🇹🇭</span> ไทย</a>
<a href="/tl/" hreflang="tl" lang="tl"><span class="flag">🇵🇭</span> Filipino</a>
<a href="/tr/" hreflang="tr" lang="tr"><span class="flag">🇹🇷</span> Türkçe</a>
<a href="/uk/" hreflang="uk" lang="uk"><span class="flag">🇺🇦</span> Українська</a>
<a href="/vi/" hreflang="vi" lang="vi"><span class="flag">🇻🇳</span> Tiếng Việt</a>
<a href="/yo/" hreflang="yo" lang="yo"><span class="flag">🇳🇬</span> Yorùbá</a>
<a href="/zh/" hreflang="zh" lang="zh"><span class="flag">🇨🇳</span> 简体中文</a>
<a href="/zh-tw/" hreflang="zh-tw" lang="zh-tw"><span class="flag">🇹🇼</span> 繁體中文</a>
</div>
</div>
<main id="main" class="content-wrap" aria-label="เนื้อหาหลัก">
<div class="breadcrumb">
<a href="/th/">หน้าแรก</a><span>></span><span>{{title}}</span>
</div>
<h1 class="page-title">{{title}}</h1>
<div class="content">{{content}}</div>
</main>
<footer class="footer" id="footer" aria-label="ส่วนท้าย">
<div class="footer-inner">
<div class="footer-cols">
<div class="footer-col">
<p class="footer-heading">เกี่ยวกับ</p>
<a href="/th/">หน้าแรก</a>
<a href="/th/contact/index.html">ติดต่อ</a>
</div>
<div class="footer-col">
<p class="footer-heading">ทรัพยากร</p>
<a href="/th/posts/index.html">บล็อก</a>
<a href="/th/rss.xml">RSS Feed</a>
</div>
<div class="footer-col">
<p class="footer-heading">กฎหมาย</p>
<a href="/th/privacy/index.html">ความเป็นส่วนตัว</a>
</div>
</div>
<div class="footer-bottom">{{copyright}}</div>
</div>
</footer>
<script type="application/ld+json">
{"@context":"http://schema.org/","@type":"BlogPosting","headline":"{{title}}","datePublished":"{{last_build_date}}","dateModified":"{{item_pub_date}}","description":"{{description}}","image":{"@type":"ImageObject","height":"2048","width":"2048","url":"{{logo}}"},"mainEntityOfPage":{"@type":"WebPage","@id":"{{id}}","name":"{{subtitle}}"},"author":"{{author}}","copyrightHolder":{"@type":"Person","@id":"{{author}}"},"copyrightYear":"{{copyright}}","creator":{"@type":"Person","@id":"{{author}}"},"inLanguage":"{{language}}","name":"{{name}}","publisher":{"@type":"Person","@id":"{{author}}"}}
</script>
<script>
(function(){var r=document.documentElement,sw=document.getElementById('themeToggle'),lt=document.getElementById('langToggle'),ld=document.getElementById('langDropdown'),mt=document.querySelector('.menu-toggle'),mm=document.getElementById('mobileMenu');function setTheme(v){r.setAttribute('data-theme',v);localStorage.setItem('vitepress-theme-appearance',v);if(v==='dark')sw.classList.add('dark');else sw.classList.remove('dark')}var saved=localStorage.getItem('vitepress-theme-appearance');if(saved)setTheme(saved);else if(matchMedia('(prefers-color-scheme:dark)').matches)setTheme('dark');var ns=document.querySelector('.nav-search');if(ns)ns.addEventListener('click',function(){var b=document.getElementById('ssg-search-btn');if(b){b.click()}else{var o=document.getElementById('ssg-search-overlay');if(o){o.classList.add('active');var inp=document.getElementById('ssg-search-input');if(inp){inp.value='';inp.focus()}}}});sw.addEventListener('click',function(){setTheme(r.getAttribute('data-theme')==='dark'?'light':'dark')});if(lt)lt.addEventListener('click',function(e){e.stopPropagation();ld.classList.toggle('open')});document.addEventListener('click',function(){if(ld)ld.classList.remove('open')});if(mt)mt.addEventListener('click',function(){var ex=this.getAttribute('aria-expanded')==='true';this.setAttribute('aria-expanded',!ex);mm.classList.toggle('open')});var lp=location.pathname.match(/^\/(en|fr|ar|bn|cs|de|es|ha|he|hi|id|it|ja|ko|nl|pl|pt|ro|ru|sv|th|tl|tr|uk|vi|yo|zh-tw|zh)\//);if(lp){var pfx='/'+lp[1];document.querySelectorAll('a[href^="/"]').forEach(function(a){var h=a.getAttribute('href');if(h&&h.charAt(0)==='/'&&h!=='/'&&!/^\/(en|fr|ar|bn|cs|de|es|ha|he|hi|id|it|ja|ko|nl|pl|pt|ro|ru|sv|th|tl|tr|uk|vi|yo|zh-tw|zh)\//.test(h)){a.setAttribute('href',pfx+h)}})}var _p=location.pathname,_m=_p.match(/^\/(en|fr|ar|bn|cs|de|es|ha|he|hi|id|it|ja|ko|nl|pl|pt|ro|ru|sv|th|tl|tr|uk|vi|yo|zh-tw|zh)\//),_src=_m?_m[1]:'en',_rest=_m?_p.slice(_m[0].length):_p.replace(/^\//,'');if(_src==='fr')_rest=_rest.replace(/^articles\//,'posts/').replace(/^fonctionnalites\//,'features/');document.querySelectorAll('a[hreflang]').forEach(function(a){var _t=a.getAttribute('hreflang'),_r=_rest;if(_t==='fr')_r=_r.replace(/^posts\//,'articles/').replace(/^features\//,'fonctionnalites/');a.setAttribute('href',_t==='en'?'/'+_r:'/'+_t+'/'+_r)});})();
</script>
</body>
</html>