Meta copy
To come
Think of these as tags that help to categorise the content of a page. Ten or 12 is probably a good maximum number to have.
Description
Keep it brief - just describe what this page is about.
Meta tags
#### EBI Content review EMBL-EBI uses several special meta tags to help ensure content can owners can be updated, and that content is up to date.
<meta name="ebi:owner" content="John Doe"> <!-- Who should be contacted about changes -->
<meta name="ebi:review-cycle" content="30"> <!-- In days, how often should the content be reviewed -->
<meta name="ebi:last-review" content="2015-12-20"> <!-- The last time the content was reviewed -->
<meta name="ebi:expiry" content="2016-01-20"> <!-- When this content is no longer relevant -->
Local masthead image and colour
You can use thesse to specify colours or imagery you'd like for the local masthead. You could achieve a similar look through CSS, but this method offers more reusability and allows for planned future expansion, such as dynamic selection.
<meta name="ebi:localmasthead-color" content="#091314">
<meta name="ebi:localmasthead-image" content="//ebiwd.github.io/EBI-Framework/images/backgrounds/embl-ebi-background-4.jpg">
To format your image, note the it will be alligned to the top-right of the local masthead, and you should account for wide screen displays.
Here are some recommended specs:- width: 2462px
- height: 322px
Meta copy HTML
Meta copy is the content of meta tags in a page - keywords and description. Ideally, words from your meta copy should be repeated in the macro copy of your page. Apart from being clear, this may help the page ranking in search engines. ### Keywords <p>Think of these as tags that help to categorise the content of a page. Ten or 12 is probably a good maximum number to have.</p> <h3>Description</h3> <p>Keep it brief - just describe what this page is about.</p> <h3>Meta tags</h3> #### EBI Content review EMBL-EBI uses several special meta tags to help ensure content can owners can be updated, and that content is up to date. <p><code class="block"> <meta name="ebi:owner" content="John Doe"> <!-- Who should be contacted about changes --> <br/> <meta name="ebi:review-cycle" content="30"> <!-- In days, how often should the content be reviewed --> <br/> <meta name="ebi:last-review" content="2015-12-20"> <!-- The last time the content was reviewed --> <br/> <meta name="ebi:expiry" content="2016-01-20"> <!-- When this content is no longer relevant --> </code></p> <h4>Local masthead image and colour</h4> <div class="row"> <div class="columns medium-8"> <p>You can use thesse to specify colours or imagery you'd like for the local masthead. You could achieve a similar look through CSS, but this method offers more reusability and allows for planned future expansion, such as dynamic selection.</p> <code class="block"> <meta name="ebi:localmasthead-color" content="#091314"> <br/> <meta name="ebi:localmasthead-image" content="//ebiwd.github.io/EBI-Framework/images/backgrounds/embl-ebi-background-4.jpg"> </code> </div> <div class="small callout columns medium-4"> <p><img src="https://ebiwd.github.io/EBI-Framework/images/backgrounds/training-yellow-4.jpg"></p> <p>To format your image, note the it will be alligned to the top-right of the local masthead, and you should account for wide screen displays.</p> Here are some recommended specs: <ul> <li>width: 2462px</li> <li>height: 322px</li> </ul> </div> </div>
Meta copy Style
You can find the original source of the CSS
as .scss
Meta copy
Have a use case that's not covered?
Please open an issue in the tracker. We'll update this living pattern library with your feedback.