Layout Blocks and Devices

I did another test with a new page. I created the desktop layout and made two Layout Blocks. Switching to the PS layout showed the Blocks correctly.

There seems to be only one problem when you want to set up layout blocks on already existing pages (desktop and PS layout are ready).

Mr. F.

1 Like

I did not make the connection that it would be a problem in PC layout view to set up Layout Blocks on existing pages that were already custom laid out for Portrait Smartphone (PS). I have another website I designed in PC view that I did not custom layout the PS view. Adding Layout Blocks in PC layout view showed up correctly in PS view and did not mess up the design.

I have to believe there are a number of Sparkle users who upgraded to version 4 who ran into this problem when moving content to Layout Blocks, if this really is the source of the problem. Is it correct to say that users should be advised not to use Layout Blocks in PC layout view on existing pages if those pages were already custom laid out in Portrait Smartphone layout view? And if that is the case, perhaps Sparkle should include this caution in the documentation (it might already be there but I did not see it).

I changed an existing website to a site with Layout Blocks and it works like a charm.
What I did is divide the page (in my head) in sections. I selected those sections and then right click and you can put that selection directly into a layout Block. Easy peasy and no fuss. The only “problem” I have is that I think 5px is really tiny on a mobile.

4 Likes

This was my experience as well…

2 Likes

Same experience, wonderful addition

3 Likes

The small font on mobile can be adjusted if you have your styles set up. You may change the font size in styles for mobile without affecting the other styles used on other devices.

2 Likes

I’m currently updating my homepage with layout blocks and perhaps two of my own experiences while working with them might be helpful:

First:
One good thing in sparkle is the independence of size and position of items in different layouts. But this also may cause a problem: Let’s say, you want to create three identical boxes using them as backgrounds. You create one and then you copy and paste the two others. Now you arrange them on your landscape page: box 1 at the top, box 2 in the middle and box 3 at the end. When creating the portrait smartphone page, it might be possible that you arrange them in a different way, simply because you selected box 3 first and placed this box at the top, box 2 in the middle and box 1 at the bottom. Normally it doesn’t matter because the boxes are just identical.
But when you use layout blocks and you select box 1 (top) on the landscape page you select exactly box 1 in portrait Smartphone layout, which, in my example, is placed at the bottom of the page.
And now the confusion is perfect: In landscape mode all seems in the right order while in portrait mode the items are grouped to a layout block widely scattered over the page.
You can avoid this by the use of a strictly identical sequence of the elements on all layouts, which is no problem when creating new sites but might be a slumbering problem in existing projects especially when revised several times.
That might be the reason for your problem.

Second:
If you collect some elements by selecting them while pressing the “Shift” key and you want to arrange them to a layout block, the sequence you select the items is reversed arranged in the layout block. For example: to arrange a text box over a background box you have to select the background first and then the text box. In the layout block they are arranged properly.

3 Likes

guauuuu!! Por fin, lo entendí!!
Gracias!! :wave: :wave: :wave:

This does make sense and it does explain some of the “odd” behavior I have been experiencing going between Landscape and Portrait Smartphone. I have two personal sites that I originally designed in Sparkle maybe three years ago, with lots of edits over the years. Getting them properly into the Layout Blocks is key and your explanation helps with that process. For me it has been a lot of trial and error to understand the behavior of the Layout Blocks and what works and does not work going between devices. I am not a fan of the Sparkle Documentation. There is a lot of information but for my mind it is not always clear and seems to skip over some of the basics. For example, how to work with Layout Blocks with an existing website design. It sounds like you found these solutions from the same trial and error and experience vs. reading about it in the documentation. I guess we all learn best by doing.

1 Like

For the time being until more documentation and bug fixes don’t use layout blocks.
You don’t have to use them to produce what you want.
-Bill

1 Like

Hey Bill,
Thanks for that sensible recommendation.

Joe O’Laughlin

Hi.

Well, I can kind of agree with Woodrow.
Certainly, layout blocks have their right to exist, but many things can be realised without them. There is still some sand in the gears.

What I can imagine are dynamic pages where posts have to be added or shortened. That would make it easier to move the blocks.

We’ll see what update Sparkle has in store here.

Mr. F.

I really like the idea of the Layout Blocks. When I first posted for this thread I was frustrated because I took full pages of a website, dividing the pages into sections of elements that were applied to Layout Blocks. After doing that my custom designed Portrait Smartphone pages were a mess. I’m not sure if applying Layout Blocks were the cause or what, although it was the only thing I changed prior to the mess.

It took me a fair amount of trial and error to figure out the nuances of Layout Blocks. Once I got elements “properly” situated in their Layout Block, they seemed to behave well. I write “properly” because I have no idea whether I am following best practices in doing all of this, from the creation of my existing sites to transitioning those sites over to the Layout Block system.

I would really like to see Sparkle put together either one video or a series of videos that walks through the Sparkle workflow. For example in regards to Layout Blocks, at what point should you apply a Layout Block: as you go section at a time on a page, or after you have completed your page design? How do you go about deleting a Layout Block without deleting the elements within the Block? How do you add elements to an existing Layout Block? How do you take one Layout Block and divide it into two? These are all most of the issues I had to figure out by trial and error.

4 Likes

Hi.

Maybe this could help: first remove / move the elements in the block, then delete the Layout Block.

Mr. F.

1 Like

I like the idea of Layout blocks, I used to use a website designer that worked on layout blocks.
I will have a template file with all blocks I create, if I need a block again or have repetitive layout section then I can just drag and drop in the position I need it and alternate the content. That side layout will make the room for the new block automatically so you don’t have to fickle around as you need to do without layout blocks.
I hope that makes sense.

2 Likes

I do know that. Would be nice to have it as a default setting on 8px any way. But that is just me!

1 Like

Drbernd, your comments are very interesting and relevant. I think this is exactly my concern with v4 layout blocks.
I built my V4 project by copying/pasting objects from a V3 project into layout blocks. And the behaviors when switching from one device to another are completely surreal and very frustrating!
Now I work with next to my Mac a small doll with the effigy of Duncan and I stick a needle in it five times a day ! :ghost:
Despite a lot of time and effort, I am still unable to solve this walking layout block problem.

2 Likes

Not aware of any further issue with layout blocks. Please email us any relevant description, list of steps, screenshots etc to reproduce the issue to feedback@sparkleapp.com so we can fix it.

Pins in the backside are starting to hurt, please stop :stuck_out_tongue_winking_eye:

4 Likes

Ok Duncan,
as soon as the problem reproduces and that I can trace the sequence I send you the file with description

Sorry, just realised wrong thread. Put my question now here.