CSS Grid Works Great With Sitecake

#1

CSS grid layouts are definately the right way to create Sitecake themes. Here are all different possible layouts and resources:

https://gridbyexample.com/patterns/

and some reference

2 Likes
Think about idea
#2

I struggle to see how Sitecake can work with a grid layout. A grid consists of nested divs – and nested divs are exactly what keeps Sitecake from working properly. In my grid-based sites I have not been able to drag and drop content, add text, images or video, all I can do is edit text and headlines in selected divs. I thought this was probably due to the “no nesting” rule. Before I look for an alternative to Sitecake – is there something I’m missing?

#3

It really works. CSS grid is really concise and poweful at the same time.
Here are two examples.

A responsive photo gallery, Sitecake editable and created with CSS grid.
https://codepen.io/Sitecake/pen/eYpooxR

See the video here

Masonry style photo galler, Sitecake editable and created with CSS grid.
https://codepen.io/Sitecake/pen/QWbNRjM

pinned #4
#5

You can find photo gallery code on Github too.

#6

Thank you, good to know!

Still, while I can edit existing text inside non-nested divs in my grids, I can’t change pictures or add new content. I guess you can’t switch out images that have classes assigned to them?

When I bought the white label version, I thought that sitecake would treat every div like the demo site and my clients would be able to freely add content via drag and drop inside every div of a grid layout. I guess there’s no way to archive that?

#7

SItecake can edit any kind of content (text, images, videos) like in demo site. Maybe you have some issues with the integration. Please create a ticket and I will help you to fix your template.

https://support.sitecake.com/hc/en-us/requests/new