├── LICENSE ├── README.md ├── docker ├── Dockerfile ├── README.md └── do-nothing └── getting-started ├── domain-name.md ├── for-authors.md └── preparation.md /LICENSE: -------------------------------------------------------------------------------- 1 | Apache License 2 | Version 2.0, January 2004 3 | http://www.apache.org/licenses/ 4 | 5 | TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION 6 | 7 | 1. Definitions. 8 | 9 | "License" shall mean the terms and conditions for use, reproduction, 10 | and distribution as defined by Sections 1 through 9 of this document. 11 | 12 | "Licensor" shall mean the copyright owner or entity authorized by 13 | the copyright owner that is granting the License. 14 | 15 | "Legal Entity" shall mean the union of the acting entity and all 16 | other entities that control, are controlled by, or are under common 17 | control with that entity. For the purposes of this definition, 18 | "control" means (i) the power, direct or indirect, to cause the 19 | direction or management of such entity, whether by contract or 20 | otherwise, or (ii) ownership of fifty percent (50%) or more of the 21 | outstanding shares, or (iii) beneficial ownership of such entity. 22 | 23 | "You" (or "Your") shall mean an individual or Legal Entity 24 | exercising permissions granted by this License. 25 | 26 | "Source" form shall mean the preferred form for making modifications, 27 | including but not limited to software source code, documentation 28 | source, and configuration files. 29 | 30 | "Object" form shall mean any form resulting from mechanical 31 | transformation or translation of a Source form, including but 32 | not limited to compiled object code, generated documentation, 33 | and conversions to other media types. 34 | 35 | "Work" shall mean the work of authorship, whether in Source or 36 | Object form, made available under the License, as indicated by a 37 | copyright notice that is included in or attached to the work 38 | (an example is provided in the Appendix below). 39 | 40 | "Derivative Works" shall mean any work, whether in Source or Object 41 | form, that is based on (or derived from) the Work and for which the 42 | editorial revisions, annotations, elaborations, or other modifications 43 | represent, as a whole, an original work of authorship. For the purposes 44 | of this License, Derivative Works shall not include works that remain 45 | separable from, or merely link (or bind by name) to the interfaces of, 46 | the Work and Derivative Works thereof. 47 | 48 | "Contribution" shall mean any work of authorship, including 49 | the original version of the Work and any modifications or additions 50 | to that Work or Derivative Works thereof, that is intentionally 51 | submitted to Licensor for inclusion in the Work by the copyright owner 52 | or by an individual or Legal Entity authorized to submit on behalf of 53 | the copyright owner. For the purposes of this definition, "submitted" 54 | means any form of electronic, verbal, or written communication sent 55 | to the Licensor or its representatives, including but not limited to 56 | communication on electronic mailing lists, source code control systems, 57 | and issue tracking systems that are managed by, or on behalf of, the 58 | Licensor for the purpose of discussing and improving the Work, but 59 | excluding communication that is conspicuously marked or otherwise 60 | designated in writing by the copyright owner as "Not a Contribution." 61 | 62 | "Contributor" shall mean Licensor and any individual or Legal Entity 63 | on behalf of whom a Contribution has been received by Licensor and 64 | subsequently incorporated within the Work. 65 | 66 | 2. Grant of Copyright License. Subject to the terms and conditions of 67 | this License, each Contributor hereby grants to You a perpetual, 68 | worldwide, non-exclusive, no-charge, royalty-free, irrevocable 69 | copyright license to reproduce, prepare Derivative Works of, 70 | publicly display, publicly perform, sublicense, and distribute the 71 | Work and such Derivative Works in Source or Object form. 72 | 73 | 3. Grant of Patent License. Subject to the terms and conditions of 74 | this License, each Contributor hereby grants to You a perpetual, 75 | worldwide, non-exclusive, no-charge, royalty-free, irrevocable 76 | (except as stated in this section) patent license to make, have made, 77 | use, offer to sell, sell, import, and otherwise transfer the Work, 78 | where such license applies only to those patent claims licensable 79 | by such Contributor that are necessarily infringed by their 80 | Contribution(s) alone or by combination of their Contribution(s) 81 | with the Work to which such Contribution(s) was submitted. If You 82 | institute patent litigation against any entity (including a 83 | cross-claim or counterclaim in a lawsuit) alleging that the Work 84 | or a Contribution incorporated within the Work constitutes direct 85 | or contributory patent infringement, then any patent licenses 86 | granted to You under this License for that Work shall terminate 87 | as of the date such litigation is filed. 88 | 89 | 4. Redistribution. You may reproduce and distribute copies of the 90 | Work or Derivative Works thereof in any medium, with or without 91 | modifications, and in Source or Object form, provided that You 92 | meet the following conditions: 93 | 94 | (a) You must give any other recipients of the Work or 95 | Derivative Works a copy of this License; and 96 | 97 | (b) You must cause any modified files to carry prominent notices 98 | stating that You changed the files; and 99 | 100 | (c) You must retain, in the Source form of any Derivative Works 101 | that You distribute, all copyright, patent, trademark, and 102 | attribution notices from the Source form of the Work, 103 | excluding those notices that do not pertain to any part of 104 | the Derivative Works; and 105 | 106 | (d) If the Work includes a "NOTICE" text file as part of its 107 | distribution, then any Derivative Works that You distribute must 108 | include a readable copy of the attribution notices contained 109 | within such NOTICE file, excluding those notices that do not 110 | pertain to any part of the Derivative Works, in at least one 111 | of the following places: within a NOTICE text file distributed 112 | as part of the Derivative Works; within the Source form or 113 | documentation, if provided along with the Derivative Works; or, 114 | within a display generated by the Derivative Works, if and 115 | wherever such third-party notices normally appear. The contents 116 | of the NOTICE file are for informational purposes only and 117 | do not modify the License. You may add Your own attribution 118 | notices within Derivative Works that You distribute, alongside 119 | or as an addendum to the NOTICE text from the Work, provided 120 | that such additional attribution notices cannot be construed 121 | as modifying the License. 122 | 123 | You may add Your own copyright statement to Your modifications and 124 | may provide additional or different license terms and conditions 125 | for use, reproduction, or distribution of Your modifications, or 126 | for any such Derivative Works as a whole, provided Your use, 127 | reproduction, and distribution of the Work otherwise complies with 128 | the conditions stated in this License. 129 | 130 | 5. Submission of Contributions. Unless You explicitly state otherwise, 131 | any Contribution intentionally submitted for inclusion in the Work 132 | by You to the Licensor shall be under the terms and conditions of 133 | this License, without any additional terms or conditions. 134 | Notwithstanding the above, nothing herein shall supersede or modify 135 | the terms of any separate license agreement you may have executed 136 | with Licensor regarding such Contributions. 137 | 138 | 6. Trademarks. This License does not grant permission to use the trade 139 | names, trademarks, service marks, or product names of the Licensor, 140 | except as required for reasonable and customary use in describing the 141 | origin of the Work and reproducing the content of the NOTICE file. 142 | 143 | 7. Disclaimer of Warranty. Unless required by applicable law or 144 | agreed to in writing, Licensor provides the Work (and each 145 | Contributor provides its Contributions) on an "AS IS" BASIS, 146 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or 147 | implied, including, without limitation, any warranties or conditions 148 | of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A 149 | PARTICULAR PURPOSE. You are solely responsible for determining the 150 | appropriateness of using or redistributing the Work and assume any 151 | risks associated with Your exercise of permissions under this License. 152 | 153 | 8. Limitation of Liability. In no event and under no legal theory, 154 | whether in tort (including negligence), contract, or otherwise, 155 | unless required by applicable law (such as deliberate and grossly 156 | negligent acts) or agreed to in writing, shall any Contributor be 157 | liable to You for damages, including any direct, indirect, special, 158 | incidental, or consequential damages of any character arising as a 159 | result of this License or out of the use or inability to use the 160 | Work (including but not limited to damages for loss of goodwill, 161 | work stoppage, computer failure or malfunction, or any and all 162 | other commercial damages or losses), even if such Contributor 163 | has been advised of the possibility of such damages. 164 | 165 | 9. Accepting Warranty or Additional Liability. While redistributing 166 | the Work or Derivative Works thereof, You may choose to offer, 167 | and charge a fee for, acceptance of support, warranty, indemnity, 168 | or other liability obligations and/or rights consistent with this 169 | License. However, in accepting such obligations, You may act only 170 | on Your own behalf and on Your sole responsibility, not on behalf 171 | of any other Contributor, and only if You agree to indemnify, 172 | defend, and hold each Contributor harmless for any liability 173 | incurred by, or claims asserted against, such Contributor by reason 174 | of your accepting any such warranty or additional liability. 175 | 176 | END OF TERMS AND CONDITIONS 177 | 178 | APPENDIX: How to apply the Apache License to your work. 179 | 180 | To apply the Apache License to your work, attach the following 181 | boilerplate notice, with the fields enclosed by brackets "[]" 182 | replaced with your own identifying information. (Don't include 183 | the brackets!) The text should be enclosed in the appropriate 184 | comment syntax for the file format. We also recommend that a 185 | file or class name and description of purpose be included on the 186 | same "printed page" as the copyright notice for easier 187 | identification within third-party archives. 188 | 189 | Copyright [yyyy] [name of copyright owner] 190 | 191 | Licensed under the Apache License, Version 2.0 (the "License"); 192 | you may not use this file except in compliance with the License. 193 | You may obtain a copy of the License at 194 | 195 | http://www.apache.org/licenses/LICENSE-2.0 196 | 197 | Unless required by applicable law or agreed to in writing, software 198 | distributed under the License is distributed on an "AS IS" BASIS, 199 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 200 | See the License for the specific language governing permissions and 201 | limitations under the License. 202 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # GBIF Hosted Portals 2 | 3 | Support material for establishing the GBIF Hosted Portals. 4 | 5 | See https://www.gbif.org/hosted-portals and [Getting Started](getting-started). 6 | -------------------------------------------------------------------------------- /docker/Dockerfile: -------------------------------------------------------------------------------- 1 | FROM jekyll/jekyll:4.1.0 2 | 3 | RUN gem sources --add https://repository.gbif.org/repository/rubygems.org/ && \ 4 | gem sources --remove https://rubygems.org/ && \ 5 | /usr/local/bin/bundle config set mirror.https://rubygems.org https://repository.gbif.org/repository/rubygems.org && \ 6 | su-exec jekyll /usr/local/bin/bundle config set mirror.https://rubygems.org https://repository.gbif.org/repository/rubygems.org 7 | 8 | RUN mv /bin/chown /chown 9 | COPY ["do-nothing", "/bin/chown"] 10 | 11 | ENV JEKYLL_UID=0 \ 12 | JEKYLL_GID=0 \ 13 | JEKYLL_ROOTLESS=1 \ 14 | TZ=UTC 15 | 16 | RUN apk --no-cache add curl && \ 17 | curl -Ss --output-dir /srv/jekyll/ --remote-name --fail https://raw.githubusercontent.com/gbif/hp-template/master/Gemfile && \ 18 | curl -Ss --output-dir /srv/jekyll/ --remote-name --fail https://raw.githubusercontent.com/gbif/hp-template/master/Gemfile.lock && \ 19 | /usr/local/bin/bundle config set frozen true && \ 20 | /usr/local/bin/bundle install 21 | -------------------------------------------------------------------------------- /docker/README.md: -------------------------------------------------------------------------------- 1 | # Hosted Portal Docker build image 2 | 3 | This is a Docker image based on https://github.com/envygeeks/jekyll-docker, but 4 | ignoring the slow chown dance. It is used by [Jenkins](https://builds.gbif.org/view/Hosted%20Portals/). 5 | 6 | It can be used locally like this: 7 | 8 | ```shell 9 | docker run -e JEKYLL_ENV=development --rm --volume="$PWD:/srv/jekyll" docker.gbif.org/fast-jekyll:4.1.0 \ 10 | bash -c "jekyll build; /chown -R "$(id -u):$(id -g)" _site" 11 | ``` 12 | -------------------------------------------------------------------------------- /docker/do-nothing: -------------------------------------------------------------------------------- 1 | #!/bin/sh 2 | 3 | : 4 | -------------------------------------------------------------------------------- /getting-started/domain-name.md: -------------------------------------------------------------------------------- 1 | # Custom domain names 2 | 3 | You should use a custom domain for your hosted portal. This can be either an *apex domain* (like `gbif.zz` and usually also `www.gbif.zz`) or a *subdomain* name (like `data.gbif.zz`, when your institution is `gbif.zz` or `www.gbif.zz`). 4 | 5 | *If your IT department is going to handle everything, you needn't read any further — tell them the domain or subdomain and send them this page.* 6 | 7 | If you want a new domain, you will need to register it. There is usually an annual fee for this, and it's important to make sure the fee will continue to be paid year after year – your IT department might be best to arrange this. 8 | 9 | You will then need to set DNS records. If you have registered a domain yourself, there is usually an option to configure DNS somewhere nearby. 10 | 11 | ## Apex domain (`gbif.zz` etc) 12 | 13 | Create an `A` record for the apex domain (e.g. `gbif.zz`) to point to `130.225.43.5`. 14 | 15 | Then create a `CNAME` record for `www` (e.g. `www.gbif.zz`) to point to `hosted-portal.gbif.org`. 16 | 17 | *Some DNS providers support `ANAME` or `ALIAS` records. If yours does, you can create an `ANAME` or `ALIAS` record for the apex domain (e.g. `gbif.zz`) to point to `hosted-portal.gbif.org` instead of creating the `A` record.* 18 | 19 | ## Subdomains (`data.gbif.zz` etc) 20 | 21 | Create a single `CNAME` record for your subdomain (e.g. `data.gbif.zz`) to point to `hosted-portal.gbif.org`. 22 | 23 | GBIF will create a TLS certificate using LetsEncrypt. This enables the site to work with secure "https://" connections. Since your institution is probably already using a TLS certificate, it is a good idea to ensure GBIF has permission to do this. 24 | 25 | Create a `CAA` record for the same subdomain (e.g. `data.gbif.zz`) with the value `0 issue "letsencrypt.org"`. 26 | 27 | (The `CAA` record is optional, unless your organization already has a `CAA` record for e.g. `gbif.zz`, in which case it is required. Some DNS providers don't support creating `CAA` records — then you can just ignore it.) 28 | 29 | ## Finally 30 | 31 | Create an issue in the GitHub repository for your portal. Write the domain (or subdomain), and assign it to MattBlissett, who will update GBIF's configuration to use the domain. 32 | -------------------------------------------------------------------------------- /getting-started/for-authors.md: -------------------------------------------------------------------------------- 1 | # Getting started 2 | Some people prefer to start with a simple example, others prefer to read the [technical document](https://jekyllrb.com/). This document is the former: a small "hello world" task with the goal to have your first edits visible on the website. 3 | 4 | We will assume that you make your changes using the GitHub website and that you have read the [preparation document](https://github.com/gbif/hosted-portals/blob/main/getting-started/preparation.md). 5 | 6 | ## What happens when you make a change? 7 | * The change will be detected by the GBIF build server 8 | * The site will then be rebuild (your content transformed to HTML which can be read by the browser) 9 | * The site will then be deployed (made available on the internet). 10 | 11 | This process can take several minutes. You can follow along by finding your site on [GBIF's build server](https://builds.gbif.org/view/Hosted%20Portals/). 12 | Your testing site is available at `https://project-name.hp.gbif-staging.org`. See also [Where can you see your changes](#where-can-you-see-your-changes) 13 | 14 | ## Edit an existing page 15 | Open the file `/about.md` and enter edit mode (the pencil icon). The page has two parts. 16 | 17 | ``` 18 | --- 19 | # Front matter is written in YAML 20 | --- 21 | Content is written in markdown 22 | ``` 23 | The area starting and ending with `---` is called the [front matter](https://jekyllrb.com/docs/front-matter/). The area below is written in [markdown/](https://guides.github.com/features/mastering-markdown/) and is the primary content on the page. 24 | 25 | * Try changing the title in the [front matter](https://jekyllrb.com/docs/front-matter/) 26 | * Make sure it has the form `title: YOUR TITLE GOES HERE`. 27 | * If you need accented or non-Latin letters, you will need to quote the string like so: `title: "DIN TITEL GÅR HER"` 28 | * Save (commit) your change 29 | * you will be asked to leave a comment describing what you change and why. This is really useful when multiple people work on the same project. 30 | 31 | ## Change the primary colour 32 | Your site is using a theme (defined in `/_config.yml` as `remote_theme: gbif/jekyll-hp-base-theme`). The theme can be configured using some variables specific to that theme. One of them is the primary colour. 33 | 34 | To change the primary colour open `/_config.yml` in the root directory. It is written in [YAML](https://dev.to/paulasantamaria/introduction-to-yaml-125f). `algae.style.colors.primary` is the variable you need to change: 35 | ```YAML 36 | algae: 37 | style: 38 | colors: 39 | primary: "#fa5e97" # Use a hex code please 40 | ``` 41 | You can use an online [colour picker](https://www.google.com/search?q=colour+picker) if you aren't sure how to generate a hex colour. 42 | 43 | > If you [run this locally](#run-on-your-own-machine), then you need to restart the project. Jekyll does not restart on changes in `/_config.yml`. 44 | 45 | ## Change the logo 46 | To change the logo open `/_config.yml`. It is also written in [YAML](https://dev.to/paulasantamaria/introduction-to-yaml-125f). 47 | 48 | A logo isn't a requirement, if none is provided then `title` field from `/_config.yml` will be used instead. 49 | 50 | Upload the logo to `/assets/images/some_file.*` and reference it as below. 51 | ```YAML 52 | algae: 53 | logo: /assets/images/fungi.svg # Logo in navbar, will be displayed with 28px height 54 | logoAndTitle: false # include the title next to the logo 55 | ``` 56 | Your logo should be in `svg` or `png` format to work well. If your logo can work on different backgrounds, then you should ensure that the logo background is transparent. 57 | 58 | > It is also possible to use an image hosted elsewhere, but we would recommend to upload one to this site. 59 | 60 | ## Create a new page 61 | You should read the documentation on [pages](https://jekyllrb.com/docs/pages/). Create a file `/hello.md` with the following content: 62 | ``` 63 | --- 64 | layout: default 65 | --- 66 | # My page 67 | This is my first page 68 | ``` 69 | In the [front matter](https://jekyllrb.com/docs/front-matter/) we define how our content is to be templated. 70 | 71 | You can change the layout to something else. Some layouts require you to fill in additional front matter. 72 | 73 | Try using `layout: post` as below 74 | ``` 75 | --- 76 | layout: post 77 | title: Welcome 78 | background: https://via.placeholder.com/1000x400 79 | description: Most layout assume the fields `background`, `title` and an optional `description` 80 | --- 81 | This is my first table 82 | 83 | | Tables | Are | Cool | 84 | | ------------- |:-------------:| -----:| 85 | | col 3 is | right-aligned | $1600 | 86 | | col 2 is | centered | $12 | 87 | | tables | are useful | $1 | 88 | ``` 89 | 90 | Now try changing the layout to `layout: page`. 91 | 92 | ## Add your page to the menu 93 | Open `/_data/navigation.yml`. Add your new page to the list of menu items. Again this is written in [YAML](https://dev.to/paulasantamaria/introduction-to-yaml-125f), so it is a good idea to learn at least the basics of it. 94 | 95 | ```YAML 96 | - text: About 97 | href: /about 98 | - text: Data 99 | href: /data 100 | - text: Links 101 | menu: # Dropdown menu (one level deep only) 102 | - text: Base theme demo 103 | href: https://hp-theme.gbif-staging.org/ 104 | - text: "---" # Divider to separate blocks of menu items (at least 3 "-") 105 | - text: "Docs" # Title for block of menu items 106 | - text: Jekyll documentation 107 | href: https://jekyllrb.com/docs/pages/ 108 | - text: Markdown tutorial 109 | href: https://guides.github.com/features/mastering-markdown/ 110 | - text: YAML tutorial 111 | href: https://dev.to/paulasantamaria/introduction-to-yaml-125f 112 | - text: News 113 | href: /news/ 114 | # Your new page goes here 115 | - text: Hello world 116 | href: /hello 117 | # And let us add an external link - could be to your Github repo 118 | - text: Report an issue 119 | href: https://github.com/gbif/hp-template/issues/new/choose 120 | ``` 121 | 122 | ## Where can you see your changes 123 | Your website is available online in 2 versions: 124 | 125 | * A test version that isn't indexed by Google and other search engines, for example https://herbarium-germany.hp.gbif-staging.org/ 126 | * And a production version intended for the public and for search engines, which will use your domain like https://www.gbif.us/, https://biodiversidad.co/ or https://specimens.hetnatuurhistorisch.nl/ 127 | 128 | Every commit triggers a deployment to your test environment. Wen you save our servers pick up the change, then we rebuild the site and make the change available online. It will take a couple of minutes for your changes to be visible online. 129 | 130 | Any saved change will be available on your test site. To make it available on the production site you need to [make a release](https://docs.github.com/en/github/administering-a-repository/managing-releases-in-a-repository). 131 | 132 | ## What is next 133 | The hosted portals are build using [Jekyll](https://jekyllrb.com). They have good documentation so you should read that. The content section in particular is useful to understand ([pages](https://jekyllrb.com/docs/pages/), [posts](https://jekyllrb.com/docs/posts/), [frontmatter](https://jekyllrb.com/docs/front-matter/), [data files](https://jekyllrb.com/docs/datafiles/)). There is also a good section about the [directory structure](https://jekyllrb.com/docs/structure/). Since the project is already setup (styling, templates, Javascript, build and deploy etc), then you can ignore the other parts if you are not interested. 134 | -------------------------------------------------------------------------------- /getting-started/preparation.md: -------------------------------------------------------------------------------- 1 | For now you can just keep the answers to the questions below in whatever format you like. We will add this to your portal later, once your Github account is linked to the project. 2 | 3 | ## Step 1: Simple instructions for everyone to explore 4 | 5 | **GitHub** 6 | We will use GitHub as the repository to host the material for your hosted portal, including the text for your website. If you do not already have a GitHub account, please go to [github.com](https://github.com/) and click "Sign up" at the top right. A good explainer video of what GitHub is can be see [here](https://www.youtube.com/watch/w3jLJU7DT5E). 7 | 8 | Put very simply: it is a website https://github.com/ where you can store files and directories and have multiple people making changes to them. You can have several projects (or repositories as they are called) and you can decide who is allowed to edit what information. You can download the whole thing and work locally or you can use a web interface. For what we need, it is fine to work in the web editor. 9 | 10 | This is where you will be doing all of your content editing, so it is worth investing time getting familiar with the interface. 11 | 12 | * Create a GitHub account 13 | * Send us the GitHub usernames that should be able to edit (you can send them to informatics@gbif.org). 14 | 15 | **Data scope** 16 | Your hosted portal will serve a subset of data (the scope) from GBIF. What is your data scope? Try to build it on https://www.gbif.org/occurrence/search by adding some filters. If that isn't possible then try to write it using the occurrence download APIs [predicate structure](https://www.gbif.org/developer/occurrence#predicates). 17 | 18 | **Menu** 19 | It is a good time to consider how you will structure the content in your site. 20 | * Will you have an "contact us" page, a "how to ask for help", "how to share data" etc.? 21 | * What is in your menu, and how will you structure the sections? 22 | * Are there any pages that aren't accessible from the menu? How does the user discover them if not using your menu? 23 | * If you are familiar with YAML (see below) try to create a menu structure in YAML. Don't worry if not, we will explain this to you and assist. 24 | 25 | **Logo** 26 | Do you have a logo? Please find a good digital version, making sure the background is transparent. The ideal format is either a `png` or a `svg` file. By default the logo will be 28 pixels high - meaning it will not work well if it is [very complex](https://qph.fs.quoracdn.net/main-qimg-dabbb24c9503df66c8d1c75642dd61ab). 27 | 28 | If you do not have a logo, then the name of your site will be used instead. 29 | 30 | In addition to your logo, the site will include secondary branding in the footer indicating that it is 'powered by GBIF' 31 | 32 | **Styling** 33 | You can tweak the look of your hosted portal with a few variables to "theme" your site. For more advanced customizations, it is possible to write additional CSS (please say if you need to, then we might be able to help). The most important theme variables to consider are: 34 | * The primary colour - it is expected to work on a white background 35 | * and possibly a secondary colour for links 36 | 37 | You need to choose your colours and then we need to identify the hex code for it (e.g. #509e2f is the hex code for "GBIF dark green"). We can help you identify the hex code, but it would be good for you to decide on your own colour scheme. You can use a [colour picker/converter](https://www.google.com/search?q=color+picker) to find a hex code. 38 | 39 | **News items** 40 | Do you have news items, blog posts or similar content that you produce regularly? It is a a good time to start collecting this material. 41 | 42 | **Social media** 43 | Do you have any social media accounts you would like to link too? Which and what are the links/usernames? 44 | 45 | **Languages** 46 | * Is your site in multiple languages? 47 | * Is one language the default (as on https://hp-base-theme.gbif-staging.org/) or is the home page a language selector (as on https://www.cbif.gc.ca/)? 48 | * Do you have experience using [Crowdin](https://crowdin.com/)? This is one of the tools that we have used to translate GBIF.org and is likely what we will be using to translate the occurrence search. 49 | * How do you plan to translate your written content? Do you plan to use any tools to do so? 50 | 51 | **Domain name** 52 | What is your domain name (the URL of your website)? Do you already have one? Do you know how to buy and manage it yourself? Do you need help from us? 53 | 54 | **Footer** 55 | What should be in your footer? The footer is several small blocks with a headline and some text below. See https://hp-base-theme.gbif-staging.org/ for an example. 56 | 57 | **Learn Markdown** 58 | Familiarize yourself with Markdown. Here is an introduction from GitHub https://guides.github.com/features/mastering-markdown/ - Markdown is important to know as all your content will be written this way. 59 | 60 | **Prepare your first page** 61 | Prepare your first page (the end result will be similar to https://hp-base-theme.gbif-staging.org/about) 62 | * Write text in Markdown (you can use an online editor like https://stackedit.io/ to play around) 63 | * Find a background header image 64 | * Write an image caption in Markdown 65 | * Optionally: try to create a new repository in GitHub, create a new file `something.md` and add your text. Notice that GitHub will format your Markdown. 66 | 67 | ## Step 2: More advanced topics (we will guide you through these steps if this is unfamiliar) 68 | 69 | **Read the Jekyll docs** 70 | Your website is created using Jekyll. They have good [documentation](https://jekyllrb.com/docs/pages/) and it is worth reading parts of it. Not everything is important as most of it is for developers. But below sections are relevant: 71 | 72 | * Content section: the documentation for `pages`, `posts`, `front matter`, `data files` and `assets` are relevant when editing the site. 73 | * Site structure: https://jekyllrb.com/docs/structure/ 74 | 75 | **Get familiar with YAML (also known as YML)** 76 | YAML is used a lot when building your website. For defining the menus and to add structured metadata to the individual pages. You are welcome to just copy-paste examples, but it might be a good idea to read [an introduction](https://dev.to/paulasantamaria/introduction-to-yaml-125f) 77 | 78 | *Short introduction to YAML* 79 | It is a way to write structured data that machines can read. A bit like filling in a form, but you have to write the name of the field as well. 80 | ``` 81 | title: Fungi of the world 82 | image: http://sitename.com/image/123 83 | caption: "Photo by Morten H. License CC0." 84 | ``` 85 | Because the above is 3 distinct pieces of information (unlike Markdown that is one big piece of text), we can do more complex layouts. Such as having the title float on top of the image and have a semi transparent caption in the corner. This is essential for menus, complex page headers, and landing pages like the home page. 86 | --------------------------------------------------------------------------------