Developer forum

Forum » Swift » Multi column pages

Multi column pages

Adrian Ursu Dynamicweb Employee
Adrian Ursu
Reply

Hi guys,

We have faced a few situations where we had to handle pages with 2 columns (one sidebar for Navigation) and one for content, where you should be able to add multiple rows and columns (mainly for the content part but sometimes also for the sidebar).

I believe that we should have a default Swift approach for this scenario.
So far, I ended up creating a new Page template with 2 grid definitions and a preconfigured column split (3-9).
This allows defining 2 regions in the page where the admin can play around with rows and columns for every region.

If you guys have another solution to this issue, I would be happy to hear about it.

Thank you,

Adrian


Replies

 
Nuno Aguiar Dynamicweb Employee
Nuno Aguiar
Reply

Hi Adrian,

 

I also see that need. We tend to be creative or work around it, so far successfully, but I am curious to see how that worked out for you. Would you mind sharing the page template so I can take a peek?

 

Best Regards,

Nuno Aguiar

 
Adrian Ursu Dynamicweb Employee
Adrian Ursu
Reply
This post has been marked as an answer

Hi Nuno,

Sure. No problem.

I have attached it here.

It's basically a mix between a standard page and the 2 columns 3-9 row and an additional grid region (remember the dwcontent placeholders from way back).

I am not sure if DW intended to keep this functionality with multiple grids on the same page, but so far it seems to be working :)

Adrian

 

Votes for this answer: 1
 
Nuno Aguiar Dynamicweb Employee
Nuno Aguiar
Reply

Hi Adrian,

 

I was curious how the Visual Editor would work with it, but it behaves just fine. I believe it's an OK solution for now.

 

You could add your Page Item type with a page property field to choose the columns width (i.e. a dropdown choosing any of the 2 column variations you'd want). But I know it's limitative, in the sense that you cannot mix and match and have 1 full row at the top and another one underneath it and whatnot (we did not in the past for Newsletters/emails before the Visual Editor).

 

But this would already solve for some common scenarios like in the Customer Center, where you always want the menu on the left and may have a bunch of other paragraphs on the right. Well done!

 

Best Regards,

Nuno Aguiar

 
Adrian Ursu Dynamicweb Employee
Adrian Ursu
Reply

Hi Nuno,

I am glad it works well for you. I was also pleasantly surprised to see the Visual Editor behaving so well in an untested scenario.

I was unsure if the setting on the page ItemType would be loaded in time to create the grid information. That's why I have not tried the configuration.

But you can try to set up the proportion between columns in the Page ItemType. 

In my case, Customer Center was the main scenario I needed a solution for. But it would also work for any content structure that has subpages and requires a sidebar.

We will explore further, for sure. I blieve this could be a good direction for the Swift team to expand it further.

Thank you,

Adrian

 
Suzi Louring
Suzi Louring
Reply

+1

 
Imar Spaanjaars Dynamicweb Employee
Imar Spaanjaars
Reply

Thanks Adrian. I just used your template in a site and it worked like a charm.

@dynamicweb / @swift-team: any chance we can see something like this in the box? I think this is a common scenario and it would be nice to have this "just work".

Imar

 
Adrian Ursu Dynamicweb Employee
Adrian Ursu
Reply

Hi Imar,

I am glad it worked.

I have noticed though that in some cases, the rows and columns of the visual editor are doubled and I have no idea how to prevent it.

Adrian

 
Nicolai Pedersen Dynamicweb Employee
Nicolai Pedersen
Reply

Hi Imar

I do not see this coming to Swift. It is very old school to do sidebars and it is not common enough to put it into Swift.... But you now have a custom solution you can put into use when needed.

 
Adrian Ursu Dynamicweb Employee
Adrian Ursu
Reply

Hi Nicolai,

I would normally agree with you, except that for Customer center (for example) you would have a sidebar. For a Blog or News list, you would (sometimes) have a sidebar (for filtering, categories etc).

There are situations (especially in B2B scenarios) where sidebars are used. There can be a lot of options for sidebars including collapsible ones. Even if it could look "old school" in some situations it would make sense for a better UX.

Thank you,

Adrian

 

 

 
Imar Spaanjaars Dynamicweb Employee
Imar Spaanjaars
Reply

Another common scenario would be contact data. On the left I could have an 8-column section with general information. In a sidebar on the right I'd like to present different contact options. If I could add multiple Text paragraphs to a single column, each of them could have its own heading and text, like this:

Currently, I think the only way to accomplish that today would be to use inline styling in the editor to make Address and Phone a heading inside a single paragraph. Or are there other ways?

 

 

You must be logged in to post in the forum