فیلتر رنگ و سایز در صفحه فروشگاه
دوستان سلام وقتتون بخیر. یه سوال دارم در مورد صفحه فروشگاه.
من دارم یه فروشگاه فول استک با نکست جی اس طراحی میکنم.
سوالم در مورد خود نکست نیست. در مورد نحوه انجام سرچ هست.
ببینین من میخوام یه سری فیچر توی سایت داشته باشم. مثلا رنگ( آبی، قرمز، زرد و... )، سایز( sm, md, lg,xl, 2xl ) ، مثلا برند و...
میخوام که وقتی یکی مثلا کلاه رو سرچ میکنه توی سایت، لیست کل کلاه ها رو نمایش بده. علاوه بر اون لیست کل فیچرهایی که برای کلاه هم هست رو در کنارش به صورت فیلتر نمایش بده.
حالا مشکل چیه؟
مشکل اینه که مثلا من 20 تا رنگ مختلف توی سایت دارم ولی رنگ کلاه ها فقط 5 تا هستن. چجوری باید این فیلتر رو انجام بدم؟
یا مثلا کلاه ها، فیچر رنگ رو دارن ولی فیچر سایز رو ندارن - کفش ها فیچر رنگ رو ندارن، فیچر اندازه رو دارن.
این سیستم رو چطوری میتونم مدیریت بکنم که وقتی یکی عبارت کفش رو جستجو میکنه، اصلا فیلتر رنگ نیاد.
وقتی کلاه رو جستجو میکنه رنگ رو بیاره و اندازه رو نیاره.
راهکاری که به نظرم میرسه اینه که توی بک اند، اول لیست محصولات رو بگیرم. سپس روی محصولات یه for بزنم و کل فیچر ها رو بریزم توی یه feature_list. مثلا colors_list و sizes_list و...
سپس اینا رو هم بفرستم به فرانت اند.
ولی خوب این فرایند قطعا نیم ساعت طول میکشه.
یه بار باید خود پروداکت ها رو پیدا بکنه. سپس یه بار دیگه روش for بزنه و بررسیش رو انجام بده.
راه بهتری نیست؟
حتی اگه یه ایده و نظر کوچیک هم دارین، ممنون میشم بگین. شاید کمکم کنه.
ممنون
گزینش سوالات
گفت و گو های مرتبط
دسته بندی سوالات
تگ‌های محبوب
روش‌هایی که بهت گفتم هر دو این کار رو انجام میدن دقیقا. وقتی توی سرچ باکس نوشته میشه کلاهِ آدیداس، پس‌زمینه کوئری زده میشه که ببینیم این محصول، توی چه دسته بندی‌ای هستش؟ که مشخصه، دسته‌بندی کلاه.
خب الان میشه اینطوری پیاده‌سازی کرد که به هر دسته بندی، یک سری فیچر بدیم. مثلا دسته‌بندی کلاه، سایز لارج و ایکس‌لارج داره، رنگ آبی و قرمز. همینطور دسته‌بندی کفش سایز ۳۹ و ۴۰ داره و رنگ آبی و زرد.
حالا از اول سناریو رو بررسی کنیم. طرف مینویسه کلاه آدیداس. پس‌زمینه دسته‌بندی محصول گرفته میشه و میرسیم به دسته‌بندی کلاه. حالا چک میکنیم ببینیم این دسته بندی، چه فیچرهایی داره؟ آهان اکی، سایز و رنگ. حالا سایز و رنگ تحت عنوان دوتا ul توی فیلترت نمایش داده میشه.
بعد چک میشه که حالا توی فیچرِ سایزِ دسته‌بندی کلاه، چه رنگهایی هست؟؟؟؟ مثلا میبینه این دسته بندی فقط ۲ تا رنگ داره که دوتاشو توی یه حلقه، با چک باکس نشون میده. سایز هم به همین منوال...
خب الان بعد از سرچ کاربر، ما یه سایدبار داریم که دوتا فیلترِ رنگ و سایز داره توش نمایش داده میشه. وقتی کلیک کنه روی رنگ قرمز، یه آیتم به کوئری اضاف میشه. یا مثلا اگه توی همون اوله کار، همه‌ی نتایجِ کوئری گذاشته شده باشه توی یه آرایه، با کلیک روی مثلا رنگ قرمز، چک میشه ببینیم توی این دسته‌بندی، آیا محصولی با این رنگ ثبت شده؟ وقتی کلیک بشه روی سایز ایکس لارج، مجدد چک میشه که آیا محصولی توی این دسته بندی که رنگش قرمز باشه و سایزشم فلان باشه هست؟
چی شد؟
- به دسته بندی، موقعِ ایجادش فیچر اضافه میکنیم.. رنگ، وزن، سایز، یا ...
- بعد مشخص میکنیم مثلا توی فیچرِ رنگ، چه رنگهایی میتونه باشه؟ قرمز زرد آبی و ...
- موقع ایجاد محصول اساین که بشه به دسته بندی، فیچرها به همراه فیچر آیتم‌هاش نشون داده میشن
- اونجا انتخاب میکنید که این محصول، کدوم یکی از اینا رو داره
- بعد از سرچ کاربر و پیدا شدنِ دسته‌بندی، فیچرهای دسته بندی هم پیدا میشه
- در نتیجه فیلترهای سایدبار، تحت تاثیر فیچرهای پیدا شده فیلتر میشه.
اینا برای روش دومیه بودن. برای روش اولی هم میتونی یه همچین کاراییو انجام بدی. با روش اول، یه جدول واسط میاد قرارمیگیره. اما توی این روش دیگه خیر
سلام رفیق.
فیچرهای مختلف توی سایت‌های فروشگاهی یه چیز عادیه، بنابراین پیچیده نیستش زیاد. منتهی من یه چیز رو گمونم درست متوجه نشدم؛ شما میخای وقتی یکی سرچ میکنه کفش، فیلترهای توی سایدبارتم تغییر کنه؟
در کل روندهای مختلفی هست، میتونی یه جدول داشته باشی توی دیتابیس ب نام دسته بندی محصولات؛ ی جدول برای محصولات ، ی جدولم برا فیچرها و یه جدول واسط برای فیچرها و محصولات. دیگه هر فیچر با هر تایپی رو میتونی متصل کنی ب هر پروداکتی. مِنی تو مِنی میشه دیگ. توی خود جدول پروداکت هم تعدادشو میزنی ک از کلاه آبی چنتا هست مثلا.
اگر میخای با سرچِ کلمه‌ی کفش، آیتم‌های فیلتر سایدبار هم تغییر کنه، میتونی به جدول محصولاتت یا به دسته بندی‌هات یه کالمن تگ یا همچین چیزی اضافه کنی، که وقتی نوشته میش کفش، سرچ روی اونا اتفاق بیافته و در نتیجه با ترکیب شرط، و نتیجه‌ی بازگشتی از دیتابیس میتونی سایدبارت رو تنظیم کنی.
یه سبک دیگه هم هست، که بجای هندلینگ توی دیتابیس، مستقیما با کد میشه هندلش کرد.
ی تیبل ساده ایجاد میکنی ب نام فیچر. دیتاهای ورودیش میشن مثلا رنگ، سایز، وزن،
ی تیبل هم میزنی برای فیچر آیتم، بهشون متا آیتم هم میگن.
این مدلی، یه یو‌آی آماده میکنیم توی پنل مدیریت برای فیچرها. مدیر سایت میره اونجا یه فیچر با نام دلخاه می‌سازه، مثلا رنگ. وقتی ساخته شد، حالا میتونه یه مودال باز بشه براش و بگه خب آیتم‌هاشو هم وارد کن. میشه قرمز، زرد، آبی. حالا میتونی یه دکمه بزاری ک نشخص کنه این فیچر، متصل شه به کدوم دسته بندی؟ کفش؟ یا کلاه؟ یا هردو..
دیگه پروداکتی که تحت این دسته بندی ایجاد بشه، همچین فیچری رو به خودش میتونه بگیره.
توی صفحه‌ی محصول، حینِ ایجاد محصولِ مثلا کفشِ آدیداس، میتونی یه تب اضافه کنی ک مشخص کنه این کفش، الان کدوم یکی از فیچرهایی که توی دسته بندی بهش متصل شده رو داره!! اونجا لیست تمامی فیچر‌آیتم‌ها قرار داده میشه. همون سایز‌های مختلف و رنگهایی که وارد شده بوده. الان میتونی با چک‌باکس یا سلکت۲، مشخص کنی که این محصول، مثلا کدوم یکی ازین سایز‌ها رو داره، کدوم رنگش هست¡!!
حالا مثلا به یک کفش سه سایز مختلف با دو رنگ متفاوت دادی. ک نتیجش باید مشخص بشه. مثلا ادیداسِ قرمزِ ۴۲، آدیداس قرمز ۴۱، نایک آبی ۴۱ و ....
برای اینکه اینارو دراری، باید فیچر‌آیتم‌هایی که انتخاب شده، توی بک‌اند با هم ضرب دکارتی بشن توسط یه کالبک فانکشن، یا با چنتا فور‌ایچ تودرتو...
این دومیه برای سایتای گنده‌تر بهتره، یه ذره هم باید تونست درکش کرد. اولیه ساده تر باشه شاید.
حالا هرجا رو دیدی چیزی گفتم ک منظور شما نبوده، بگو درستش میکنیم با هم...
تشکر بابت پاسختون @mjokarr . کمک کننده بود.
آره نکته همین داینامیک بودن فیلترها هست.
این سایت رو لطفا ببینین. یه سایت ماهیگیریه.
https://oskarfishing.com/products/?q=osp
https://oskarfishing.com/products/?q=%DA%86%D9%88%D8%A8
توی سرچ اول اسم یه مدل لوازم ماهیگیری رو سرچ کردم ( OSP ) . توی سرچ دوم اسم یه وسیله ماهیگیری رو ( چوب ) .
توی جفتشون چوب ماهیگیری رو میاره ولی اسم برندها، تعداد رنگ ها و همچنین تعداد سایز ها متفاوته.
هدف من ایجاد یه همچین چیزیه.
در واقع سیستمش جوریه که انگار یه بار خوب کی ورد رو بررسی میکنه و مثلا 200 تا محصول رو لود میکنه.
در مرحله بعد یه بار دیگه بررسی میکنه که محصولاتی که لود شدن، چه برندها، رنگ ها و اندازه هایی دارن. اونا رو جمع میکنه و به صورت فیلتر نمایش میده.
در مورد این نظری دارین؟
روش‌هایی که بهت گفتم هر دو این کار رو انجام میدن دقیقا. وقتی توی سرچ باکس نوشته میشه کلاهِ آدیداس، پس‌زمینه کوئری زده میشه که ببینیم این محصول، توی چه دسته بندی‌ای هستش؟ که مشخصه، دسته‌بندی کلاه.
خب الان میشه اینطوری پیاده‌سازی کرد که به هر دسته بندی، یک سری فیچر بدیم. مثلا دسته‌بندی کلاه، سایز لارج و ایکس‌لارج داره، رنگ آبی و قرمز. همینطور دسته‌بندی کفش سایز ۳۹ و ۴۰ داره و رنگ آبی و زرد.
حالا از اول سناریو رو بررسی کنیم. طرف مینویسه کلاه آدیداس. پس‌زمینه دسته‌بندی محصول گرفته میشه و میرسیم به دسته‌بندی کلاه. حالا چک میکنیم ببینیم این دسته بندی، چه فیچرهایی داره؟ آهان اکی، سایز و رنگ. حالا سایز و رنگ تحت عنوان دوتا ul توی فیلترت نمایش داده میشه.
بعد چک میشه که حالا توی فیچرِ سایزِ دسته‌بندی کلاه، چه رنگهایی هست؟؟؟؟ مثلا میبینه این دسته بندی فقط ۲ تا رنگ داره که دوتاشو توی یه حلقه، با چک باکس نشون میده. سایز هم به همین منوال...
خب الان بعد از سرچ کاربر، ما یه سایدبار داریم که دوتا فیلترِ رنگ و سایز داره توش نمایش داده میشه. وقتی کلیک کنه روی رنگ قرمز، یه آیتم به کوئری اضاف میشه. یا مثلا اگه توی همون اوله کار، همه‌ی نتایجِ کوئری گذاشته شده باشه توی یه آرایه، با کلیک روی مثلا رنگ قرمز، چک میشه ببینیم توی این دسته‌بندی، آیا محصولی با این رنگ ثبت شده؟ وقتی کلیک بشه روی سایز ایکس لارج، مجدد چک میشه که آیا محصولی توی این دسته بندی که رنگش قرمز باشه و سایزشم فلان باشه هست؟
چی شد؟
- به دسته بندی، موقعِ ایجادش فیچر اضافه میکنیم.. رنگ، وزن، سایز، یا ...
- بعد مشخص میکنیم مثلا توی فیچرِ رنگ، چه رنگهایی میتونه باشه؟ قرمز زرد آبی و ...
- موقع ایجاد محصول اساین که بشه به دسته بندی، فیچرها به همراه فیچر آیتم‌هاش نشون داده میشن
- اونجا انتخاب میکنید که این محصول، کدوم یکی از اینا رو داره
- بعد از سرچ کاربر و پیدا شدنِ دسته‌بندی، فیچرهای دسته بندی هم پیدا میشه
- در نتیجه فیلترهای سایدبار، تحت تاثیر فیچرهای پیدا شده فیلتر میشه.
اینا برای روش دومیه بودن. برای روش اولی هم میتونی یه همچین کاراییو انجام بدی. با روش اول، یه جدول واسط میاد قرارمیگیره. اما توی این روش دیگه خیر