آموزش طراحی سایت

کار با ردیف و ستون در ویژوال کامپوزر

آشنایی با ردیف و ستون

آموزش ردیف و ستون در ویژوال کامپوزر

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

کار با ردیف و ستون در ویژوال کامپوزر

پس از انتخاب المان ردیف، مانند شکل زیر یک ردیف به صفحه ویرایشگر اضافه می­شود که با استفاده از گزینه­ های آن می­توانید نسبت به تغییرات و سفارشی ­سازی ردیف اقدام کنید.

در تصویر زیر گزینه­ های ردیف را به شما معرفی کرده ­ایم قابلیت جابجایی ردیف با کشیدن و رها کردن موس.

 

  1. قابلیت جابجایی ردیف با کشیدن و رها کردن موس.
  2. اضافه کردن بخش(ستون) جدید در همان ردیف.
  3. تعداد و ویرایش ستون­های ردیف.
  4. کوچک کردن ردیف.
  5. کپی کدهای ردیف برای استفاده در برگه­ های دیگر.
  6. تنظیمات ردیف.
  7. کپی ردیف برای استفاده در همین صفحه(clone).
  8. حذف ردیف.
  9. اضافه کردن کدد CSS برای این برگه.
  10. بزرگ و کوچک کردن صفحه­ساز .
  11. Undo و بازگردانی تغییرات به حالت قبلی.
  12. چسباندن ردیف کپی شده با استفاده از کپی کدها(مورد 5) و ایجاد یک ردیف همانند ردیف کپی شده در برگه جدید.
  13. ساخت یک الگو از همه ردیف ­ها و المان ­های صفحه برای استفاده از این الگو در برگه جدید.
  14. افزودن المان جدید.

برای مثال، می­ خواهیم ردیف صفحه را با استفاده از دکمه شماره 3 به دو ستون مساوی تقسیم کنیم.

نوشته های مشابه

کار با ردیف و ستون در ویژوال کامپوزر

در یکی از ستون ­ها المان تصویر و در ستون دیگر المان بلاک متن را اضافه و ذخیره کنید. توجه داشته باشید در هر ستون با استفاده از آیکن مداد می­ توانید به طور اختصاصی آن ستون را ویرایش و تنظیمات دلخواهتان را اعمال نمایید.
کار با ردیف و ستون در ویژوال کامپوزر

نتیجه نهایی

در نهایت نتیجه کار به شکل زیر خواهد بود.

کار با ردیف و ستون در ویژوال کامپوزر

ردیف داخلی

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

کار با ردیف و ستون در ویژوال کامپوزر

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

بازگشت به صفحه دوره آموزش طراحی سایت

دیدگاهتان را بنویسید

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

دکمه بازگشت به بالا