قبل از اینکه بتوانید یک ماژول Toggle را به صفحه خود اضافه کنید، ابتدا باید به Divi Builder بروید. از وقتی که تم دیوی بر روی شما نصب شده است وب سایت، متوجه یک دکمه خواهید شد از Divi ساز استفاده کنید در هر زمان که صفحه جدیدی ایجاد کردید ، بالای ویرایشگر پست قرار بگیرید. برای فعال سازی Divi Builder و دسترسی به همه ماژول های Divi Builder بر روی این دکمه کلیک کنید. سپس بر روی دکمه کلیک کنید از Visual Builder استفاده کنید برای شروع ژنراتور در حالت تصویری. همچنین می توانید بر روی دکمه کلیک کنید ویژوال ساز را فعال کنید وقتی شما خود را مرور می کنید وب سایت در پیش زمینه اگر وارد داشبورد وردپرس خود شده اید.
پس از استفاده از Visual Builder ، می توانید روی دکمه خاکستری بعلاوه کلیک کنید تا ماژول جدیدی به صفحه خود اضافه کنید. ماژول های جدید فقط می توانند در داخل ردیف ها اضافه شوند. اگر صفحه جدیدی را شروع می کنید ، به یاد داشته باشید که ابتدا یک سطر به صفحه خود اضافه کنید.
ماژول ضامن را در لیست ماژول ها پیدا کرده و بر روی آن کلیک کنید تا به صفحه شما اضافه شود. لیست ماژول ها قابل جستجو است ، به این معنی که شما همچنین می توانید "ضامن" را تایپ کنید و سپس enter را فشار دهید تا به طور خودکار ماژول ضامن را پیدا کرده و اضافه کنید! پس از اضافه شدن ماژول ، لیست گزینه های ماژول به شما خوش آمد می گوید. این گزینه ها به سه گروه اصلی تقسیم می شوند: محتویات , تصور et پیشرفته .
مثال استفاده از حالت: صفحه سQالات متداول
صفحه FAQ یکی از بهترین مکانها برای تلفیق اطلاعات با استفاده از ماژول Toggle است. به کاربر اجازه می دهد بدون نیاز به خواندن متن متن ، سریع سوالی را که به دنبال آن است شناسایی کند. برای این مثال ، من به شما نشان می دهم که چگونه می توانید با استفاده از ماژول Toggle در عرض چند دقیقه یک بخش FAQ مدرن را برای صفحه FAQ خود طراحی کنید.
با استفاده از Visual Builder ، یک بخش جدید با یک ردیف عرض کامل (1 ستون) اضافه کنید. سپس یک ماژول Divider به ردیف اضافه کنید. در زیر زبانه محتوا از تنظیمات ماژول Divider ، گزینه "Show Divider" را انتخاب کنید.
در تب Design ، گزینه های زیر را وارد کنید:
رنگ: # 000000 (سیاه و سفید)
سبک تقسیم: جامد
موقعیت جداکننده:
تقسیم کننده عمودی مرکز وزن: 4 پیکسل
ارتفاع: 1
سپس یک ماژول ضامن در زیر تقسیم کننده ای که من در همان ردیف ایجاد کردم اضافه کنید. در تنظیمات ماژول ضامن ، موارد زیر را به روز کنید:
برگه محتوا
عنوان: [عنوان خود را وارد کنید]
محتوا: [محتوای خود را وارد کنید]
وضعیت: بسته
رنگ زمینه باز: #ffffff
بستن رنگ پس زمینه را تغییر دهید: #ffffff
رنگ پسزمینه: #ffffff
برگه طراحی
رنگ نماد: # 000000
رنگ Toggle متن را باز کنید: # 000000
رنگ Toggle بستن: # 000000
عنوان فونت: باز بدون، پررنگ
اندازه فونت: 24px
عنوان متن رنگ: # 000000
فونت بدن: باز بدون
اندازه فونت بدن: 18px
رنگ متن بدن: # 666666
ارتفاع خط بدن: 1.6em
از مرز استفاده کنید: بله
عرض مرز: 0px
بالشتک سفارشی: Top 2px ، پایین 2px
پس از ذخیره تنظیمات خود برای ماژول ضامن ، ماژول تقسیم کننده ای را که ایجاد کرده اید کپی کرده و در زیر ماژول ضامن قرار دهید. این کار با یک خط تقسیم بالا و پایین ، فرورفتگی را قاب می کند پس از آن ، ماژول فلیپ فلاپ خود را کپی کرده و پس از خط جدا کننده پایین قرار دهید. از آنجا که این یک ماژول Toggle تکراری است ، تمام پارامترهای طراحی به ماژول Toggle جدید منتقل شده اند و تمام کاری که شما باید انجام دهید این است که محتوای ماژول Toggle جدید را به روز کنید. سپس روند تکثیر ماژول های Division و Scale Modules را ادامه دهید و محتوای مقیاس خود را به روز کنید تا کل بخش سQالات متداول را کامل کنید.
همین. اکنون یک بخش پرسش و پاسخ مدرن دارید که از ماژول Toggle برای ادغام سوالات و پاسخ های خود استفاده می کنید.
اکنون که ماژول ضامن را در عمل مشاهده کردید ، در بخش های زیر به تمام تنظیمات آن بروید. ما در مورد جزئیات آنچه در هر برگه تنظیمات ماژول پیدا خواهید کرد ، توضیحات مفصلی را ارائه داده ایم.
پارامترهای محتوا ماژول Toggle
تب محتوای ماژول ضامن در گروه های پارامتر زیر تنظیم شده است (که این موارد نیز متناوب هستند!).
متن
اینجاست که می توانید عنوان را اضافه کرده و محتوای آن را ضامن کنید.
نافرجام
می توانید انتخاب کنید که آیا می خواهید دکمه شما به طور پیش فرض با این تنظیم باز یا بسته شود.
زمینه
در اینجا می توانید رنگ پس زمینه را هنگام باز کردن ضامن و رنگ پس زمینه را هنگام بسته بودن تغییر دهید. با تنظیم گزینه رنگ پس زمینه نیز می توانید به راحتی آنها را یکسان کنید. همچنین گزینه تنظیم یا بارگذاری تصویر پس زمینه وجود دارد.
برچسب مدیریت
به طور پیش فرض ، ماژول ضامن شما با برچسبی ظاهر می شود که روی مولد "Toggle" را بنویسید. برچسب مدیر به شما امکان تغییر این برچسب را برای شناسایی آسان می دهد.
پارامترهای طراحی ماژول راکر
پارامترهای طراحی ماژول ضامن در دکمه های کشویی زیر در زیر زبانه Design با هم گروه شده اند.
تصویر
اینجاست که می توانید رنگ نماد ضامن را تغییر دهید.
متن
در اینجا شما می توانید رنگ متن تغییر حالت بسته و بسته را تنظیم کنید.
متن عنوان
در اینجا می توانید قلم متن عنوان ، وزن ، اندازه ، رنگ ، فاصله ، ارتفاع خط و موارد دیگر را تنظیم کنید.
متن متن
در اینجا می توانید قلم ، وزن ، اندازه ، رنگ ، فاصله ، ارتفاع ردیف و موارد دیگر را تنظیم کنید.
مرزهای
در اینجا می توانید استفاده از حاشیه را انتخاب کنید. و اگر استفاده از حاشیه را انتخاب کردید ، می توانید رنگ آن را نیز انتخاب کنید ، عرض آن را تغییر دهید و سبک آن را انتخاب کنید.
فاصله
در قسمت فاصله ، می توانید padding سفارشی را به بالا ، راست ، پایین یا سمت چپ ضامن اضافه کنید. همچنین می توانید این مقادیر را برای دسک تاپ ، رایانه لوحی یا دستگاه های تلفن همراه تغییر دهید.
تنظیمات پیشرفته ماژول ضامن
در تب Advanced ماژول ضامن خود ، می توانید یک کلاس ID و css بی نظیر اضافه کنید. همچنین می توانید css های سفارشی را به ماژول کشویی فیلم کشویی css سفارشی به گزینه های مختلف css از پیش تعریف شده (و از پیش انتخاب شده) اضافه کنید. سرانجام ، در لیست کشویی قابلیت مشاهده ، می توانید قابلیت مشاهده ماژول خود را در تلفن ها ، تبلت ها و دسک تاپ ها تنظیم کنید.
این همه این آموزش است ، امیدوارم به شما امکان استفاده بهتر از ماژول Divi Toggle را بدهد.
[vc_row center_row=”yes”][vc_column width=”1/2″][vcex_button target=”blank” layout=”expanded” align=”center” font_family=”Raleway” font_weight=”700″ style=”flat” custom_background=”#18b69d” custom_hover_background=”#118d7a” custom_color=”#ffffff” custom_hover_color=”#ffffff” icon_right=”fa fa-download”]دانلود تم DIVI [/vcex_button][/vc_colum][/vc_colum] /1″][vcex_button url=”https://www.elegantthemes.com/affiliates/idevaffiliate.php?id=2&url=23065&tid40632=tutorials” target=”blank” layout=”expanded” align=”family” =_font ”Raleway” font_weight=”1″ style=”flat” custom_background=”#c700e” custom_hover_background=”#4226d8f” custom_color=”#ffffff” custom_hover_color=”#ffffff” icon_right=”fa fa-NAD”]DOW قالب DIVI[/vcex_button][/vc_column][/vc_row]
سایر آموزشهای دوگانه
- سایت های رستوران 5 که از موضوع دووی استفاده می کنند
- چگونه برای اضافه کردن متن در محصول Divi WooCommerce
- چگونه می توان رنگ منو را بین صفحات Divi تغییر داد
- نحوه شخصی سازی شبکه های یک وبلاگ با Divi
- نحوه استفاده از ویرایشگر نقش دووی در وردپرس
- نحوه ایجاد یک نوار لغزنده تمام صفحه Divi
- چگونگی تغییر رنگ منوها بین صفحات Divi
- ویژگی هایی که احتمالاً در مورد Divi نمی دانید
- نحوه استفاده از Divi Builder در وردپرس
- نحوه استفاده از ماژول پیمایش ویدئو Divi
- نحوه استفاده از ماژول Flip Builder Divi
- نحوه اضافه کردن ماژول توصیفی در Divi Builder
- نحوه استفاده از ماژول متن دووی
- نحوه ایجاد کشویی در دیوی
- نحوه ویرایش نقش کاربر Divi
- نحوه استفاده از ماوی رسانه اجتماعی Divi
- نحوه استفاده از ماژول فروشگاه با موضوع WordPress Divi
- نحوه استفاده از ماوی نوار کناری Divi
- نحوه استفاده از ماژول جدول قیمت دووی
- چگونه از عنوان ماژول نشریات دووی استفاده کنیم
- نحوه اضافه کردن ماژول ویدیویی از دیوی
- نحوه استفاده از ماژول ناوبری مقاله
- چگونه از ماوی جستجوی Divi استفاده کنیم
- چگونه از ماژول کیف پول Divi استفاده کنیم
- نحوه استفاده از ماژول شخص در Divi Builder
- نحوه استفاده از ماژول کیف پول با فیلتر Divi
- نحوه استفاده از ماژول کشویی عرض کامل
- نحوه استفاده از ماژول Image Divid Builder
- نحوه استفاده از ماژول ناوبری تمام عرض Divi Builder
- نحوه استفاده از ماژول گالری تصاویر
- نحوه استفاده از ماوی کارت Width Divi Builder
- نحوه استفاده از ماژول Portfolio Full Width Divi
- نحوه استفاده از ماژول هدر تمام عیار Divi
- چگونه از ماوی شمارنده Divi استفاده کنیم
- نحوه استفاده از نوار لغزنده مقالات در Divi Builder
- نحوه استفاده از ماژول Divi ایمیل Optin