Decap CMS

Blog (about.gitlab.com/blog/)

Where can I find blog posts?

Blog posts can be found in two different locations:

1. Yaml files in the about.gitlab.com Repository
2. Decap CMS

Creating a blog post in the about.gitlab.com repository

Creating a blog post from scratch is as easy as filling out the blog post template. This can be done using the WebIDE, or by setting up the project locally.

1. Copy the example yaml document, and place it under the /blog/ folder within the appropriate locale. For example, English blog posts would be under /content/en-us/blog/
2. Add an author (first name, last name). If the author does not already exist in this list of authors, you can create a new one by copying and pasting the format of an existing author.
3. Fill in the remaining sections of the yaml file, using markdown for the body of the blog post, and assign your merge request to @Sgittlen for review.

Creating a blog post using Decap CMS

flowchart TD
    A[Login into Decap with GitLab SSO] --> B{Are you creating a new article or editing an existing one?}
    B -- "New Article" --> D[Click New Blogpost]
    B -- "Editing Article" --> J{Published or Unpublished?}
    J -- "Published" --> C[Click Contents Tab and Edit Existing Blogpost]
    J -- "Unpublished" --> E[Go to Workflow Tab, find unpublished article, and click into it]
    C --> F[Save Changes]
    D --> F[Save Changes]
    E --> F[Save Changes]
    F --> G[MR is created with draft changes in GitLab. Review App is created based on the MR]
    G --> H{Approval Decision}
    H -- "Approve Changes" --> I[Merge changes into codebase]
    H -- "Request Feedback / Update MR" --> F
    H -- "Delete Article" --> K[Delete article: close MR and preserve contents]

1. Log into Decap by visiting https://about.gitlab.com/admin/ and entering your GitLab credentials.
2. Using the language of your choice, select a Blog - Post Collection.
3. Fill in the fields under Content. Most fields are required unless otherwise noted. (You may also fill out the SEO fields - if you leave them blank, they will populate automatically with the Title and Description from the Content section.The last section, Config, can optionally be used to change the slug, and set the blog post to be Featured on the blog landing page.)
4. Click Save in the upper right corner.
5. Check the latest Merge Requests in the about.gitlab.com repository. A new merge request titled “Create Blog - Post {title}” will have automatically been created.
6. Within that MR, you will be able to view the review app of your blog post, and tag @Sgittlen for approval and merge.
7. Deleting a non-published post in Decap will end up closing the MR. If you are looking for that content, it will remain in the GitLab UI.

Video Tutorials can be found at the following playlist. For assistance, please reach out to #digital-experience-team or #blog in slack.

Additonal Notes

• Note that the swim lames/board in the Workflow tab correspond to labels applied to the various MRs.
• If you want to add an author, category, or tag, you will need to create those in Decap and merge the MRs in to the main branch first. Once that is complete the author, category, or tag will become available to be selected in Decap when creating or editing an existing article.

Adding media to blog posts

Mermaid charts

```mermaid
      flowchart TB;

      subgraph legend[ Legend ]
         proc(Process);
         art[Artifact];
         proc -->|IO relation|art;
      end
```

Videos

    <figure class="video_container">

    <iframe width="560" height="315"
    src="https://www.youtube.com/embed/pA5SfHwlq0s" frameborder="0"
    allowfullscreen="true">

    </iframe>

    </figure>

Code blocks with syntax highlighting

```json
    {
        "Version": "2012-10-17",
        "Statement": [
            {
                "Effect": "Allow",
                "Action": [
                    "ecr:GetAuthorizationToken",
                    "ecr:BatchCheckLayerAvailability",
                    "ecr:GetDownloadUrlForLayer",
                    "ecr:DescribeRepositories",
                    "ecr:ListImages",
                    "ecr:DescribeImages",
                    "ecr:BatchGetImage"
                ],
                "Resource": "*"
            }
        ]
    }
```

Creating a blog post using the Web IDE

1. Visit the project repository at https://gitlab.com/gitlab-com/marketing/digital-experience/about-gitlab-com
2. Click the Edit button dropdown, and select Open with Web IDE
3. Once open, navigate to the folder you’d like your blog post in
   • For most, this will be in content -> en-us -> blog
   • Localized blog posts can be found in the content/{{language-code}} folder, such as content -> fr-fr -> blog
4. Add a new file by clicking the Add file button at the top of the sidebar pane. Be sure to name your file whatever the url of the blog post will be
   • Alternatively, if you have an existing yaml file (i.e. from Argo), you can drag and drop the file directly into the folder of your choosing. Be sure to right click -> rename the file to match the English version
5. From here, you can copy and paste an existing blog post yaml file and fill in your new values, or use the blog MR template to start from scratch
   • Be sure to either upload your blog image inside /public/images/blog/hero-images/, or copy a URL from Cloudinary
6. Once you’re happy with your post, you can create a merge request through the Web IDE by selecting the Source Control icon on the left sidebar, then click the dropdown beside the Commit and push to main button -> Create a new branch and commit (you won’t be able to commit and push to main directly)
   • Hit Enter to just use the default branch name
   • Click the Create MR button that appears in the bottom corner
7. Wait for the pipeline to run to view your review app

For a video walkthrough, click here.

Events

Adding an event to the events landing page

To add an event to about.gitlab.com/events/, you can use Decap, or the Web IDE:

Decap CMS

1. Log into Decap CMS by going to about.gitlab.com/admin/ and logging in with your GitLab credentials.
2. Along the left sidebar, select Events -> Landing Page Card, and click the New Event Landing Page Card button at the top of the screen.
3. Fill out the following fields:
   • Name - Name of event
   • Type - The type of event (i.e. Conference, Webcast)
   • Description - A brief description of the event. Can use markdown.
   • Start Date - Use the date picker to select the date of the event. This field is required
   • End Date - (optional) If the event spans multiple days, select the end date. Can leave this field blank.
   • Location - Add city and state of event. If virtual, type in Virtual.
   • Region - Select the appropriate region for event
   • Industry - (optional) Select an industry, if relevant.
   • Event URL - Add registration URL
4. Once you are happy with the content, click Save at the top of the screen.
5. This will automatically create a Merge Request with your changes, which you can use to view the Review App and make any changes.
   • To find your merge request, check this list of open merge requests for the MR titled Create Event - {{ Your Event Name }}
6. Review, approve, and merge your MR to see it live on the website.

Video Tutorial available here

Web IDE

1. Open the Web IDE for about.gitlab.com

2. Create a new .yml file in /content/shared/en-us/events/landing/cards and title it the name event (with no spaces).

   • Ex: connect-sydney-2025.yml

3. Fill in the following fields, maintaining the same format for the date:

   
   name: 
   type: 
   description: |
   Suports markdown, ex: Get together with the GitLab community to contribute, learn and win **exciting prizes**.
   startDate: YYYY-MM-DD
   endDate: YYYY-MM-DD (optional)
   location: 
   region: 
   industry: 
   eventURL: 
   

4. Create an MR, review, and merge your changes

View page source - Edit this page - please contribute.