KaTeX یه کتابخونه جاوااسکریپتی برای نمایش فرمول های ریاضی روی وبه. فرمول رو با سینتکس LaTeX می نویسی و KaTeX تو مرورگر یا روی سرور تبدیلش می کنه به خروجی تمیز و سریع. برای سایت های آموزشی، وبلاگ های علمی و هر جایی که فرمول لازم داری به درد می خوره.
نسخه رسمی و بدون تغییر، از منبع رسمی با مجوز MIT؛ هش هر فایل با منبع بررسی شده است.
اگه تا حالا خواسته باشی یه فرمول ریاضی رو تو صفحه وب بذاری، می دونی که HTML معمولی برای این کار ساخته نشده. راه ساده اش اینه که فرمول رو عکس کنی و آپلود کنی، ولی نتیجه معمولاً خوب نیست. عکس تو صفحه های بزرگ تر تار می شه، متنش قابل کپی و جستجو نیست و برای هر تغییر کوچیک باید دوباره بسازیش. KaTeX دقیقاً برای همین مشکل ساخته شده. فرمول رو به شکل متن و با سینتکس LaTeX می نویسی و کتابخونه تبدیلش می کنه به HTML و CSS که با فونت های خودش نمایش داده می شه.
نقطه قوتش سرعته. رندر همزمان انجام می شه، پس بعد از نمایش فرمول ها صفحه جابه جا نمی شه و پرش نمی بینی. به کتابخونه دیگه ای هم وابسته نیست. با render و renderToString می تونی تو مرورگر یا سمت سرور با Node ازش استفاده کنی. اسکریپت کمکی auto-render هم کنارشه. متن صفحه رو می گرده، جداکننده هایی مثل دو تا دلار رو پیدا می کنه و فرمول ها رو خودش تبدیل می کنه، پس برای هر فرمول جدا کد نمی خواد بنویسی. گزینه هایی مثل displayMode و throwOnError هم برای کنترل نمایش و خطاها هست.
کجا به درد می خوره؟ سایت آموزشی، وبلاگ علمی، مستندات فنی، بانک سوال یا فروشگاه دوره های ریاضی و فیزیک. کجا نه؟ KaTeX بخش بزرگی از دستورهای LaTeX رو پشتیبانی می کنه، ولی کل LaTeX نیست. اگه بسته های خاص یا دستورهای نادر لازم داری، قبل از تصمیم چندتا از فرمول های واقعی خودت رو تست کن و ببین همه شون درست درمیان. MathJax پوشش گسترده تری داره، ولی KaTeX معمولاً سبک تر و سریع تره. یادت باشه KaTeX فقط نمایش می ده و ویرایشگر فرمول نیست.
یه نکته برای سایت های ایرانی: فایل CSS و فونت های KaTeX رو از هاست خودت لود کن. اگه به یه CDN خارجی وصل باشی، تو روزهایی که اینترنت بین الملل مشکل داره فرمول ها خراب یا خام نشون داده می شن. نسخه های رسمی و بدون تغییر KaTeX تو مخزن داخلی ما هم در دسترسه و می تونی از همین جا برداری و رو هاست خودت بذاری. تو صفحه های راست به چپ هم حواست باشه که فرمول ها ذاتاً چپ به راست نوشته می شن.
راهنمای استفاده
راه انداختنش پیچیده نیست. کد آماده پایین همین صفحه رو می تونی مستقیم تو قالب یا صفحه ات بذاری. قدم های کلی اینه:
فایل های CSS و جاوااسکریپت KaTeX و اسکریپت auto-render رو از همین صفحه بگیر و رو هاست خودت آپلود کن.
پوشه فونت ها رو کنار فایل CSS نگه دار. CSS مسیر فونت ها رو از همین ساختار پیدا می کنه و اگه جابه جاشون کنی، فرمول ها بد نمایش داده می شن.
تو بخش head صفحه، اول فایل CSS رو اضافه کن.
بعدش اسکریپت اصلی KaTeX و بعد از اون auto-render رو لود کن، ترجیحاً با defer.
بعد از لود شدن صفحه، تابع renderMathInElement رو روی document.body صدا بزن تا فرمول های متن پیدا و تبدیل بشن.
فرمول ها رو تو محتوا با جداکننده های تنظیم شده بنویس. مثلاً دو دلار برای فرمول مستقل و پرانتز با بک اسلش برای فرمول داخل خط.
اگه می خوای فرمول رو دستی رندر کنی، katex.render رو استفاده کن. برای خروجی آماده سمت سرور هم renderToString هست. تو وردپرس می تونی همین فایل ها رو از طریق قالب یا یه افزونه که کد سفارشی اضافه می کنه به سایت بدی. آخر کار هم یه صفحه آزمایشی با چندتا فرمول بساز و مطمئن شو همه چی درسته.
نشانی مستقیم فایل اصلی 0.10.2https://mirror.wbweb.ir/npm/katex@0.10.2/dist/katex.min.js
پرسشهای رایج
KaTeX کتابخونه ای برای نمایش فرمول های ریاضی با سینتکس LaTeX روی صفحه وبه. بزرگ ترین فرقش با MathJax سرعت و سادگیه، چون رندر همزمان انجام می شه. در عوض MathJax دستورهای بیشتری رو پشتیبانی می کنه. اگه فرمول هات معمولین و سرعت صفحه برات مهمه، KaTeX انتخاب خوبیه.
بله، چون یه کتابخونه جاوااسکریپته و به وردپرس وابسته نیست. کافیه فایل های CSS و جاوااسکریپت رو تو قالب یا با یه افزونه برای افزودن کد سفارشی به سایت اضافه کنی. بعدش تابع رندر خودکار رو اجرا کن تا فرمول های داخل نوشته ها تبدیل بشن.
معمولاً دلیلش اینه که فایل CSS لود نشده یا پوشه فونت ها کنار اون نیست. KaTeX علاوه بر خروجی HTML یه نسخه MathML هم می سازه که CSS مخفی اش می کنه. بدون CSS هر دو نسخه دیده می شن. مسیر فایل ها رو تو تب Network مرورگر چک کن.
خود فرمول ها چپ به راست هستن و معمولاً مشکلی ندارن. ولی اگه فرمول وسط متن فارسی جابه جا یا بهم ریخته دیده شد، جهت اون بخش رو چک کن. متن فارسی بلند رو هم بهتره داخل فرمول ننویسی و بیرونش بذاری.
بله، به شرطی که همه فایل ها از هاست خودت لود بشن. KaTeX به سرویس خارجی نیاز نداره، ولی اگه CSS و فونت ها رو از CDN بگیری، با قطعی اینترنت بین الملل لود نمی شن. بهترین کار اینه که همه فایل ها رو کنار فایل های سایتت نگه داری.
prebid-universal-creative یه بسته جاوااسکریپتیه که تبلیغ برنده رو توی سایت هایی با Prebid و هدر بیدینگ نشون می ده. این کد توی کریتیو اد سرور قرار می گیره و بعد از تموم شدن مزایده، تبلیغ رو توی جایگاه نشون می ده. مجوزش Apache هست و نسخه رسمی ش توی مخزن ما موجوده.
workbox-cdn یه بسته آماده از کتابخونه Workbox گوگله که بدون ابزار build و فقط با بارگذاری یه اسکریپت می تونی توی سایتت استفاده کنی. با Workbox سرویس ورکر رو راحت تر می نویسی، کش و حالت آفلاین رو مدیریت می کنی و بازدیدهای بعدی سایتت سریع تر باز می شن.
mathjax یه کتابخانه متن باز جاوااسکریپته که فرمول های ریاضی رو توی مرورگر نمایش می ده. فرمولی که با LaTeX، MathML یا AsciiMath نوشتی رو به متن تیز، قابل انتخاب و قابل دسترس تبدیل می کنه، پس لازم نیست از فرمول ها عکس بگیری. مجوزش Apache هست و بسته npm هم داره.
sweetalert2 یه کتابخانه جاوااسکریپته که به جای پنجره های پیش فرض مرورگر، یعنی alert و confirm و prompt، پنجره های پیام، تایید و ورودی تمیز و ریسپانسیو نشون می ده. ظاهرش قابل تنظیمه و طبق معرفی رسمی از دسترس پذیری WAI-ARIA پشتیبانی می کنه. سازنده اش Limon Monte و مجوزش MIT هست.
search-insights یه کتابخانه جاوااسکریپت از Algolia با مجوز MIT هست که کلیک، تبدیل و بازدید کاربرها روی نتیجه های جستجو رو به Insights API خود Algolia گزارش می ده. اگه جستجوی سایتت با Algolia کار می کنه، با این بسته می تونی رفتار کاربرها رو ثبت کنی و کیفیت جستجو رو بهتر کنی.
js-cookie یه کتابخانه جاوااسکریپت ساده و خیلی سبکه که کار با کوکی های مرورگر رو راحت می کنه. با چند تا متد کوتاه می تونی کوکی بسازی، بخونی و پاک کنی و لازم نیست با رشته خام document.cookie سروکله بزنی. مجوزش MIT هست و به کتابخانه دیگه ای وابسته نیست.
آخرین نسخه
۳.۰.۸
نسخهها
۸
بهروزرسانی
چیزی که لازم دارید اینجا نیست؟
نام کتابخانه، افزونه یا قالب را بفرستید؛ پس از بررسی، نسخههای رسمی آن به مخزن اضافه میشود.