Discover the best cmsgallery websites created by professional designers. Get inspired and start planning your perfect cmsgallery web design today!

Jonas Arleth

I'll show you a trick to control the size of CMS elements via a toggle to give your clients more flexibility in displaying CMS collections in Webflow.

Each CMS element has an example toggle "medium", "large" and "align Center". As soon as one of these options is active, a class is added to the element "grid-item" via custom code, which changes the size of the element or the alignment. The classes and sizes of the grid items can be changed in the hidden section-cms-grid. In order for it to work, the embed field in each CMS item and the jQuery code must be added.

Tutorial: https://youtu.be/DsuCGRSgJIk

Control Sizing of CMS Items with a Toggle

Harshit Agrawal

Hello Everyone !

I am back with another cool card hover effect , 
this can be used in personal portfolios

You can change the angle if you want from transformations and also you can change the layout if you want  :)
Let me know if you have any questions !

Follow for more awesome stuff !
and if you want to hire me , you can press Hire Me or Email me at kingfactory1234@gmail.com  

Thanks Stay Healthy and Safe !

Tilted Cards hover Effect

Bradley Stallcup

I love this gallery from TyCreated soooo much!
It's the same but I added a lightbox feature on click and removed the CMS so you can copy and paste it faster. Thanks Ty keep em' coming!

Slick Lightbox Gallery

Hii Everyone , I want to show you some cool stuff !!

This is a Netflix kind of theme made in webflow , the fun part is, It is having CMS build inside a Popup , when u click on a movie/trailer, you will se different popup for all !

Clone it and make it yours !

Thanks

Hire Me : kingfactory1234@gmail.com

netflixtheme

Tim Daff

Here is a CMS powered gallery I did for a client recently, I've stripped out all the other pages and it's just the gallery now.  

Hope you can find it useful!

If you like, give it some ❤️

CMS Image Gallery

Martin Schulze-Schilddorf

CMS overlay on click (technical prototype)

yep, its responsive ;)

As you can see, every CMS item has a different grid-size. I achieved this with very little custom CSS code. The code is implemented inside the body at the very bottom. If you want every item to be the same size, just delete the custom code. Thats it.

Keep in mind that links inside the overlay won't work. As soon as you click anywhere in the overlay it will close itself instead of triggering the link.
If someone figures out how to achieve this, feel free to write it down in the comments and I will implement it in the project.

CMS Grid Overlay

Diarmuid Sexton

This demo shows how to use the Fancybox 3 plugin. It's slightly different to the lightbox - and I've set it up to show captions for CMS galleries which the Webflow lightbox doesn't do yet.

https://fancyapps.com/fancybox/3/

DEMO - Fancybox Gallery (Lightbox)

Sometimes you want to see all the images from a gallery on desktop, but don't want to use all that space on mobile. So to save some space, this changes into a swipeable gallery on mobile. *woohoo!
(Like Netflix or Apple TV etc...)

Scroll to the bottom to copy a version thats not connected to CMS. (It'll copy and paste easier.) Plus there's a cool little hover-state class on the cards.

There's a little HTML that is used to hide the scrollbar, but that's it. Super simple. Enjoy!

minim-responsive-gallery

Francesco Castronuovo

Hi my gorgeous friends of Webflow,

By playing a bit with jQuery you can add a looping behaviour to your lightbox components to endlessly browse through your gallery.

You just need to follow the three steps listed inside the page and you'll be done!

Enjoy, clone, and feel free to leave a comment.

Have an awesome Webflow journey y'all!

*** PROJECT UPDATE ***
1) Fixed a bug that prevented the slide from looping when clicking on the lightbox images only
2) Added swipe event handler to make the looping functionality available on mobile as well.

P.S. Feel free to visit my YouTube channel:
https://www.youtube.com/@francescocastronuovo

Webflow Looping Lightbox

Bien Studio

