دوره آموزش طراحی قالب وردپرس


طراحی قالب وردپرس

دوره آموزش طراحی قالب وردپرس

 

شما در دوره آموزش طراحی قالب وردپرس یک پروژه را از ۰ تا ۱۰۰ یعنی از یک فایل خالی در فتوشاپ شروع کرده و تا تبدیل به یک قالب برای وردپرس، طبق مراحل طراحی قالب اختصاصی انجام می دهیم و شما در حین طراحی قالب در جریان تمام مراحل و حتی مشکلات احتمالی قرار می گیرید اگر شما می خواهید طراحی سایت و طراحی قالب وردپرس را به صورت پروژه محور و حرفه ای یاد بگیرید حتما در این دوره شرکت کنید.

پیش نیاز های این دوره:

 

ما رضایت شما را تضمین خواهیم کرد

** جلسه اول به منظور تضمین کیفیت آموزش رایگان می باشد **

تمامی جلسات حین تدریس دوره ضبط شده و در آخر دوره به شما تقدیم خواهد شد

 

هزینه دوره ها
نحوه برگزاری دوره هزینه برگزاری دوره
هزینه دوره خصوصی (حضوری) ۵۴۹ هزارتومان
هزینه دوره آموزش غیر حضوری تماس بگیرید

 

سرفصل های دوره آموزش طراحی قالب وردپرس:

مرحله مقدماتی 

  • روش های کسب در آمد از طریق طراحی سایت
  • آزادکاری یا فریلسنری از طریق سایت های انجام پروژه
  • نحوه طراحی سایت برای افراد و شرکت ها
  • نحوه قیمت گذاری پروژه های طراحی سایت
  • نحوه عقد قرارداد طراحی سایت با مشتری و مواردی که باید رعایت کنید
  • کسب در آمد از طریق پشتیبانی وبسایت مشتریان
  • ساخت محصول و فروش آن در مارکت های آنلاین و شرایط کار با تم فارست
  • کسب در آمد از طریق آموزش به دیگران
  • موارد مورد نیاز برای راه اندازی یک وبسایت
  • مفاهیم کاکرد وبسایت های اینترنتی
  • دیتاسنتر و سرور چیست؟ تفاوت سرور اختصاصی و مجازی
  • هاست چیست؟
  • دامنه چیست؟
  • سیستم مدیریت محتوا چیست؟
  • طراحی وبسایت استاتیک و داینامیک
  • چرا از وردپرس استفاده می کنیم؟
  • چگونه هاست و دامنه را به هم متصل کنیم؟
  • مفاهیم دیتابیس و کنترل پنل های مدیریت هاست

مرحله اول 

  • چیدمان و طرح بندی استاندارد یک صفحه ی وب در فتوشاپ
  • مفهوم سند و ایجاد یک سند برای طرح گرافیکی یک صفحه وب
  • آشنایی با ابزارهای فتوشاپ برای طراحی یک صفحه وب
  • طرح ریزی قسمت های اصلی سایت (هدر، فوتر، ساید بار) با ابزارهای فتوشاپ
  • مفاهیم ruler و guideline؛ تنظیم و استفاده از آن ها
  • مفهوم رزولوشن و انتخاب آن به درستی برای یک صفحه ی وب
  • معرفی واحد ها ی اندازه گیری و انتخاب اندازه مناسب برای یک سند گرافیکی صفحه وب
  •  ایجاد طرح گرافیکی صفحه ی وب در فتوشاپ ( فایل psd طرح وب سایت)
  • ایجاد بخش های footer ،header،content و … در فایل psd
  • اضافه کردن استایل به بخش های ایجاد شده
  • توضیح میزان شفافیت و شفافیت داخلی یک صفحه ی وب
  • معرفی انواع border و inner shadow متن و تصویر
  • توضیح مفاهیم UX و UI برای طراحی صفحات وب
  • روانشناسی رنگ و انتخاب صحیح ست رنگی در طراحی قالب
  • استایل دادن به بخش های مختلف سند گرافیکی یک صفحه ی وب در فتوشاپ
  • بهینه سازی و ذخیره تصاویر برای استفاده در وب
  • پسوندهای ذخیره سازی تصویر براساس استفاده در وب
  • ابزارهای برش دهی تصاویر
  • معرفی ابزار lorem ipsum برای ایجاد متن تصادفی مورد نیاز برای یک صفحه وب
  • مفهوم طراحی سایت فلت یا تخت

مرحله دوم

  • چگونگی تبدیل فایل PSD به فایل HTML
  • توضیح در مورد فایل های HTML و CSS
  • تفاوت فایل های HTML و CSS
  • چگونگی ایجاد فایل ها ی HTML و CSS
  • طرز نمایش، استایل بندی، چیدمان و رنگ بندی صفحه ی وب با CSS
  • توضیح چگونگی نمایش یک صفحه ی وب برای user ها
  • دلیل ایجاد فایل های header، footer،content ،slider و … به صورت جداگانه برای ایجاد صفحات وب
  • توضیح چگونگی ایجاد قسمت های header، footer،content ، slider و … برای ایجاد یک صفحه ی وب
  • توضیح ساختار فایل HTML شامل تگ های header و body
  • معرفی تگ های مختلف HTML
  • توضیح ساختار کلی فایل HTML و تگ ها ی HTML
  • توضیح چگونگی لینک کردن فایل CSS در فایل HTML
  • توضیح مسیردهی فایل ها در CSS
  • چه کدهایی باید در فایل style.css نوشته شود؟
  • توضیح مفهوم minify و مزیت استفاده از کدهای minify شده ی html و css
  • توضیح ساختارCSS به طور کامل
  • چگونگی ایجاد کلاس و آی دی در فایل CSS و فراخوانی آنها
  • تفاوت آی دی و کلاس در یک فایل CSS
  • معرفی انتخاب کننده های (سلکتورها) CSS
  • توضیح انواع انتخاب های سلکتورهای CSS

