![gh-actions/site](https://github.com/monero-project/monero-site/workflows/gh-actions/site/badge.svg?branch=master) ## Table of Contents - [Introduction](#introduction) - [What you'll need](#what-youll-need) - [General change recommendations](#general-change-recommendations) - [Translation](#translation) - [housekeeping](#housekeeping) - [How to make a blog post](#how-to-make-a-blog-post) - [Updates on User Guides](#updates-on-user-guides) - [How to make a blog post](#how-to-make-a-blog-post) - [How to make a User Guide](#how-to-make-a-user-guide) - [How to make a Moneropedia Entry](#how-to-make-a-moneropedia-entry) - [How to update the Team page](#how-to-update-the-team-page) - [How to update the Roadmap](#how-to-update-the-roadmap) - [How to add a new Merchant](#how-to-add-a-new-merchant) - [How to add a question to the FAQ](#how-to-add-a-question-to-the-faq) - [How to add a publication to the Library](#how-to-add-a-publication-to-the-library) ## Introduction This README here to walk you through everything you need to know to make changes, edits, or even completely new pages for the new [getmonero.org website](https://getmonero.org/). It'll definitely be a bit of a ride, so strap yourself in. Feel free to skip down to a relevant section if you already know what you need. If you need support about something related to the website, plese join `#monero-site` [Freenode/IRC](irc://chat.freenode.net/#monero-site), [Matrix](https://matrix.to/#/!txpwSzQzkuUaVbtsIx:matrix.org) and MatterMost. For general info about Monero join `#monero`. We'll do whatever we can to help you. ## What you'll need * Jekyll: [getmonero.org](https://getmonero.org/) is made using a simple, static website generator called [Jekyll](https://jekyllrb.com/). You will need it installed on your system to test any changes that you made. Follow the instructions on the website to get up and going: * Install Ruby dependencies as suggested [in the Jekyll documentation](https://jekyllrb.com/docs/installation/) * Install Bundler: `gem install bundler` * Install Jekyll with all dependencies (run from the project directory): `bundle` * GitHub/GitLab: Pretty much everything in Monero is hosted on [GitHub](https://github.com/monero-project) or [getmonero GitLab](https://repo.getmonero.org/users/monero-project/projects) and uses Git as the primary version control system. If you're not familiar with how to use Git, you can check out [this tutorial](https://guides.github.com/activities/hello-world/) for a good overview. It will take you through pretty much everything you'll need to know to edit the website. If you haven't already, register on GitLab and fork the [Monero Website repository](https://github.com/monero-project/monero-site). Please note that GitLab accounts logged in using the "Log in with GitHub" option require manual intervention in order to be able to fork repositories. Either register your account using email/password or contact the Website Workgroup via GitLab or `#monero-site` to have your GitHub OAuth profile unlocked. *Note: If you're confused, feel free to click other files in the same directory (folder) that you are in for the step that you are on to see some working examples. Compare them to the instructions and you should understand better.* Once you have the above list of things, it's typically a good idea to build the website from your local computer to make sure it works before you make any changes. To do this, complete the following steps: 1. Navigate to your local `monero-site` repository. 2. Serve the website: `bundle exec jekyll serve --baseurl ''`. If you want, you can speedup thi process by loading only the last blog post instead of all of them. Simply add `--limit_posts 1` to the command above. The resulting command will be `bundle exec jekyll serve --limit_posts 1 --baseurl ''`. 3. Open a browser and go to [http://127.0.0.1:4000](http://127.0.0.1:4000). 4. If all went well, you should see the Monero website and you're ready to make changes. ## General change recommendations The average Monero user that will want to contribute to the website should probably start looking for issues labelled [⛑️ contributor needed](https://github.com/monero-project/monero-site/issues?q=is%3Aissue+is%3Aopen+label%3A%22%E2%9B%91%EF%B8%8F+contributor+needed%22) or making blog posts, user guides or Moneropedia entries; all of which are covered in this document. If this is all you want to do, don't worry, it's actually not a daunting task at all. If you are a web developer and would like to make large macro-level changes, it would be best to open an issue first or to get in contact with the developers on `#monero-site` (IRC/Freenode, MatterMost, Matrix). This website is completely open-source however and anything and everything is available for changing should the community deem it necessary. Every section from here on out will talk about how to make a specific type of web page. It will start with a bullet point list of what to do for the advanced among you that just want a quick overview. For those who are still learning this list is followed by a detailed explanation, starting with example front matter. Any variable in the front matter written in all caps you are expected to change (make sure your changes are not all caps though). It will then lead you through the rest of the process until it's time to type your content. A few random points of note: - After [a discussion](https://repo.getmonero.org/monero-project/monero-site/issues/982), the community decided to include only open source wallets in the 'Downloads' section of the website. Requests to add closed source wallets to that page will be rejected. - All external links must have `https://` in front of them or they will not redirect properly. - If you want to add a new page to the navigation, you should go to ALL LANGUAGES in the `_data/lang` folder and add the page. - It is strongly strongly STRONGLY encouraged that if you make a change, you - at the minimum - test it on your local machine before submitting a PR. Sometimes unexpected things may happen due to a change. If you change a page, check the whole page on multiple screen sizes and browsers to make sure there wasn't any collateral damage. ## Translation In this section you'll find the info you need to translate a page and add a new translation, but keep in mind that Monero has a [Localization Workgroup](https://github.com/monero-ecosystem/monero-translations) who coordinate and give support to translators-volunteers. For live support/request of infos, come chat on `#monero-translations` (Freenode/IRC, riot/matrix, MatterMost). The bulk of the website and the roadmap are translatable on Weblate, an easy to use localization platform that provide contributors with a user friendly interface: [translate.getmonero.org](https://translate.getmonero.org). Before translating, please read [the guide for translators](https://github.com/monero-ecosystem/monero-translations/blob/master/weblate.md), which contains all the info and workflows you need to know before starting. We are trying to move most of the localization work on Weblate, but some parts of the website still need to be manually translated on the repository. The following instructions will tell you which files to translate and how to proceed. ### 1. Quickstart * Navigate to the correct language in the /i18n folder and find the page you wish to translate * Do not translate any of the `*.yml` files in the /_18n folder * Click the file and translate the page, not touching any HTML or markdown * Remove `{% include untranslated.html %}` from the page * Test/Build * Submit PR ### 2. Navigate to correct file Go to the /i18n folder and find the two letter code for the language you wish to translate for. Enter that folder and find the file you wish to translate. The filenames are all in English and MUST NOT BE CHANGED. ### 3. Translate the file Here you can do your translation. Depending on the page, you may have to maneuver around some HTML or markdown. In general, anything between two tags (such as `
TRANSLATE THIS
`) should be fine. Testing is VERY important, so do NOT skip it. If during testing, the page appears different from the original English page (besides the translated text, of course), you did something wrong and may have to start again. #### 3.1. Notes for Moneropedia Entries Moneropedia entries have two specificities: * The Front Matter: Moneropedia Fron should be translated for both *entry:* and *summary:* elements. However, *terms:* should be extanded with their translation, leaving the English words **untouched**. This is really important for compatibility purposes. With this, if a new guide is added to the site, an English term on the untranslated version of the guide in another language could be linked to the moneropedia article (of the same language). * The old *untranslated* snippet must be removed, therefore the next section is irrelevant here. Finally, your entry should go from: ``` --- entry: "Entry name in English" terms: ["English", "terms"] summary: "English summary." --- {% include untranslated.html %} ``` To: ``` --- entry: "Translated entry name" terms: ["English", "terms", "translated", "terms"] summary: "Translated summary." --- ``` ### 4. set the 'translated' snippet to true Somewhere on the page (usually the top) should be a snippet that says `{% include disclaimer.html translated="false" version=page.version %}`. Simply change this to `{% include disclaimer.html translated="true" version=page.version %}`. This will remove the orange bar from the bottom saying the page is untranslated. ## How to add a new language Adding a new language can be complicated. If you feel unsure about the steps necessary, contact the Website workgroup and somebody will add the new language for you. ### 1. \_config.yml file Navigate to the root folder of the whole website and find the file labeled `_config.yml`. Open it and find the line that says `languages:`. Add your two letter language code (Google it if you don't know it) in between the brackets after the others already present. You will need to put a comma after the previous last one. Example: ``` languages: ["en", "es", "NEW LANG HERE"] ``` Save and exit the file. ### 2. \_data folder Navigate to the `_data/lang` folder and copy the `en` folder. Paste it into the same folder and the copy renamed to the two letter language code of the language you will be translated to. **The 'en' folder itself should still be there. It should not be renamed. There should be a new folder in addition to the ones that were already there.** Translate the content of the files. Do not touch anything labeled `url`. ### 3. \_i18n folder Navigate to the \_i18n folder and duplicate the en.yml file. Rename the duplicate to the two letter language code of your language with a `.yml`. Now duplicate the `en` folder and rename it with the correct language code. **The original folder and yml file themselves should still be there. They should not be renamed. There should be a new folder and yml file in addition to the ones that were already there.** ### 4. Open an issue on the repo where the website is hosted After you've done all the above, you'll need to [open an issue on the repository](https://github.com/monero-project/monero-site/issues) asking to add the language you are working on to Weblate, where the core of the website is translated. ## Housekeeping ### GitHub Issues We ask that if you open an issue on the site that you remain available for clarifying questions or corrections. We do our best to close issues that are resolved when we make changes to the site, but If your issue is resolved by a contributor and the issue is not closed we ask that you close it in a timely manner. A contributor may ask you to close an issue after it's confirmed fixed. Please review the changes to the site and close your issue if you can verify that it's fixed. ## Updates on User Guides User guides and developer guides may need regular updates, either to fix typos, to add explanations regarding new features, to update screenshots, and so on. As those guides are translated in several languages, it could be hard to keep all languages version up to date with the English version. To keep track of those changes, the user guides (but not the developer guides) are versioned using a snippet at the top of each localized (\_i18n/en/resources/\*-guides) file: ``` {% assign version = '1.1.0' | split: '.' %} ``` This snippet is responsible for keeping track of the language version. The based version (English version) is however also tracked in the `Front Matter` from the /resources/user-guides/ or /resources/developer-guides/ directory file: ``` mainVersion: - "1" - "1" - "0" ``` - First number is the Major version number - Second number is the Minor version number - Third number is the build number. When you update a guide, you are responsible for updating this version tracking in every file involved in your update: - For an update on English files, you will update the version tracking number in the `Front Matter` of /resources/\*-guides/ and in \_i18n/en/resources/\*-guides - For an update on localized files, you will update the version tracking number in the \_i18n/{% t library.PLACEHOLDER-NAME %}
``` Where `LINK-TO-PUBLICATION` is the URL of the actual publication. If it's a resource external to Getmonero, simply add the URL (for example `https://masteringmonero.com/free-download.html`). If you uploaded the file in the `/library` folder as explained in step 1, use this structure: `{{ site.baseurl_root }}/library/NAME-FILE`. `PLACEHOLDER-NAME` needs to be a placeholder that will be added in the `_18n/en.yml` file, under the `library` category, as explained in the next step. ### 3. Add placeholder in en.yml After you found the `library` category, add your placeholder and value after the last entry of the list. For example: `mypublication: "This is the description of my publication"`. In this example `mypublication` is the placeholder and needs to be also added to the entry in `index.md`, the result will be `{% t library.mypublication %}
` and the value contained in the placeholder will be correctly displayed. Save the changes.