آموزش توسعه تم Shopify پیشرفته: Liquid + Vue.js (نسخه 3.0)
دانلود Advanced Shopify Theme Development: Liquid + Vue.js (v3.0)
موضوعات پیشرفته عبارتند از:
- نحوه ساخت یک تم Shopify کاملاً کاربردی از ابتدا
- تکنیک های مایع پیشرفته
- Shopify Ajax API
- یک Mini-Cart قدرتمند با استفاده از Vue.js ایجاد کنید
- یک نوع سفارشی و انتخابگر گزینه برای محصولات ایجاد کنید
- یک تم Shopify پیشرفته از آینده بسازید (Vue.js 3.0)
- نحوه پیاده سازی Vue.js با استفاده از CDN در تم های Shopify
دوره برای چه کسانی است؟
هر کسی که به دنبال ایجاد تم های تجارت الکترونیک برای خود، مشتریان یا به دست آوردن یک شغل مورد تقاضا با استفاده از پلت فرم Shopify است. اکثر تم های Shopify در گذشته گیر کرده اند. استفاده از جی کوئری برای محتوای پویا مربوط به گذشته است. این دوره jQuery را از پنجره بیرون می اندازد و Vue.js را جایگزین آن می کند. منعطف ترین و قدرتمندترین چارچوب جاوا اسکریپت که به ما امکان می دهد از آینده یک موضوع Shopify ایجاد کنیم.
موضوع ساخته شده در این دوره از بهترین شیوه ها برای تم های Shopify استفاده می کند اما در جایی که بیشتر به آن نیاز است یک قطعه نوآورانه اضافه می کند. روشی که ما این طرح زمینه را ایجاد خواهیم کرد، بهترین تجربه مشتری را با کمترین تعمیر و نگهداری امکان پذیر می کند.
چرا Vue.js؟
Vue.js تنها چارچوبی است که امکان انعطاف پذیری مورد نیاز هنگام ساخت تم های Shopify را فراهم می کند. ما می‌توانیم Vue.js را در قسمت‌هایی از موضوع که بیشتر به آن نیاز داریم تزریق کنیم و آن را از جایی که به آن نیاز نداریم دور نگه داریم. Vue.js نیز به راحتی قابل برداشت و شروع استفاده است. نیازی به تنظیمات گسترده و وابستگی نیست. بسیار سبک وزن است و به ما اجازه می دهد تا به راحتی حالت را در قالب خود مدیریت کنیم.
مقدمه Introduction
-
چیزی که خواهیم ساخت What we will be building
-
الهام بخش Inspiration
آماده سازی Preparation
-
حساب و فروشگاه آنلاین Shopify Partners Shopify Partners Account and Online Store
-
اتصال کیت تم Theme Kit Connection
-
چرا Vue.js؟ Why Vue.js?
مبانی تم Theme Basics
-
افزودن محصولات و مجموعه ها Adding Products and Collections
-
صفحه مجموعه Collection Page
-
طرح واره بخش صفحه اصلی Homepage Section Schema
-
صفحه محصول Product Page
صفحه محصول در عمق Product Page in Depth
-
افزودن Vue.js به صفحه محصول Adding Vue.js to Product Page
-
افزودن به سبد خرید با Vue.js Adding to Cart with Vue.js
-
انتخاب کشویی سفارشی Custom Select Dropdown
SCSS برای Shopify SCSS for Shopify
-
اصول طراحی صفحه محصول Product Page Styling Basics
-
هدر یک ظاهر طراحی شده و از پیش تنظیم شده Styling Header and presets
-
نسخه Swiper.js Swiper.js Version
-
یک ظاهر طراحی صفحه مجموعه Collection Page Styling
-
یک ظاهر طراحی کارت محصول Product Card Styling
-
یک ظاهر طراحی صفحه محصول Product Page Styling
مینی سبد خرید Mini-Cart
-
راه اندازی مینی سبد خرید Mini-Cart Setup
-
سبک سبد خرید مینی Mini-Cart Styling
-
کارکرد نهایی مینی سبد خرید Mini-Cart Final Functionality
بخش های صفحه اصلی Home Page Sections
-
بخش تصویر قهرمان و متن غنی Hero Image and Rich Text Sections
-
تصویر با بخش متن Image with Text Section
-
بخش فهرست لوگو (بلوک های بخش) Logo List Section (Section Blocks)
استفاده از ناوبری (منوها) Using Navigations (Menus)
-
کشوی منو Menu Drawer
-
منو و استایل پاورقی Footer Menu and Styling
پایان لمس Finishing Touches
-
تعاملات منو Menu Interactions
-
پاسخگویی موبایل Mobile Responsiveness
-
مراحل بعدی Next Steps
**پاداش** چگونه مشتریان فریلنسری پیدا کنیم **BONUS** How to find freelance clients
-
مقدمه Introduction
-
تابلوهای شغلی سفارشی Custom Job Boards
-
شبکه های اجتماعی Social Networks
-
Slack Groups Slack Groups
https://donyad.com/d/c58368
Working With Shopify
همه چیز در مورد کار با Shopify
نمایش نظرات