{"id":303007,"date":"2021-08-26T13:12:37","date_gmt":"2021-08-26T13:12:37","guid":{"rendered":"https:\/\/webkul.com\/blog\/?p=303007"},"modified":"2026-03-13T07:17:32","modified_gmt":"2026-03-13T07:17:32","slug":"laravel-ecommerce-image-gallery","status":"publish","type":"post","link":"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/","title":{"rendered":"Laravel eCommerce Image Gallery"},"content":{"rendered":"\n<h3 class=\"wp-block-heading index-title\">Introduction<\/h3>\n\n\n\n<p>The admin can also create various groups and assign galleries to that group. <\/p>\n\n\n\n<p>This is the best gallery module for the Bagisto platform and in <a href=\"https:\/\/store.webkul.com\/laravel-ecommerce-image-gallery.html\" target=\"_blank\" rel=\"noreferrer noopener\">Laravel eCommerce Image Gallery<\/a> module, everything is configured by the admin.<\/p>\n\n\n\n<p>The admin can even allow the style for opening and closing the Image.<\/p>\n\n\n\n<h3 class=\"wp-block-heading index-title\">Installation of Laravel Image Gallery Module<\/h3>\n\n\n\n<p>Unzip the respective extension zip and then merge<strong>&nbsp;\u201cpackages\u201d<\/strong>&nbsp;into project root directory.<\/p>\n\n\n\n<p>Goto&nbsp;<strong>bootstrap\/providers.php<\/strong>&nbsp;file and add the following line under&nbsp;<strong>\u2018providers\u2019<\/strong>.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">Webkul\\ImageGallery\\Providers\\ImageGalleryServiceProvider::class<\/pre>\n\n\n\n<p>Goto&nbsp;<strong>composer.json<\/strong>&nbsp;file and add the following line under&nbsp;<strong>\u2018psr-4\u2019<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">\"Webkul\\\\ImageGallery\\\\\": \"packages\/Webkul\/ImageGallery\/src\"<\/pre>\n\n\n\n<p>Then run the following commands:-<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">composer dump-autoload<\/pre>\n\n\n\n<pre class=\"wp-block-preformatted\">php artisan image-gallery:install<\/pre>\n\n\n\n<pre class=\"wp-block-preformatted\">php artisan optimize:clear<\/pre>\n\n\n\n<p>After following these steps, the\u00a0<a href=\"https:\/\/bagisto.com\/en\/\">Bagisto<\/a>\u00a0Laravel Image Gallery Extension should be successfully installed and ready for use in your Bagisto v2.3.14 project.<\/p>\n\n\n\n<p>You will also see the\u00a0<strong>Image Gallery<\/strong>\u00a0section on the left-hand side in the menu bar.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1120\" height=\"880\" src=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-section-2.webp\" alt=\"image-gallery-section\" class=\"wp-image-530547\" srcset=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-section-2.webp 1120w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-section-2-300x236.webp 300w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-section-2-250x196.webp 250w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-section-2-768x603.webp 768w\" sizes=\"(max-width: 1120px) 100vw, 1120px\" loading=\"lazy\" \/><\/figure>\n\n\n\n<div class=\"wk-index-wrap\"><div class=\"block-wrap\">\n<h3 class=\"wp-block-heading index-title\">Features<\/h3>\n<\/div><\/div>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Admin can manage images with title, description, sort order, status, and image upload.<\/li>\n\n\n\n<li>Admin can create galleries by selecting images and setting a thumbnail.<\/li>\n\n\n\n<li>Admin can bulk upload multiple images at once, apply a title prefix, description, sort base, and status, and attach them to a gallery.<\/li>\n\n\n\n<li>Admin can group galleries into gallery groups.<\/li>\n\n\n\n<li>Admin can enable\/disable the module via configuration.<\/li>\n\n\n\n<li>Admin can configure gallery viewer options: caption, caption type, caption position, background, interval, border, slide count, and controls.<\/li>\n\n\n\n<li>Shop users can view the gallery list page and open any gallery to view images.<\/li>\n\n\n\n<li>Shop users can navigate images with next\/previous controls.<\/li>\n<\/ul>\n\n\n<div class=\"wk-index-wrap\">\n<h3 class=\"index-title\"><strong>Image Gallery Configuration<\/strong><\/h3>\n<\/div>\n<p><!-- \/wp:post-content -->After the successful installation of the module, the admin can configure the module under the admin panel. The needs to Configure&gt;&gt;Image Gallery.<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:image {\"id\":303065,\"sizeSlug\":\"large\",\"linkDestination\":\"none\"} --><\/p>\n<figure class=\"wp-block-image size-large\"><\/figure>\n<p><!-- \/wp:image --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-478487\" src=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/laravel-ecommerce-image-gallery-module-configurations.webp\" alt=\"laravel-ecommerce-image-gallery-module-configurations\" width=\"1105\" height=\"1050\" srcset=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/laravel-ecommerce-image-gallery-module-configurations.webp 1105w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/laravel-ecommerce-image-gallery-module-configurations-300x285.webp 300w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/laravel-ecommerce-image-gallery-module-configurations-1078x1024.webp 1078w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/laravel-ecommerce-image-gallery-module-configurations-250x238.webp 250w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/laravel-ecommerce-image-gallery-module-configurations-768x730.webp 768w\" sizes=\"(max-width: 1105px) 100vw, 1105px\" loading=\"lazy\" \/><\/p>\n<p>Here the admin can set various actions like <strong>Opining and Closing Effect<\/strong>, <strong>Side Count, Control<\/strong>.<\/p>\n<p>The admin can also set<strong> caption type and caption position<\/strong>.<br \/>The admin can also <strong>enable and disable<\/strong> the Image Gallery from here.<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>Click on the Save button.<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:wk-block\/index-panel --><\/p>\n<div class=\"wk-index-wrap\">\n<h3 class=\"index-title\">Add Images, Gallery and Groups<\/h3>\n<\/div>\n<p><!-- \/wp:wk-block\/index-panel --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>Now the admin needs to add the Images, Gallery and Group, for this the admin needs to configure to the Image Gallery button that is visible on the side menu bar as shown below:-<\/p>\n<p><img decoding=\"async\" class=\"alignnone wp-image-530522 size-full\" src=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-add-images.webp\" alt=\"image-gallery-add-images\" width=\"1120\" height=\"880\" srcset=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-add-images.webp 1120w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-add-images-300x236.webp 300w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-add-images-250x196.webp 250w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-add-images-768x603.webp 768w\" sizes=\"(max-width: 1120px) 100vw, 1120px\" loading=\"lazy\" \/><\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:image {\"id\":303043,\"sizeSlug\":\"large\",\"linkDestination\":\"none\"} --><\/p>\n<figure class=\"wp-block-image size-large\"><\/figure>\n<p><!-- \/wp:image --><\/p>\n<p><!-- wp:heading {\"level\":4} --><\/p>\n<h3>Manage Images<\/h3>\n<p><!-- \/wp:heading --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>Under the Manage Images all the images that have been added are visible along with <strong>\u00a0image title, description, sort order, select gallery <\/strong>and <strong>status.<\/strong><\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>To add a new image click on the <strong>Add Image<\/strong> button.<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>After clicking on the add image button a page will open that will look like shown below:-<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:image {\"id\":303056,\"sizeSlug\":\"large\",\"linkDestination\":\"none\"} --><\/p>\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" class=\"alignnone wp-image-530523 size-full\" src=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-image-edit-page.webp\" alt=\"manage-image-edit-page\" width=\"1120\" height=\"880\" srcset=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-image-edit-page.webp 1120w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-image-edit-page-300x236.webp 300w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-image-edit-page-250x196.webp 250w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-image-edit-page-768x603.webp 768w\" sizes=\"(max-width: 1120px) 100vw, 1120px\" loading=\"lazy\" \/><\/figure>\n<p><!-- \/wp:image --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>Here the admin needs to <strong>add image including description and title for the image<\/strong>.<br \/>Click on the <strong>Save Image<\/strong> button.<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:heading {\"level\":4} --><\/p>\n<h3>Manage Gallery<\/h3>\n<p><!-- \/wp:heading --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>On clicking on the Manage Gallery all the galleries are visible as shown below:-<\/p>\n<p><img decoding=\"async\" class=\"alignnone wp-image-530527 size-full\" src=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-gallery.webp\" alt=\"manage-gallery\" width=\"1120\" height=\"880\" srcset=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-gallery.webp 1120w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-gallery-300x236.webp 300w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-gallery-250x196.webp 250w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-gallery-768x603.webp 768w\" sizes=\"(max-width: 1120px) 100vw, 1120px\" loading=\"lazy\" \/><\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:image {\"id\":303060,\"sizeSlug\":\"large\",\"linkDestination\":\"none\"} --><\/p>\n<figure class=\"wp-block-image size-large\"><\/figure>\n<p><!-- \/wp:image --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>To add a new gallery the admin needs to click on the <strong>Add Gallery<\/strong> button, the page that opens will look like shown below:-<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:image {\"id\":303061,\"sizeSlug\":\"large\",\"linkDestination\":\"none\"} --><\/p>\n<figure class=\"wp-block-image size-large\"><\/figure>\n<p><img decoding=\"async\" class=\"alignnone wp-image-530528 size-full\" src=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-gallery-edit.webp\" alt=\"manage-gallery-edit\" width=\"1120\" height=\"880\" srcset=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-gallery-edit.webp 1120w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-gallery-edit-300x236.webp 300w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-gallery-edit-250x196.webp 250w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-gallery-edit-768x603.webp 768w\" sizes=\"(max-width: 1120px) 100vw, 1120px\" loading=\"lazy\" \/><\/p>\n<p><!-- \/wp:image --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>Here the admin can input the title and code for the gallery and also select the images for that gallery along with the thumbnail.<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>Click on the<strong> Save Gallery <\/strong>button.<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:heading {\"level\":4} --><\/p>\n<h3>Manage Group.<\/h3>\n<p><!-- \/wp:heading --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>Under the Manage Groups all the groups that have been added are visible along with <strong>Group code , id, and status.<\/strong><\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-478445\" src=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/laravel-ecommerce-image-gallery-add-gallery-manage-groups.webp\" alt=\"laravel-ecommerce-image-gallery-add-gallery-manage-groups\" width=\"1120\" height=\"880\" srcset=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/laravel-ecommerce-image-gallery-add-gallery-manage-groups.webp 1120w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/laravel-ecommerce-image-gallery-add-gallery-manage-groups-300x236.webp 300w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/laravel-ecommerce-image-gallery-add-gallery-manage-groups-250x196.webp 250w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/laravel-ecommerce-image-gallery-add-gallery-manage-groups-768x603.webp 768w\" sizes=\"(max-width: 1120px) 100vw, 1120px\" loading=\"lazy\" \/><\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:image {\"id\":303057,\"sizeSlug\":\"large\",\"linkDestination\":\"none\"} --><\/p>\n<figure class=\"wp-block-image size-large\"><\/figure>\n<p><!-- \/wp:image --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>To add a new group click on the<strong> Add Group<\/strong> button.<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:image {\"id\":303059,\"sizeSlug\":\"large\",\"linkDestination\":\"none\"} --><\/p>\n<figure class=\"wp-block-image size-large\"><\/figure>\n<p><!-- \/wp:image --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p><img decoding=\"async\" class=\"alignnone wp-image-530531 size-full\" src=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-groups-edit.webp\" alt=\"manage-groups-edit\" width=\"1120\" height=\"880\" srcset=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-groups-edit.webp 1120w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-groups-edit-300x236.webp 300w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-groups-edit-250x196.webp 250w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/manage-groups-edit-768x603.webp 768w\" sizes=\"(max-width: 1120px) 100vw, 1120px\" loading=\"lazy\" \/><\/p>\n<p>Here the admin can enter the group code and select the gallery for that group.<br \/>Click on the <strong>Save Group<\/strong> button.<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:wk-block\/index-panel --><\/p>\n<div class=\"wk-index-wrap\">\n<h3 class=\"index-title\">Front End<\/h3>\n<\/div>\n<p><!-- \/wp:wk-block\/index-panel --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>In the front end the <strong>View Galleries <\/strong>button is visible as shown below:-<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:image {\"id\":303062,\"sizeSlug\":\"large\",\"linkDestination\":\"none\"} --><\/p>\n<figure class=\"wp-block-image size-large\"><\/figure>\n<p><img decoding=\"async\" class=\"alignnone wp-image-530533 size-full\" src=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery.webp\" alt=\"image-gallery-view-gallery\" width=\"1120\" height=\"880\" srcset=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery.webp 1120w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-300x236.webp 300w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-250x196.webp 250w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-768x603.webp 768w\" sizes=\"(max-width: 1120px) 100vw, 1120px\" loading=\"lazy\" \/><\/p>\n<p><!-- \/wp:image --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>After clicking on the View Galleries button the user will is redirected to another page where all the galleries are visible:-<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:image {\"id\":303063,\"sizeSlug\":\"large\",\"linkDestination\":\"none\"} --><\/p>\n<figure class=\"wp-block-image size-large\"><\/figure>\n<p><img decoding=\"async\" class=\"alignnone wp-image-530534 size-full\" src=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-visible.webp\" alt=\"image-gallery-visible\" width=\"1120\" height=\"880\" srcset=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-visible.webp 1120w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-visible-300x236.webp 300w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-visible-250x196.webp 250w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-visible-768x603.webp 768w\" sizes=\"(max-width: 1120px) 100vw, 1120px\" loading=\"lazy\" \/><\/p>\n<p><!-- \/wp:image --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>To view the images of the gallery click on any gallery.<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:image {\"id\":303064,\"sizeSlug\":\"large\",\"linkDestination\":\"none\"} --><\/p>\n<figure class=\"wp-block-image size-large\"><\/figure>\n<p><img decoding=\"async\" class=\"alignnone wp-image-530535 size-full\" src=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-view-detail.webp\" alt=\"image-gallery-view-detail\" width=\"1120\" height=\"880\" srcset=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-view-detail.webp 1120w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-view-detail-300x236.webp 300w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-view-detail-250x196.webp 250w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-view-detail-768x603.webp 768w\" sizes=\"(max-width: 1120px) 100vw, 1120px\" loading=\"lazy\" \/><\/p>\n<p><!-- \/wp:image --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>In the above page the all the images of the gallery are visible.<\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>So, that was much about the User Guide of Laravel eCommerce Image Gallery for any queries or doubts reach out to us at<strong>\u00a0<a href=\"mailto:support@webkul.com\" target=\"_blank\" rel=\"noreferrer noopener\">support@webkul.com<\/a>.<\/strong>\u00a0You can also raise a ticket at our\u00a0<a href=\"https:\/\/bagisto.uvdesk.com\/en\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>HelpDesk System.<\/strong><\/a><\/p>\n<p><!-- \/wp:paragraph --><\/p>\n<p><!-- wp:paragraph --><\/p>\n<p>Please explore our<strong><a href=\"https:\/\/webkul.com\/laravel-development\/\">\u00a0Laravel Development Services\u00a0<\/a><\/strong>and Quality\u00a0<strong><a href=\"https:\/\/store.webkul.com\/catalogsearch\/result\/index\/?cat=171&amp;q=laravel\">Bagisto Extensions<\/a><\/strong>.<\/p>\n<p><!-- \/wp:paragraph --><\/p>","protected":false},"excerpt":{"rendered":"<p>Introduction The admin can also create various groups and assign galleries to that group. This is the best gallery module for the Bagisto platform and in Laravel eCommerce Image Gallery module, everything is configured by the admin. The admin can even allow the style for opening and closing the Image. Installation of Laravel Image Gallery <a href=\"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/\">[&#8230;]<\/a><\/p>\n","protected":false},"author":267,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-303007","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Laravel eCommerce Image Gallery - Webkul Blog<\/title>\n<meta name=\"description\" content=\"With the help of the module Laravel eCommerce Image Gallery, the admin can create a gallery and add images to the gallery.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Laravel eCommerce Image Gallery - Webkul Blog\" \/>\n<meta property=\"og:description\" content=\"With the help of the module Laravel eCommerce Image Gallery, the admin can create a gallery and add images to the gallery.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/\" \/>\n<meta property=\"og:site_name\" content=\"Webkul Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/webkul\/\" \/>\n<meta property=\"article:published_time\" content=\"2021-08-26T13:12:37+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-03-13T07:17:32+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-section-2.webp\" \/>\n<meta name=\"author\" content=\"Simant Verma\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@webkul\" \/>\n<meta name=\"twitter:site\" content=\"@webkul\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Simant Verma\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/\"},\"author\":{\"name\":\"Simant Verma\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/person\/63f64723fe98f166757f7903d1f7e7e0\"},\"headline\":\"Laravel eCommerce Image Gallery\",\"datePublished\":\"2021-08-26T13:12:37+00:00\",\"dateModified\":\"2026-03-13T07:17:32+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/\"},\"wordCount\":673,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/webkul.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-section-2.webp\",\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/\",\"url\":\"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/\",\"name\":\"Laravel eCommerce Image Gallery - Webkul Blog\",\"isPartOf\":{\"@id\":\"https:\/\/webkul.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-section-2.webp\",\"datePublished\":\"2021-08-26T13:12:37+00:00\",\"dateModified\":\"2026-03-13T07:17:32+00:00\",\"description\":\"With the help of the module Laravel eCommerce Image Gallery, the admin can create a gallery and add images to the gallery.\",\"breadcrumb\":{\"@id\":\"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/#primaryimage\",\"url\":\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-section-2.webp\",\"contentUrl\":\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-section-2.webp\",\"width\":1120,\"height\":880,\"caption\":\"image-gallery-section\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/webkul.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Laravel eCommerce Image Gallery\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/webkul.com\/blog\/#website\",\"url\":\"https:\/\/webkul.com\/blog\/\",\"name\":\"Webkul Blog\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/webkul.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/webkul.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/webkul.com\/blog\/#organization\",\"name\":\"WebKul Software Private Limited\",\"url\":\"https:\/\/webkul.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png\",\"contentUrl\":\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png\",\"width\":380,\"height\":380,\"caption\":\"WebKul Software Private Limited\"},\"image\":{\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/webkul\/\",\"https:\/\/x.com\/webkul\",\"https:\/\/www.instagram.com\/webkul\/\",\"https:\/\/www.linkedin.com\/company\/webkul\",\"https:\/\/www.youtube.com\/user\/webkul\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/person\/63f64723fe98f166757f7903d1f7e7e0\",\"name\":\"Simant Verma\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/7d1724606c049d771b8373de3119b9fde5f988195eb2e7d951f4acafa583388c?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/7d1724606c049d771b8373de3119b9fde5f988195eb2e7d951f4acafa583388c?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g\",\"caption\":\"Simant Verma\"},\"url\":\"https:\/\/webkul.com\/blog\/author\/simantverma-bd183\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Laravel eCommerce Image Gallery - Webkul Blog","description":"With the help of the module Laravel eCommerce Image Gallery, the admin can create a gallery and add images to the gallery.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/","og_locale":"en_US","og_type":"article","og_title":"Laravel eCommerce Image Gallery - Webkul Blog","og_description":"With the help of the module Laravel eCommerce Image Gallery, the admin can create a gallery and add images to the gallery.","og_url":"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/","og_site_name":"Webkul Blog","article_publisher":"https:\/\/www.facebook.com\/webkul\/","article_published_time":"2021-08-26T13:12:37+00:00","article_modified_time":"2026-03-13T07:17:32+00:00","og_image":[{"url":"https:\/\/webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-section-2.webp","type":"","width":"","height":""}],"author":"Simant Verma","twitter_card":"summary_large_image","twitter_creator":"@webkul","twitter_site":"@webkul","twitter_misc":{"Written by":"Simant Verma","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/#article","isPartOf":{"@id":"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/"},"author":{"name":"Simant Verma","@id":"https:\/\/webkul.com\/blog\/#\/schema\/person\/63f64723fe98f166757f7903d1f7e7e0"},"headline":"Laravel eCommerce Image Gallery","datePublished":"2021-08-26T13:12:37+00:00","dateModified":"2026-03-13T07:17:32+00:00","mainEntityOfPage":{"@id":"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/"},"wordCount":673,"commentCount":0,"publisher":{"@id":"https:\/\/webkul.com\/blog\/#organization"},"image":{"@id":"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/#primaryimage"},"thumbnailUrl":"https:\/\/webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-section-2.webp","inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/","url":"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/","name":"Laravel eCommerce Image Gallery - Webkul Blog","isPartOf":{"@id":"https:\/\/webkul.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/#primaryimage"},"image":{"@id":"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/#primaryimage"},"thumbnailUrl":"https:\/\/webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-section-2.webp","datePublished":"2021-08-26T13:12:37+00:00","dateModified":"2026-03-13T07:17:32+00:00","description":"With the help of the module Laravel eCommerce Image Gallery, the admin can create a gallery and add images to the gallery.","breadcrumb":{"@id":"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/#primaryimage","url":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-section-2.webp","contentUrl":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/image-gallery-section-2.webp","width":1120,"height":880,"caption":"image-gallery-section"},{"@type":"BreadcrumbList","@id":"https:\/\/webkul.com\/blog\/laravel-ecommerce-image-gallery\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/webkul.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Laravel eCommerce Image Gallery"}]},{"@type":"WebSite","@id":"https:\/\/webkul.com\/blog\/#website","url":"https:\/\/webkul.com\/blog\/","name":"Webkul Blog","description":"","publisher":{"@id":"https:\/\/webkul.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/webkul.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/webkul.com\/blog\/#organization","name":"WebKul Software Private Limited","url":"https:\/\/webkul.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png","contentUrl":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png","width":380,"height":380,"caption":"WebKul Software Private Limited"},"image":{"@id":"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/webkul\/","https:\/\/x.com\/webkul","https:\/\/www.instagram.com\/webkul\/","https:\/\/www.linkedin.com\/company\/webkul","https:\/\/www.youtube.com\/user\/webkul\/"]},{"@type":"Person","@id":"https:\/\/webkul.com\/blog\/#\/schema\/person\/63f64723fe98f166757f7903d1f7e7e0","name":"Simant Verma","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/webkul.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/7d1724606c049d771b8373de3119b9fde5f988195eb2e7d951f4acafa583388c?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/7d1724606c049d771b8373de3119b9fde5f988195eb2e7d951f4acafa583388c?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g","caption":"Simant Verma"},"url":"https:\/\/webkul.com\/blog\/author\/simantverma-bd183\/"}]}},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts\/303007","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/users\/267"}],"replies":[{"embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/comments?post=303007"}],"version-history":[{"count":16,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts\/303007\/revisions"}],"predecessor-version":[{"id":530548,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts\/303007\/revisions\/530548"}],"wp:attachment":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/media?parent=303007"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/categories?post=303007"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/tags?post=303007"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}