![Decorative background for title](/_next/image?url=https%3A%2F%2Fassets.rpglogs.com%2Fimg%2Fwarcraft%2Fheader-bg_sod.jpg%3Fv%3D11&w=384&q=50)
How to write an article for Warcraft Logs Season of Discovery
Signing in to the Warcraft Logs Season of Discovery CMS
If you are invited to be an author for Warcraft Logs Season of Discovery, you will receive an invite link that lets you set a password and sign up to the CMS. Afterwards, you can always go back to https://cms.rpglogs.com/admin to sign in.
Creating an article
Once you are signed in to the CMS, you can navigate to the Articles section on the left, and then create or edit an article.
You'll be able to edit the following fields:
Title
- Appears at the top of the article, on the browser tab, in share links, search results etc.
- 60 character limit.
- Can use some enhanced markdown such as
<SiteTitle>
.
Slug
- Appears in the URL of the article.
- Should be automatically set from
Title
, so should not need to be manually changed.
Body
- The contents of the article.
- Can use all of enhanced markdown, including images etc.
Description
- Appears in share links and search results.
- 155 character limit.
- Can use some enhanced markdown such as
<SiteTitle>
.
PreventIndexing
- Whether or not the page should be prevented from being indexed by search engines such as Google.
- In almost all cases, this should be left as
Off
.
ArticleCategory
- The start of the URL path that the article is grouped under, such as
/help
or/news
.
- The start of the URL path that the article is grouped under, such as
ArticleTags
- Ignore this for now. Will be used in the future to group related articles across multiple categories.
Sites
- The sites that this article will appear on.
- Either select multiple, or select the
*
option for the article to appear on all sites.
FeaturedImageUrl
- The preview image appearing when sharing an article on social media or e.g. Discord
- Defaults to a game-specific fallback image
- Testable e.g. with this browser extension
- Images for this Card support an aspect ratio of 2:1 with minimum dimensions of 300x157 or maximum of 4096x4096 pixels. Images must be less than 5MB in size. JPG, PNG, WEBP and GIF formats are supported. Only the first frame of an animated GIF will be used. SVG is not supported.
Previewing an article
To preview what your article looks like before publishing it, you should use the Article Preview page on Warcraft Logs Season of Discovery. You can use the same page on different sites to see how the article will appear differently, for example:
- https://www.warcraftlogs.com/article/preview
- https://classic.warcraftlogs.com/article/preview
- https://www.fflogs.com/article/preview
- etc
The Article Preview page will save your draft article in your browser's storage, so you can come back to it (on the same device) later without losing anything. Once you are happy, copy and paste the content into the CMS Edit Article form.
Publishing an article
Make sure to save your changes using the Save button in the top-right. If the article has not already been published, click the Publish button.
The article will then be available on the sites that you specified in the Sites
field, with a URL built from the ArticleCategory
and Slug
fields. For example, if your article selected *
(all sites) for Sites
, Help
for ArticleCategory
, and how-to-write-an-article
for the Slug
, then it will be available on each site as:
- https://articles.warcraftlogs.com/help/how-to-write-an-article
- https://articles.classic.warcraftlogs.com/help/how-to-write-an-article
- https://articles.fflogs.com/help/how-to-write-an-article
- etc
For performance reasons, each article page is only rebuilt a minimum of every 3 minutes. This rebuild is triggered by visiting the article more than 3 minutes after it was last rebuilt. The rebuild happens in the background, so, after visiting the article 3 minutes after it was last built, you would then need to refresh the page a few seconds later to see the newly built page. This is why using the Article Preview page is important to see the effect your changes will have quickly.
Adding images to an article
Make sure to read how to use the <Image>
component on the Enhanced Markdown page.
You can use any image URL that begins with https://assets.rpglogs.com/
. You can upload images to this domain using the CMS:
In the Media Library, upload an image. Then, click the small Copy Link button in the top-right of the image, and use that as the URL.
Note that you should not bother using the Crop or Replace functionality in the Media Library, as these images are cached in users browser's for a year, so updating the image will not have any effect for users that have already viewed it. Instead, simply upload a new image to get a new URL, and use that.
The form to upload/edit an image also has extra fields such as an Alt
field - you can ignore this, as we set alt text directly in the markdown, such as:
<Image src="..." alt="Description of the image">
Best practices
Headers
Header levels
When using headers, make sure to start at the top and not skip any levels.
Good:
# Header
## Subheader
### Subsubheader
Bad (doesn't start at the top with a single #
):
## Header
### Subheader
#### Subsubheader
Bad (skips a level):
# Header
### Subheader
#### Subsubheader
Header styles
Do not add any extra styling to headers.
Bad (applies extra styling to the header):
# **Header**
Table of contents
Headers of the first three levels contribute towards constructing the table of contents. If your article has at least 3 headers like this, then the table of contents will appear when your article is viewed.
When header names in the table of contents are clicked, the user is taken to that section. For this to work, header names within your article must be unique. If there are any duplicate header names, they will still show up in the table of contents, but they will not appear as links, and you should update your article to make these names unique.
Bad (duplicate header names):
# Headers
## Styles
# Buttons
## Styles
Good (unique header names):
# Headers
## Header styles
# Buttons
## Button styles
Links
Links to other articles
When linking to another article, make sure the URL starts with /
(instead of https://articles.warcraftlogs.com/
). This is a performance benefit and will make sure faster navigation is used. For example:
[Enhanced Markdown](/help/enhanced-markdown)
Becomes: Enhanced Markdown
Links to the main site
When linking to a page on the main site, make sure the URL starts with ../
(instead of https://www.warcraftlogs.com/
). This ensures that the URL will be correct no matter what site it is viewed on. For example:
[<SiteTitle> Recruitment](../recruitment)
Becomes: Warcraft Logs Season of Discovery Recruitment
Links to other websites
Links to other websites have no special rules, and should just specify the entire URL. This also ensures that they get opened in a new tab. For example:
[Google](https://www.google.com)
Becomes: Google
Images
Images that do not have a valid src
(doesn't start with https://assets.rpglogs.com
) or do not have an alt
set will not render at all when published. On the Article Preview page, an error will be shown to let you know how to fix it.
Images that cannot be found will not render at all when published. On the Article Preview page, an error will be shown to let you know how to fix it.
An image's alt
text is important for accessible users and search engines, and should be a description of what is shown in the image, not simply a caption for the image.
Adding an Article Title Image
The Article Title image can be customized by setting a Title Background Image.
These images should meet the following criteria:
- The image should have a ratio of roughly 7:1, and be optimized for 1920x1080 screens. It will be resized to a width of 384px, so it shouldn't be smaller than this.
- They should be very lightweight, weighing under 20kb (ideally around 10kb).
- The preview should behave properly under responsive constraints and fill the article title space.
To reduce the size of the image, resize it and then run it through an optimizer before uploading.
To add a new image, follow these steps:
- Resize and optimize the image (through, eg, TinyPNG).
- Upload it to the Media Library.
- Copy the URL, and assign a new entry within the Title Background Image collection type.
- Assign the Title Background Image you just created to the desired Article, within the Article edit screen.