I’ve ben experimenting with the suite of Sentry CMS stacks and wanted to find a way of placing the login icon neatly in the footer, aligned with the other content there. The stacks’ author Will Woodgate has come up with a way of achieving this and I thought it was worth sharing in case any other Sentry users would like to do the same thing. All the clever stuff is his, any mistakes are mine.
Note: because different themes use ExtraContent areas in different ways and place them in different parts of the page, you’ll need to experiment when assigning the EC stack a number. It’s just trial and error I’m afraid.
-
In Edit mode, go to Settings in the left hand column and choose General
-
Place the following code into the Footer field
<div id="extraContainerxyz"></div>
where ‘xyz’ is the number of the ExtraContent container you want to create -
Drop the free ExtraContent stack into the page where you want to use the Sentry Login stack
-
Drop the Sentry Login stack into the ExtraContent stack
-
In the Page Inspector, assign the ExtraContent stack the same number as you’ve used in the code that’s placed in the footer in Step 2.
-
Switch to the Code page in Settings and select the CSS tab
-
Add the following code to your site-wide CSS, noting that first that the number next to the ExtraContent container must match the number used in Steps 2 and 5; and that you may have to fiddle with the bottom margin to line the icon up correctly.
#extraContainer5 {
display: inline-block;
}#extraContainer5 .sentryLoginTrigger {
margin-bottom: -6px;
}
Save and preview.
You now have a login icon that sits neatly in the footer.
Rob