مرحله سوم

  • تبدیل طرح گرافیکی به کد
  • معرفی نرم افزارهای ویرایشگر
  • ایجاد یک سند Html برای یک صفحه ی وب
  • معرفی Css و استفاده از آن برای ایجاد افکت های گرافیکی و ایجاد سند Css
  • لینک کردن صفحه های Html و Css
  • کدنویسی قالب طراحی شده در فتوشاپ
  •  استفاده از کدهای css reset
  • شروع کدنویسی بخش های مختلف صفحه ی وب
  • کدنویسی header
  • کدنویسی footer
  • کدنویسی navbar
  • کدنویسی search box
  • اضافه کردن فونت به یک فایل Html
  • اضافه کردن تصویر پس زمینه ی سایت
  • کدنویسی بخش header شامل کدنویسی لوگو
  • کدنویسی منوی اصلی سایت
  • مفهوم hover و استفاده از آن برای ایجاد منوها
  • طراحی منو و زیرمنو با Css
  • روش های انتخاب رنگ برای طراحی وب
  • ابزارهایی برای انتخاب رنگ های flat
  • کدنویسی صفحه داخلی
  • مشخص کردن نوع و اندازه فونت سایت با استفاده از Css
  • استایل دادن به بخش های مختلف با استفاده از دستور nth-child
  • استفاده از کلاس clear در style.css
  • فیکس کردن تصویر زمینه
  • کدنویسی قسمت footer
  • الویت بخشیدن به بخش های مختلف با استفاده از دستور important
  • Hover دادن به بخش های مختلف صفحه ی وب
  • کدنویسی content صفحات دیگر سایت
  • مفهوم breadcrumb و ایجاد آن در فایل Css
  • استایل دهی به پست های یک صفحه ی وب
  • کدنویسی سایدبار
  • تبدیل باکس های سایدبار به صورت widget
  • اضافه کردن hover به باکس های سایدبار
  • ایجاد بخش ادامه مطلب برای هر پست
  • معرفی مفهوم material-design
  • اتمام کدنویسی

مرحله چهارم

  •  قالب وردپرس چیست؟ چه کاربردی دارد؟
  • تبدیل قالب طراحی شده به قالب وردپرسی
  • داینامیک کردن بخش های مختلف یک صفحه ی وب
  • آشنایی با فایل های وردپرس
  • تفاوت برگه و پست
  • ایجاد صفحات داخلی سایت
  • معرفی افزونه Yoast SEO
  • معرفی ابزارک ها و آموزش نحوه ی کار کردن با آنها
  • اضافه کردن امکان thumbnails به وردپرس
  • استایل دهی به کل text areaها، inputها، button ها و …
  • اضافه کردن استایل Css به نظرات وردپرس
  • استایل، طرح بندی و رنگ بندی برای نمایش آرشیو مطالب سایت
  • آموزش اضافه کردن ادامه مطلب به یک پست سایت
  • اضافه کردن تاریخ انتشار، دسته بندی و نویسنده به هر پست
  • اضافه کردن پنل مدیریت به قالب وردپرس
  • اضافه کردن فایوآیکون به سایت
  • قابلیت تغییر فاوآیکون از طریق پنل مدیریت قالب
  • قابلیت تغییر آیکون سایت از طریق پنل مدیریت قالب
  • اضافه کردن استایل به پنل مدیریت قالب وردپرس
  • معرفی افزونه TablePress برای ساختن جدول
  • معرفی و اجرای افزونه ی ووکامرس
  • چگونه ووکامرس را با قالب سایت سازگار کنیم؟
  • افزودن محصولات به فروشگاه از طریق افزونه ووکامرس
  • اضافه کردن style.css به ووکامرس
  • معرفی مفاهیم ریسپانسیو و سایت های واکنش گرا
  • نحوه ی تست ریسپانسیو بودن سایت ها
  • تست ریسپانسیو بودن سایت بدون موبایل و تبلت
  • دستورهای موردنیاز برای ریسپانسیو کردن وب سایت
  • ریسپانسیو کردن قالب به صورت عملی
  • نمایش یک بخش از وب سایت فقط در موبایل
  • معرفی کاربرد عملی خاصیت z-index در طراحی وب
  • ساخت فیلد های سفارشی در پست وردپرس
  • ساخت بخش تنظیمات برای وارد کردن اطلاعات هر پست
  • اضافه کردن باکس دانلود به قالب طراحی شده
  • ثبت دامنه و خرید هاست (راه اندازی سایت بصورت عملی)
  • انتقال قالب طراحی شده از لوکال هاست به سایت اصلی

 

ارسال نظر
درخواست شما پس از تایید در سایت نمایش داده می شود. از ارسال پرسش تکراری خودداری نمایید.


خوش آمدید!
ایجاد حساب کاربری
پشتیبانی