آیلین وب

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

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

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

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

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. سلام وقتتون بخیر
    من هدر و فوتر ساختم تو سایت هم گذاشتم ولی بعد مدتی هم هدر پریده هم فوتر ولی تو قسمت هدر و فوتر المنتور نوشته ک تو سایت هستند ولی تو سایت نمایش داده نمیشه میشه راهنماییم کنید ک مشکل از کجاست؟؟

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

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

پیشنهاد میکنیم این مقالات را هم بخوانید
آموزش انتخاب بهترین کلمات کلیدی (Keywords) برای محتوا + فیلم آموزشی

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

آموزش انتخاب بهترین کلمات کلیدی برای سایت و محتوا، موضوع این جلسه

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

هاست ویندوز و هاست لینوکس

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

آموزش ساخت مگامنو در المنتور (رایگان) + 📽فیلم آموزشی

آموزش ساخت مگامنو در المنتور

با آموزش ساخت مگامنو در المنتور در خدمت شما عزیزان هستم و

کپی کردن صفحات المنتور به صورت کامل از یک سایت به سایت دیگر + (فیلم آموزشی)

کپی کردن صفحات المنتور به

شاید برای خیلی از شماها پیش اومده که توی طراحی صفحات با

مطالب داغ
اسکرول به بالا