منو سایت

برجسته پلاگین Divi: گالری Divi Elastic

 تاریخ انتشار :
/
  وبلاگ
برجسته پلاگین Divi: گالری Divi Elastic

Divi Elastic Gallery یک افزونه شخص ثالث برای Divi است که یک ماژول گالری جدید را به Divi Builder اضافه می کند. تصاویر را با گزینه‌های طرح‌بندی متعدد نمایش دهید، نحوه واکنش عکس‌ها را هنگام کلیک کردن انتخاب کنید، شرح‌ها، عنوان‌ها، فیلترها، صفحات و موارد دیگر را تنظیم کنید. در این پست، نگاهی دقیق‌تر به گالری Divi Elastic می‌اندازیم تا به شما کمک کنیم تصمیم بگیرید که آیا ماژول Divi مناسب برای نیازهای شما است یا خیر.

ماژول Divi Elastic Gallery

Divi Elastic Gallery یک ماژول جدید به Divi Builder به نام Elastic Gallery اضافه می کند.

ماژول Divi Elastic Gallery

بخش محتوای ماژول شامل تنظیمات گالری، پس‌زمینه و تگ مدیریت است. تنظیمات گالری شامل یک انتخابگر تصویر و بسیاری از تنظیمات تصویر است. برای افزودن تصاویر به گالری، افزودن تصاویر از گالری را انتخاب کنید. کتابخانه رسانه باز می شود و می توانید تصاویری را که می خواهید نمایش دهید انتخاب کنید.

تنظیمات گالری

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

ماژول Divi Elastic Gallery

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

ماژول Divi Elastic Gallery

ارتفاع ردیف و فاصله بین تصاویر

چند مورد از این تنظیمات یک دقیقه طول کشید تا بفهمم. در اینجا توضیح من در مورد هر تنظیمات بر اساس مستندات و آزمایشات من است.

حداقل ارتفاع ردیف تصاویر را به هر ردیف اضافه می کند تا زمانی که اندازه آن از حداقل بیشتر شود. استفاده از تعداد کمتر، تصاویر بیشتری را در گالری نمایش می دهد. در مثال زیر، حداقل ارتفاع ردیف را 145 تنظیم کرده ام.

حداقل تصاویر در هر ردیف، تعداد تصاویری را که از ردیف پایین شروع می‌شود، در سطرهای بیشتری نشان می‌دهد. در مثال زیر 6 تصویر را برای حداقل سفارش تنظیم کرده ام. ردیف پایین 6 تصویر و ردیف بالا 3 تصویر را نشان می دهد. اگر آن را روی 4 قرار دهم، ردیف بالا یک تصویر و ردیف دوم و سوم 4 تصویر را نشان می دهد.

Image Spacing تعداد پیکسل ها را بین هر تصویر بالا، پایین و کناری مشخص می کند. مثال زیر را روی ۲۱ پیکسل قرار دادم و بین هر تصویر ۲۱ پیکسل در هر طرف وجود دارد.

ماژول Divi Elastic Gallery

عکس عمل Onclick

عمل Image Onclick مشخص می کند که وقتی کاربر روی یک تصویر در گالری کلیک می کند چه اتفاقی می افتد. می تواند تصویر را در لایت باکس باز کند، به صفحات دیگر پیوند دهد یا کاری انجام ندهد. اگر آن را در لایت باکس باز کرده باشید، گزینه هایی برای آن خواهید دید. اگر آن را برای پیوند به صفحات دیگر دارید، کادری را مشاهده می کنید که در آن می توانید هر URL را با دستورالعمل هایی در مورد نحوه افزودن پیوندها وارد کنید.

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

برجسته پلاگین Divi: گالری Divi Elastic

اینجا لایت باکس پیش فرض است. دارای پس‌زمینه تیره، پیمایش، نماد بسته و عنوان زیر تصویر است.

برجسته پلاگین Divi: گالری Divi Elastic

برای این مثال، عنوان را به تصویر اضافه کردم و رنگ پس زمینه را تغییر دادم.

برجسته پلاگین Divi: گالری Divi Elastic

بر اساس دسته بندی فیلتر کنید

فیلتر دسته به شما امکان می دهد دسته بندی ها را برای نمایش انتخاب کنید و متن را برای دکمه همه دسته ها تغییر دهید.

ماژول Divi Elastic Gallery

صفحه بندی