Identity Films and Productions is an award winning documentary production company that tells meaningful stories about individuals and communities in engaging & insightful ways. The company was established in 2006 and is headed by award winning producer and director, and former professor, Danny Ben-Moshe.

identity-films-production

Billie Tuitt

Discover how to alternate the order of your CMS items with a small snippet of code!

To see the code and for more resources visit: https://www.billietuitt.com/resources.

Alternate CMS Items

Angelika C.

Studio 03 Ecommerce | Photography Site V2

Professional Photographer Kresh Juraga reached out to me to create a unique, dynamic experience for his site. Engineering his own sets and lights, he wanted to sell his own tools so that people all over world can create his beautiful sets and backdrops in their own homes. 

His Site:
- Organized to be SEO friendly and strategically designed for his target audience
- Featuring text and image scroll animations, e-commerce functionality, hover and glow FX, Filtered CMS gallery, plus more. Check out the shopping page too ;)

His website and business is continuously evolving:

V3 showcases a much simpler background, add-ins include a carousel of his team, a form instead of a contact link and product models

Our next big project will be to integrate a custom magazine-styled blog to his website, and to continue editing his copy. Stay tuned for V4.

Version 2 Studio 03 Ecommerce | Photography Site

Studio 03 Ecommerce | Photography Site V3

Simpler interface & background with team displayed as a carousel, form at the end of the site and making it possible to showcase different models with their own product page using cms integration, number filtering, custom fields etc.

- Organized to be SEO friendly and strategically designed for his target audience
- Featuring text and image scroll animations, e-commerce functionality, hover and glow FX, Filtered CMS gallery, plus more. Check out the shopping page too ;)

Professional Photographer Kresh Juraga reached out to me to create a unique, dynamic experience for his site. Engineering his own sets and lights, he wanted to sell his own tools so that people all over world can create his beautiful sets and backdrops in their own homes.

Version 3 Studio 03 Ecommerce | Photography Site

Hi my Webflow friends,

A bit of jQuery gives you endless powers.

This project only uses a single CMS collection list to populate both the cube and the images on the background.

Just scroll down, enjoy, clone, and feel free to leave a comment.

Have an awesome Webflow journey y'all!

P.S. Feel free to visit my YouTube channel:
https://www.youtube.com/@francescocastronuovo

*********

The amazing pictures are from Jakob Owens on Unsplash:

- http://www.directorjakobowens.com/
- https://instagram.com/jakobowens
- https://twitter.com/jakobOwenss

CMS jQuery Cubic Scrollable Image Gallery

Emil Villumsen

* CMS video collection
* Custom slider with video background
* Video backgrounds on hover
* Live and running for a growth-stage startup

Arbejd dot com | Job platform

ONETOO

It's been a heck of a long time coming. A little side project for us here at ONETOO. We love where we live, so we built a site to share all the good things happening locally. 

We've done a bunch with the Webflow CMS. Built a custom ticker, which each day shows the weather via a Zapier integration with the Webflow CMS. We're soon to launch a events module, and portal too.

Take a peek, and if you can, come visit us on The Ninch.

The Ninch

Klaus Dyba

complex cms webflow page about world biggest bmx  brand wethepeople bike co. Extensive use of cms, animations and images.

wethepeople bmx bike co website

Slyy

CMS Video Lightbox Cloneable

1vaRoS0QlFL+TEUDugDt/1KXdWvhj03Qb9u2ruorsNc=

6qSamKWmkxX2fnUM9HsZmrP8aP7f2O195iTFPfRXJnU=

Abq7j8lCUGCWx2iqashROjdv8R2L4sVg4pUuROgkp4E=

BI8g38RjO9qSIoKsoKXAkzypF/jq0x6CSrMWEHlULbs=

CHiQfJJNufnbbHjt7tcZuD9wK6Bl5FwbOUHnSl3avqA=

CS4BRGaO4rUrYNAyOI44zTjp3t7P2OOu41QdwKmWO/g=

KtqtGmJAcb3wYXGo9fF+CejOVcQnOQ1CJJXG6emPyiw=

