آیا می خواهید یک پاورقی سفارشی در DIVI ایجاد کنید؟
یکی از مهم‌ترین بخش‌های تم‌ساز Divi، امکان افزودن پاورقی جهانی به صورت پویا به صفحات وب و پست‌های شما است.
هنگامی که یک پاورقی طراحی کردید، می توانید آن را به طور خودکار به هر نوع صفحه یا پستی که می خواهید با استفاده از تم ساز Divi اضافه کنید.
در این آموزش، ما شما را به صورت گام به گام از طریق فرآیند ایجاد و افزودن یک فوتر سراسری به شما راهنمایی می کنیم. وب سایت.
بررسی
قبل از اینکه وارد آموزش شویم، بیایید نگاهی به پاورقی که قرار است طراحی کنیم بیاندازیم.
دفتر
به Divi Theme Builder بروید و یک پاورقی جهانی اضافه کنید
- به Divi > Theme Builder بروید و روی "کلیک کنید" یک پاورقی جهانی اضافه کنید«
- برای انتخاب " یک پاورقی جهانی بسازید«
بخش شماره 1 را سفارشی کنید
رنگ پس زمینه
بخشی را که می توانید در صفحه پیدا کنید باز کنید و رنگ پس زمینه بخش را تغییر دهید.
- پس زمینه: #000000
فاصله
به تب تغییر دهید سبک و سپس تنظیمات فاصله را برای بخش تغییر دهید.
- حاشیه (بالا، چپ و راست): 6vw
- حاشیه داخلی (چپ و راست): 30 پیکسل
مرز
سپس یک حاشیه بالا در سمت چپ و راست اضافه کنید.
- مستطیل گرد بالا سمت چپ: 20 پیکسل
- مستطیل گرد بالا سمت راست: 20 پیکسل
جعبه سایه
همچنین در تنظیمات بخش یک سایه باکس قرار دهید.
- قدرت تاری سایه کمان: 135 پیکسل
- رنگ قلم زیرنویس: rgba(0,0,0,0.18)
یک خط جدید به بخش اضافه کنید
ساختار ستون
با افزودن یک ردیف به بخش خود با استفاده از ساختار ستون زیر ادامه دهید:
یک ماژول Text به ستون اضافه کنید
عنوانی به اندازه H2 اضافه کنید (سرفصل 2)
درج یک ماژول متنی با محتویات سایز H2
تنظیمات متن H2
به برگه تغییر دهید سبک ماژول و پارامترهای متن H2 را بر این اساس تغییر دهید:
- قلم سربرگ: Poppins
- هدر نور کمرنگ: نیمه پررنگ
- تراز متن: در مرکز
- رنگ متن سرصفحه: #ffffff
- اندازه متن سرصفحه: 31 پیکسل (رومیزی)، 24 پیکسل (تبلت)، 18 پیکسل (تلفن)
- ارتفاع خط سربرگ: 1,6 em
اندازه
همچنین حداکثر عرض را به ماژول اضافه کنید.
- حداکثر عرض: 700 پیکسل
اضافه کردن ماژول دکمه به ستون
اضافه کردن متن به دکمه
یک ماژول Button درست زیر ماژول Text در ستون خود وارد کنید و متن دلخواه خود را وارد کنید.
هم ترازی
به برگه تغییر دهید سبک از ماژول و تراز دکمه را به مرکز تغییر دهید.
- تراز دکمه ها: در مرکز
تنظیمات دکمه
با سفارشی کردن دکمه ادامه دهید.
- استفاده از سبک های سفارشی برای دکمه: بله
- اندازه متن دکمه: 12 پیکسل
- رنگ متن دکمه: #000000
- دکمه پس زمینه: #FFFFFF
- دکمه عرض حاشیه: 0 پیکسل
همچنین بخوانید: نحوه نمایش یک صفحه وبلاگ به عنوان چرخ فلک در DIVI
- شعاع حاشیه دکمه: 100 پیکسل
- فاصله حروف دکمه ها: 1 پیکسل
- فونت دکمه: Poppins
- دکمه نور نرم: نیمه پررنگ
- دکمه سبک کپی: TT
فاصله
همچنین مقادیر حاشیه داخلی سفارشی را اضافه کنید.
- حاشیه داخلی (بالا و پایین): 14 پیکسل
- حاشیه داخلی: چپ (40 پیکسل)؛ راست (58 پیکسل)
بخش #2
بخش دوم «عادی» را زیر قسمت قبلی اضافه کنید.
رنگ پس زمینه
تغییر رنگ پس زمینه
- زمینه: #ffffff
فاصله
سپس تمام حاشیه های داخلی (بالا و پایین) را حذف کنید.
- حاشیه داخلی (بالا و پایین): 0 پیکسل
مرز
همچنین یک شعاع حاشیه به بخش اضافه کنید.
- مستطیل گرد (بالا سمت چپ): 20 پیکسل
- مستطیل گرد (بالا سمت راست): 20 پیکسل
جعبه سایه
و تنظیمات بخش را با افزودن یک سایه باکس ظریف تکمیل کنید.
- قدرت تاری سایه جعبه: 135 پیکسل
- رنگ فونت زیرنویس: rgba(0,0,0,0.18)
یک خط جدید به بخش اضافه کنید
ساختار ستون
پس از تکمیل تنظیمات بخش، یک ردیف جدید با استفاده از ساختار ستون زیر اضافه کنید:
اندازه
بدون اضافه کردن هیچ ماژول، تنظیمات ردیف را باز کنید و آنها را به صورت زیر تغییر دهید:
- از عرض ناودان سفارشی استفاده کنید: بله
- فاصله ستون ها: 1
- هماهنگ کردن ارتفاع ستون: بله
- حداکثر عرض: 100
- حداکثر عرض: 100
فاصله
سپس حاشیه های داخلی پیش فرض (بالا و پایین) را از خط حذف کنید.
- حاشیه داخلی (بالا و پایین): 0 پیکسل
فاصله ستون ها
با باز کردن تنظیمات ستون برای افزودن مقادیر padding سفارشی ادامه دهید.
- حاشیه داخلی (بالا و پایین): 100 پیکسل (رومیزی)، 50 پیکسل (تبلت و تلفن)
- حاشیه داخلی (چپ و راست): 100 پیکسل (رومیزی)، 50 پیکسل (تبلت و تلفن)
ماژول متن شماره 1 را به ستون اضافه کنید
اضافه کردن محتوا
اکنون می توانیم ماژول ها را به آن اضافه کنیم. یک ماژول Text به ستون اضافه کنید و آن را وارد کنید محتویات د votre choix.
تنظیمات متن
به برگه تغییر دهید سبک از ماژول و بر این اساس پارامترهای متن را تغییر دهید:
- فونت متن: Poppins
- وزن قلم متن: پررنگ
- رنگ متن: #000000
- اندازه متن: 17 پیکسل
- تراز متن: در مرکز
فاصله
سپس حاشیه های سفارشی (بالا و پایین) را اضافه کنید.
- حاشیه بالا: 10 پیکسل
- حاشیه پایین: 30 پیکسل
یک ماژول Separator به ستون اضافه کنید
درست در زیر ماژول Text، یک ماژول Separator اضافه کنید.
دید
مطمئن شوید که گزینه " نمایش جداکننده فعال است
- نمایش جداکننده: بله
خط
رنگ خط را به مشکی تغییر دهید.
- رنگ برچسب: #000000
اندازه
تنظیمات اندازه اسپلیتر را نیز تغییر دهید.
- حداکثر عرض: 15
- تراز متن: مرکز
ماژول متن شماره 2 را به ستون اضافه کنید
اضافه کردن محتوا
با اضافه کردن یک ماژول Text دیگر به ستون و همچنین a محتویات د votre choix.
اضافه کردن یک لینک
پیوندی به صفحه ای که می خواهید این ماژول به آن ارجاع دهد وارد کنید.
تنظیمات متن
سپس به تب تغییر دهید سبک و تنظیمات متن را به صورت زیر تغییر دهید:
- فونت متن: Poppins
- متن نور ملایم: واضح
- متن رنگ متن: #777777
- اندازه متن: 15 پیکسل
- تراز متن: در مرکز
فاصله
همچنین یک حاشیه (بالا و پایین) اضافه کنید.
- حاشیه (بالا و پایین): 10 پیکسل
ماژول متن شماره 2 را در صورت نیاز کلون کنید
هنگامی که ماژول متن دوم را تکمیل کردید، می توانید آن را هر چند بار که نیاز دارید (بسته به تعداد عناصر پاورقی قابل کلیکی که می خواهید اضافه کنید) کلون کنید.
ویرایش محتوا و لینک ها
حتماً محتوای ماژول و پیوندها را برای هر تکراری ویرایش کنید.
کل ستون را دو بار کلون کنید
پس از تکمیل ستون و ماژول های آن، می توانید آن را دو بار کلون کنید.
رنگ پس زمینه ستون 2
سپس تنظیمات ستون 2 را باز کرده و رنگ پس زمینه را تغییر دهید.
- پس زمینه: #f9f9f9
ویرایش محتوا و لینک ها
مطمئن شوید که تمام محتوا و پیوندها را در هر ستون تکراری ویرایش کنید.
اضافه کردن یک ستون جدید
بعد، ستون چهارم را به سطر اضافه کنید.
رنگ پس زمینه
رنگ پس زمینه ستون جدید را تغییر دهید.
- پس زمینه: #0fffc7
فاصله
حاشیه های داخلی را به صورت زیر تغییر دهید:
- حاشیه داخلی (بالا و پایین): 70 پیکسل
- حاشیه داخلی (چپ و راست): 50 پیکسل
ماژول "ما را در رسانه های اجتماعی دنبال کنید" به ستون 4 اضافه کنید
شبکه های اجتماعی را اضافه کنید
با افزودن یک ماژول ادامه دهید " ما را در شبکه های اجتماعی دنبال کنید در ستون 4 و شبکه های اجتماعی مورد نظر خود را وارد کنید.
سبک‌های آیکون رسانه‌های اجتماعی را بازنشانی کنید
کلیک کنید بازنشانی سبک عناصر نقش برای هر یک از شبکه های اجتماعی
هم ترازی
سپس به تب تغییر دهید سبک و تراز ماژول را تغییر دهید.
- تراز متن: مرکز
تنظیمات نماد
همچنین رنگ آیکون های رسانه های اجتماعی را تغییر دهید.
- رنگ نماد: #000000
ماژول Optin Email را به ستون 4 اضافه کنید
درج یک مد " ایمیل Optin "زیر ماژول" ما را در شبکه های اجتماعی دنبال کنید«
محتوای ماژول و عنوان را پاک کنید
حساب کاربری ایمیل
سپس یک حساب ایمیل اضافه کنید. اگر یک حساب ایمیل اضافه نکنید، ماژول پس از خروج از سازنده تم نمایش داده نمی شود.
رنگ پس زمینه را حذف کنید
- استفاده از رنگ پس زمینه: خیر
تنظیمات زمینه
به تب تغییر دهید سبک و تنظیمات فیلد را به صورت زیر تغییر دهید:
- زمینه های رنگ پس زمینه: rgba (0,0,0,0)
- فیلدهای رنگ متن: #000000
- فونت Champs: Poppins
- فیلدهای اندازه متن: 13 پیکسل
- فیلدهای عرض حاشیه: 1 پیکسل
تنظیمات دکمه
همچنین دکمه ماژول خود را سفارشی کنید.
- استفاده از سبک های سفارشی برای دکمه: بله
- اندازه متن دکمه: 12 پیکسل
- رنگ متن دکمه: #000000
- دکمه پس زمینه: #FFFFFF
- عرض حاشیه: 0 پیکسل
- شعاع حاشیه دکمه: 100 پیکسل
- فاصله حروف دکمه ها: 1 پیکسل
- فونت دکمه: Poppins
- دکمه کم نور: نیمه پررنگ
- دکمه سبک کپی: TT
همچنین ببینید: چگونه یک فرم تماس چسبنده در DIVI ایجاد کنیم
- پد دکمه (بالا و پایین): 15 پیکسل
ماژول متن پویا را به ستون 4 اضافه کنید
ماژول بعدی و آخرین ماژول که برای تکمیل این طراحی نیاز داریم یک ماژول Text است.
گزینه را فعال کنید " از محتوای پویا استفاده کنید"
سپس گزینه " تاریخ فعلی"
و تنظیمات محتوای پویا را به صورت زیر تغییر دهید:
- جلو: حق چاپ ©
- بعد از: | تمامی حقوق محفوظ است
- فرمت تاریخ: گمرک
- قالب تاریخ سفارشی: 20 سال
تنظیمات متن
سپس به تب style بروید و تنظیمات متن را تغییر دهید:
- فونت متن: Poppins
- متن رنگ متن: #000000
- اندازه متن: 16 پیکسل
فاصله
پارامترهای ماژول را با اضافه کردن حاشیه و voila تکمیل کنید!
- حاشیه بالا: 50 پیکسل
گزینه های جهانی پاورقی و تم ساز را ذخیره کنید
پس از اتمام کار، حتماً قبل از خروج از سازنده، کار خود را ذخیره کنید. تم دیوی.
به محض اینکه از طرح بندی قالب خارج شدید، کل تغییرات سازنده تم خود را ذخیره کنید و کارتان تمام شد!
بررسی
اکنون که تمام مراحل را طی کردیم، اجازه دهید آخرین نگاهی به نتیجه داشته باشیم.
دانلود DIVI در حال حاضر!!!
نتیجه
در این آموزش، ما به شما نشان دادیم که چقدر آسان است که یک فوتر جهانی سفارشی زیبا با سازنده تم Divi ایجاد کنید.
امیدواریم این آموزش الهام بخش شما برای ایجاد فوترهای جهانی زیبا برای پروژه های بعدی Divi باشد.
اگر نگرانی یا پیشنهادی دارید، ما را بیابید بخش نظرات برای بحث در مورد
با این حال ، شما همچنین می توانید مشورت کنید منابع مااگر برای اجرای پروژه های ایجاد سایت های اینترنتی به عناصر بیشتری احتیاج دارید ، با مشورت راهنمای ما در مورد ایجاد وبلاگ وردپرس یا یکی در Divi: بهترین تم وردپرس در همه زمان ها.
اما در عین حال، این مقاله را در شبکه های اجتماعی مختلف خود به اشتراک بگذارید.
...
