آموزش ۰ تا ۱۰۰ طراحی سایت با وردپرس
- آپدیت شده در تاریخ

ما در دنیایی زندگی میکنیم که رشد اینترنت و استفاده از گوشیهای هوشمند و آشنایی با فضای مجازی، از علاقهمندیها و نیازهای امروزه است؛ و این امر باعث رشد روزافزون سایتها و خدمات فروش آنلاین گردیده است. اگر میخواهید طراح سایت شوید باید حتماً طراحی سایت با وردپرس را یاد بگیرید.
شرکتهای موفقی در این زمینه وجود دارند که درآمد پرسودی از طریق یک سایت دارند. همچنین فروشگاههایی وجود دارند که در کنار کسبوکار سنتی خود از یک سایت معتبر برای فروش آنلاین نیز استفاده میکنند. حال برای داشتن این نوع از کسبوکار پرسود شما یا نیاز به داشتن علم این کار رادارید، و یا با پرداخت هزینه زیاد از طراحان سایت کمک بگیرید.
درگذشتهی نهچندان دور، میهن وردپرس دوره حضوری طراحی سایت داشت، که افراد مشتاق خاص خودش را میطلبید! با بزرگتر شدن میهن وردپرس، رفتهرفته بر تعداد درخواستهای آموزش طراحی سایت افزوده میشد. این شد که تصمیم گرفتیم دوره را بهصورت آنلاین برگزار کنیم؛ تا همهی افراد شانس یادگیری این مهارت پرسود و شیرین را داشته باشند.
بهاینترتیب این آموزش جامع در وبسایت میهن وردپرس قرار گرفت. از آن روز به بعد دوره حضوری که فقط مختص افرادی خاص بود (فقط افرادی که در شیراز حضور داشتند) تبدیل به دورهای شد که همه میتوانند در آن شرکت کنند؛ و بعد از یادگیری بهراحتی به کسب درآمد بپردازند.
با برگزاری دورههای آموزشی آنلاین شانس یادگیری این کسبوکار نوین و پردرآمد در اختیار عموم مردم قرار گرفت. دورهای که همه میتوانند در آن شرکت کنند و بعد از یادگیری بهراحتی به کسب درآمد بپردازند.
آموزش طراحی سایت با وردپرس
امروزه سایتهای زیادی هستند که به سبکی زیبا طراحی شده و درآمد بالایی دارند. مثلاً وبسایت دیجیکالا را میبینیم که از یک فروشگاه زنجیرهای هم فراگیرتر شد و سود و حتی مشتریان بیشتری هم دارد. حالا شاید شما بگویید رسیدن به دیجی کالا خیلی رؤیایی است. اما جالب است که بگویم فروشگاه کفشی را در قشم دیدم که میگفت ۹۰ درصد فروش روزانهاش از طریق فروش آنلاین بوده. خب برای دستیابی به این بستر پرسود لازم است که شما یا علم این کار را داشته باشید؛ یا هزینهای کنید تا طراحان سایت برای شما سایتی را طراحی کنند.
طراحی سایت، فقط طراحی ظاهری نیست!
بسیاری از طراحان سایت بر این باورند که طراحی سایت تنها در ساخت سایتهای جذاب و زیبا خلاصه میشود. اما در حقیقت طراحی سایت چیزی فراتر از طراحی ظاهر آن است. برای طراحی سایتی مطلوب، عوامل زیادی ازجمله ساختار سایت، کاربردپذیری، خوانایی، عملکرد و… تأثیرگذار هستند. امروزه تمام وبمستران و مدیران سایتهای حرفهای و بهروز به دنبال اجرای سایتهای باکیفیت و پاسخگو هستند.
طراحی و اجرای سایت برای کسبوکار، تنها به این معنی نیست که یک برنامهنویس و یا متخصص سایتی را برای ما طراحی کند. امروزه روشهای متفاوتی از طراحی سایت در بازار و سایتهای مربوطه وجود دارد، و تنها با آموزشهای کافی و حرفهای میتوانیم خودمان طراح سایت خود باشیم.
ازاینرو برخی از طراحان قالبهای حرفهای و سایتهای بهروز جهان تلاش میکنند تا روشهای آسانتر و کاربردیتری برای اجرای یک سایت ارائه دهند. مانند قالبهای حرفهای که اکثر سایتهای حرفهای دنیا از آنها استفاده میکنند. هنگامیکه کلمه طراحی وبسایت به گوش ما میخورد؛ اولین مسئلهای که به ذهن ما خطور میکند رنگبندی، جذابیت و طراحی زیبای صفحات سایت است. اما توجه کنید که این تمامکار نیست.
برخی از افراد طراحی سایت را بهعنوان یک اثر هنری میشناسند. باید توجه داشت که یک سایت، ارائه محصولات و خدمات بهصورت دیجیتالی است؛ که در آن قالب، کد نویسی و ساختار سایت امری اساسی و مهم به شمار میآید. بر همین اساس، طراحی وبسایت موضوعی فراتر از طراحی ظاهر آن است زیرا یک طراحی مناسب و ایده آل ساختار، کارایی و قابلیتهای یک وبسایت را رقم میزند.
چرا آموزش طراحی سایت با وردپرس
اما چرا تأکید کاری ما در بستر آمادهای مانند وردپرس است؟ خب جواب ساده است. شما برای خرید خودرو و رانندگی کردن، به سراغ این کار نمیروید که تکتک وسایل را مثل موتور، چرخ، دنده را بخرید و مونتاژ کنید و بعد تازه بخواهید رانندگی کنید. وردپرس هم به همین صورت عمل کرده است، به این طریق که شما را از دردسرهای اولیه ساخت سیستم مدیریت محتوا نجات داده؛ و فقط لازم است با یادگیری طراحی قالب HTML و CSS و علم کار با وردپرس با کمک ما در این جاده همواری که CMS فراهم کرده است، در این مسیر برانید و ویراژ دهید.
وردپرس بهگونهای عمل کرده که شما را از دردسرهای اولیه ساخت سیستم مدیریت محتوا نجات داده است. فقط با یادگیری طراحی قالب Html، CSS و علم کار با وردپرس در این جاده همواری که CMS فراهم کرده با یک خودرو از قبل آمادهشده برانید. درگذشته نهچندان دور میهن وردپرس با برگزاری دورههای حضوری طراحی سایت آغاز بهکار کرد؛ و افراد علاقهمند و خاص خودش را میطلبید.
قالب یا همان ساختار کلی یک سایت از عوامل بسیار مهم در طراحی سایت است. انتخاب زبانهای برنامهنویسی مختلف مانند PHP، CSS، HTML و نظیر اینها و قالبهای آماده هرکدام معایب و مزایای زیادی دارند؛ که بنا بر سلیقه و نظر طراح آن و هدفی که از طراحی سایت دنبال میکند میتواند متفاوت باشد. البته این موضوع در بهینهسازی سایت نیز بیتأثیر نخواهد بود.
چرا آموزش طراحی سایت با وردپرس به شما پیشنهاد میشود؟
امروزه برای هر کسبوکاری که ما داریم، بهشدت احساس نیاز میشود که یک وبسایت داشته باشیم. برای داشتن یک وبسایت، وردپرس یکی از بهترین گزینهها است. که با توجه به حجم مطالب آموزشی، یادگیری آن بسیار آسان است. البته برای متفاوت بودن سایتمان و همچنین زیباسازی آن باید از قالبهای وردپرسی استفاده کرد. گروهی از قالبهای وردپرسی، قالبهای اختصاصی هستند که بهترین گزینه برای طراحی سایتهای سفارشی هستند؛ یا برای زمانی که ما میخواهیم سایتی را از پایه طراحی کنیم مناسب میباشند. در این دوره ما به آموزش طراحی سایت از ۰ تا ۱۰۰ پرداختهایم.
هنگامیکه بخواهید یک سایت تأثیرگذار و کاربردی طراحی کنید؛ احتیاج دارید که زبانهای برنامهنویسی زیادی را آموزش ببینید. این زبانهای برنامهنویسی شامل HTML، CSS، JavaScript و… هستند؛ که ایجاد بهروزرسانی و یا تغییرات را امکانپذیر میکنند. به هنگام استفاده از قالبهای آماده، ایجاد تغییرات میتواند سخت یا غیرممکن باشد. به همین دلیل داشتن دانش کافی در خصوص مدیریت و ویرایش قالبهای باکیفیت اهمیت زیادی دارد.
بهاینترتیب میتوانید وبسایتتان را در مسیری طراحی کنید که بهراحتی و با سرعت پشتیبانی و مدیریت شود. ما در این دوره آموزشی امکان ویرایش کردن قالبها را به شما آموزش میدهیم؛ و بهراحتی میتوانید قالب خود را همانگونه که میخواهید تغییر دهید و یا ویرایش کنید.