LVQMH5aS2Xt7rOUBVCdHQcS1kJ+x1s1Q6kalLh//OJ0=

RMv0YJlLOBe7cY7HgZ3Jox34R0Wrk7jLv3DZyBETA7I=

ZC8pa382rux3/Ya5JYmbaiFDJJqVQfa/ZkKRoDwNIOg=

oIkmI84/O3nodhAO/gAbs0zgY2IvPgpH6UlSycbHi/I=

vWLqV3Ov/sIqX+Ose2pF2s1IS8JnBBI9cV4HRbUYAj0=

z7lzpDYq5nfwdPMT+jWKpBj8QZv3acBNr4+vtQ9fUlE=

zRYikcIlbF3Un7C26+4VGO/t8jKwNjjuAdQWLlZECTQ=

+j+2BnaQSkzkNe0dpNHl103pbsRtVlBy3Ivqpwb7bho=

/z5rny/vN8rnsI2gxYCgnqQOFiwY847T4QIeZ6w5I34=

/zPeDB00QSmJg02UNPvvY6N+w7bL9XbOTmOZn0UHdA0=

0ACb5hSoxo1svvHlhJqD4sUSDGJ97B1kBGWGGxycXu4=

0z+EonM/Ze0RUt4FnVPK9NO8zbPrdKWPIV/2nsroWAM=

1Kas5SxzFq1TyEEK/rwk9T2BTRF97IopQx0dxEZEiV4=

1PAePmG+u2MMJihdvOPE+f3q6uU4s1vcblpYTbo4KCw=

1yPpEBxQzs5EQ8FAvcACSinRq2S2J2069sPRZVRmmxE=

2bQMcH11t5ZrdZDFAzWCq5D6s61DSuaFkYFRIDm7xwg=

4eIPknyFF46oh0mLjXLEN9nOuX2TKp2hUHUJY5aPSpQ=

4zIwhZkCZ+GlQOns3JIYBz0/OVfdZ3Y1uk/5+7mf+2A=

5FDeSfKIJLemkdT7BTuxj/qoLWYEBfG9UQBPghck3ZA=

5pIFK+PVeOj47PIVY1YpQZ0n1VhUv3AFhxF9FK3/5NU=

7xZWAYfVqaEy7CXa1ckZo3xjvoaWoIOdhw+qc8M1IKQ=

8mjRvgjeEnrPXy8+PRfmTkymyy2TZZroyVA+UwoQP3Y=

8oMNOGWYYe/dsogfowL+vLrVdT2OWWyyHB1Y4XXFWGs=

9DmxyyZ8FEsc5DSKm/8DpcDu2e/GCLlCF0UJQCEBuSw=

9Lzv3HXsA+tV2fDclVY4TYl02XNXPEq7XGg6nPEUQy8=

9q5U1E2jY0N4SeEkrtIJaTni2dqqoMZRcQjgTozZe6A=

C/5LSec5a5dvUgJbQG1ErBFEP+Az0HHizao78wic5BI=

CY7M9UIqsstwHXkY2gh+1iwe+xn/L400EHoMCr5V2Kk=

CjOPUxQfd2e9T/jCfK5kLFZtS+YknIrp9TbZsxBJ3n4=

DV5SvculpCgU62iO9dqjdXDq2NZzcZV/98XKJeIodPc=

DZW4Lt9/4nTqMYcoG7AAN7TQCRwpJ94xFJ+gE1GO2AQ=

EA6pIl34ynZu2fCXtDsf5N+8HjgmFW1iWFEJidJmjwE=

EmL/07sZTmi9xV+epHzdYP8GGRzf/PzE1igH51TIYGQ=

I6aCKEIKc6Arq7OqoqijPw7efTjUjYkQrD6nNhdEUwo=

IhRHqY3wzCgXo0jVXcXENzpOx3S2zEs3TVqX3++URlA=

