GLAM style
Welcome to the GLAM style!
editThis page explains the use of the GLAM style, a suite of templates and styles to make uniformly styled visual pages on Metawiki.
Creating a new page
editChoose the name
editIf you are creating a new page for your project, choose the name of your main page. You should use this name in all the element versions you create for your own project. Create your page in https://meta.wikimedia.org/wiki/<yourpage>
.
Create the header
editTo use GLAM style for your new project, you will first need to create a version of the header. The header contains the upper part of the page, including a link to the stylesheet, the header image and texts, as well as the menu.
Copy the content of Template:GLAM/Main_navigation to https://meta.wikimedia.org/wiki/Template:<yourpage>/Main_navigation
This makes the style Template:GLAM/style.css available for your page with heading styles and styles for content components. It is the stylesheet that is shared across similarly styled pages.
🔥 At the moment, you need to create your own separate copy of Template:GLAM/Main_navigation, but work is ongoing to make a master template.
If you want to make changes or additions to the style
editIf you wish to extend the style for your own page, keep the basics but add your own flavor.
- Create a new stylesheet in
https://meta.wikimedia.org/wiki/Template:<yourpage>/style.css
- Add a link to it in your header template at
Template:<yourpage>/Main navigation
. Add the code<templatestyles src="<yourpage>/style.css" />
after the existing templatestyles link. Do not replace existing code, but keep both stylesheets: GLAM/style.css and <yourpage>/style.css.
Using the header
edit➜ Read more about how to use the header
Basic box
editThe core of the style is the use of content boxes. The boxes share a common template, which is Template:GLAM/Box. You can create boxes that have an image and some content, and that can be laid out in a grid. There are many properties that the template can take. Hit edit, select the box, and hit edit on the template to see all the properties you can add.
This is an example of a basic box
This is the part of the template that holds the textual content. The basic box can be light grey or blue. The button can be blue or negative with blue edges on grey / white edges on blue, or white. It can also be smaller in size.
➜ Read more about content boxes
Layouts for boxes and lists
editTo create different grids and lists that are responsive and adjust to different devices, the content boxes must be used with container <div> tags. The containers divs use css classes that arrange the boxes in grids and lists of different sizes and behaviours.
Examples of derivative boxes
editFurther templates are created using the basic box and adding specific features.
➜ Read more about derivative boxes
Wiki Loves Monuments
Guru Dutt
dry stone walling
Catalog of derivative boxes
editThe boxes do not have their own style, they use the style that us in use on the page. The layout assumes the use of a derivative of the GLAM style.
Main page | Box | Properties |
---|---|---|
Wiki Loves Living Heritage | Smallbox | |
GLAM | Highlight |
|
Further templates
editArticlerow was initially created for a news section component, this template is used for event listings and other types of visual link lists.
➜ Read more about various different templates
Page creation workflows
editUsing Wikidata and Listeria
edittktk
Translating pages and components
edittktk
Reporting problems
editThe dark mode has not been catered for yet.
There are known issues with the mobile view and the menu.
The submenus will be worked on soon.
Make Phabricator tickets and tag with [tag to be added].