Please provide steps for having same layout frontend as in backend

[StrangeTech]

@JacobDK

This is not working - and if I try with a Page-template it is not working either.

But I need a step-by-step as with many other awesome features

I don’t have a lot of time this evening, but I will do a quick summary to help you get started:

1. Create a “Default” template of “Single Item: Post” in Cwicly Themer > Templates
2. Give it the visibility conditions shown in this post:

@StrangeTech

Can you please try setting the visibility conditions for the Single Item: Post template to the following:

3. Edit the template (as per your design requirements) and where you want the post content to appear, add a Cwicly Post Content block
4. With the Post Content block selected, add a global class called “default-post-content”
5. Edit that global class by clicking its chip in the block inspector (so it is highlighted with a light border)
6. Add whatever background colours and styles you require for the entire block (with the class still selected)
7. For individual elements (e.g. paragraphs and headings) add relative styles to the global class as per this post:

@StrangeTech

Here are the settings I used to centre the content within the editor to a max-width using a relative style (named All elements).

I hope this gives you some inspiration.

The obvious caveat is that any styles, including max-width you set must also work correctly on the front-end. This is relatively straightforward because the intention is usually to match the editing experience to the front-end display, so as long as you apply those styles using the post content block, everything just works in both places.

You have complete control over the styling of any and all blocks within the post content and these styles will be applied to the editor and the front-end display.

Please note: Some screenshots in that post show relative styles directly on the post content block, I am recommending applying them to the global class instead, let me know if you need further clarification on this.