JCIMc2jHTforX4kLxzXeocMmrYb+LnAgwZU0w3bCzQY=

JSUE/tzFGqA8SW6UZelJxRWNmjDOVW6AacN+s8q2058=

JXxUskpxyJf0HzDZZzk+rnqpDJoD/uHhmIBaeZ2rf2I=

JseFDRfctUKg1rAF0E6mL1YOHzQe1gVou75Mw8zcVOY=

KmttvwfoYQsBfGx+YR6WvNYQXoRwaQ+hKZS5+DHpXLk=

LOBx6XjXdHGh1Mc2TWG0lUBfYWbMOp15iStJG887/pg=

LtNTzuGC6a/O4opneIzFRwuxaT7A0jTPzl4xxFVOaJU=

Mohr77Q7dxdMguKfm9Dp+4QZR4J21VTSH1maVgI3cvY=

NP6mAIrpTB9kRjtJnW3FmZTpNpH4UMQimwJqY9Sec+k=

NaOvW/FyxHGGW+okX5dXeUZcodQswSRaUy5pwYMQCY0=

OKA/wpW5U0/bGFF7Bsd9Jpz9vIcGmsLeCg4ac42B+uM=

ONGbaY8NwLZsAON1rFnvSZpSx/C2YgSvAaKP+Qs3sy0=

P7vOA+qkoiRS/9UWXIUHxm+CI0lSj7WY2ZBiK9KyND4=

Pesmw2FSIduSR93sJEVAEAHyJZ4MQP9Pbn1gPgXxcXw=

RTjXBMHnjTqFdoDyXUO2AKPkqYypcAKcmM0zGDh4caY=

ReTHz5O++2bhIDWL5iofoqpgFh3DS7gFBY5lndMX0a4=

S3UH97cX9/DCJeeuSb/1cxTJ7CCdGRdLv4pASFeUrlQ=

W0wgK3N2DKRw7mHe/OXWveRF5zny0tvm+vG0KHiLp/Q=

XGglpWsF+VpgOjXfIqzwrxv0n1E+aPydxJbt23zu0UA=

XX0MCgYYdjyJaAld9hCk0PcNrB+fUHW+6oqNW70OCtw=

YTgvz2H2yS7kYnVdz+7EJIUOPBCJhECNTPAhmUOoe68=

aRkYfJM+J8QK/4ctRXmPW8fpZt96HgtI+Vt4w1TJqFw=

aTgdgTg3HuG2EnCKMUKWPS7IKzHa2A6MPD/HTC2OnDc=

bNYcTJMABTjrejqaTAIi80LmrWFfpTsCp44eZk1OWP0=

bsLlc2kcOlK5RWQ59v0AEAUf4ihEq1EqzVL0STw1ipU=

ca/pVHa3/6Sxei+4H7EgEWxytJZtjYaWd4gIcLS9BNk=

dHp4QfzRtLvnW6XpYp9LkZ/+UmkiRSJnCTDTHkJxhyg=

dZwrFziiqNuYnGDLDpHI1YhPjKifwSg45KCaURl8D2g=

e+VmFrHp4Yr8GXYWjDQHdWz2PclHlzv9quqbIMU/Xu0=

eDXaquyPVYoFNZ+HLRFOqPbAk7N1nlRiJhbhe4g83Es=

eKZ9sLSo6+sicIvD6P1KSh2FCMctkVM3veR39Usebi0=

eYRhaR917Kl8W9yQ5U6MBqXj8vPkIthFhiNmuNeAN78=

eYmgBZ7+8Grb61FIjGTNd9D3G+r/jczTEkvC5rm19Tk=

eecmD3rxb35ZwVocxDFRqbIjnQdCCFmngV56ILYVHa4=

fqjlnE7z3/vZw0OHR2kV0utFuXmlHUaSBJ3gfhkXNsI=

gok0DFmTbYmfgm71+6/UBa9YMdK9fta9tVCYCvw0mUk=

