آموزش سربرگ چسبان المنتور

  1. Home
  2. فریلنسری
  3. طراحی سایت
  4. جزئیات مقاله
فریلنسرها
آموزش سربرگ چسبان المنتور

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

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

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

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

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

 

ارتفاع سربرگ چسبان

 

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

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

 

رنگ پس زمینه شفاف

 

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

شعاع کادر سربرگ چسبان المنتور

 

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

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

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

شناسه css هدر چسبان المنتور

 

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

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

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

 

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

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

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

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

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

 

سربرگ چسبان المنتور

 

 

مدیر سایت

زمان عضویت نویسنده: 7 مرداد 1399

پاسخ شما به دیدگاه