A standardised warning banner in Orchard

In the posts I've written about creating a certificate authority and SSL certificates for use in a Dev/Test environment (part 1, part 2), I wanted to have a standard banner at the top of them that warns that there's stuff in there that's not best practice (i.e. the fact that the private key isn't locked away in an airtight bunker!) without having to copy and paste it from one post to the next:

One way I found to do this was to create a new Widget that contains the text and use that to replicate the warning banner across each of the pages.

Creating an HTML widget and applying it to multiple pages

The first thing to do is to create a new layer for the widget to live "in", and configure the rules that determine which pages the layer is applied to:

1. From the Orchard dashboard (~/Admin) select "Widgets" in the menu on the left-hand side
2. From the Widgets page, click on "Add a new layer..." at the top of the page (inbetween the "Current Layer" and "Current Culture" drop-downs
3. Fill in the "Name" field to give the layer a name
4. Fill in the "Layer Rule" starting with one blog post / page that you want the warning text to appear on, for example: url("~/blog/creating-your-own-certificates-for-development-test-environments-part1")
5. Click "Save"

The next thing to do is to create the widget text itself for the layer, so that it will show up on pages:

1. From the Orchard dashboard (~/Admin) select "Widgets" in the menu on the left-hand side
2. Select the layer that you previously created in the "Current Layer" drop-down at the top of the page
3. (Optional but makes it easier to see what's what!) Click "Hide All" next to "All Layers" on the right-hand side of the page; Orchard will now only show you widgets that are present on this layer
4. Looking at the list of page sections on the left-hand side of the page, click the "Add" button for the "BeforeContent" section
5. Choose "Html Widget" on the "Choose A Widget" page
6. Name the widget and use the HTML editor to enter the content you want to appear, then click "Save"

Browsing to the page that you entered the URL for in step 4 (Fill in the "Layer Rule") from the first set of steps should now show you the banner acros the top of the page. You can customise and tweak the way it looks by modifying the HTML Widget until it looks just how you want it. I ended up tweaking it by using the "Source code" (the button with <> on it) editor to change the styling.

If/When you want the banner to appear on multiple pages, you can go back into the "Widgets" part of Orchard, select the layer for your banner in the "Current Layer" drop-down and click "Edit" to update the rule, as this is what determines the pages that the layer is applied to. The Orchard documentation contains a table that covers the different parts that can be present in the expression for the "Layer Rule". It really would be nice if there was a baked-in part of the syntax that allowed you to apply a rule based on a tag!