i5RceAnwNYDnFUmn6Nr7tYoU2zgb6WZMXFAm/Ks3EJI=

iyiyfmoKLG7KcFAH8fMkFZGer4wu8vHJodF4ieLhLsc=

kaIOlI6Nq9Q/ie+EQ0pIStIilIP0OEzSTA39Jp+4KjQ=

mDRiTqVFjYXWAoMmTKvGYstVKq4e0nZ5Ckliw/B0aEo=

mdqrxKA5yNLUO1xy5DRK+BdrEEx0DaTbUqGALpHTFfo=

oEth0GQmlQEb4LYJYa0d+c3HKD3ULkpBbWmsOKI9iAY=

p2Vh8R1nnPDbUmB2laIvAo+ftmfycxaj1wj+1VbZyLg=

p7M33hx2/QNUnwxc0CuYfz1Pt74M+mfrGVQxzk65gwY=

p8RKstqTUsFv0yM8P1EiWUksDkzfBxAw5OAvX/lo29w=

p97Dq+fIx/w3/EkGTzaK1w3GxAKb2UiB7DMgeXVqPaw=

pJfUbXSMy3I5/YgFlhkcdg6l873+JjkE05INAUxLmUI=

pJu6WGBlTFWiqPzNCkQSRb8W05i8Lzy2Nfh+m51MAZM=

pLIbUAyBVzklGHnVkB1mmXeFlr+mt/yEqhl2nYGyTl8=

qo89NZbme+e7+TR8W9q4ZzVpfBgm5f4sIK4lmlJJZ8k=

qriyvYyof2e0nw26zR6JThjy67bKClLhvHTizM7yDcg=

qwBI7cEFi2p5uofmngMNq9hyeXBei5HjbZBPsE2jVNk=

s1IkcDWaLdG1fVzmrKfXCHT56fJwoMRLaOXYYJs0NVQ=

sVP46tBNXrVbRgo8gxjQJi56Ye1Tf58d/5IGrW+t554=

tGWEp1ekGCD5QuqN7IYlGfZ+o0Bp3gDLnODVnfQtzzk=

tOlureLazS6/pYwbqdKmud6Bvaf9nA4m71Uoyrhnjxo=

taTnYyyHDohIACH0XOt7f9rsbQDo8eDaAR5/12UVIeQ=

tcmGcYpBS2ChBOHZ0EWBvqwozC4S2fVByvq+/Nu+8qk=

uP+ZzGwKBh+FYBXbqZtd32p45/OTlDem6FfMx/8OpCI=

w2/bDgmUb6OwHuhtN+Wm89zclNO2xRBG8xtJr4UsBbM=

wV9d2LzLij/UwbGC8MXX+RHNBZ5d/rww134rq+krlJQ=

xdTyVT3ZuBSNWCl2NPxJ8eZ0ifhUzatwezSwUElWFy0=

xopiPniokR0nK50Zusg9JVnovSEk5Ehp9FNP10Oe3yY=

z0Bcstj2RryBavzQoKM3ahOCQcI8zFyYwMLgeOJj6ho=

zTjP0wu4jQu1N5tp1E0KqrsQoD7VvYN4Qrege5SFXd0=

znSGofNSewV4L1nPnkUNOmgEJsZN01R3WQN2oIXOng0=

Best Cmsgallery Websites | Free Examples & Designs

Discover Cmsgallery websites
built by the Webflow community

Browse, clone, and customize thousands of websites #MadeinWebflow. Looking for templates?

Discover Cmsgallery websites built by the Webflow community

Browse, clone, and customize thousands of websites #MadeinWebflow. .css-ac9ku6{color:#2E5CFF;font-weight:normal;-webkit-text-decoration:none;text-decoration:none;cursor:pointer;}.css-ac9ku6:hover{-webkit-text-decoration:underline;text-decoration:underline;}Looking for templates?

Discover Cmsgallery websites
built by the Webflow community

Browse, clone, and customize thousands of websites #MadeinWebflow. Looking for templates?