معرفی قالب IRON FIT

IRON FIT یک قالب حرفه‌ای، مدرن و کاملاً واکنش‌گرا برای باشگاه‌های بدنسازی، مراکز فیتنس، مربیان شخصی و برندهای ورزشی است. این محصول با زبان‌های HTML، CSS و JavaScript خالص (بدون وابستگی به فریم‌ورک‌های سنگین) توسعه یافته و از سیستم دو زبانه (فارسی و انگلیسی) با قابلیت تغییر لحظه‌ای، تم تاریک/روشن، وبلاگ کامل با مقالات آموزشی، فرم‌های رزرو مربی، برنامه тренинг и تغذیه، رژیم‌های غذایی تخصصی و بخش نظرات کاربران پشتیبانی می‌کند.

این قالب با در نظر گرفتن نیازهای واقعی یک مجموعه ورزشی طراحی شده و تمرکز اصلی آن بر تجربه کاربری عالی، سرعت بارگذاری بالا و قابلیت شخصی‌سازی آسان است. صفحه اصلی شامل بخش‌های مختلفی از جمله هیرو با ویدئو، درباره ما، آمار اعضا، برنامه تمرینی هفتگی (به صورت نوت‌بوک دستی)، رژیم‌های غذایی (افزایش حجم، کاهش وزن، گیاه‌خواری، کتو)، معرفی مربیان با شبکه‌های اجتماعی، رزرو آنلاین جلسه، نظرات اعضا، سوالات متداول، گالری تصاویر و فرم تماس است.

همچنین بخش وبلاگ به صورت کاملاً دینامیک طراحی شده و مقالات به صورت شش عدد (با قابلیت افزایش) در قالب کارت نمایش داده می‌شوند. هر مقاله شامل تصویر شاخص، تاریخ، زمان مطالعه، نویسنده، برچسب‌ها و محتوای پیشرفته با تیتر، پاراگراف، لیست و جدول تغذیه است. سیستم دو زبانه به گونه‌ای پیاده‌سازی شده که تمام محتوای صفحات (هم استاتیک و هم مقالات) به دو زبان فارسی و انگلیسی ذخیره و با کلیک کاربر تعویض می‌شود.

قابلیت تم تاریک/روشن نیز با استفاده از کلاس‌های CSS و دکمه اختصاصی پیاده‌سازی شده و تنظیمات زبان و تم در مرورگر کاربر ذخیره می‌شود. تمامی فرم‌ها (رزرو مربی، برنامه اختصاصی، تماس با ما) از اعتبارسنجی سمت کاربر پشتیبانی می‌کنند و اطلاعات ثبت‌شده را در LocalStorage ذخیره می‌کنند. این محصول به‌صورت کاملاً مستند (همراه با توضیحات در فایل‌های HTML و CSS) ارائه شده و به‌راحتی قابل شخصی‌سازی است.

✨ ویژگی‌های کامل محصول (به صورت موردی)

🎨 ظاهر و طراحی

• طراحی مدرن، مینیمال و حرفه‌ای با رنگ‌بندی طلایی و مشکی

• فونت فارسی وزیرمتن برای ظاهری خوانا و زیبا

• دو نسخه تم تاریک و روشن با قابلیت تغییر یک‌کلیک

• کاملاً واکنش‌گرا (Responsive) و سازگار با موبایل، تبلت و دسکتاپ

• پشتیبانی از انیمیشن‌های اسکرول (AOS)

• گالری تصاویر با قابلیت فیلتر (همه، فضای باشگاه، مسابقات، نتایج مشتریان)

• ویدئوی پس‌زمینه در هدر اصلی (Hero) به‌همراه تصویر جایگزین برای موبایل

🌐 چند زبانه (دو زبانه فارسی/انگلیسی)

• سیستم کامل ترجمه با دیکشنری داخلی

• قابلیت تغییر زبان در یک لحظه بدون رفرش کامل صفحه

• ذخیره زبان انتخاب‌شده در مرورگر کاربر

• پشتیبانی از ترجمه تمام بخش‌ها (منو، هیرو، خدمات، تعرفه‌ها، سوالات، مقالات و…)

📝 بخش وبلاگ (Blog)

• صفحه اصلی وبلاگ با نمایش مقالات به صورت کارتی

