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

بخش طرح بندی سربرگ چسبان المنتور

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

قالب ما از قبل آماده شده است و آموزش سربرگ چسبان المنتور را شروع می کنیم.

در قسمت طرح بندی ارتفاع را روی کمترین ارتفاع قرار می دهیم و ارتفاع را 90 پیکسل انتخاب می نماییم.

 

 

بخش استایل سربرگ چسبان المنتور

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

 

 

در منوی حاشیه برای زیبایی سربرگ چسبان و نرم کردن دو گوشه چپ و پایین را شعاعی به اندازه 20 پیکسل اعمال می کنیم.

 

بخش پیشرفته سربرگ چسبان المنتور

وارد بخش پیشرفته می شویم و فاصله از پایین را به -150 می رسانیم. توجه داشته باشدی این اندازه را با توجه به صفحه اصلی خود تنظیم و بررسی نمایید .

ایندکس Z را روی 999 تنظیم می کنیم و در بخش شناسه css متن header_stick  را تایپ می کنیم که در کد دهی css از این شناسه استفاده کنیم.

 

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

افکت آفست را مطابق اندازه ارتفاع هدر روی 90 تنظیم می کنیم.

 

حال در منوی css سفارشی کد زیر را وارد می کنیم.

#header_stick.elementor-sticky–effects { background:#4BDBE38F; } #header_stick .elementor-sticky–effects >.elemetor-coniner{ min-height: 20px; }

در نهایت سربرگ چسبان المنتور مطابق تصویر آماده گردید.

جهت مشاهده سایر پست های آموزشی به مجله شهر کار رجوع نمایید.

مشاهده نمونه کارهای ایوان کسری در زمنیه های طراحی سایت، فتوشاپ و … در اینستاگرام ایوان کسری