نحوه افزودن فیلد جستجو به منوی ثانویه Divi

بدون فیلد جستجو ، ناوبری سایت شما دچار مشکل می شود. شما ممکن است قوی ترین تجربه مرور را در اینترنت داشته باشید ، اما اگر کاربران شما نتوانند دقیقاً همان چیزی را که بدنبال آن هستند جستجو کنند ، شما ریسک (و احتمالاً) کسب و کار خود را از دست خواهید داد. این آموزش شما را در افزودن یک کادر جستجو به منوی ثانویه Divi راهنمایی می کند تا در هر صورت ، کاربران شما همیشه با چند کلیک از هر چیزی که نیاز دارند فاصله داشته باشند.

مروری بر کادر جستجوی Divi

دفتر

موبایل

سرصفحه جهانی را بارگیری و یا اصلاح کنید

برای این مقاله ، ما از سرصفحه / پاورقی رایگان که همراه با بسته بندی طرح تحویل مواد غذایی ما ارائه می شود استفاده می کنیم. شما به سادگی می توانید آن را بارگیری کنید .Zip *: فرانسوی بایگانی و استخراج موارد لازم .جسون بر روی کامپیوتر شما

پس از آن به داشبورد وردپرس خود بروید و به آن بروید Divi - مولد تمبه از آنجا باید بر روی () کلیک کنید نماد پیکان بالا و پایین برای باز کردن گزینه های قابلیت حمل

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

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

یک فیلد جستجو را به نوار منوی ثانویه اضافه کنید

با استفاده از Divi Visual Builder ، باید چیزی شبیه به این را به عنوان Header Global مشاهده کنید.

اولین کاری که می خواهیم انجام دهیم این است که فضایی برای قسمت جستجو ایجاد کنیم. ما می خواهیم مطمئن شویم که قسمت جستجو به راحتی برای همه قابل دسترسی است. آخرین بازدید، بنابراین ما آن را به منوی ثانویه اضافه می کنیم (بالای صفحه اصلی / تماس خط)

برای شروع ، کادر جستجو را با استفاده از ماژول جستجوی Divi در ستون سوم ردیف اول

متن حفره دار برای فیلدهای جستجو مهم است ، بنابراین هنگامی که ماژول شما در جای خود قرار دارد ، به پارامترهای و خود را تنظیم کنید منطقه رزرو شده نوشتار به چیزی که به کاربر یادآوری می کند که باید به دنبال چه چیزی باشد. ما گذاشتیم موارد را پیدا کنید! به عنوان یک نگهدارنده مکان ، بنابراین کاربر می داند این همان چیزی است که می تواند جستجو کند ، زیرا ما از بسته طرح بندی تحویل مواد غذایی استفاده می کنیم.

کادر جستجو در ستون سوم خوب نیست. بنابراین ما می خواهیم وارد شویم ماژول تحقیق تنظیمات و رفتن به طرح زبان. پیداش کن تبدیل کننده گزینه ها ، سپس به ترجمه کردن تب (دوم). سپس می توانید ماژول جستجو را به جای خود بکشید و Divi تمام CSS و فاصله را برای آن انجام می دهد.

ما همچنین از٪ برای این مقدار استفاده می کنیم تا بدون در نظر گرفتن نمای رومیزی نسبی باقی بماند. استفاده كردن پیکسل ممکن است برخی از قطعنامه های مختلف را مخدوش کند.

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

حالت دهی به ماژول جستجوی Divi

در حالی که شما گزینه های زیادی برای یک ظاهر طراحی برای یک جعبه جستجو ندارید ، چند گزینه دارید. یعنی رنگ متن و خود فیلد ، چه زمانی که غیرفعال است و چه وقتی کاربر روی آن کلیک کرده است. (البته فاصله و اندازه و سایر گزینه های استاندارد طراحی Divi.)

برای یافتن گزینه های رنگ ، به قهرمان منو در طرح زبان. پس از بزرگ شدن ، این امکان را دارید که رنگ متن محل نگهدارنده ، رنگ زمینه زمینه و رنگ متن زمینه (متن وارد شده توسط کاربر ، یعنی گفتن) را تغییر دهید. علاوه بر این تمرکز کردن تغییرات زمانی رخ می دهد که کاربر به طور خاص با کادر جستجو تعامل داشته باشد.

وقتی این مورد به دلخواه شما طراحی شد ، روی دکمه ذخیره کلیک کنید.

تنظیمات نمایان بودن را بررسی کنید

برخی از طرح بندی رایگان و بسته های سربرگ ما دارای گزینه های مختلف نمایش برای دستگاه های رومیزی و تلفن همراه هستند. اگر حالت های کم نور / خاکستری در مولد بصری مشاهده می کنید ، نشان می دهد که این حالت در برخی از دستگاه ها غیرفعال است.

برای سرصفحه تحویل مواد غذایی ، دو ستون آخر در تلفن همراه غیرفعال است. ما می خواهیم وارد شویم تنظیمات خط و روی تنظیمات ستون هایی که می خواهید در تلفن همراه نمایش داده شود کلیک کنید. در این مورد ، سوم است.

سپس به پیشرفت زبان و حرکت به دید گزینه. در اینجا ، مطمئن شوید که همه گزینه های زیر بی اثر کردن در کنترل نشده برای ستون حاوی فیلد جستجوی شما روی دکمه ذخیره کلیک کنید (کنه سبز) ، و ماژول ها باید رنگی ظاهر شوند و دیگر تغییر رنگ داده نشوند.

هنگامی که مطمئن شدید همه چیز قابل مشاهده است ، آماده هستید که این مورد را آنلاین قرار دهید!

کار خود را ذخیره کنید

مطمئن شوید که بر روی دکمه ذخیره سبز در پایین سمت راست صفحه کلیک کنید.

اکنون آماده هستید که ژنراتور بصری را با استفاده از X در گوشه سمت راست بالا ببندید. در صفحه بعدی ، باید مطمئن شوید که Divi Theme Builder همه گزینه های شما را ذخیره کرده است. اگر می گوید تغییرات را ذخیره کنید، روی دکمه کلیک کنید. اگر می گوید همه تغییرات ذخیره شد، سپس قسمت جستجوی شما در منوی ثانویه Divi شما فعال است.

نتایج نهایی

تنها کاری که باید انجام دهید این است که کارهای خود را در سایت خود تحسین کنید!

دفتر

موبایل

نتیجه گیری با قسمت جستجوی Divi

جعبه های جستجو بخش اساسی یک تجربه کاربری خوب برای سایت شما هستند. اگر می خواهید بهترین خدمات ممکن را به شما ارائه دهید آخرین بازدید، اطمینان از قابل جستجو بودن محتوای شما باید یکی از اولویت های اصلی شما باشد. امیدوارم بتوانید از این روش سریع و آسان استفاده کنید و به زودی آن را در سایت Divi خود اعمال کنید!