آیلین وب

دوستان عزیز، برای حمایت از ما حتما به ما رای بدهید​

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

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

ساخت فوتر پنهان در المنتور

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

hidden footer aylinweb - ساخت فوتر پنهان در المنتور (قدم به قدم)
اضافه کردن قالب جدید در المنتور

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

hidden footer 23 aylinweb - ساخت فوتر پنهان در المنتور (قدم به قدم)
یک قالب رو انتخاب کنید

در این صفحه میتونید یک تمپلیت آماده انتخاب کنید(و یا میتونید یک طرح سفارشی ایجاد و طراحی کنید)

یکی از این نمونه های آماده رو به دلخواه اینتخاب کنید :

footer 23 aylinweb - ساخت فوتر پنهان در المنتور (قدم به قدم)
نمونه های آماده فوتر در المنتور رو انتخاب کنید

بعد از درج فوتر موردنظرتون از نمونه های آماده، بر روی بخش اصلی کلیک کرده و به تنظیمات پیشرفته بخش برید، سپس مقدار z-index را روی 1 قرار دهید. (با این کار ما برای این بخش یا سکشن یک اولویت انتخاب میکنیم)

hidden footer 5 aylinweb - ساخت فوتر پنهان در المنتور (قدم به قدم)
اضافه کردن اولویت نمایش فوتر

باز هم در این مرحله به بخش فوتر مورد نظرمون میرم و در بخش موشن افکت گزینه شناور را فعال کرده و روی گزینه پایین تنظیم میکنیم تا فوتر ما در پایین صفحه به نمیش در بیاد.

نکته : میتوانید برای چشم نواز بودن و رابط کاربری زیباتر، این بخش رو توی موبایل و تبلت پنهان کنید و فقط در دسکتاپ نمایش داده شود. (برای تنظیم براحتی میتوانید در بخش “شناور روی” دستگاهی را که میخوهید به نمایش در بیاید رو انتخاب کنید.)

خب حالا در همان تب پیشرفته به قسمت CSS سفارشی رفته و کد زیر را وارد کنید.

section.elementor-element { z-index: 2; }
hidden footer 455 aylinweb - ساخت فوتر پنهان در المنتور (قدم به قدم)
اضافه کردن کد سفارشی به المنتور

خب دوستان دیگه تموم شد و الان نوبت اینه که برید و فوتر ساخته شده را مشاهده کنید و باید بخشی همانند تصویر زیر را مشاهده کنید.

footer hidden aylinweb - ساخت فوتر پنهان در المنتور (قدم به قدم)
ساخت فوتر مخفی در المنتور

موفق و پروز باشید. و اگر هم مشکل در اجرایی ترفند داشتید میتوانید در بخش دیدگاه ها مطرح کنید و جواب خودتون رو در کمترین زمان ممکن دریافت کنید.

8 دیدگاه دربارهٔ «ساخت فوتر پنهان در المنتور (قدم به قدم)»

  1. وقتتون بخیر
    من نتونستم مراحل رو پیش برم اصلا کلا در مورد المنتور چیزی بلد نیستم چیکار کنم؟ البته مراحل رو طبق تصاویر میشه پیشرفت ولی توی مثلا css سفارشی موندم که کد مورد نظر رو کجا قرار بدم
    میشه راهنمایی کنید یا حداقل ویدئوی آموزشی این بخش رو هم قرار بدید؟

    1. سلام دوست عزیز
      در بتدا شما جلسات کامل آموزش المنتور رو پیش برید که به صورت ویدئو هم هست و به صورت رایگان تا با بخش های افزونه المنتور آشنا بشید و سپس ترفند ها و آموزش های لازم رو پیش بگیرید چون در ادامه آموزش ها هم دیگه بخش ها اولیه رو نمیگیم و انتظار میره که خودتون ویدئو ها اولیه و اموزش کامل المنتور رو مشاهده کنید.
      ممنونم از شما

  2. با سلام برای نمایش این گزینه شناور بایددر تنظیمات المنتور اکسترا Sticky Elements
    را غیر فعال کرد که باری ساخت سایدبار شناور استفاده شده لطفا راه حلی اراعه دهید

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

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

دیدگاه‌ خود را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

پیشنهاد میکنیم این مقالات را هم بخوانید
ساخت بخش دانلود به ازای دریافت ایمیل یا موبایل با المنتور + ویدئوی آموزشی

ساخت بخش دانلود به ازای

با یک مقاله و آموزش بسیار مفید و اختصاصی از تیم آیلین

ارسال لینک دانلود به ایمیل در وردپرس با افزونه subscribe & download + ویدئوی آموزشی

ارسال لینک دانلود به ایمیل

با معرفی افزونه subscribe & download با ما همراه باشید،  یا همان ارسال

قالب Astra Pro : قالب

قالب Astra Pro | قالب آسترا مخصوص افزونه المنتور بعد از مدتها

ساخت استایل منوی اپلیکیشن موبایل با المنتور

ساخت استایل منوی اپلیکیشن موبایل

در این مقاله بسیار مفید می خوام که نحوه ساخت یک استایل

مطالب داغ
اسکرول به بالا
طراحی انواع سایت
طراحی انواع سایت با قیمت بسیار ارزان!