آموزش درج گالری تصاویر در المنتور
در این آموزش قصد داریم که چگونه در المنتور گالری تصاویر بسازیم. کاربرد این المان (ابزار) به این صورت است که یکسری تصاویر دلخواه که قبلا در سایت آپلود شدند بتوانیم به صورت گالری یا در کنار هم در سایت نمایش بدهیم.
آموزش درج گالری تصاویر در المنتور
برای درک بهتر این آموزش کافیست فایل آموزشی زیر را مشاهده کنید.
در فایل آموزشی بالا به صورت بصری کاملا قابل مشاهده است که بتوانید چطور یک المان گالری را به صفحه میزکار خود در المنتور اضافه کنید. حالا در آموزش بعدی به این موضوع می پردازیم بعد از درج ابزار گالری چطور بتوانیم تصاویرهایی که در سایت آپلود کردیم به نمایش بگذاریم.
نمایش تصاویر در المنتور
در این آموزش به نحوه درج تصاویر در ابزار گالری برای نمایش تصاویر در المنتور پرداخته ایم.
خب تا اینجا یاد گرفتیم که چطور المان (ابزار) گالری را به صفحه میزکارمون اضافه کنیم و حتی توانستیم که چند تا تصاویر از قبل آپلود شده هم با استفاده از المان گالری به نمایش بگذاریم. حالا نوبت به بخش های مهم، تنظیمات این ابزار می پردازیم.
تنظیمات بخش ویرایش ابزار گالری در المنتور
در این بخش به تنظیمات ابزار گالری می پردازیم که بتوانیم به صورت سفارشی تنظیمات را اعمال کنیم.
✓ تب محتوا
نوع (Type): در این بخش می توانیم به 2 صورت گالری تصاویر را نمایش دهیم. اولین گزینه به صورت Single یعنی همه تصاویر به نمایش گذاشته می شود بدون دسته بندی. دومین گزینه به صورت Multiple یعنی به صورت دسته بندی شده بسته به نوع نمایش می توانید از هم جدا کنید مثلا می توانید بخش نمونه طراحی سایت یکسری عکس مخصوص به خود داشته باشه و انواع بخش های دیگر هم می توانید اضافه کنید و عکس های مربوط به بخش خود نمایش داده شود.
image selected: در این قسمت در فایل آموزشی هم دیدید برای درج تصاویر باید از این قسمت اقدام کنید.
order By: در این بخش نوع نمایش به صورت پیشفرض یا به صورت تصادفی می توانید انتخاب کنید.
Layout (نمایش محتوا): در این قسمت نوع نمایش را می توانید انتخاب کنید به صورت (Grid، Justitied، Masonry) پشت سرهم، کاشی وار
Row Height (ارتفاع ردیف): در این بخش می توانید به صورت دستی ارتفاع ردیف را کم یا زیاد کنید.
Spacing (فاصله تصاویر): در این بخش به صورت دستی فاصله بین تصاویر را می توانید کم یا زیاد کنید.
link: می توانید به تصاویر خود لینک سفارشی اضافه کنید.
اندازه عکس: در این قسمت می توانید اندازه عکس ها را بسته به سلیقه خود کوچک یا بزرگ انتخاب کنید.
✓ تب استایل
image: در این قسمت به دو بخش تقسیم شده است. بخش اول قسمت Normal در این قسمت Border color می توانید برای حاشیه تصاویر یک رنگ انتخاب کنید. و قسمت دیگر Border Radius می توانید به حاشیه ایجاد شده گوشه های گرد بدهید. در بخش دوم Hover در این بخش اشاره گر ماوس روی هر تصویری قرار گیرد رنگ حاشیه و گوشه های حاشیه ایجاد شده تغییر پیدا می کند.
فیلترهای CSS: در این قسمت می توانید فیلترهای تاری، درخشندگی، کنتراست و.. بر روی تصاویر اعمال کنید.
Hover Animation: در این قسمت به صورت سفارشی هنگامی که ماوس بر روی تصویر قرار گیرد می توانید حالت های موجود (Zoom in، Zoom out، و...) انتخاب کنید.
✓ تب پیشرفته
در این قسمت می توانید از حالت های حاشیه های خارجی و فاصله داخلی از (چپ، راست، بالا و پایین) استفاده کنید، و از حالت های افکت (متحرک)، پس زمینه ، حاشیه کادر دور، یا css سفارشی می توانید استفاده کنید.