کاربردپذیری در طراحی سایت به معنای استفاده آسان از سایت و راهنمای آن است، تا کاربران بتوانند با سایت تعامل برقرار کنند و بهراحتی بتوانند در صفحات سایت جستجو کنند. یکی از مهمترین عوامل در طراحی سایت بهینهسازی آن است. طراحان حرفهای با طراحی و پیادهسازی ساختار و نقشه مناسب برای سایت، سایت را برای کاربران بهینهسازی میکنند. یکی دیگر از عناصر مهم در طراحی وبسایت خوانایی سایت است. در طراحیها باید از رنگ و فونتهای مناسب در متن و پسزمینه استفاده شود تا متنها بهراحتی قابل مشاهده باشند.
پکیج طراحی قالب وردپرس
بهطورکلی مفاهیم موردنیاز برای طراحی وبسایت را توضیح میدهیم. مفاهیم اولیه HTML و CSS و همچنین توضیحاتی در رابطه با فتوشاپ و طراحی سایت قبل از کد نویسی را برای شما توضیح خواهیم داد. شما میتوانید قالب HTML خود را طراحی کنید. Hyper Text Markup Language به معنی زبان نشانهگذاری فوق متن است. زبان استاندارد طراحی صفحات وب CSS یا Cascade Style Sheets زبانی است که توسط آن قادر خواهید بود؛ تا استایل طراحی صفحات وبسایت خود را یک بار تعریف، و در صفحات موردنیازتان اعمال کنید. اضافه کردن فروشگاه به سایت هم یکی دیگر از سرفصلهای بحثبرانگیز این دوره است!

