بازدید :
32
زمان ارسال :
23 روز پيش
بازدید :
32
زمان ارسال :
23 روز پيش
کانال : faratheme
هدر سایت، اولین چیزی است که تقریباً در تمام صفحات دیده میشود؛ اگر هدر درست طراحی نشده باشد، کاربر در همان چند ثانیهی اول احساس «بینظمی و بیاعتمادی» میکند، حتی اگر بقیهی سایت عالی باشد.
در این قسمت از آموزشهای قالب چندمنظوره فراتم یاد میگیری چطور یک هدر حرفهای، مدرن و کاملاً کاربردی بسازی که ترکیبی از این عناصر است:
لوگوی متحرک و سبک (برای حس برندینگ زنده و مدرن)
نوار جستجوی واضح و در دسترس برای پیدا کردن سریع محصول یا محتوا
آیکونهای کاربردی مثل منوی موبایل، حساب کاربری، سبد خرید، شبکههای اجتماعی و…
همهی اینها را فقط با المنتور و امکانات داخلی فراتم، جامع ترین قالب چندمنظوره ایرانی پیاده میکنیم؛ بدون نیاز به کدنویسی، با کنترل کامل روی چیدمان، فاصلهها، رنگها و رفتار هدر در موبایل.
در این قسمت دقیقاً چه چیزی یاد میگیری؟ 🧠
انتخاب ساختار کلی هدر در فراتم:
چپ: لوگو / وسط: منو / راست: آیکونها
یا لوگو وسط، منو و آیکونها در دو طرف برای سایتهای شخصی و رزومهای
طراحی لوگوی متحرک:
استفاده از نسخه سادهی لوگو برای هدر
اضافه کردن Motion Effects سبک (مثلاً محو شدن نرم یا تکان بسیار ملایم)
رعایت اصول سرعت و UX تا انیمیشن آزاردهنده نباشد
ساخت نوار جستجو در هدر:
قرار دادن سرچ بهصورت فیلد ساده یا آیکون که روی کلیک باز میشود
تنظیم Placeholder مناسب (مثلاً «چی میخوای جستجو کنی؟»)
نکات مربوط به نسخه موبایل (نمایش آیکون سرچ بهجای باکس کامل)
چیدمان و تنظیم آیکونهای کاربردی:
آیکون منوی موبایل (همبرگری)
آیکون حساب کاربری
آیکون سبد خرید (برای سایتهای فروشگاهی)
آیکونهای شبکههای اجتماعی (LinkedIn, Instagram و…) برای سایتهای شخصی و رزومهای
نکات مهم UX و ریسپانسیو:
کاهش ارتفاع هدر در اسکرول (Sticky / Shrink Header)
چیدمان مجزای نسخه موبایل با منوی همبرگری و آیکونهای فشرده
حفظ خوانایی، کنتراست و فضای کافی برای لمس در موبایل
در نهایت یک هدر خواهی داشت که هم از نظر ظاهری «برندت را معرفی میکند»، هم از نظر کاربردی «ناوبری و جستجو را برای کاربر ساده میکند».
🎯 مثال عملی روی دمو «رزومه و شخصی» فراتم
برای اینکه ببینی یک هدر شیک و متمرکز روی برند شخصی چه شکلی است،
در این قسمت بهعنوان نمونه میرویم سراغ دمو رزومه و شخصی فراتم تا روی آن:
جایگذاری لوگو، نام شخص و عنوان شغلی را مرور کنیم
ببینیم چطور میتوان آیکونهای شبکههای اجتماعی را در هدر قرار داد
رفتار هدر را در نسخه موبایل بررسی کنیم (منوی همبرگری، اسکرول، جمعشدن هدر)
🔗 دمو رزومه و شخصی فراتم
همین الگو را میتوانی برای سایر سایتهایی که با قالب چندمنظوره فراتم میسازی (شرکتی، استارتاپ، آموزشی، فروشگاهی و…) شخصیسازی و حرفهایتر کنی.
🛒 خرید قالب فراتم از راستچین (نسخه اصلی و لایسنسدار)
اگر میخواهی دقیقاً همین نوع هدرهای حرفهای با لوگوی متحرک، سرچ و آیکونهای کاربردی را روی سایت خودت یا پروژههای مشتریها پیاده کنی،
میتوانی نسخهی اصلی و لایسنسدار قالب چندمنظوره فراتم را از مارکت راستچین تهیه کنی 👇
🔗 خرید قالب فراتم از راستچین
https://www.rtl-theme.com/faratheme-wordpress-theme/
با خرید لایسنس، بهروزرسانیهای منظم، دموهای جدید و پشتیبانی کامل فراتم، جامع ترین قالب وردپرس همیشه در دسترس تو خواهد بود.
🔗 لینکهای مهم فراتم
🌐 سایت رسمی فراتم – فراتم، جامعترین قالب چندمنظوره ایرانی
https://farathemes.com
💻 مشاهده دموهای مختلف قالب چندمنظوره فراتم
(آموزشی، قطعات خودرو، استارتاپ، مهاجرتی، پادکست، پروسایت، پزشکی، باشگاه ورزشی، فروشگاه دیجیتال، ابزارآلات، دیجیفرا، رستوران، تسکمنیجمنت، استودیو عکاسی، اسپا، رزومه، شرکت خلاق، پرتال سازمانی)
🛒 خرید مستقیم قالب چندمنظوره فراتم از راستچین
https://www.rtl-theme.com/faratheme-wordpress-theme/
📲 دعوت به کانال تلگرام فراتم
اگر میخواهی هر هفته در وبینارهای پرسش و پاسخ زنده، طراحی عملی با فراتم و مرور پروژههای واقعی شرکت کنی و زودتر از بقیه از انتشار دموهای جدید و آپدیتها باخبر شوی،
به کانال تلگرام رسمی فراتم بپیوند 👇
https://t.me/FaraThemeWP
🔑 کلمات کلیدی (هر کلمه در یک خط)
فراتم
قالب چندمنظوره فراتم
فراتم، جامع ترین قالب چندمنظوره ایرانی
جامع ترین قالب وردپرس
آموزش فراتم
آموزش طراحی هدر سایت وردپرس
طراحی هدر حرفه ای با المنتور
لوگوی متحرک در هدر سایت
طراحی هدر با لوگو و منو و آیکون
افزودن نوار جستجو در هدر وردپرس
آموزش ساخت هدر ریسپانسیو در فراتم
طراحی هدر برای سایت شخصی و رزومه
دمو رزومه و شخصی فراتم
آیکون سبد خرید و حساب کاربری در هدر
آموزش المنتور فارسی
طراحی منوی موبایل و هدر چسبان در وردپرس
آموزش قالب چندمنظوره فراتم
طراحی هدر سایت شرکتی با فراتم
خرید قالب فراتم از راستچین
آموزش طراحی سایت بدون کدنویسی با فراتم
توضیحات :
هدر سایت، اولین چیزی است که تقریباً در تمام صفحات دیده میشود؛ اگر هدر درست طراحی نشده باشد، کاربر در همان چند ثانیهی اول احساس «بینظمی و بیاعتمادی» میکند، حتی اگر بقیهی سایت عالی باشد.
در این قسمت از آموزشهای قالب چندمنظوره فراتم یاد میگیری چطور یک هدر حرفهای، مدرن و کاملاً کاربردی بسازی که ترکیبی از این عناصر است:
لوگوی متحرک و سبک (برای حس برندینگ زنده و مدرن)
نوار جستجوی واضح و در دسترس برای پیدا کردن سریع محصول یا محتوا
آیکونهای کاربردی مثل منوی موبایل، حساب کاربری، سبد خرید، شبکههای اجتماعی و…
همهی اینها را فقط با المنتور و امکانات داخلی فراتم، جامع ترین قالب چندمنظوره ایرانی پیاده میکنیم؛ بدون نیاز به کدنویسی، با کنترل کامل روی چیدمان، فاصلهها، رنگها و رفتار هدر در موبایل.
در این قسمت دقیقاً چه چیزی یاد میگیری؟ 🧠
انتخاب ساختار کلی هدر در فراتم:
چپ: لوگو / وسط: منو / راست: آیکونها
یا لوگو وسط، منو و آیکونها در دو طرف برای سایتهای شخصی و رزومهای
طراحی لوگوی متحرک:
استفاده از نسخه سادهی لوگو برای هدر
اضافه کردن Motion Effects سبک (مثلاً محو شدن نرم یا تکان بسیار ملایم)
رعایت اصول سرعت و UX تا انیمیشن آزاردهنده نباشد
ساخت نوار جستجو در هدر:
قرار دادن سرچ بهصورت فیلد ساده یا آیکون که روی کلیک باز میشود
تنظیم Placeholder مناسب (مثلاً «چی میخوای جستجو کنی؟»)
نکات مربوط به نسخه موبایل (نمایش آیکون سرچ بهجای باکس کامل)
چیدمان و تنظیم آیکونهای کاربردی:
آیکون منوی موبایل (همبرگری)
آیکون حساب کاربری
آیکون سبد خرید (برای سایتهای فروشگاهی)
آیکونهای شبکههای اجتماعی (LinkedIn, Instagram و…) برای سایتهای شخصی و رزومهای
نکات مهم UX و ریسپانسیو:
کاهش ارتفاع هدر در اسکرول (Sticky / Shrink Header)
چیدمان مجزای نسخه موبایل با منوی همبرگری و آیکونهای فشرده
حفظ خوانایی، کنتراست و فضای کافی برای لمس در موبایل
در نهایت یک هدر خواهی داشت که هم از نظر ظاهری «برندت را معرفی میکند»، هم از نظر کاربردی «ناوبری و جستجو را برای کاربر ساده میکند».
🎯 مثال عملی روی دمو «رزومه و شخصی» فراتم
برای اینکه ببینی یک هدر شیک و متمرکز روی برند شخصی چه شکلی است،
در این قسمت بهعنوان نمونه میرویم سراغ دمو رزومه و شخصی فراتم تا روی آن:
جایگذاری لوگو، نام شخص و عنوان شغلی را مرور کنیم
ببینیم چطور میتوان آیکونهای شبکههای اجتماعی را در هدر قرار داد
رفتار هدر را در نسخه موبایل بررسی کنیم (منوی همبرگری، اسکرول، جمعشدن هدر)
🔗 دمو رزومه و شخصی فراتم
همین الگو را میتوانی برای سایر سایتهایی که با قالب چندمنظوره فراتم میسازی (شرکتی، استارتاپ، آموزشی، فروشگاهی و…) شخصیسازی و حرفهایتر کنی.
🛒 خرید قالب فراتم از راستچین (نسخه اصلی و لایسنسدار)
اگر میخواهی دقیقاً همین نوع هدرهای حرفهای با لوگوی متحرک، سرچ و آیکونهای کاربردی را روی سایت خودت یا پروژههای مشتریها پیاده کنی،
میتوانی نسخهی اصلی و لایسنسدار قالب چندمنظوره فراتم را از مارکت راستچین تهیه کنی 👇
🔗 خرید قالب فراتم از راستچین
https://www.rtl-theme.com/faratheme-wordpress-theme/
با خرید لایسنس، بهروزرسانیهای منظم، دموهای جدید و پشتیبانی کامل فراتم، جامع ترین قالب وردپرس همیشه در دسترس تو خواهد بود.
🔗 لینکهای مهم فراتم
🌐 سایت رسمی فراتم – فراتم، جامعترین قالب چندمنظوره ایرانی
https://farathemes.com
💻 مشاهده دموهای مختلف قالب چندمنظوره فراتم
(آموزشی، قطعات خودرو، استارتاپ، مهاجرتی، پادکست، پروسایت، پزشکی، باشگاه ورزشی، فروشگاه دیجیتال، ابزارآلات، دیجیفرا، رستوران، تسکمنیجمنت، استودیو عکاسی، اسپا، رزومه، شرکت خلاق، پرتال سازمانی)
🛒 خرید مستقیم قالب چندمنظوره فراتم از راستچین
https://www.rtl-theme.com/faratheme-wordpress-theme/
📲 دعوت به کانال تلگرام فراتم
اگر میخواهی هر هفته در وبینارهای پرسش و پاسخ زنده، طراحی عملی با فراتم و مرور پروژههای واقعی شرکت کنی و زودتر از بقیه از انتشار دموهای جدید و آپدیتها باخبر شوی،
به کانال تلگرام رسمی فراتم بپیوند 👇
https://t.me/FaraThemeWP
🔑 کلمات کلیدی (هر کلمه در یک خط)
فراتم
قالب چندمنظوره فراتم
فراتم، جامع ترین قالب چندمنظوره ایرانی
جامع ترین قالب وردپرس
آموزش فراتم
آموزش طراحی هدر سایت وردپرس
طراحی هدر حرفه ای با المنتور
لوگوی متحرک در هدر سایت
طراحی هدر با لوگو و منو و آیکون
افزودن نوار جستجو در هدر وردپرس
آموزش ساخت هدر ریسپانسیو در فراتم
طراحی هدر برای سایت شخصی و رزومه
دمو رزومه و شخصی فراتم
آیکون سبد خرید و حساب کاربری در هدر
آموزش المنتور فارسی
طراحی منوی موبایل و هدر چسبان در وردپرس
آموزش قالب چندمنظوره فراتم
طراحی هدر سایت شرکتی با فراتم
خرید قالب فراتم از راستچین
آموزش طراحی سایت بدون کدنویسی با فراتم
0نظر ثبت شده
قسمت 1 – شروع کار با «فراتم» و ورود به دنیای طراحی سایت
قسمت 2 – نصب وردپرس و آمادهسازی سایت برای شروع کار با فراتم
قسمت 3 – نصب قالب فراتم و فعالسازی کامل امکانات قالب
قسمت 4 – نصب افزونههای ضروری فراتم و آمادهسازی محیط طراحی
قسمت 5 – تنظیمات پایه فراتم و آمادهسازی ساختار اصلی سایت
قسمت ۶ – تنظیمات عمومی وردپرس: برگه اصلی، فروشگاه و ساخت منو
قسمت ۷ – تنظیمات عمومی هویت برند، فونتها، لوگو و دکمهها در
قسمت ۹ – طراحی اسلایدر قهرمان صفحه اصلی با فراتم؛ پیام اصلی،
قسمت ۱۰ – طراحی بخش «پیشنهادات شگفتانگیز» در صفحه اصلی با ق
قسمت ۸ – افزودن JS و CSS سفارشی در فراتم؛ بدون دستکاری فایل
قسمت ۱۵ – طراحی بخش «پیشنهاد شگفتانگیز (۳)» ویژه کمپینها
قسمت ۱۴ – طراحی کارت قیمتگذاری (Price Box) حرفهای در صفحه
قسمت ۱۳ – طراحی بخش سؤالات متداول (FAQ) حرفهای در صفحه اصلی
قسمت ۱۲ – طراحی «پیشنهادات شگفتانگیز» (چیدمان دوم) در صفحه
قسمت ۱۱ – نمایش حرفهای دستهبندیها در صفحه اصلی فروشگاه با
قسمت ۱۶ – طراحی باکس لوگوی جذاب در صفحه اصلی با قالب چندمنظو
قسمت ۱۷ – طراحی ویترین شمارهبندی معکوس در صفحه اصلی با قالب
قسمت ۱۸ – طراحی بخش «پیشنهاد شگفتانگیز (۴)» برای منوی ویژه
قسمت ۱۹ – طراحی منوی پیشرفته و ژانرهای هوشمند در صفحه اصلی
قسمت ۲۰ – طراحی سکشن تایملاین افقی و عمودی در صفحه اصلی
قسمت ۲۱ – طراحی تصویر متحرک (هیبرید) در صفحه اصلی با فراتم
قسمت ۲۲ – طراحی هدر حرفهای سایت؛ لوگوی متحرک، جستجو
قسمت ۲۴ – طراحی کارت محصول در آرشیو؛ نمایش تخفیف، برچسب
قسمت ۲۵ – سفارشیسازی صفحه تکی محصول؛ چیدمان، گالری، تبها
قسمت ۲۳ – طراحی فوتر حرفهای سایت؛ منوها، اطلاعات تماس
قسمت ۲۶ – طراحی صفحه بلاگ و کارت مقالات با قالب آماده فراتم
قسمت ۲۷ – طراحی صفحه درباره ما با قالب آماده فراتم
آیا از حذف این لیست پخش اطمینان دارید؟
0نظر ثبت شده
لیست پخش ایجاد شد.
نظر شما ثبت گردید و پس از تایید منتشر خواهد شد.