Remove Share buttons from utility page template and make utility pages full-width on desktop

[StephenAbbott]

Pages like the Terms and Privacy pages on the Open Ownership website use the utility page template in Wagtail.

The share buttons which take up the right-hand column on these pages are redundant and we'd like to introduce the ability to remove them.

Alongside this change, we'd also like for any code blocks added to the body field of utility pages to display across the full width of the utility page when viewed on desktop

[philgyford]

@StephenAbbott Can you let me know how you're adding code blocks to the body field? I can't see a specific code block so maybe you're using Raw HTML? I want to make sure I'm working with whatever content you'll actually use. Thanks!

[StephenAbbott]

Hi @philgyford. Good to see you round these parts again. Hope all is well.

Apologies. When I said "code blocks" above, I was meaning to refer to the Rich text / Embed / Table / Raw HTML / etc... blocks that you can add to any body section using the existing Wagtail tools:

We definitely plan to use the Raw HTML block on utility pages going forward if that helps at all. I'm not sure whether we have tested its use on utility pages before.

[philgyford]

Ah sorry, crossed wires – I thought you meant blocks containing code!

So, if there are no sharing buttons, you'd want a Utility page to look as if there's no right-hand column at all? Looking something like this?

It does make the lines rather long and harder to read I think?

(All good here thanks! Nice to be back temporarily.)

[StephenAbbott]

@philgyford Yes exactly. We'd want a Utility page to look as if there's no right-hand column at all.

Appreciate your warning about making the lines long when these pages are viewed on desktop (right-hand column hidden on mobile anyway), but I think it will be OK.

I believe the template is only used for our Terms and Privacy pages but we are planning on adding a new utility page with some embedded graphics/interactive visuals.

[philgyford]

@StephenAbbott I haven't thought much about how to do this, but one alternative might be to keep the body text the current width but, on utility pages, allow certain elements – like images and tables - be the full width. Here's how it would look for a table, for example:

That'd keep the text to readable length but allow wider things as much space as possible.

[StephenAbbott]

@philgyford I'll send this to a colleague to ask their thoughts and get back to you

[StephenAbbott]

@philgyford Have consulted with colleagues who agree with you that keeping the body text the current width but, on utility pages, allowing elements like images and tables to be full width is the best approach here.

I think the following elements should be full width:

• Embed
• Table
• Image
• Raw HTML

based on the feeling that Rich text, Pull quote, Summary/highlight box, Link and Details are all text-focused elements.

How does this sound to you?

[philgyford]

@StephenAbbott Sounds good - I'll see what I can do and let you know if there are any difficulties with any of those.

One thing I should have thought of before: It would simpler (in terms of reducing the number of varying template possibilities) if we made it so that Utility Pages never have sharing buttons. So, there wouldn't be a switch to turn them off/on – if you're making a Utility Page there would never be sharing buttons, and Embed, Table, etc would always be full width. Does that sound OK?

[StephenAbbott]

Yes. That's great. No need for sharing buttons

[StephenAbbott]

Signed off ✅