از طراحی سایت در فتوشاپ تا برنامه نویسی تحت وب
شما در این دوره آموزشی، یک پروژه را از ۰ تا ۱۰۰ یعنی از یک سند خالی در فتوشاپ تا یک قالب در وردپرس، طبق مراحل طراحی قالب اختصاصی (مراحلی که در بالا آورده شد) انجام میدهید؛ و در جریان تمام مراحل و حتی مشکلات احتمالی قرار میگیرید. و در آخر اضافه کنیم که اگر زمان و حوصلهی تمرین کردن را دارید و پیگیر این هستید که طراح وب شوید ما این آموزش را به شما پیشنهاد میکنیم.
چرا طراحی سایت را از فتوشاپ شروع میکنیم؟
فتوشاپ بهترین نرمافزار طراحی ۲ بعدی در دنیا است که توسط شرکت معروف Adobe ساختهشده؛ و قابلیتهای بارزتری نسبت به سایر نرمافزارهای طراحی دارد. که به چند مورد از آن اشاره میکنیم: امکان جداسازی Header و Footer، سایر اجزا را جدا از هم نگه میدارد و همچنین اگر مشتری بخواهد تغییری ایجاد کند فقط در همان قسمت اعمال میشود.
همچنین وجود ابزارهایی که به صرفهجویی در زمان کمک میکند. فرمتهای مختلف برای خروجی گرفتن مانند gif،png،jpg،SVG و دیگر فرمتها وجود دارد. در فتوشاپ میتوانیم طرح را کامل ببینیم و بعد از تأیید نهایی کارفرما شروع به برنامهنویسی میکنیم؛ که زمان کمتری نسبت به برنامهنویسی صرف میشود. همچنین فرصت مناسبی است برای اینکه از وضعیت طراحی خود قبل از برنامهنویسی باخبر میشویم. علاوه بر این امکان تغییرات قبل از شروع برنامهنویسی نیز وجود دارد.
ووکامرس چیست؟
افزونهای رایگان برای طراحی فروشگاه اینترنتی در وردپرس، که به دلیل پشتیبانی گسترده از افزونهها و ترکیب با وردپرس بسیاری از وبسایتها از آن برای اضافه کردن امکانات فروشگاهی استفاده میکنند.
امکانات پیشفرض ووکامرس تمامی نیازهای کلی برای ایجاد یک فروشگاه برای فروش فیزیکی یا فروش فایلها و محتواهای دیجیتالی را فراهم میکند. امکانات بسیاری نیز با استفاده از افزونههای رایگان و تجاری که برای این سیستم توسعه پیداکرده است، به آن افزوده میشوند.
طراحی فروشگاه اینترنتی با ووکامرس یکی مناسبترین گزینهها در بیشتر موارد به شمار میرود. به دلیل اینکه ووکامرس بر روی وردپرس پیادهسازی شده است؛ در اختیار داشتن امکانات ووکامرس و وردپرس در کنار هم، مزیتی غیرقابلچشمپوشی به شمار میرود. طراحی فروشگاه اینترنتی با ووکامرس بهینه، کارآمد، مقرونبهصرفه و پشتیبانیکننده از تجارت و کسبوکار آنلاین شما بهحساب میآید.
ووکامرس افزونههای بسیار زیادی برای سفارشی کردن و افزودن امکانات جدید به فروشگاه شما در اختیارتان قرار میدهد. افزونههایی برای مدیریت مشتریان، راهاندازی بازاریابی در فروشگاه، آمار فروشگاه و …
چرا طراحی سایت با برنامه نویسی؟
برنامهنویسی وبسایت در طراحی وبسایت، مجموعه کدها و اسکریپتها و ماژولها و ابزاری که در طراحی وبسایت از آن توسط طراح سایت استفاده میشود است. این کدها میتوانند کدهای آماده باشند یا توسط خود طراح نوشته شود. این کدها باید در قالبی خاص که قرارگیری این قالب نیز دارای کدهای خاص است نوشته شوند؛ تا ظاهر سایت ما آراسته و شکیل باشد.
با استفاده از برنامهنویسی میتوانیم به طرح دلخواه خود و یا سفارشدهنده برسیم. تهیه یک طرح کلی از وبسایت و تطبیق آن با اصول علمی هدایت کاربر (UX)، طراحی قسمت گرافیکی سایت (UI) توسط طراح، تبدیل صفحات طراحیشده به HTML,CSS و تبدیل به قالب وردپرس مطابق نیاز مشتری را میتوان از مراحل کلی طراحی سایت با برنامهنویسی عنوان کرد.
این دوره برای چه افرادی مناسب نیست؟
- کسانی که به کسب درآمد از اینترنت اعتقادی ندارند.
- کسانی که دوست دارند هزینههای گزافی بابت طراحی قالبشان یا ایجاد یک سفارشیسازی جزئی در قالبشان، پرداخت کنند.
- کسانی که فکر میکنند نمیتوانند خود طراح سایت حرفهای شوند و سایت خودشان را طراحی کنند.
- آن دسته از افرادی که خود را در امر یادگیری باور ندارند.
این دوره برای چه افرادی مناسب است؟
- افرادی که دوست دارند از طریق طراحی سایت کسب درآمد کنند.
- کسانی که به کسب درآمد از اینترنت اعتقادی دارند و میخواهند سایت خودشان را حرفهای بسازند.
- کسانی که میخواهند ایدههای کسب و کار خود را ارزیابی کنند.
- کسانی که ایدههای لازم برای کسبوکار اینترنتی خود را اجرا میکنند.
- آن دسته از افرادی که به دنبال اجرای کسب و کارهای خود هستند.
- افرادی که برای یادگیری خود ارزش قائلند.
طرح طراحی شده در این دوره
تصمیم گیری در مورد شرکت در پکیج طراحی سایت با وردپرس
اگر میخواهید یک طراح سایت موفق درزمینهٔ توسعه تجارت الکترونیک خود از طریق اینترنت باشید، باید وبسایتی جذاب، تعامل برانگیز، کاربرپسند و همچنین دارای خدمات کاربردی داشته باشید.
داشتن یک سایت حرفهای و کاربرپسند کار مشکلی نیست. شما حتی با کمترین هزینه میتوانید یک سایت حرفهای داشته باشید و کسبوکار خود را بهصورت حرفه گسترش دهید. کافی است در این دوره آموزشی بسیار مفید شرکت کنید و در کمترین زمان ممکن سایت کاملاً اختصاصی و حرفهای برای خود و مشتریان خود را راهاندازی کنید.
شروع دوره جدید آموزش طراحی قالب وردپرس
بعد از دو سال، تصمیم گرفتیم دوره ۰ تا ۱۰۰ طراحی سایت را با توجه به دانش روز طراحی سایت، مجدداً ضبط کنیم. جلسات آموزشی دوره جدید صفر تا صد بهصورت رایگان در پنل دانشجویان قبلی دوره طراحی سایت و وبمستران طلایی قرار گرفت.
سرفصلهای این دوره آموزشی
جلسه ۱ – مقدمات طراحی سایت با وردپرس
- توضیحاتی در رابطه با دوره
- کارهایی که در این دوره انجام خواهیم داد.
جلسه ۲ – روش های کسب در آمد از طریق طراحی سایت
- روش های کسب در آمد از طریق طراحی سایت
- آزادکاری یا فریلسنری از طریق سایت های انجام پروژه
- نحوه طراحی سایت برای افراد و شرکت ها
- نحوه قیمت گذاری پروژه های طراحی سایت
- نحوه عقد قرارداد طراحی سایت با مشتری و مواردی که باید رعایت کنید
- کسب در آمد از طریق پشتیبانی وبسایت مشتریان
- ساخت محصول و فروش آن در مارکت های آنلاین و شرایط کار با تم فارست
- کسب در آمد از طریق آموزش به دیگران
جلسه ۳ – آموزش مقدماتی کار با فتوشاپ برای طراحی سایت
- چیدمان و طرح بندی استاندارد یک صفحه ی وب در فتوشاپ
- مفهوم سند و ایجاد یک سند برای طرح گرافیکی یک صفحه وب
- آشنایی با ابزارهای فتوشاپ برای طراحی یک صفحه وب
- معرفی واحدهای اندازه گیری و انتخاب اندازه مناسب برای یک سند گرافیکی صفحه وب
- کار با بخشهای مختلف Blending Options
- ایجاد یک بنر تبلیغاتی برای شروع کار با فتوشاپ بصورت عملی
جلسه ۴ – شروع طراحی سایت در فتوشاپ (بخش اول)
- روانشناسی رنگ و انتخاب صحیح ست رنگی در طراحی قالب
- طرح ریزی قسمت های اصلی سایت (هدر، فوتر، ساید بار) با ابزارهای فتوشاپ
- مفاهیم ruler و guideline؛ تنظیم و استفاده از آن ها
- ایجاد طرح گرافیکی صفحه ی وب در فتوشاپ ( فایل psd طرح وب سایت)
- ایجاد بخش هدر سایت در فایل psd
- اضافه کردن استایل به بخش های ایجاد شده
- توضیح میزان شفافیت و شفافیت داخلی یک صفحه ی وب
- معرفی انواع border و inner shadow متن و تصویر
- ساخت گرادینتها در طراحی وب به سبک جدید
- استایل دادن به بخش های مختلف سند گرافیکی یک صفحه ی وب در فتوشاپ
- توضیح مفاهیم UX و UI برای طراحی صفحات وب
- ساخت منوی وبسایت در فتوشاپ
- طراحی بخش سبدخرید سایت در هدر
- طراحی لوگو ساده و شیک برای مشتری در فتوشاپ
- طراحی مگامنو و هدر کامل وبسایت در فتوشاپ
جلسه ۵ – طراحی سایت در فتوشاپ (بخش دوم)
- طراحی بخش محتوای وبسایت در فتوشاپ
- طراحی نمایش لیست محصولات وبسایت در فتوشاپ
- طراحی صفحه اصلی وبسایت در فتوشاپ بصورت کام
- معرفی ابزار lorem ipsum برای ایجاد متن تصادفی مورد نیاز برای یک صفحه وب
جلسه ۶ – طراحی سایت در فتوشاپ (بخش سوم)
- طراحی فوتر وبسایت در فتوشاپ
- تکمیل طرح اصلی وبسایت و افزودن مواردی برای زیباسازی بیشتر سایت
جلسه ۷ – طراحی سایت در فتوشاپ (بخش چهارم)
- طراحی صفحه مقالات در فتوشاپ بصورت کامل
- طراحی صفحه تماس با ما و درباره ما و … در فتوشاپ
- طراحی صفحه ۴۰۴ یافت نشد در فتوشاپ
جلسه ۸ – طراحی سایت در فتوشاپ (بخش پنجم)
- طراحی صفحه محصولات در فتوشاپ بصورت کامل
- طراحی صفحه آرشیو محصولات در فتوشاپ بصورت کامل
- اتمام طراحی سایت در فتوشاپ
- دریافت خروجی برای ارائه به مشتری
جلسه ۹ – شروع یادگیری HTML و معرفی تگهای آن
- توضیح در مورد فایل های HTML و CSS
- تفاوت فایل های HTML و CSS
- چگونگی ایجاد فایل ها ی HTML و CSS
- طرز نمایش، استایل بندی، چیدمان و رنگ بندی صفحه ی وب با CSS
- توضیح چگونگی نمایش یک صفحه ی وب برای user ها
- توضیح ساختار فایل HTML شامل تگ های header و body
- معرفی تگ های مختلف HTML
جلسه ۱۰ – شروع یادگیری CSS و معرفی تگهای آن
- توضیح ساختار CSS به طور کامل
- چگونگی ایجاد کلاس و آی دی در فایل CSS و فراخوانی آنها
- تفاوت آی دی و کلاس در یک فایل CSS
- آموزش CSS بصورت کامل و آشنایی با خصوصیتهای سی اس اس
جلسه ۱۱ – شروع کار با HTML و CSS بصورت عملی
- معرفی نرم افزار های مختلف برنامه نویسی
- ایجاد یک فایل HTML ساده
- توضیح ساختار کلی فایل HTML و تگ های HTML
- معرفی Selectorها در CSS و انواع آنها
- دلیل ایجاد فایل های header، footer،content ،slider و … به صورت جداگانه برای ایجاد صفحات وب
- توضیح مفهوم minify و مزیت استفاده از کدهای minify شده ی html و css
- توضیح مسیردهی فایل ها در CSS
- توضیح چگونگی اضافه کردن فایل CSS به فایل HTML
- کامنت گذاری در HTML
- کامنت گذاری در CSS
جلسه ۱۲ – ساخت هدر وبسایت با زبان HTML و CSS
- تبدیل طرح گرافیکی به کد
- ایجاد یک سند Html برای یک صفحه ی وب بصورت عملی
- معرفی Css و استفاده از آن برای ایجاد افکت های گرافیکی و ایجاد سند Css بصورت عملی
- لینک کردن صفحه های Html و Css بصورت عملی
- کدنویسی قالب طراحی شده در فتوشاپ
- استفاده از کدهای css reset بصورت عملی
- شروع کدنویسی بخش های مختلف صفحه ی وب
- کدنویسی هدر سایت بصورت کامل
- معرفی کاربرد عملی خاصیت z-index در طراحی وب
- اضافه کردن فونت به یک فایل Html
- اضافه کردن تصویر پس زمینه ی سایت
- کدنویسی بخش header شامل کدنویسی لوگو
- کدنویسی منوی اصلی سایت
- مفهوم hover و استفاده از آن برای ایجاد منوها
- طراحی منو و زیرمنو با Css
- آشنایی با پسوند SVG و استفاده از آن در وبسایت
- مشخص کردن نوع و اندازه فونت سایت با استفاده از Css
جلسه ۱۳ – ساخت مگامنو و محصولات صفحه اصلی با HTML
- ساخت مگامنو حرفهای در HTML
- افکت دادن به مگامنو با استفاده از CSS
- استفاده از تگ img بصورت عملی
- استایل دهی به سلکتور مختلف last-child و first child
- شروع ساخت صفحه اصلی وبسایت
- استفاده از کلاس clear در style.css
- Hover دادن به بخش های مختلف صفحه ی وب
- استایل دهی به هدینگها
- توضیح کاملتر خاصیت float بصورت عملی
- استایل دادن به بخش های مختلف با استفاده از دستور nth-child
جلسه ۱۴ – ساخت ستون کناری وبسایت با HTML و CSS
- ساخت ستون کناری وبسایت در HTML
- قرار دادن تصویر تبلیغاتی در ستون کناری وبسایت
- برنامهنویسی سایدبار وبسایت
- اضافه کردن hover به باکس های سایدبار
- ساخت آخرین مطالب با HTML در سایدبار
- ساخت فرم خبرنامه در HTML
- ساخت اسلایدر موبایل در HTML
جلسه ۱۵ – ساخت اسلایدر در HTML و CSS
- ساخت اسلایدر موبایلی در صفحه اصلی سایت
- آموزش کار با Owl Slider
- اضافه کردن جاوا اسکریپت به سایت طراحی شده
- استفاده از اسلایدر اسکرولی در وبسایت
جلسه ۱۶ – ساخت فوتر وبسایت با HTML و CSS
- ساخت فوتر وبسایت در HTML
- آموزش عملی کار با گرادینتها در CSS
- ساخت پس زمینه فوتر وبسایت با CSS
- قرار دادن اینماد و لوگو ساماندهی در فوتر وبسایت
- اتمام HTML صفحه اصلی و کپی گرفتن برای استفاده در دیگر صفحات وبسایت
جلسه ۱۷ – ساخت صفحات داخلی و صفحه 404
- کپی گرفتن از فایلها برای ساخت صفحه جدید HTML
- ساخت فایل صفحات درباره ما، تماس با ما و … در HTML
- ساخت صفحه ۴۰۴ یافت نشد با HTML
- آموزش سازگار کردن سایت با مرورگرهای مختلف
جلسه ۱۸ – ساخت مابقی صفحات وبسایت
- ساخت صفحات دیگر در html
- اتمام نشانه گذاری html و تکمیل قالب در html
- توضیح ساختار کلی قالب وردپرس
- آموزش ساخت فایلهای مختلف در قالب وردپرس
جلسه ۱۹ – شروع ساخت قالب وردپرس و تبدیل HTML به وردپرس
- ساخت یک قالب ساده خام برای وردپرس
- توضیح ساختار قالب وردپرس بصورت عملی
- شروع تبدیل قالب HTML به وردپرس
- داینامیک کردن Title صفحات
- آدرس دهی بصورت داینامیک برای فایلهای JS و CSS
- Include کردن هدر و فوتر در صفحات سایت
- آموزش ساخت فهرست متغیر در وردپرس
- سازگار کردن قالب وردپرس با افزونههای مختلف
جلسه ۲۰ – ساخت مگامنو و ستون کناری در قالب وردپرس
- ساخت مگامنو عریض بدون استفاده از افزونه
- آموزش ساخت سایدبار قابل ویرایش از بخش ابزارکها
- ساخت ابزارک اختصاصی برای قالب وردپرس
- آموزش افزودن قابلیت تصویر شاخص به وردپرس
- افزودن سایزهای مختلف تصویر شاخص در وردپرس
- مدیریت سایدبار وبسایت با ابزارکها
- مدیریت تبلیغات وبسایت با استفاده از ابزارکها
- نمایش آخرین مقالات وبسایت در ستون کناری
جلسه ۲۱ – ساخت فوتر وبسایت و صفحه ۴۰۴ و صفحات آرشیو
- انتقال کدهای بخش سایدبار به فایل مجزا
- ساخت پست تایپ سفارشی در وردپرس
- نمایش پست تایپ سفارشی در بخش اسلایدر
- ساخت فوتر وبسایت در وردپرس
- ساخت محل ابزارک برای فوتر
- مدیریت فوتر از پنل وردپرس
- برنامه نویسی صفحه ۴۰۴ در قالب وردپرس
- ساخت سایز تصویر شاخص برای بخش آرشیو
- برنامه نویسی صفحه آرشیو در قالب وردپرس
- نمایش شماره صفحات در بخش آرشیو بدون نصب افزونه
- استایل دهی CSS به بخش شماره صفحات
جلسه ۲۲ – ساخت صفحه برگه ها و نوشته های وردپرس
- نمایش برگهها در وردپرس
- نمایش نوشته تکی در وردپرس
- نمایش برچسبها در قالب وردپرس
- نمایش نام نویسنده در قالب وردپرس
- نمایش دسته بندی های نوشته در قالب وردپرس
- نمایش محتوای پست در قالب وردپرس
- نمایش نظرات در قالب وردپرس
- ویرایش سی اس اس برای سفارشی سازی نظرات سایت
- سفارشی کردن برنامه نویسی comments.php
جلسه ۲۳ – شروع ساخت بخش فروشگاهی وبسایت و ساخت صفحه معرفی محصول در ووکامرس
- روش سازگار کردن قالب ساخته شده با ووکامرس
- استفاده از تصاویر شاخص در صفحه محصول
- ویرایش بخش های مختلف ووکامرس در قالب طراحی شده
- سفارشی کردن صفحه نمایش محصول در ووکامرس
- افزودن بخش مقایسه محصول در قالب طراحی شده
- ساخت بخش افزودن به لیست خرید آینده
- سفارشی سازی دکمه افزودن به سبد خرید
جلسه ۲۴ – ساخت صفحه محصول در ووکامرس (بخش دوم)
- ادامه ساخت صفحات محصول در ووکامرس
- ساخت بخش معرفی کامل محصول
- نمایش مشخصات فنی محصول در صفحه محصول
- سفارشی سازی بخش های مختلف صفحه محصول ووکامرس
جلسه ۲۵ – ساخت صفحه آرشیو محصولات و صفحه سبد خرید و صفحه حساب کاربری ووکامرس
- ساخت صفحه آرشیو محصولات
- سفارشی کردن صفحه دسته بندی محصولات ووکامرس
- سفارشی کردن صفحه سبد خرید ووکامرس
- سفارشی سازی پیامهای نمایش داده شده در صفحه تسویه حساب ووکامرس
- سفارشی سازی صفحه حساب کاربری ووکامرس
جلسه ۲۶ – نمایش محصولات ووکامرس در صفحه اصلی سایت
- استفاده از WP_Query برای نمایش پست تایپها
- نمایش محصولات ووکامرس در صفحه اصلی سایت
- افزودن دکمه افزودن به سبد خرید به صفحه اصلی
- نمایش عنوان محصولات در صفحه اصلی سایت
جلسه ۲۷ – ساخت پنل تنظیمات برای قالب وردپرس
- بهترین روش برای ساخت پنل تنظیمات قالب وردپرس
- چرا از روشهای قدیمی استفاده نمیکنیم؟
- افزودن فیلد متنی به پنل تنظیمات قالب وردپرس
- افزودن فیلد انتخاب رنگ به پنل تنظیمات قالب وردپرس
- افزودن فیلد آپلود تصویر به پنل تنظیمات قالب وردپرس
- مدیریت بخشهای سایت قالب با پنل تنظیمات قالب وردپرس
- تغییر لوگوی سایت از پنل تنظیمات قالب وردپرس
- مدیریت تبلیغات سایت از پنل تنظیمات قالب وردپرس
- انتخاب دسته بندی محصولات صفحه اصلی از پنل تنظیمات قالب
جلسه ۲۸ – انتخاب رنگ و استایل قالب از پنل تنظیمات قالب
- کوتاه کردن عنوان محصولات صفحه اصلی برای جلوه بهتر
- انتخاب عنوان دسته بندی محصولات صفحه اصلی از پنل تنظیمات قالب
- ساخت رنگبندی و انتخاب رنگ سایت از طریق پنل تنظیمات قالب
- افزودن رنگبندی سبز، قرمز و آبی به پنل تنظیمات قالب
جلسه ۲۹ – ریسپانسیو کردن قالب طراحی شده
- آموزش کامل ریسپانسیو کردن بخشهای مختلف سایت
- کار با شرط @media and screen در سی اس اس
- جلوگیری از اسکرول افقی در حالت موبایل
جلسه ۳۰ – ساخت منوی ریسپانسیو برای موبایل
- ساخت منوی همبرگری در موبایل
- اتصال منوی همبرگری به فهرست وردپرس
- ساخت منو ریسپانسیو بدون نیاز به نصب افزونه (بصورت اختصاصی)
- ساخت منو ریسپانسیو با استفاده از افزونه
- استفاده از جاوا اسکریپت برای ساخت منو موبایلی
جلسه ۳۱ – حل مشکلات قالب طراحی شده
- آموزش حل مشکل عنوان در تگ Title
- آموزش اسلایدی کردن تصاویر محصولات ووکامرس
- آموزش افزودن LightBox به تصاویر محصولات ووکامرس
- آموزش حل حذف شدن استایل hover منوی اصلی موقع hover کردن روی submenu
جلسه ۳۲ – اضافه کردن قابلیت به قالب
- لینک کردن دسته بندی های موجود در صفحه اصلی
- اضافه کردن Preloader به کل صفحات سایت
جلسه ۳۳ – اضافه کردن قابلیت به قالب
- ساخت فرم جستجوی سفارشی
- نمایش عناصر سایت در ساعات خاص
جلسه ۳۴ – مگامنوی ریسپانسیو
- آموزش ریسپانسیو کردن مگامنو
- ساخت منوهای باز شونده در حالت موبایلی
جلسه ۳۵ – افزودن تنظیمات به ابزارک اختصاصی ساخته شده
- افزودن تنظیمات تغییر عنوان به ابزارک
- افزودن تغییر تعداد نمایش پست به ابزارک
جلسه ۳۶ – پس زمینه سفارشی برای مگامنو
- قرار دادن تصویر پس زمینه سفارشی برای هر مگامنو بصورت مجزا
- روشهای دیگر سفارشی کردن مگامنوها
جلسه ۳۷ – ساخت مینی سبد خرید
- نمایش تعداد محصولات سبد خرید در هدر سایت
- نمایش سبد خرید سریع در هدر سایت
جلسه ۳۸ – نمایش مسیر کاربر و فرم ورود اختصاصی
- نمایش مسیر کاربر در سایت
- ساخت فرم ورود اختصاصی برای ورود کاربر در قالب
جلسه ۳۹ – شرطی کردن دستهبندیها و استفاده از فیلدهای دلخواه
- استفاده از if_category
- استفاده از is_category
- استفاده از فیلدهای سفارشی وردپرس
- شرطی کردن فیلدهای سفارشی وردپرس
مدرس این دوره آموزشی
رضا حسینی راد
- مدیر و موسس وبسایت میهن وردپرس با رتبه ۳۵۰ ایران
- دارای گواهینامه SEO Expert از SEO MOZ
- دارای گواهینامه بین المللی PHP , HTML & CSS و JavaScript از W3Schools
- نویسنده کتاب شاه کلید سئو
- مشاور و مدرس کسبوکار اینترنتی
تفاوت این دوره با سایر دورههای آموزشی
- در این دوره آموزشی، یک قالب وردپرس را بصورت کاملا عملی طراحی و پیاده خواهیم کرد.
- طراحی UI سایت را از صفر توسط فتوشاپ انجام خواهیم داد.
- سایت را برای موبایل و تبلت نیز طراحی خواهیم کرد.
- برنامه نویسی و نشانه گذاری را بصورت کاملا اصولی یاد خواهید گرفت.
سوالات متداول
تا بحال برنامهنویسی نکردهام! این دوره برای من مناسب است؟
جالب است بدانید اکثر افرادی که در این دوره شرکت کردهاند، حتی راهاندازی اولیه و کار با سایت را هم به خوبی بلد نبودهاند؛ و در انتهای دوره توانستند طراحی و راهاندازی سایت را بهصورت کامل یاد بگیرند. که این کار را میتوانستند هم برای خودشان و هم برای مشتریانشان انجام دهند. پس با اطمینان به شما میگوییم که شرکت در این دوره و انجام تمرینهای آن حتماً به شما کمک میکند؛ تا به یک طراح حرفهای تبدیل شوید و درامد شیرینی را هم از این مهارت کسب کنید.
تنها کافی است اصول و عملکردهای ایجاد یک سایت را بدانید تا بتوانید خودتان طراح سایت شوید. با شرکت در این دوره دیگر نیاز ندارید سایت خود را به یک طراح حرفهای بسپارید تا طراحی کند. بلکه خودتان میتوانید یک سایت حرفهای با تمام امکاناتی که یک سایت حرفهای میتواند داشته باشد را طراحی کنید.
چرا طراحی سایت را با برنامهنویسی انجام دهیم؟
برنامهنویسی وبسایت در طراحی وبسایت، مجموعه کدها و اسکریپتها و ماژولها و ابزاری که در طراحی وبسایت از آن توسط طراح سایت استفاده میشود است. این کدها میتوانند کدهای آماده باشند یا توسط خود طراح نوشته شود. این کدها باید در قالبی خاص که قرارگیری این قالب نیز دارای کدهای خاص است نوشته شوند؛ تا ظاهر سایت ما آراسته و شکیل باشد.
با استفاده از برنامهنویسی میتوانیم به طرح دلخواه خود و یا سفارشدهنده برسیم. تهیه یک طرح کلی از وبسایت و تطبیق آن با اصول علمی هدایت کاربر (UX)، طراحی قسمت گرافیکی سایت (UI) توسط طراح، تبدیل صفحات طراحیشده به HTML,CSS و تبدیل به قالب وردپرس مطابق نیاز مشتری را میتوان از مراحل کلی طراحی سایت با برنامهنویسی عنوان کرد.
آیا با استفاده از این آموزش می توانم سایتم را هر طور که دوست دارم طراحی کنم؟
بله. شما با دیدن این آموزش هر سایتی که دوست داشته باشید و به هر شکلی که مدنظرتان باشد، میتوانید طراحی کنید. اکثر ما زمانی که به اجرا و طراحی سایت فکر میکنیم اولین چیزی که ذهنمان را درگیر میکند شکل ظاهری، رنگبندی و دیگر موارد آن است. اما اینها کافی نیست. بلکه ارائه خدمات و یا حتی محصولات، امنیت، بهینهسازی و… یکی از مهمترین مواردی است که در طراحی سایت باید به آن توجه داشت. ما در این دوره تمامی این موارد را به شما آموزش میدهیم. پس مطمئن باشید با شرکت در این دوره میتوانید یکی از طراحان حرفهای سایت شوید.
من میخواهم قالب آماده خودم را ویرایش کنم و تغییرات اساسی در آن ایجاد کنم. این آموزش به من کمک میکند؟
بله. بعد از دیدن این دوره و یادگیری HTML و CSS میتوانید ظاهر قالب آمادهتان را منحصربهفرد کنید! طوری که دیگر مشخص نشود قالبتان آماده است. CSS برای تعیین استایل صفحات وب ازجمله طراحی، طرحبندی، تغییر رنگبندیها، تغییرات در صفحهنمایش برای دستگاههای مختلف و اندازه صفحهنمایش استفاده میشود.
در قالبهای وردپرس هم امکان این را دارید که شکل ظاهری سایت خود را با استفاده از CSS تغییر دهید. ممکن است شما بخواهید قالب سایت خود را تغییر دهید. بهعنوانمثال جهت تغییر رنگ یک قسمت خاص، اندازه فونتها و حتی راستچین یا چپچین بودن مطالب، که تمامی این موارد را بهراحتی با شرکت در این دوره آموزش میبینید.
تعدادی از افراد بعدازاینکه هاست و دامنه موردنظر خود را تهیه کردند، اقدام به نصب و استفاده از پوستهها و قالبهای آماده میکنند؛ و سعی دارند که سایت خودشان را بدون پرداخت هزینه طراحی، بارگذاری و اجرا کنند. این افراد درصورتیکه به تمام نکات اجرا و طراحی سایت مسلط باشند؛ موفق خواهند بود و سایت خود را بدون هیچ مشکلی راهاندازی میکنند.
اما آن دسته از افراد که به طراحی و اجرای یک سایت حرفهای مسلط نیستند و آموزشهای موردنیاز را ندیدهاند؛ باید توجه داشته باشند که برخی از این قالبها در مدتزمان کوتاهی طراحیشدهاند، حجم بالایی دارند و معمولاً دارای مشکلات کد نویسی، امنیتی و هزاران مشکل دیگر که از آن اطلاعی ندارند هستند؛ که برای وبسایت شما بسیار مضر بهحساب میآید. برای رفع تمام این مشکلات کافی است که قبل از آنکه اقدام به اجرای یک سایت حرفهای داشته باشیم؛ از آموزشهایی که میتواند ما را در ساخت یک سایت حرفهای راهنمایی و کمک کند استفاده کنیم.
میخواهم سایتم در موبایل و تبلت به خوبی نمایش داده شود. آیا این آموزش به من کمک میکند؟
بله، شما با دیدن این دوره آموزشی میتوانید با یادگیری اصولهای ریسپانسیو بودن یک سایت، و اینکه چطور بفهمید سایت شما ریسپانسیو است یا نه این کار را انجام دهید. امروزه افراد زیادی از تلفن همراهشان برای جستجوهای آنلاین استفاده میکنند. برخی قالبهای آماده در موبایلها و تبلت ها بهدرستی نمایش داده نمیشوند؛ و استفاده از وبسایت برای کاربران موبایل بسیار دشوار خواهد بود.
این امر باعث پایین آمدن کیفیت سایت شما میشود. پس قبل از انتخاب قالب باید بدانید که با موبایل و تبلت میتواند سازگار باشد یا خیر. همچنین در الگوریتمهای گوگل سایتهایی که موبایل پسند طراحی میشوند از رتبه بهتری در صفحات گوگل برخوردار خواهند بود. با این تفاسیر میتوان نتیجه گرفت رعایت بهینهسازی و طراحی سایت سازگار با تلفنهای همراه ضروری است.
آیا طراحی سایت میتواند تأثیری بر روی سئو داشته باشد؟
بله، با اندکی آشنایی با تکنیکها و اصول سئو و بهینهسازی سایت، میتوان تا حدی رتبه سایت در موتورهای جستجو و بهینهسازی سایت را افزایش داد؛ اما این تمام کار نیست. تعداد بسیار زیادی از افراد بر این باور هستند که سئو، قرار دادن تعداد زیادی کلمات کلیدی در مکانهای مخصوصی در سایت موردنظر است. اما برخلاف تصور این افراد سئو مسائل زیادی را شامل میشود؛ ازجمله کد نویسی سایت و بسیاری از مسائل دیگر که در طراحی سایت آنها را نباید نادیده گرفت. قرار دادن کلمات کلیدی در سایت تنها بخش کوچکی از پازلی است که میبایست برای بهینهسازی سایت تکمیل شود.
نحوه پشتیبانی این دوره
نظرات دانشجویان این دوره
لیست بروزرسانیها
آپدیت شماره ۱۰ در تاریخ ۱۲ آذر ۱۳۹۸
- تابع if_category
- تابع is_category
- استفاده از فیلدهای سفارشی وردپرس
- شرطی کردن فیلدهای سفارشی وردپرس
آپدیت شماره ۹ در تاریخ ۱۷ مرداد ۱۳۹۸
- افزودن تنظیمات به ابزارک اختصاصی ساخته شده به دوره اضافه شد.
- آموزش پس زمینه سفارشی برای مگامنو به دوره اضافه شد.
- آموزش ساخت مینی سبد خرید به دوره اضافه شد.
- آموزش نمایش مسیر کاربر و فرم ورود اختصاصی به دوره اضافه شد.
آپدیت شماره ۸ در تاریخ 2 مرداد 1398
- آموزش ریسپانسیو کردن مگامنو و ساخت منوهای باز شونده در حالت موبایلی اضافه شد.
آپدیت شماره ۷ در تاریخ ۲۷ خرداد ۱۳۹۸
- آموزش اضافه کردن لینک به دسته بندیهای صفحه اصلی
- اضافه کردن لودینگ قبل از بارگذاری سایت (Preloader)
آپدیت شماره ۶ در تاریخ ۲۲ اسفند ۱۳۹۷
- آموزش حل مشکل عنوان در تگ Title
- آموزش اسلایدی کردن تصاویر محصولات ووکامرس
- آموزش افزودن LightBox به تصاویر محصولات ووکامرس
- آموزش حل حذف شدن استایل hover منوی اصلی موقع hover کردن روی submenu
آپدیت شماره ۵ در تاریخ ۲۷ آذر ۱۳۹۷
- تمامی جلسات دوره از ابتدا ضبط شد. در دوره جدید قالب جدید فروشگاهی شرکتی همراه با پنل مدیریت کامل طراحی کردیم.
آپدیت شماره ۴ در تاریخ ۲۹ خرداد ۱۳۹۷
- آموزش کار با فونت آیکون ها اضافه شد.
- آموزش افزودن Preloader پیش بارگذار صفحات اضافه شد.
- آموزش ویرایش و طراحی دکمه افزودن به سبد خرید در ووکامرس اضافه شد.
- آموزش اضافه کردن تصویر پیش بارگذار زیر تصاویر در حال لود اضافه شد.
آپدیت شماره ۳ در تاریخ ۱۹ دی ۱۳۹۶
- آموزش کار با keyframe ها و ساخت جلوه های انیمیشن در صفحات وب به دوره اضافه شد.
- آموزش ساخت پس زمینه دکمه بصورت اسلاید در زمان قرار گرفتن موس روی دکمه اضافه شد.
آپدیت شماره ۲ در تاریخ ۱۵ آبان ۱۳۹۶
- راهکار های کسب در آمد از طریق طراحی سایت با وردپرس و نحوه عقد قرار داد با مشتری به آموزش اضافه شد.
آپدیت شماره ۱ در تاریخ ۳ آبان ۱۳۹۶
- آموزش نوشتن سی اس اس مستقیم به دوره اضافه شد.
- آموزش نمایش شماره صفحات در مطالب اضافه شد.
- آموزش نمایش نام نویسنده و تگ ها به آموزش اضافه شد.
- نحوه ساخت وب گرادینت ها به آموزش اضافه شد.
- نحوه نمایش آخرین مطالب سایت در صفحه اصلی به دوره اضافه شد.

