Show 'Subscribe' banner above masthead

[briggySmalls]

Skin deep want a banner above the masthead that will encourage users to subscribe. This should hyperlink to the subscription product.

[briggySmalls]

The 'Header Image' customization options that catch base provides out of the box, appear suitable for this. By choosing 'Before Header' the banner will appear there, with the sticky masthead appearing immediately afterwards. Scrolling down triggers the masthead to 'stick'. The theme also allows for specifying a URL to link to

[briggySmalls]

@jerome-toole Anu wants me to provide Sylvia with dimensions for the banner image. She wants something like at www.idler.co.uk, see image attached.

How do you decide what dimensions to draw things at? For the largest anticipated screen size? e.g. retina resolution?

[jerome-toole]

I would go with retina. With that one, the image is only as wide as the text and the rest is just a background color - saves on image size and also makes it respond to screen width better.

On Mon, Mar 6, 2017 at 11:33 PM, briggySmalls notifications@github.com wrote:

@jerome-toole https://github.com/jerome-toole Anu wants me to provide Sylvia with dimensions for the banner image. She wants something like at www.idler.co.uk, see image attached. [image: screen shot 2017-03-06 at 23 31 49] https://cloud.githubusercontent.com/assets/11054133/23634989/23d8cc54-02c5-11e7-8ba5-6eb1e67b4a96.png How do you decide what dimensions to draw things at? For the largest anticipated screen size? e.g. retina resolution?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/jerome-toole/skindeep/issues/24#issuecomment-284570105, or mute the thread https://github.com/notifications/unsubscribe-auth/AFRZOw6gIkFR1lTnhEY-ZmGlm8pPwV1oks5rjJflgaJpZM4MU1l- .

-- 07963714722 @ http://twitter.com/jamronejamrone design.jerometoole.co.uk

[briggySmalls]

The Idler banner has dimensions:

• 1000x76 image limited to 640 max-width
• Block with yellow background limited to 1000 max-width These are good reference dimensions

It uses CSS like:

width: 
max-width: 1000px;
background: #ffd800;
margin: 0 auto;

[briggySmalls]

Merged in dceef4d