اگر ظاهر پاورقی یا پاورقی قالب وردپرس خود را دوست ندارید، می توانید آن را به روش های مختلفی سفارشی کنید. ممکن است این را بپرسید نحوه طراحی یک فوتر سفارشی با المنتور? باید بگم راحت! المنتور با قالب ها و المان های آماده خود این فرصت را در اختیار شما قرار می دهد. در این مقاله آموزش طراحی فوتر واکنش گرا در المنتور را به دو صورت مشاهده می کنیم.
در ویدیوی زیر که یکی از بخش های آموزشی المنتور است، در مورد نحوه ساخت فوتر با المنتور از صفر تا صد بدون قالب آماده و با استفاده از المان های المنتور صحبت کرده ایم. در زیر تمامی مراحل طراحی فوتر با المنتور را به دو صورت ارائه کرده ایم.
اگر Elementor Pro در سایت خود ندارید، ابتدا این افزونه را آماده و نصب کنید.
طراحی پاورقی با قالب آماده برای المنتور
دو روش برای طراحی پاورقی با المنتور وجود دارد. در روش اول می توانید استفاده کنید قالب های آماده Elementorفورا فوتر خود را ایجاد کنید و سپس محتوا و رنگ های هر بخش را سفارشی کنید. در روش دوم ساخت فوتر با المنتور که در زیر توضیح می دهیم خودمان از صفر تا صد قالب فوتر طراحی می کنیم.
برای این کار مراحل زیر را انجام دهید:
برای ایجاد پاورقی وب سایت، از قسمت داشبورد وردپرس شروع کنید Elementor > الگوهاقالب ساخت را فشار دهید.
- از قسمت Create Skins روی Footer کلیک کنید و سپس روی دکمه Add New کلیک کنید.
- سپس بخش زیر به شما نشان داده می شود که در آن باید یک ساختار ایجاد کنید.
- در این قسمت با انتخاب فوتر فرمت مورد نظر را مانند تصویر زیر از لیست کشویی سمت راست انتخاب کرده و روی گزینه insert کلیک کنید.
- سپس می توانید بخش های مختلف فوتر را بر اساس محتوا و سایت خود سفارشی کنید.
- سپس آن را به عنوان یک الگو ذخیره می کنید و تصمیم می گیرید که آیا آن را در سراسر سایت یا در یک صفحه خاص نمایش دهید.
ایجاد الگوی پاورقی Elementor
همانطور که در ویدیوی ابتدای مقاله مشاهده کردید، یکی از راه های طراحی فوتر سفارشی با المنتور، طراحی قالب فوتر از ابتدا می باشد. برای این کار هنگام استفاده از قالب های آماده، از قسمت قالب ها وارد قسمت ایجاد قالب شده و دکمه افزودن جدید را فشار دهید. بدون استفاده از بلوک های کتابخانه، پنجره را ببندید و عناصر زیر را به فوتر اضافه کنید. بیایید با Elementor یک فوتر طراحی کنیم و با عناصر Elementor یک Footer کامل بسازیم
🔶 با Elementor متن و لینک به فوتر اضافه کنید
در این قسمت نحوه افزودن متن و لینک های فوتر را با هم خواهیم دید.
- انتخاب ساختار 4 ستونی برای فوتر
- با افزودن عنصر عنوان، عنوانی را در یکی از ستون ها ایجاد کنید
- یک عنصر ویرایشگر متن را به پاورقی اضافه کنید
- یک بخش داخلی در هر ستون در فوتر ایجاد کنید (در صورت لزوم)
- کد رنگ هر بخش پاورقی را تعیین کنید
توجه: با کشیدن و رها کردن می توانید تمام عناصر را به قالب خود اضافه کنید.
🔶 اضافه کردن دکمه فوتر با Elementor
دکمه یکی از عناصر اصلی برای ایجاد یک فوتر سفارشی است که به راهنمایی کاربران به صفحه مورد نظر کمک می کند. در این ویدیو نحوه اضافه کردن دکمه به فوتر همراه با تنظیمات دکمه را مشاهده می کنید.
- یک بخش یا بخش داخلی در ستون مربوطه ایجاد کنید
- با افزودن یک عنصر دکمه، یک دکمه ایجاد کنید
- محتوا، سبک و رنگ، فواصل داخلی و خارجی (پد و حاشیه) دکمه را تغییر دهید
- ویرایش و تغییر فواصل داخلی و خارجی دکمه ها
- از طریق هدر سبک، یک حاشیه به دکمه اضافه کنید
- عرض ستون و بخش پاورقی را با Elementor تنظیم کنید
- اضافه کردن آیکون به دکمه ها
- با تغییر اندازه در سبک، طرح دکمه را تغییر دهید
- جاسازی نماد رسانه اجتماعی در المنتور (با استفاده از دکمه و عنصر Elementor)
🔶 ایجاد عنصر شمارنده فوتر با Elementor
استفاده از عناصری که از نظر بصری جذاب یا متحرک در فوتر هستند، کاربران را جذب می کند. عنصر شمارنده یکی از این عناصر است که به شما کمک می کند آمار سایت را در اختیار کاربران خود قرار دهید. پس از افزودن عنصر شمارنده در Elementor به صورت زیر عمل کنید:
- شماره شروع و پایان شمارنده را ویرایش کنید
- عنوان و متن پیشخوان را در فوتر ویرایش کنید
- تغییر سبک (فونت و نوع فونت)، رنگ متن، اضافه کردن حاشیه، سایه و پس زمینه
🔶 درج لوگوی سایت در المنتور در قسمت فوتر
- لوگوی سایت در فوتر به کاربران اطمینان می دهد
- اضافه کردن لوگوی سایت با کشیدن و رها کردن
- اندازه، قاب، سایه جعبه لوگو را تنظیم کنید
- این تصویر را در فوتر قرار دهید
برخی از افزونه های Elementor عناصر بیشتری را در اختیار شما قرار می دهند که با استفاده از آنها می توانید به راحتی سربرگ و فوتر سایت خود را طراحی کنید. یکی از آنها افزونه Element Kit است که عنصر خاصی را به Elementor اضافه می کند.
قالب Elementor را ذخیره کرده و فوتر سایت را فعال کنید
در این قسمت از آموزش ساخت فوتر با Elementor با زدن دکمه save صفحه ای باز می شود که باید در قسمت شرط قسمتی از سایت را که می خواهیم قالب فوتر منتشر شود را مشخص کنیم. با انتخاب کل سایت، قالب فوتر برای تمام صفحات سایت فعال و تنظیم می شود.
در این مقاله نحوه طراحی فوتر با المنتور را به دو صورت توضیح داده ایم که می توانید با افزودن ابزارک نقشه سایت، لوگوی سایت، لینک شبکه های اجتماعی و … فوتر خود را شخصی سازی کنید.