سلام و تشکر از سایت خوب شما
ما از برنامه نویسی و کد نویسی فقط اسم HTML و CSS رو بلدیم, با یادگیری این دوره میتونیم یک سایت فروشگاهی مثل الوشاپ یا کات شاپ طراحی کنیم؟
مثلا استایل نمایش محصولات, گزینه های هاور محصولات و … رو با کد نویسی اضافه یا تغییر دهیم. چون این موارد در تنظیمات قالب های آماده فروشگاهی بعضا وجود ندارند و برای ایجادشون فقط باید دمو مربوطه رو ایمپورت کنیم.
سلام بله به راحتی. حتی میتونید این قالب ها را بعد از دیدن این آموزش به دلخواه خود تغییر دهید
سلام خسته نباشید
چند تا سوال داشتم
خیلی به طراحی قالب علاقه دارم اما با دیدن قیمت دوره ها و آموزش ها و پک ها منصرف شده بودم تا با سایت شما آشنا شدم و این آموزش رو دیدم حالا سوالم اینه که با این آموزش میتونم قالب های مذهبی ، هیئتی طرحی کنم مثل قالب ghorb.net یا قالب noorieh.info یا قالب ali-rahmani.com طراحی کرد
خودم هم یه سایت دارم ، اینه al-abbas.ir البته قالبش تماما کار دوستمه اینجوری هم میشه ساخت با این آموزش
اینم بگم که هیچ کدنویسی بلد نیستم راه میفتم با این آموزش
تشکر
سلام متشکرم. بله توی این آموزش از صفر تا صد توضیحات رو ارائه کردیم و با دیدنش میتونید هر سایتی رو طراحی کنید. اگر باز هم مشکلی از بابت ساخت بخشی از سایت داشتید بفرمایید به آپدیت های بعدی آموزش ٬ اضافه می کنیم
آپدیت هایی که میزنید با پرداخت همون 240 تومن حساب میشن
یا هزینه جداگونه دارن
ممنون
آپدیت ها رایگان هستند و هزینه جداگانه ندارد
با سلام بنده کاربر مبتدی هستم و هیچ گونه دانشی درباره کد نویسی و اشنایی با برنامه نویسی ندارم میخواستم بدونم بعد از خرید و مطالعه دوره توانایی طراحی سایت رو دارم یا خیر؟؟
سلام بله دوره از صفر تا صد توضیح داده شده و پس از مشاهده کامل دوره می توانید هر سایتی را طراحی کنید
سلام بخشید من وردپرس رو نصب کردم بر روی لوکال هاست و سایتمو ساختم اونجا فقط میخواستم بدونم چطور میتونم سایتی که طراحی کردمو را اندازی کنم بر روی دامینم طوری که با سرچ کردن دامین سایت من باز بشه .ممنون
سلام امکانش نیست باید حتما انتقال بدید به هاست اصلی
باسلام خدمت اساتید محترم
من هیچ برنامه نویسی و کدنویسی بلد نیستم
ایا با اموزش شما میتوانم یک قالب را طراحی کنم یک قالب کامل و امن
و ایا میتوانم یک قالب خارجی را فارسی سازی و راستچین کنم
یادگیریم خوبه
درود بله میتونید بصورت کامل قالب امن را طراحی کنید. در مورد فارسی سازی و راستچین خیر یک پکیج جدا برای اینکار میسازیم روی سایت قرار خواهیم داد
بله ممنون میشم این آموزش رو هم بزارید که بتونیم استفاده کنیم برای این آموزش تخفیف 50 درصدی نداره من میخوم امنیت وردپرس رو هم خرید کنم
حتما به زودی قرار داده میشه. این آموزش در حال حاضر خیر اما عضو کانال تلگرام و اینستاگرام ما بشید تخفیف های خوبی میذاریم
سلام
این دوره شما برای استفاده با گوشی(کلا سیستم اندروید)
قابل استفاده هست یا نه؟؟
منظورم مراحل یادگیری کامل تا ساخت یک وبسایت و استفاده از اطلاعات شما؛ برروی گوشی های اندروید هست.
بدون استفاده مطلق از لپ تاب یا …
ممنون از سایت خوبتون.
سلام اگر منظور دیدن ویدیو هست بله اما برای ساخت سایت و کار با فتوشاپ و dreamweaver نیاز به کامپیوتر دارید
درود بر شما. ممنون استاد swidget درست شد. فقط یه سوال اینکه اگه بکگراند اون رو یه pattern بزارم سرعت سایت خیلی کم میشه؟ و همینطور navbar ؟
درود خواهش میکنم. خیر اگر حجم تصویر زیاد نباشه مشکلی نیست
سلام و احترام
استاد سه ماهی هست که سایتم رو راه اندازی کردم و به یک مشکل بر خوردم با خرید اموزش 0 تا 100 طراحی شما چیزای زیادی یاد گرفتم و تونستم مشکلات در قالبم رو تا حدی حل کنم و اکنون به مشکل بزرگی بر خوردم تو این سه ماه فضای هستم پر شده توی 120 محصول من 800 عکس اپلود کردم و همگی رو در فتو شاپ حجمشون رو کم کردم و الان از هر عکسی که آپلود کردم در هاست قسمت پابلیک اچ تیمل قسمت wp-content و داخل پوشه اپلود پوشه های با نام 2017 و 2018 درست شده که عکس هام اونجا هستند و مشکل اینجاست که از هر عکس خودش رفته کلی عکس دیگه ساخته و اندازه رو هر بار کاهش داده / برای حل این موضوع سرچ کردم تو اینترنت هیچ جا راهنمایی نکردن و دوستان زیادی این مشکل رو در انجمن ها پرسیدن و جوابش این بوده که در پوشه فانگشن قالب باید سایز های اضافی رو حذف کنید و من فقط یک سایز دیدم در این پوشه که کدش رو در سطر پایین میزارم.
/**
* theme support for featured images
*/
if (function_exists(‘add_theme_support’)) {
add_theme_support(‘post-thumbnails’);
add_image_size(‘blog’, 100, 72, true);
}
این کد در توابع پوسته من هست که فانکشن پی اچ پی هم نام داره و هر عکسی برای محصولاتم میزارم چندین عکس دیگه میزاره تا نهایتا به 100 در 72 پیکسل تبدیل بشه و من کلا گیج شدم لطفا راهنمای کنید استاد.
درود خوشحال شدم از نظر خوبتون. اینها را حذف نکنید چون در قالب شما استفاده می شوند. بهتر است وارد بخش تنظیمات > رسانه شوید و تمامی گزینه ها را روی 0 در 0 قرار دهید. سپس با افزونه force regenerate thumbnails می توانید تصاویر اضافه را حذف کنید
با احترام
سلامی مجدد
استاد اون افزونه رو نصب کردم و در ناحیه کاربری این افزونه کلیدش ررو زدم تا 100 در صد تصاویر بنده رو آنالیز کرد و در اخر هیچی و وارد هاست که شدم دیدم هیچی تغییر نکرده و عکس های اضافه سر جاش هست اگر لطف کنید و لینک تلگرامتون رو برام بفرصتید در جیمیلم تا بتونم ازتون راهنمای بگیرم ممنون میشم و pv شما نزد بنده امانت است .
سلام مجدد اگر حذف نکرده پس تمامی تصاویر نیاز هست و نباید حذف شوند. برای بخش های مختلف قالب استفاده می شوند. فقط همان بخش رسانه مقادیر را صفر قرار دهید تا از این پس تصاویر بیشتری اضافه نشود
سلام استاد وقتی که میام برا swidget و swidget span سی اس اس بزنم عمل نمیکنه و باید تو کدهای css reset این تغییرات رو انجام بدم و اون وقت سایتم به هم میریزه. مشکل از چیه؟ باید چکار کنم؟
سلام یک !important به سی اس اس ها اضافه کنید مطابق آموزش
استاد important میدم ولل درست نمیشه. aside رو از ریست کد بیرون آوردم و بهش سی اس اس دادم درست شده. مثلا به aside span و aside ul li a سی اس اس دادم. ولی swidget که اضافه میکنم باز جواب نمیده. ولی بدون swidget درست میشه. راه رو درست رفتم؟ یا باید کار دیگه انجام بدم؟
swidget رو با # تست کنید.
سلام استاد وقت بخیر
استاد وقتی میخوایم mainmenu رو تو html css تعریف کنیم. میشه جای اینکه از دستور ul و li استفاده کنیم برا هر منو از کد a استفاده کنیم؟ یا حتما باید ul li باشه؟
درود وقت بخیر. بهتره ul li باشه از نظر سئو و محتوایی
سلام استاد در بعضی سایتها مثل زرین پال وقتی صفحه لود میشه یه افکت تار مانند روی صفحه برا یکی دو ثانیه میمونه و بعد محو میشه. میشه این افکت رو روی وردپرس اجرا کرد؟ اگه میشه تو آپدیت بعدی حتما بزارید. ممنونم
درود بله حتما در آپدیت بعدی توضیح خواهیم داد.
ممنون استاد. بی صبرانه منتظرم
با سلام آموزش لایسنس گذاری روی قالب وردپرس رو نمی زارید؟ چون در سطح وب چنین آموزشی وجود ندارد و من به شدت به این آموزش نیازمندم.
درود این آموزش مربوط میشه به دوره آموزشی php و باید پی اچ پی رو یاد بگیرید
سلام.
اگه Html و CSS رو به طور کامل فرا بگیریم در این دوره میتونه موثر واقع بشه ؟
ممنون.
سلام
بله بسیار موثر هست.
سلام و احترام
خسته نباشید
دیشب این پکیج آموزشی صفر تا صد طراحی قالب رو دانلود کردم و همه فیلم ها رو مختصر نگاه کردم.
عالی بود دستون طلا
خیلی مشتاق بودم تو 10 ساعت کل فیلم هاتون رو دانلود و مختصر نگاه کردم و بایستی بگم استاد محشری و کارت خیلی درسته دمت گرم و کاش زودتر باهاتون اشنا می شدم .
باید بگم هیچ پشیمون نیستم و ارزشش خیلی بیشتره … موفق باشید و پایدار
///||||\\\ ارادتمند: عبدالهی ///||||\\\
درود
متشکرم لطف دارید انشالله که براتون مفید واقع بشه. موفق و پیروز باشید
سلام وقتتون بخیر
بعد از این دوره مدرک رو تضمینی به ما میدید؟
سلام
بعد از گذراندن دوره یک آزمون آنلاین از شما گرفته میشود در صورتی که از آزمون نمره قبولی بگیرید میتوانید مدرک را دریافت کنید.
سلام
تو این دوره html و css رو هم آموزش میدین؟
سلام بله بصورت کامل
سلام
وقتتون بخیر
یه ابهامی برای من پیش اومده و اونم اینکه اگر که وردپرس سیستم مدیریت محتوای تقریبا امن و کاملی هستش، پس چرا اکثر سایت ها از وردپرس استفاده نمیکنن و به گفته خودتون تقریبا 20 درصد از وبسایت ها از این سیستم مدیریت محتوا استفاده میکنن؟ در حالیکه اگر وردپرس تقریبا کامل و امن و بی نقص باشه باید اکثر وبسایت ها از این سیستم مدیریت محتوا استفاده کنن. برای مثال چرا باید فروشگاه های بزرگ هزینه کنن و CMS اختصاصی ایجاد کنن؟ ممنون میشم به طور کامل توضیح بدید
درود وقت خوش
ببینید اون ۷۵ درصد اکثرشون سایت های استاتیک html هستن که نیاز به cms ندارند یا سایت هایی مثل شبکه های اجتماعی و… مهم اینه در مقایسه با سایر سی ام اس ها وردپرس بسیار استفاده زیادی داره
استاد تو این سایتی که بهتون گفتم از فرمهای زیادی برای تکمیل ثبت نام استفاده شده . میشه فهمید از چه پلاگینی استفاده شده؟
بله به راحتی با inspect element میتونید ببینید لیست افزونه های نصب شده رو و همچنین از مسیر افزونه ها مثلا wp-content/plugins/quform
ممنون استاد. چک کردم همینطور که گفته بودید ظاهرا همه فرمها با کد نوشته شده. میشه همچنین چیزی؟ همه دستور input و غیره دارن و بنظر نمیاد از پلاگین خاصی استفاده کرده باشه. استاد اگه امکانش هست شما هم چک کنید و جواب سوال منو بدید . ممنون میشم
درود آدرس صفحه دارای فرم رو بدید
سلام
https://88u.ir/signup
استاد منظورم کل مراحل ثبت نام هست. اگه میشه تا آخر چک کنید.
درود ظاهرا php هست اختصاصی نوشته شده
سلام استاد وقت بخیر
وقتی برای mainmenu هاور میزارم و بک گراند بهش میدم عرض navbar رو ۱۰۰ درصد نمیگیره و از بالا یکم فاصله میگیره. باید چکار کنم که کاملا عرض رو بگیره؟
سلام width:100% بهش بدید تمام صفحه میشه. طبق آموزش
سلام استاد میشه با این دوره و با کمک وردپرس یه سایتی مشابه ww.**u.ir طراحی کرد؟
درود به شما. وبسایت ارسالی شما بررسی شد.
بله می توانید چنین قالبی را بنویسید.
آیا خود این سایت با وردپرسه؟ از کجا میشه فهمید با چه سیستمی طراحی شده؟
سلام
بله با وردپرس میباشد میتوانید کد های قالب را چک بفرمایید.
ببخشید سوالم اینه که با این اموزش میشه یک قالب حرفه ای با پنل مدیریت حرفه ای مثال سایت خودتون طراحی کرد؟
درود بله با این آموزش میتونید سایتی مثل سایت خودمون طراحی کنید آموزش ساخت پنل مدیریت نیز توضیح داده شده
سلام استاد mainmenu را وقتی تعریف میکنم هر کار میکنم میره زیر navbarcenter . باید چکار کنم تا بیاد روی اون؟
سلام باید بهش z-index:999999 بدید توی سی اس اس
سلام استاد چطوری میشه ساعت و تاریخ رو در بالای سایت طراحی شده خودمون اضافه کنیم؟
درود توی سایت سرچ بفرمایید نمایش ساعت و تاریخ در وردپرس
ممنون دیدم. استاد میخوام بصورت دیجیتالی بالای سایتم نمایش داده بشه؟ امکانش هست؟
سلام
با استفاده از جاوا اسکریپت باید قرار بدهید، افزونه ساعت در سایت موجود است.
سلام دراین محصول ازامنیت کدنویسی بحث شده هست؟
سلام خیر نیازی نیست چون با استفاده از توابع وردپرس توضیح داده شده که کاملا امن هستند
با سلام دورهها صفر تا صد ورد پرس آنلاین برگزار میشه؟ و یا کلاسهای حضوری هم دارید؟
درود به شما. کلاس حضوری فعلا در دستور کار ما نیست و تمامی دوره ها به صورت پک آموزشی در اختیار شما قرار میگیرد.
سلام مرسی استاد بابت این آپدیت و این آموزش که برای من و دیگر دوستان گذاشتید. عالی بود مثل همیشه
درود خواهش میکنم لطف دارید
سلام استاد میخوام یه پیج ثبت نام در یک دوره آموزشی رو بسازم که زمانی که کاربر رو لینک پرداخت میزنه بره به درگاه پرداخت و پرداخت انجام بشه. و در اون پیج ایمیل و نام و شماره تماس از کاربر گرفته بشه. چطوری باید طراحی کنم؟ آیا فقط با html باید طراحی کنم؟ لطفا راهنماییم کنید. با تشکر
سلام خیر برای اینکار کافیست از یک افزونه فروشگاه ساز مثل ووکامرس استفاده کنید یا افزونه EDD . آموزش ووکامرس: https://mihanwp.com/woo/
با عرض سلام و احترام
بنده آموزش رو هنوز نگرفتم ، دموی سایت ساخته شده رو دیدم خب یه سایت خیلی قشنگ و حرفه ای بود ، اما هنوز نمی دانم آیا بعد از گزراندن این دوره توانایی ساخت هر سایت یا به ویژه تغییر در سایت یاقالبی را دارم یا خیر ….چون این چیزیست که به دنبال آن هستم ،والا باصرف هزینه و زمان کمتر میتوان قالبی تهیه و صاحب سایت زیبا شد… رشته تحصیلی من در دانشگاه کامپیوتر نبوده و تا چند وقت پیش اطلاعاتی از کد نویسی و برنامه نویسی نداشتم ، چند ماه هست که شروع کردم و انتظار ندارم با یک دوره آموزشی تبدیل به یک مهندس کامپیوتر خبره شوم، اما میخواستم ببینم این دوره چه اندازه به من کمک میکند تا تغییراتی که دلم میخواد و نیاز به کد نویسی دارد را در سایت خودم بدهم…
سوال بعدی اینکه اینطور که من در این صفحه دیدم گویا قصد دارید قسمت های تکمیلی به این آموزش اضافه کنید، اگر بعد از اینکه ما آموزش رو تهیه کردیم چنین شد، امکان این هست که مابا پرداخت هزینه آن قسمتها فقط آنها را به صورت جداگانه دریافت کنیم؟
با سپاس فراوان ، موفق و پیروز باشید.
سلام
در این دوره شما با بیس کد نویسی قالب وردپرس و طراحی قالب در فتوشاپ و تبدیل آن به کد آشنا میشوید که با ارتقا دادن دانش خود شما قادر خواهید بود که قالب های بسیار حرفه ای را طبق سلیقه خود بسازید.
قسمت هایی که اضافه میشود به آموزش را میتوانید به صورت رایگان در آپدیت هایی که برای این آموزش داده میشود دریافت کنید.
سلام آمورزشی که دادید خیلی خوب بود ولی کاش یک قالبی در آموزش استفاده میکردید که امروزه نیاز دارند.
مثل قالبی در آموزش مثل سایت خودتون یا سایتی شبیه به سایت خودتون استفاده میکردید که حرفه ای تر به نظر بیاد میدونم هر کس این دوره رو تماشا کنه به هدف که میخواد میتونه برسه ولی کمی باید بیشتر آموزش حرفه ای تر باشه.
آموزش های شما واقعا خوبه..
سلام متشکرم لطف دارید. در جلسات آپدیتی این دوره روش های مدرن تر و کامل تری توضیح داده میشه که میتونید حتی حرفه ای تر از سایت ما رو باهاشون طراحی کنید. مهم اینه شما پایه و اساس کار رو یاد بگیرید بعدش هر سایتی رو طبق سلیقه خودتون میتونید طراحی کنید.
سلام استاد میشه در تاپ منو برای هر کدام از منوها یه کلاس جدا تعریف کرد؟ بجای اینکه از دستور
استفاده کنیم فقط از a link استفاده کنیم؟
سلام بعد از ساخت منوها با inspect element مرورگر کدهای قالب رو نگاه کنید خود وردپرس به هر آیتم یه کلاس داده. می تونید برای اون کلاس ها توی استایل سی اس اس دلخواه بنویسید
مرسی. استاد میخوام وقتی لینک یا شیپ هاور میشه و رنگ متفاوت بهش میدم از سمت راست به سمت چپ هاور بشه. نه اینکه یه دفه هاور بشه.باید چکار کنم؟
سلام باید با خاصیت keyframe این کار رو انجام بدید. توی گوگل سرچ کنید در موردش بصورت کامل توضیحاتی داده شده. اگر متوجه نشدید بگید توی اپدیت بعدی آموزش توضیح بدیم خدمتتون
سلام استاد راستش متوجه نشدم اگه ممکنه تو آپدیت بعدی بگین. مرسی
چشم حتما این موضوع رو توضیح خواهیم داد.
استاد چطوری میشه داخل یه div یه div دیگه نوشت جوری که یه عمل متفاوت انجام بشه. مثلا div اول یه shape یا آیکون باشه وقتی روش میریم یه پنجره جدید باز بشه یا منوی جدید
سلام دقیقا مثل منوها عمل کنید div:hover > span{background:red}
استاد وقتی اینکارو میکنم درست میشه ولی باید دقیقا وقتی رو آیکون میرم اون منو باز بشه ولی اینجوری نیس وقتی با فاصله زیاد هم زیر اون آیکون موس رو میبرم باز اون منو یا اون باکس ظاهر میشه. opacity رو در حالت عادی صفر زدم و در حالت هاور ۱ زدم. مشکل چیه؟ چطوری باید درستش کنم؟
سلام شما باید visibility:hidden و یا display:none رو هم بهش بدید. با اینکار هست که هنگام قرار گرفتن روی آیکون فقط منو نمایش داده میشه
سلام استاد تو کد نویسی css میخوام height عکس رو در محصولات ووکامرس بیشتر کنم height همه عکسهای قالبم زیاد میشه . چکار کنم که فقط height عکس محصولاتم زیادتر بشه؟
درود.
از تنظیمات ووکامرس > پیکربندی > محصولات > نمایش، نگاره های محصول، می توانید سایز تصاویر محصول را تعیین کنید.
سلام پیشنیاز این دوره چی هست ؟؟
درود.
اطلاعات متوسط از CSS و HTML.
سلام
میبخشید ما قصد طراحی سایت موزیک رو داریم با یه پلیر موزیک و موزیک ویدئو اختصاصی از اونجایی که موزیک پلیر و ویدیو پلیر وردپرس قابلیت لینک دانلود و قابلیت لینک دانلود برای ویدیو ها رو به صورت چند کیفیتی نداره خواستم بدونم با این اموزش این امر هم میسر میشه . افزنه هایی هم که این قبلیت رو دارن مثل jw player متاسفانه نال شدشون که خوب نیست اصلشون هم قیمت بالایی داره با پرداخت به صورت ماهانه
ممنون میشم راهنمایی کنید
سلام خیر اما در صورت نیاز در آپدیت های بعدی در مورد موزیک پلیر ها و ویدیو پلیرها آموزش خواهیم داد
سلام خسته نباشید
راهی برای اتصال سایتی با برنامه نویسی html به درگاه پرداخت وجود داره؟
درود.
خیر، حتما باید از یک زبان برنامه نویسی مانند PHP، ASP و یا دیگر زبان های برنامه نویسی استفاده کنید.
با سلام و عرض ادب من میخواستم یک کتاب بهم معرفی کنید که آموزش کامل برنامه نویسی html وcss رو آموزش بده بصورت فارسی
سلام متاسفانه کتاب کاملی ندیدم چنین موردی رو باید با سرچ گوگل پیدا کنید.
سلام. چجوری میشه یه باکس طراحی کنیم مثلا به شکل دایره و بک گراندش رو یه فیلم بزاریم؟ آیا امکانش هست؟
بک گراند رو توی سی اس اس نمیشه فیلم گذاشت . برای قرار دادن فیلم در صفحه معمولا از شورت کد فیلم یا آیتم ویدیو روولوشن اسلایدر استفاده می شود
بله متوجه شدم ممنون استاد
شب خوشی داشته باشید
آیا با این آموزش میتوان فیلتر های مختلفی برای خصوصیات محصول ایجاد کرد.(مثلا بعد از انتخاب مبایل : فیلتر رنگ , سایز صفحه نمایش , برند شرکت ها , و غیره … ) اگر خیر , خواهشا راهنمایی بفرمایید با کدام آموزش میتوان به این فوت و فن دست یافت
سلام
این قسمت هایی که میفرمایید مربوط به ووکامرس هست که میتوانید از افزونه زیر استفاده کنید.
https://mihanwp.com/product-filter/
سلام. من در آموزش دیدم که از position های absolute و relative استفاده می شود. اما علتش رو متوجه نشدم.بخاطر چی از این پوزیشن ها استفاده میشه ؟
سلام . از absolute برای شناور کردن آیتم و از relative برای گرفتن ایتم absolute استفاده می شود. موقع استفاده در آموزش توضیح داده شده
آموزش طراحی قالب
شامل طراحی گرافیک انواع فرم ها میشود ؟
مثلا فرم ثبت فرم ورود فرم خرید
سلام
این کار نیاز به کد نویسی ندارد و میتوانید با افزونه یوزر پرو و فرم 7 انجام بدهید.
فرض کنید که از گرافیک یوزرپرو نخواسته باشم استفاده کنم .آِیا شکل گرافیکی فرم ها و گرافیک صفحات فرایند مراحل خرید یک کحصول را میتوانم با این آموزش درست کنم ؟ اگر خیر لطفا راهنمایی بفرمایید که با چه آموزشی میتوانم به این فوت و فن مسلط شوم
در گرافیک یوزرپرو تغییر بدهید خیر نمیتونید با این افزونه چون باید به کد نویسی مسلط باشید.