Sentry CMS - how to place the login icon in the footer

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.

  1. In Edit mode, go to Settings in the left hand column and choose General

  2. 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

  3. Drop the free ExtraContent stack into the page where you want to use the Sentry Login stack

  4. Drop the Sentry Login stack into the ExtraContent stack

  5. 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.

  6. Switch to the Code page in Settings and select the CSS tab

  7. 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

5 Likes

If you have a one page website which uses Sentry CMS you could uncheck the Display Login Button in the Sentry Login stack on that page and then, within Settings, General, Footer add something like this:

<a href="http://yourpageaddress.com/index.php?action=login"> <i class="fa fa-lock"></i></a> - © 2017 your company name

This topic was automatically closed 6 days after the last reply. New replies are no longer allowed.