• صفحه اختصاصی برای هر مقاله با دریافت آی‌دی از URL

• ۶ مقاله نمونه (با قابلیت افزودن نامحدود)

• هر مقاله شامل: تصویر شاخص، عنوان، چکیده، دسته‌بندی، تاریخ، زمان مطالعه، نویسنده

• محتوای پیشرفته مقاله شامل: تیتر H2 و H3، پاراگراف، لیست گلوله‌ای، نقل قول، جدول تغذیه

• مقالات مرتبط در پایین هر پست

• سیستم اشتراک‌گذاری در شبکه‌های اجتماعی

🧾 فرم‌ها و تعامل با کاربر

• فرم رزرو مربی با فیلدهای نام، شماره تماس، انتخاب مربی، تاریخ و ساعت

• اعتبارسنجی کامل فرم و نمایش پیام موفقیت/خطا

• ذخیره اطلاعات رزرو در LocalStorage

• فرم دریافت برنامه تمرینی اختصاصی با انتخاب هدف تمرینی و سطح آمادگی

• فرم تماس با ما با قابلیت ارسال ایمیل (با استفاده از EmailJS)

• نمایش پیام‌های خطا و موفقیت زیبا

💪 برنامه تمرینی و تغذیه

• برنامه تمرینی ۷ روزه به صورت جدول نوت‌بوک دستی (روزهای شنبه تا جمعه)

• نمایش روز، نوع تمرین و جزئیات حرکات

• چهار نوع رژیم غذایی با جزئیات کامل:

  • رژیم افزایش حجم (۳۵۰۰ کالری)

  • رژیم کاهش وزن (۲۲۰۰ کالری)

  • رژیم گیاه‌خواری (۲۸۰۰ کالری)

  • رژیم کتوژنیک (۲۰۰۰ کالری)

• هر رژیم شامل چهار وعده (صبحانه، ناهار، میان‌وعده، شام) و مواد تشکیل‌دهنده

👥 مربیان و تیم حرفه‌ای

• معرفی ۴ مربی با نام، تخصص، بیوگرافی و تصویر

• شبکه‌های اجتماعی (اینستاگرام، تلگرام، واتساپ) برای هر مربی

• قابلیت آپلود عکس مربیان با fallback خودکار

• ترجمه کامل همه اطلاعات مربیان در دو زبان

💰 تعرفه‌ها (Pricing)

• سه پلن عضویت: استارتر، قهرمان و افسانه‌ای

• نمایش قیمت، ویژگی‌ها و دکمه عضویت

• پلن محبوب (“محبوب‌ترین”) با هایلایت بصری

• ترجمه کامل همه متون تعرفه‌ها

✍️ نظرات کاربران (Testimonials)

• سه نظر نمونه با عکس، متن نظر، نام و نقش کاربر

• قابلیت اضافه کردن نظرات بیشتر

❓ سوالات متداول (FAQ)

• ۵ سوال پرتکرار همراه با پاسخ

• قابلیت باز و بسته شدن هر آیتم

• ترجمه کامل همه سوالات و پاسخ‌ها

📞 تماس با ما و فوتر

• اطلاعات تماس کامل (آدرس، تلفن، ایمیل، ساعت کاری)

• نقشه تعاملی (نمایشی) با قابلیت جایگذاری نقشه واقعی

• فوتر با لوگو، لینک‌های سریع و شبکه‌های اجتماعی

• دکمه اسکرول به بالا (Scroll to Top)

⚙️ فنی و پیاده‌سازی

• بدون نیاز به فریم‌ورک (HTML، CSS، Vanilla JavaScript)

• فایل‌های CSS جداگانه برای هر بخش (style.css، blog.css، dark-mode.css، responsive.css)

• فایل‌های JS جداگانه (main.js، blog.js، form-handler.js، animations.js)

• استفاده از Font Awesome و SVG برای آیکون‌ها

• پشتیبانی از Intersection Observer برای انیمیشن شمارنده اعداد

• ذخیره تنظیمات کاربر در localStorage

• کدنویسی تمیز، کامنت‌گذاری شده و قابل شخصی‌سازی

• بهینه برای سئو (متا تگ، عنوان، توضیحات، ساختار صحیح HTML