Major block problem

I am having a major problem with layout blocks. Everything looks fine in the app, but when I do a preview, the “header block” and the “Footer block”, ram up against one another and the blocks in the center become transparent, as if the block markers are gone, but the data still wants to show through. This is happening on all pages, and I don’t know what to do to fix it at all. I didn’t notice it until the last update. Sure would be better if headers and footers were their own thing. Anyway, any help would be appreciated. Thanks,


Sorry toe hear about your Layout Block problem.
But without seeing the file or the live page it is almost impossible to help.

Mr. F.

Use the feedback option to send the project file to Tec Support.

OK, I can try to do that. I sent this same note to TEch support, but did not see an option to attach a file. I do have more information. This occurs when I set the Layout Block that is intended to be a footer and set “Custom Scrolling” to “Fix to Browser bottom”. I’ve used many web editors before, and while I like Sparkle a lot, not having dedicated hearers and footers makes it much more complicated to use, IMO.

As Mr_Fozzie points out, it is difficult to find out, what precisely you mean.

If the sum of heights of all LBs becomes bigger then the height of the browser window, Sparkle just “finishes” what you asked to do and pushes the last LB through to the end.
Try to make all Layout Blocks thinner and see, what happens. And always check their hierarchy in the Layers panel.
Using LBs needs some practise, but I find them really powerful and use them a lot.

I made a slight error, the footer does not start at the bottom of the header, but somewhere in the middle slightly above the Menu element. You can see it as where the blue starts (the header itself is white). The solid stuff (ie the logos, the mailchimp form, etc) are all part of the footers. The photos and text in the background are the other Layout Blocks, and they all scroll fine underneath, while the footer stuff on top stays put. Again, this does not occur at all when the “Fix to Browser Bottom” is clicked “off”. Note that the post with the photo is awaiting approval

Wait, maybe I am misunderstanding something. When I click on that setting, is that telling the Layout Block to reside at the bottom of the page, or literally just at the bottom of the viewing area of the browser on the screen?

fix to the browser bottom literally fixes the object on the bottom of the browser (not the page), so you can make stuff fixed that scrolls together with the page without leaving your viewport.

If you want the footer block to behave like a footer, you need to setup on teh “Arrange” tab the option “Move with Page Bottom”

With this setting enabled, it will follow the Sparkle page bottom / the handle

Then, the next thing is to set it to show up on all pages, and it will behave like a footer. Remember that each page have a different height, so whenever you move the handle, it will move the block too.

This only works for grouped objects or Layout Blocks.

There is “Move with page bottom” under Arrange/Visibility and “Fix to browser button” under Layout Block/ Custom Scrolling…


Under the menu item “Help” there are some options for feedback, including the one to send the current project by mail. For bigger files: WeTransfer is your first choice.

You seem to have a wild order on the canvas. I would always place the header at the top and the footer accordingly at the bottom.

Layout blocks don’t do wonders. You should also always pay attention to the correct arrangement.

Mr. F.

Yep, I already knew that one, but thought the other one was to attach to the page bottom. In all my web projects, I’ve never tried to attach anything to a bottom browser, so didn’t even know this was an option. Anyway, fixed and understood.

Nope, not the issue, I’ve been doing websites for many years. The footer was moving, and I didn’t know why. Now I do. I had never attempted to attach something to the bottom of the visible area of a browser, and didn’t know such a function even existed, so thought I was attaching the footer to the bottom of the page, not the bottom of the viewport of the browser. Anyway, problem resolved. Thank you

Thanks everybody. I thought the footer required BOTH the attach to bottom of browser and bottom of window, as I had never tried to attach something to the bottom of the viewport area of a browser. I actually don’t know why that would be used, but obviously some people use it. In 20+ years of making websites, I’ve never tried to do that, haha, so I didn’t even know the function existed. Also, I’ve only used Sparkle for a couple of weeks and am still figuring out its nuances. Anyway, it’s all sorted now, and I get what it was doing. Thanks again.

1 Like

I sent a note to tech support with the file in question. When in Sparkle, the page looks fine, everything is aligned and happy, on all pages. However, when running a preview, the following occurs: When the “Fix to Browser Bottom” is clicked on, the last Layout Block, intended to be the footer moves up, over all the existing Layout Blocks and attaches to the bottom of the upper Layout Block, intended to be the header. The other layout blocks are visible, but all appear to have transparency, so I see all the layout blocks and the “footer” Layout Block partially visible on top of one another. This occurs on all pages. When the Fix to Browser Bottom is not clicked, then the preview looks fine. The issue occurs only when that feature is clicked on, and is completely reproducible. Layout Blocks aren’t particularly unusual, Wix calls them strips, and there is a similar setup in Dreamweaver, although I don’t remember the name right now. The problem isn’t with my understanding of the concept, but that the behavior of the layout block assigned as “footer” does not operate as expected. My page/browser lengths are fine, and looks perfectly aligned in the Sparkle app, without any issue, it’s when I preview it, ie, look at it in action, that it goes wonky. I will try to attach the image of it in preview mode. The footer is sitting on top of the rest of the page, and the page itself scrolls normally under the fixed position of the footer.

Oh yeah. That looks strange.

Please keep us here up to date if it’s a bug that needs to be fixed or “user made confusion” :face_with_hand_over_mouth:

How has it been fixed?

Mr. F.

Nope, does not appear to be a bug. Just new to Sparkle (2 weeks or so) and how it works compared to other web designers.

I have had an issue with text labels on sliders not going where they are supposed to on initial loading of a file, and I’m not sure if it’s a bug, or if I haven’t grouped things properly, and have had a few instances where grouping objects has caused crashes, but nothing as predictable as the block issue that was due to my misunderstanding. If I have further issues like that, I will let you know.