آموزش جامع و حرفه ای طراحی سایت با وردپرس – ۰ تا ۱۰۰ به صورت کامل
چرا طراحی سایت با وردپرس؟
اما چرا تأکید کاری ما در بستر آمادهای مانند وردپرس است، خب جواب ساده است. شما برای خرید خودرو و رانندگی کردن، به سراغ این کار نمیروید که تکتک وسایل را مثل موتور، چرخ، دنده را بخرید و مونتاژ کنید و بعد تازه بخاید رانندگی کنید، وردپرس هم به همین صورت عمل کرده، شمارا از دردسرهای اولیه ساخت سیستم مدیریت محتوا نجات داده، و فقط لازمه با یادگیری طراحی قالب HTML و CSS و علم کار با وردپرس در این جاده همواری که این CMS فراهم کرده، با کمک ما در این مسیر برانید و ویراژ دهید.
وردپرس بهگونهای عمل کرده که شمارا از دردسرهای اولیه ساخت سیستم مدیریت محتوا نجات داده. فقط با یادگیری طراحی قالب Html ، CSS و علم کار با وردپرس در این جاده همواری که این CMS فراهم کرده با یک خودرو از قبل آمادهشده برانید.
قالب یا همان ساختار کلی یک سایت از عوامل بسیار مهم در طراحی سایت است. انتخاب زبانهای برنامهنویسی مختلف مانند PHP، CSS، HTML و نظیر اینها و قالبهای آماده هرکدام معایب و مزایای زیادی دارند که بنا بر سلیقه و نظر طراح آن و هدفی که از طراحی سایت دنبال میکند میتواند متفاوت باشد که البته این موضوع در بهینهسازی سایت نیز بیتأثیر نخواهد بود.
چرا آموزش طراحی سایت به شما پیشنهاد میشود؟
امروزه برای هر کسبوکاری که ما داریم، به شدت احساس نیاز میشود که یک وبسایت داشته باشیم. برای داشتن یک وب سایت، وردپرس یکی از بهترین گزینههاست که با توجه به حجم مطالبی آموزشی، یادگیری آن بسیار آسان است. البته برای متفاوت بودن سایتمان و همچنین زیباسازی آن باید از قالبهای وردپرسی استفاده کرد. گروهی از قالبهای وردپرسی، قالبهای اختصاصی هستند که بهترین گزینهاند برای طراحی سایتهای سفارشی، یا برای زمانی که ما میخواهیم سایتی را از پایه طراحی کنیم. در این دوره ما به آموزش طراحی سایت از ۰ تا ۱۰۰ پرداخته ایم.
هنگامیکه بخواهید یک سایت تأثیرگذار و کاربردی طراحی کنید، به زبانهای برنامهنویسی زیادی احتیاج دارید که آموزش ببینید. این زبان برنامهنویسیها شامل HTML، CSS، JavaScript و… هستند که ایجاد، بهروزرسانی و یا تغییرات را امکانپذیر میکند. به هنگام استفاده از قالبهای آماده ایجاد تغییرات میتواند سخت یا غیرممکن باشد. به همین دلیل داشتن دانش کافی در خصوص مدیریت و ویرایش قالبهای باکیفیت اهمیت زیادی دارد تا وب سایتتان را در مسیری طراحی کنید که بهراحتی و با سرعت پشتیبانی و مدیریت شود. ما در این دوره آموزشی امکان ویرایش کردن قالبها را به شما آموزش میدهیم و بهراحتی میتوانید قالب خود را همانگونه که میخواهید تغییر و یا ویرایش کنید.
کاربردپذیری در طراحی سایت به معنای استفاده آسان از سایت و راهنمای آن است تا کاربران بتوانند با سایت تعامل برقرار کنند و بهراحتی بتوانند در صفحات سایت جستجو نمایند. طراحان حرفهای با طراحی و پیادهسازی ساختار و نقشه سایت مناسب، سایت را برای کاربران بهینهسازی میکنند. که یکی از مهمترین عوامل در طراحی سایت بهینهسازی آن است. یکی دیگر از عناصر مهم در طراحی وبسایت خوانایی سایت است. در طراحیها باید از رنگ و فونتهای مناسب در متن و پسزمینه استفاده شود تا متنها بهراحتی قابلمشاهده باشند.
روند دوره آموزش طراحی سایت
به طور کلی مفاهیم مورد نیاز برای طراحی وب سایت را توضیح میدهیم. از مفاهیم اولیه HTML و CSS و توضیحاتی در رابطه با فتوشاپ و طراحی سایت قبل از کد نویسی. شما میتوانید قالب HTML خود را طراحی کنید. Hyper Text Markup Language به معنی زبان نشانه گذاری فوق متن است، زبان استاندارد طراحی صفحات وب css یا Cascade Style Sheets زبانی است که توسط ان قادر خواهید بود تا استایل طراحی صفحات وب سایت خود را یک بار تعریف و به صفحات مورد نیازتان اعمال کنید. اضافه کردن فروشگاه به سایت هم یکی دیگر از سرفصلهای بحث بر انگیز این دوره است!
WooCommerce افزونهای رایگان برای طراحی فروشگاه اینترنتی در وردپرس هست.
از طراحی سایت در فتوشاپ تا برنامه نویسی تحت وب
شما در این دوره آموزش یک پروژه را از ۰ تا ۱۰۰ یعنی از یک سند خالی در فتوشاپ تا یک قالب در وردپرس، طبق مراحل طراحی قالب اختصاصی (مراحلی که در بالا آورده شد) انجام میدهید و در جریان تمام مراحل و حتی مشکلات احتمالی قرار میگیرید. و در آخر اضافه کنیم که اگر زمان و حوصلهی تمرین کردن را دارید و پیگیر این هستید که طراح وب شوید ما این آموزش را به شما پیشنهاد میکنیم.
چرا طراحی سایت را از فتوشاپ شروع میکنیم؟
فتوشاپ بهترین نرمافزار طراحی ۲ بعدی در دنیاست که توسط شرکت معروف adobe ساختهشده و قابلیتهای بارزتری نسبت به سایر نرمافزارهای طراحی دارد که به چند مورد از آن اشاره میکنیم: امکان جداسازی Header و Footer و سایر اجزا را جدا از هم نگه میدارد و اگر مشتری بخواهد تغییری ایجاد کند فقط در همان قسمت اعمال میشود. همچنین وجود ابزارهایی که به صرفهجویی در زمان کمک میکند. فرمتهای مختلف برای خروجی مانند gif،png،jpg،SVG و دیگر فرمتها، در فتوشاپ میتوانیم طرح را کامل ببینیم و بعد از تأیید نهایی کارفرما شروع به برنامهنویسی میکنیم که زمان کمتری نسبت به برنامهنویسی صرف میشود و اینکه فرصت مناسبی است برای اینکه از وضعیت طراحی خود قبل از برنامهنویسی باخبر میشویم و امکان تغییرات قبل از شروع برنامهنویسی وجود دارد.
ووکامرس چیست؟
افزونهای رایگان برای طراحی فروشگاه اینترنتی در وردپرس، که به دلیل پشتیبانی گسترده از افزونهها و ترکیب با وردپرس بسیاری از وبسایتها از آن برای اضافه کردن امکانات فروشگاهی استفاده میکنند.
امکانات پیشفرض ووکامرس تمامی نیازهای کلی برای ایجاد یک فروشگاه برای فروش فیزیکی یا فروش فایلها و محتواهای دیجیتالی را فراهم میکند. امکانات بسیاری نیز با استفاده از افزونههای رایگان و تجاری که برای این سیستم توسعه پیداکرده است، به آن افزوده میشوند.
طراحی فروشگاه اینترنتی با ووکامرس یکی مناسبترین گزینهها در بیشتر موارد به شمار میرود. به دلیل اینکه ووکامرس بر روی وردپرس پیادهسازی شده است، در اختیار داشتن امکانات ووکامرس و وردپرس در کنار هم، مزیتی غیرقابلچشمپوشی به شمار میرود. طراحی فروشگاه اینترنتی با ووکامرس، بهینه، کارآمد، مقرونبهصرفه و پشتیبانیکننده از تجارت و کسبوکار آنلاین شما بهحساب میآید.
ووکامرس افزونههای بسیار زیادی برای سفارشی کردن و افزودن امکانات جدید به فروشگاه شما در اختیارتان قرار میدهد. افزونههایی برای مدیریت مشتریان، راهاندازی بازاریابی در فروشگاه، آمار فروشگاه و …
چرا باید طراحی وب سایت را با برنامه نویسی انجام دهیم؟
برنامهنویسی وبسایت در طراحی وبسایت، مجموعه کدها و اسکریپتها و ماژولها و ابزاری که در طراحی وبسایت از آن توسط طراح سایت استفاده میشود، این کدها میتوانند کدهای آماده باشند یا توسط خود طراح نوشته شود، این کدها باید در قالبی خاص که قرارگیری این قالب نیز دارای کدهای خاص هست نوشته شوند تا ظاهر سایت ما ظاهری آراسته و شکیل باشد.
با استفاده از برنامهنویسی میتوانیم به طرح دلخواه خود و یا سفارشدهنده برسیم. تهیه یک طرح کلی از وبسایت و تطبیق ان با اصول علمی هدایت کاربر (UX)، طراحی قسمت گرافیکی سایت (UI) توسط طراح، تبدیل صفحات طراحیشده به HTML,CSS و تبدیل به قالب وردپرس مطابق نیاز مشتری را میتوان از مراحل کلی طراحی سایت با برنامهنویسی عنوان کرد.
تا بحال برنامهنویسی نکردهام! دوره آموزش طراحی سایت برای من مناسب است؟
جالب است بدانید اکثر افرادی که در این دوره شرکت کردهاند، حتی راه اندازی اولیه و کار با سایت را هم به خوبی یاد نداشتند و در انتهای دوره توانستند طراحی و راه اندازی سایت را به صورت کامل یاد بگیرند. هم برای خودشان و هم برای مشتریانشان! پس با اطمینان به شما می گوییم که شرکت در این دوره و انجام تمرینهای آن حتماً به شما کمک میکند تا به یک طراحی حرفهای تبدیل شوید و درامد شیرینی را هم از این مهارت کسب کنید.
کافی ست اصول و عملکردهای ایجاد یک سایت را بدانید تا بتوانید خود طراح سایت شوید. با شرکت در این دوره دیگر نیاز ندارید سایت خود را به یک طراح حرفهای بسپارید تا طراحی کند. خودتان میتوانید یک سایت حرفهای با تمام امکاناتی که یک سایت حرفهای میتواند داشته باشد را طراحی کنید.
آیا با استفاده از این آموزش می توانم سایتم را هر طور که دوست دارم طراحی کنم؟
بله. شما با دیدن این آموزش هر سایتی که دوست داشته باشید و به هر شکلی که مدنظرتان باشد، میتوانید طراحی کنید. اکثر ما زمانی که به اجرا و طراحی سایت فکر میکنیم اولین چیزی که ذهنمان را درگیر میکند شکل ظاهری و رنگ بندی و دیگر موارد آن است. اما اینها کافی نیست. ارائه خدمات و یا حتی محصولات، امنیت، بهینهسازی و… یکی از مهمترین مواردی است که در طراحی سایت باید به آن توجه داشت. ما در این دوره تمامی این موارد را به شما آموزش میدهیم. پس مطمئن باشید با شرکت در این دوره میتوانید یکی از طراحان حرفهای سایت شوید.
من میخواهم قالب آماده خودم را ویرایش کنم و تغییرات اساسی در آن ایجاد کنم. این آموزش به من کمک میکند؟
بله. بعد از دیدن این دوره و یادگیری HTML و CSS میتوانید ظاهر قالب آمادهتان را منحصربهفرد کنید! طوری که دیگر مشخص نشود قالبتان آماده است. CSS برای تعیین استایل صفحات وب، از جمله طراحی، طرح بندی تغییر رنگبندی ها و تغییرات در صفحهنمایش برای دستگاههای مختلف و اندازه صفحهنمایش استفاده میشود. در قالبهای وردپرس هم امکان این رادارید که شکل ظاهری سایت خود را با استفاده از 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 صفحه اصلی و کپی گرفتن برای استفاده در دیگر صفحات وبسایت
جلسه ۱۷ – ساخت صفحات داخلی و صفحه ۴۰۴
-
کپی گرفتن از فایلها برای ساخت صفحه جدید 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
-