گزینه Pagination صفحه بندی را در زیر گالری اضافه می کند. شما همچنین می توانید اندازه صفحه را انتخاب کنید که تعداد تصاویر نمایش داده شده در هر صفحه را تعیین می کند. در این مثال من اندازه صفحه 4 را انتخاب کرده ام. این صفحه 4 تصویر را در هر صفحه نمایش می دهد و 3 صفحه برای نمایش تصاویر من ایجاد می کند.

ماژول Divi Elastic Gallery

گزینه های طراحی گالری Divi Elastic

ماژول Elastic Gallery شامل تمام تنظیمات استاندارد Divi است که به شما کنترل کامل روی استایل هر عنصر را می دهد. در اینجا مروری بر تنظیمات اولیه است.

پوشش

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

ماژول Divi Elastic Gallery

انیمیشن های شناور

انیمیشن‌های شناور تعیین می‌کنند که وقتی کاربر ماوس را روی تصویر می‌گذارد، پوشش چگونه ظاهر می‌شود. از بین 7 انیمیشن انتخاب کنید یا انیمیشن ها را غیرفعال کنید.

ماژول Divi Elastic Gallery

همچنین می توانید انیمیشنی را برای تصویر انتخاب کنید تا همزمان با انیمیشن همپوشانی اجرا شود. از بین 5 انیمیشن انتخاب کنید یا انیمیشن تصویر را غیرفعال کنید. من مقیاس خاکستری را برای رنگ در مثال زیر انتخاب کردم. این کار تصاویر را به مقیاس خاکستری تغییر می دهد و هنگامی که ماوس را روی آن قرار می دهید تصویر را رنگی نشان می دهد.

ماژول Divi Elastic Gallery

تصاویر

تنظیمات تصویر گوشه ها و حاشیه های گرد را کنترل می کنند. سبک، عرض و رنگ قاب را تنظیم کنید. در مثال زیر، گوشه های گرد را 30 پیکسل کردم، یک حاشیه 1 پیکسلی اضافه کردم و رنگ را به بنفش تغییر دادم.

ماژول Divi Elastic Gallery

فیلتر گالری

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

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

ماژول Divi Elastic Gallery

صفحه بندی گالری

صفحه گالری نیز دارای تعداد باورنکردنی گزینه است. تراز، رنگ ها، فونت ها، حاشیه ها، فاصله، سایه ها و موارد دیگر را تنظیم کنید. در این مثال، اندازه فونت ها را تنظیم کردم، وزن آنها را تغییر دادم، گوشه ها را گرد کردم، فونت ها و رنگ های پس زمینه را تغییر دادم و به آنها یک کادر سایه دادم. من همچنین یک حاشیه به صفحه فعال اضافه کردم، گوشه ها را صاف کردم، رنگ ها را معکوس کردم و اندازه فونت را افزایش دادم.

ماژول Divi Elastic Gallery

نمونه گالری دیوی الاستیک

این چیزی است که گالری Divi Elastic در چیدمان به نظر می رسد. من از بسته طرح بندی کالاهای چرمی رایگان موجود در Divi استفاده می کنم. گالری را تمام عرض ساختم، رنگ‌ها را تغییر دادم تا با چیدمان مطابقت داشته باشند، و تصاویر را به مقیاس خاکستری تغییر دادم و آنها را در حالت شناور تغییر رنگ دادم. فاصله بین تصاویر صفر است. فونت اینتر است، با بولد برای وزن و TT برای سبک. من 20px Padding را به بالا و پایین و 30px Padding را به چپ و راست اضافه کردم.

نمونه گالری دیوی الاستیک

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

نمونه گالری دیوی الاستیک

گالری دیوی الاستیک را بخرید

گالری دیوی الاستیک با قیمت ۲۵ دلار در بازار دیوی موجود است. این شامل استفاده نامحدود از وب سایت، 30 روز ضمانت بازگشت وجه و یک سال پشتیبانی و به روز رسانی است.

گالری دیوی الاستیک را بخرید

پایان افکار

این نگاه ما به گالری دیوی الاستیک است. این یک ماژول ساده است، اما دارای گزینه های نمایش و استایل زیادی برای ایجاد تقریباً هر نوع گالری مورد نیاز است. چند تن از تنظیمات Min برای به دست آوردن طرح مورد نظر نیاز به تغییراتی دارند، اما من از طرح‌بندی‌هایی که توانستم از آن خارج شوم تحت تأثیر قرار گرفتم. اگر به یک ماژول گالری پر ویژگی برای Divi علاقه دارید، Elastic Gallery ارزش بررسی را دارد.

ما می خواهیم از تو بشنویم. آیا Elastic Gallery for Divi را امتحان کرده اید؟ نظر خود را در مورد آن در نظرات با ما در میان بگذارید.