---
title: "آموزش قرار دادن ستون محتوایی بر روی تصویر در المنتور"
url: "https://elementorfa.ir/overlapping-columns-elementor/"
type: "post"
published: "2020-05-05T19:34:17+04:30"
modified: "2023-07-26T11:00:37+03:30"
author: "المنتور فارسی"
---

5/5 - (13 امتیاز)

امروز در این آموزش قصد داریم در مورد همپوشانی ستون ها (Overlapping Columns) و قرار دادن متن و توضیحات بر روی تصویر صحبت کنیم.

به استفاده از این ترفند می تونید طراح های زیبا تری را در المنتور اجرا کنید.

![همپوشانی ستون ها در المنتور](https://elementorfa.ir/wp-content/uploads/2020/05/overlapping-columns-elementor.png)

## طراحی ستون همپوشانی در المنتور

### استفاده از ویجت بخش داخلی

ابتدا درون صفحه یک **ویجت بخش داخلی** به صورت 2 ستونه قرار دهید. در تب محتوا گزینه ارتفاع را روی کمترین ارتفاع و مقدار ارتفاع را روی 400 انتخاب کنید.

![همپوشانی ستون ها در المنتور](https://elementorfa.ir/wp-content/uploads/2020/05/inner-section-height.png)

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

![](https://elementorfa.ir/wp-content/uploads/2020/05/inner-section-background.png)

### ایجاد ستون محتوایی

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

![](https://elementorfa.ir/wp-content/uploads/2020/05/style-columns-elementor.png)

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

![پدینگ ستون ها در المنتور](https://elementorfa.ir/wp-content/uploads/2020/05/columns-padding.png)

و از تب طرح بندی، تراز عمودی را روی گزینه وسط قرار دهید.

![تراز عمودی ستون](https://elementorfa.ir/wp-content/uploads/2020/05/style-column.png)

### روکش پس زمینه ویجت بخش داخلی

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

در اینجا نوع پس زمینه حتما گرادینت انتخاب شود. سپس مقادیر به ترتیب زیر پر شود.

رنگ بخش اول : #FFFFFF00

موقعیت بخش اول: 60

رنگ بخش دوم: #FFF

موقعیت بخش دوم: 0

زاویه: 90

شفافیت: 1

![](https://elementorfa.ir/wp-content/uploads/2020/05/background-style-inner-section.png)

حالا با تغییر موقعیت بخش اول می توانید عرض تصویر را تغییر دهید.