feat: Content improvements across website infrastructure docs

en/contributors/website/content-shortcodes-and-includes.md

@@ -21,9 +21,15 @@ To add an alert, use the following `include`, where:
 {% include _alert.html type:'success' icon:'fa-face-smile' title:'No icon: Stride contributors are proud to announce a new release now running on .NET 6 supporting the latest C# 10.' %}
 ```
 
+### Examples
+
+See the examples [here](https://www.stride3d.net/blog/examples/#alert).
+
+![Alert examples in the Stride website](media/alert-examples.jpg)
+
 ## Alert Banner
 
-A global alert banner can be used for promotional purposes. The banner can be activated in `site.json`.
+A global alert banner can be used for promotional purposes. The banner can be activated in `site.json`. It will show up on every single page.
 
 ```json
 "alert-banner": true
@@ -31,10 +37,14 @@ A global alert banner can be used for promotional purposes. The banner can be ac
 
 The HTML can be updated in the `/_includes/alert-banner.html` file.
 
+![Alert Banner examples in the Stride website](media/alert-banner-example.jpg)
+
 ## Image
 
 Add responsive images using shortcodes. Be sure to include a descriptive title, as it will improve your post's search engine visibility. Also, if possible, use the **webp** format for images, which can also be used for transparent images. This will improve the performance of your site.
 
+### img
+
 To add a responsive image, use the following shortcode:
 
 `{% img 'title' 'url' %}`
@@ -45,6 +55,8 @@ Replace `title` with a descriptive title for the image and `url` with the image
 <img alt="title" src="url" class="img-fluid mb-2" loading="lazy" data-src="url">
 ```
 
+### img-click
+
 To add a responsive image with a clickable link that opens the image in full size, use the following shortcode:
 
 `{% img-click 'title' 'url' %}`
@@ -67,7 +79,9 @@ Replace `title` with a descriptive title for the image, `url` with the image URL
 
 ## Video
 
-We should consider hosting our videos on YouTube whenever possible. 
+We should consider hosting our videos on YouTube whenever possible.
+
+### youtube
 
 To embed a **YouTube video**, use the following shortcode:
 
@@ -79,6 +93,8 @@ Replace `id` with the YouTube video ID. This shortcode renders as:
 <div class="ratio ratio-16x9 mb-2"><iframe src="https://www.youtube.com/embed/id" title="YouTube video" allowfullscreen></iframe></div>
 ```
 
+### youtube-playlist
+
 To embed a **YouTube playlist**, use the following shortcode:
 
 `{% youtube-playlist 'id' %}`

en/contributors/website/deployment-azure.md

@@ -2,16 +2,11 @@
 
 We have tested [different deployment](deployment.md) options and decided for the following one.
 
-- [Step-by-Step Guide to Deploying Azure Web Apps (Windows) with IIS](#step-by-step-guide-to-deploying-azure-web-apps-windows-with-iis)
-  - [Setting up a new Azure Web App (Windows) with IIS](#setting-up-a-new-azure-web-app-windows-with-iis)
-  - [Adjusting the Web App Configuration](#adjusting-the-web-app-configuration)
-  - [Modifying the GitHub Action](#modifying-the-github-action)
-
-# Step-by-Step Guide to Deploying Azure Web Apps (Windows) with IIS
+## Step-by-Step Guide to Deploying Azure Web Apps (Windows) with IIS
 
 This guide assumes you already have permission to access the Azure subscription.
 
-## Setting up a new Azure Web App (Windows) with IIS
+### Setting up a new Azure Web App (Windows) with IIS
 
 These instructions pertain to the staging environment. For the production environment, follow the same steps, but with a different web app name.
 
@@ -30,7 +25,7 @@ These instructions pertain to the staging environment. For the production enviro
       - Click **Next**
 1. In the Deployment Tab - This step can be completed later if preferred.
    - Enable Continuous deployment
-   - Select account, organisation `Stride`, repository `stride-website` and branch `staging-next`
+   - Select account, organisation `Stride`, repository `stride-website` and branch `staging`
    - Click **Next**
 1. In the Monitoring Tab
    - Leave all settings as default
@@ -46,15 +41,20 @@ These instructions pertain to the staging environment. For the production enviro
    - Click **Create**
    - The GitHub Action will be added to the repository and run automatically. It will fail at this stage, but this will be resolved in the subsequent steps.
 
-## Adjusting the Web App Configuration
+> [!CAUTION]
+> If you have completed the Deployment Tab process, ensure that the deployment profile includes the **DeleteExistingFiles** property. This property may need to be set to `False` or `True` depending on the specific requirements of your deployment. For instance, Stride Docs deployment retains files from previous deployments, allowing multiple versions like `4.2`, `4.1`, etc., to be maintained. Adjust this setting based on your deployment needs.
+
+### Adjusting the Web App Configuration
 
 1. Proceed to the newly created Web App
 1. Click on **Configuration**
 1. Select **General Settings**
-1. Change the Http Version to **2.0**
+1. Change the `Http version` to **2.0**
+1. Change `Ftp state` to **FTPS only**
+1. Change `HTTPS Only` to **On**
 1. Click **Save** to apply the changes
 
-## Modifying the GitHub Action
+### Modifying the GitHub Action
 
 The previous step will have added a GitHub Action to the repository, which will fail at this point. You need to modify the GitHub Action to correct the issue.
 
@@ -67,9 +67,9 @@ The previous step will have added a GitHub Action to the repository, which will
     on:
     #  push:
     #    branches:
-    #      - staging-next
+    #      - staging
         workflow_dispatch:
     ```
 1. Open the `stride-website-staging-azure.yml` workflow and update it with the properties from the previous step. Save your changes.
 1. This workflow may also need to be added to the production branch master if it is not already there.
-1. Execute the workflow stride-website-staging-azure.yml. Ensure you select the correct branch staging-next and click **Run workflow**. This action will deploy the website to the Azure Web App.
+1. Execute the workflow `stride-website-staging-azure.yml`. Ensure you select the correct branch `staging` and click **Run workflow**. This action will deploy the website to the Azure Web App.

en/contributors/website/eleventy.md

@@ -2,19 +2,8 @@
 [Eleventy](https://www.11ty.dev/) is a static site generator that uses JavaScript as its templating language. It is a very powerful tool that allows us to create a website with a lot of flexibility and customization. It is also very easy to use and learn. This section will cover the basics of Eleventy configuration on the Stride website. Creating and updating the content is described in our [Content](content.md) section.
 
 We used to use **Jekyll** as our static site generator, but we decided to switch to Eleventy because of its flexibility and ease of use. We also wanted to use a tool that is more widely used and supported, which is why we decided to switch to Eleventy.
-
-# Table of Contents
-
-- [Packages and Dependencies](#packages-and-dependencies)
-- [Configuration](#configuration)
-- [Global Data](#global-data)
-- [Folder Structure](#folder-structure)
-- [Layouts](#layouts)
-- [Includes](#includes)
-- [Advanced Topics](#advanced-topics)
-  - [Creating Custom Shortcodes and Includes](#creating-custom-shortcodes-and-includes)
-  
-# Packages and Dependencies
+ 
+## Packages and Dependencies
 
 Eleventy is a **Node.js** application. Please follow our [Installation](installation.md) guide to install Node.js and all the required dependencies.
 
@@ -33,7 +22,7 @@ Packages we currently use:
   - `markdown-it-table-of-contents` - Table of contents plugin for markdown-it, used mainly in blog posts as `[[TOC]]`
   - `sass` - Sass compiler for our `/css/*.scss` files
 
-# Configuration
+## Configuration
 
 The Eleventy configuration is located in the `.eleventy.js` file at the root of the project. This file contains all the configuration settings for the Eleventy build process. As it is a JavaScript file, you can utilize all JavaScript features and syntax within it.
 
@@ -43,13 +32,13 @@ The Eleventy configuration is located in the `.eleventy.js` file at the root of
 - pass through files - Files that are copied to the output folder without any processing
 - custom collections - Custom collections used in the templates like `tagList` and `yearList`
 - filters - Custom filters used in the templates
-- custom shortcodes - Custom [shortcodes](content.md#shortcodes-and-includes) used in the templates, pages or blog posts.
+- custom shortcodes - Custom [shortcodes](content-shortcodes-and-includes.md) used in the templates, pages or blog posts.
 
 The file is well-commented and should be self-explanatory. If you need to add a new configuration, please follow the existing structure and include a comment to explain the new configuration.
 
-# Global Data
+## Global Data
 
-Global data is located in the `/_data` folder. It contains all the global data that is accessible in all the templates. Currently, we have these JSON files:
+Global data is located in the `_data` folder. It contains all the global data that is accessible in all the templates. Currently, we have these JSON files:
 
 - `site.json` - Contains all the global data for the website, used in the templates and shortcodes.
 - `features.json` - Contains all the data for the features page and its features sections.
@@ -64,31 +53,31 @@ Our `site.json` file contains these main properties, with only some listed below
 - `authors` - Contains all the authors used in the blog posts
 - repeated data - like `csharp-version`, `dotnet-version`, `download-version` which are used in multiple places on the website and are updated with every release
 
-# Folder Structure
+## Folder Structure
 
 The folder structure is crucial for Eleventy, as it determines the output of the build process. The folder structure is organized as follows:
 
-**Folders**
-
-- `/_data` - Global data
-- `/_drafts` - Draft blog posts (excluded from the build process)
-- `/_includes` - Reusable code snippets that can be included in multiple pages
-- `/_layouts` -  Main layout pages (`container`, `page`, `post`) using the primary layout page `default`
-- `/_site` - Output build folder (excluded in `.gitignore` and used for deployment) 
-- `/assets` - Additional assets, such as scripts
-- `/blog` - Blog content page
-- `/css` - Website stylesheets
-- `/files` - Stride installer files
-- `/images` - Images and MP4 files used on the website
-- `/legal` - Content page
-- `/posts` - Blog posts
-- `/posts/2014-2021` - Old blog posts which are merged to the same output folder as `/posts`
+### Folders
+
+- `_data` - Global data
+- `_drafts` - Draft blog posts (excluded from the build process)
+- `_includes` - Reusable code snippets that can be included in multiple pages
+- `_layouts` -  Main layout pages (`container`, `page`, `post`) using the primary layout page `default`
+- `_site` - Output build folder (excluded in `.gitignore` and used for deployment) 
+- `assets` - Additional assets, such as scripts
+- `blog` - Blog content page
+- `css` - Website stylesheets
+- `files` - Stride installer files
+- `images` - Images and MP4 files used on the website
+- `legal` - Content page
+- `posts` - Blog posts
+- `posts/2014-2021` - Old blog posts which are merged to the same output folder as `/posts`
   - this folder is only for convenience to easily access new posts
-- `/wiki` - Excluded from build process, used only for wiki deployment
+- `wiki` - Excluded from build process, used only for wiki deployment
 
-**Files**
+### Files
 
-- `/posts/posts.json` - Blog post defaults so they don't have to be repeated in the front matter
+- `posts/posts.json` - Blog post defaults so they don't have to be repeated in the front matter
 - `*.html` - HTML content pages
 - `*.liquid` - Liquid content pages
 - `*.md` - Markdown content pages
@@ -97,7 +86,7 @@ The folder structure is crucial for Eleventy, as it determines the output of the
 - `.eleventyignore` - Lists files and folders not to be processed by Eleventy
 - `package.json` - Eleventy project metadata used by `npm`
 
-**Non Eleventy files:**
+### Non Eleventy files
 
 - `.nojekyll` - Special file for GitHub Pages
 - `CNAME` - Custom domain for GitHub Pages
@@ -110,35 +99,34 @@ The folder structure is crucial for Eleventy, as it determines the output of the
 - `web.config` - Configuration file for IIS deployment
 - `web.Release.config` - Configuration file for Windows ASP.NET Core deployment
 
+> [!NOTE]
+> This project includes ASP.NET Core solution and files, as they can be used seamlessly with Eleventy. Read more about this in our [Installation](installation.md#aspnet-core) section.
 
-**Note:** This project includes ASP.NET Core solution and files, as they can be used seamlessly with Eleventy. Read more about this in our [Installation](installation.md#aspnet-core) section.
-
-
-# Layouts
+## Layouts
 
-All the layouts are located in the `/_layouts` folder. The `default` layout is the main layout page and is used by all the other layouts. 
+All the layouts are located in the `_layouts` folder. The `default` layout is the main layout page and is used by all the other layouts. 
 
 - `default` - Main layout page
 - `container` - Used by some pages
 - `page` - Used by most of the pages
 - `post` - Used by blog posts
 
-# Includes
+## Includes
 
-All the includes are located in the `/_includes` folder. The includes are reusable code snippets that can be included in multiple pages.
+All the includes are located in the `_includes` folder. The includes are reusable code snippets that can be included in multiple pages.
 
 Some includes are used solely by the layouts, while others are used by the content pages.
 
-# Advanced Topics
+## Advanced Topics
 
-## Creating Custom Shortcodes and Includes
+### Creating Custom Shortcodes and Includes
 
-If you need to create a custom shortcode or include, please follow the existing structure and [include a comment](content.md#shortcodes-and-includes) to explain the new shortcode or include.
+If you need to create a custom shortcode or include, please follow the existing structure and [include a comment](content-shortcodes-and-includes.md) to explain the new shortcode or include.
 
-The shortcodes are defined in the `.eleventy.js` file, while the includes are located in the `/_includes` folder.
+The shortcodes are defined in the `.eleventy.js` file, while the includes are located in the `_includes` folder.
 
 You can explore the existing shortcodes and includes to get a better understanding of how they work and how to create new ones.
 
-## Performance Optimization
+### Performance Optimization
 
 ToDo: Remove this section if not needed

en/contributors/website/index.md

@@ -1,4 +1,5 @@
 # Contributing to the Stride website
+
 This documentation serves as a comprehensive guide to help you navigate and contribute to the **Stride website**.
 
 If you're looking to make minor changes, such as adding or updating a post or page, or fixing a typo, you can jump straight to the [Content Updates](content.md#content-updates) section.
@@ -15,11 +16,15 @@ Technologies we use to build our website:
 - HTML, JavaScript, CSS, SCSS, and JSON
 - GitHub Actions (CI/CD)
   - Our [GitHub Actions](https://github.com/stride3d/stride-docs/tree/master/.github/workflows) are already configured for deploying to staging and release environments
-  - For personal testing or demonstration purposes, you might need to set up your own GitHub Actions. This can be particularly useful if you want to showcase proposed changes to maintainers for approval
+  - For personal testing or demonstration purposes, you might need to set up your own GitHub Actions. This can be particularly useful if you want to showcase proposed changes to maintainers for approval.
+
+## Dependencies
 
-## Important Links
+Various Stride systems rely on content fetched and processed from either the Stride website or the Stride Docs website. It's crucial to ensure that the following links remain active and accessible. Please refrain from removing or altering these links unless the dependent systems have been updated accordingly to accommodate any changes.
 
-- https://www.stride3d.net/legal/privacy-policy/
-    - This links is used in the Stride Installer
-- https://www.stride3d.net/feed.xml
-    - This feed is loaded in the Stride Launcher
+1. https://www.stride3d.net/legal/privacy-policy/
+   - This link is integral to the **Stride Installer**. It provides users with transparent information about data handling and privacy considerations associated with using Stride.
+2. https://www.stride3d.net/feed.xml
+   - The **Stride Launcher** utilizes this feed to keep users updated with the latest news, updates, and announcements from the Stride community.
+3. https://doc.stride3d.net/latest/en/index.json
+   - This JSON file is crucial for integrating the Stride Website's search functionality with the Stride Documentation. It ensures that search results are comprehensive, including relevant information from both the Stride website and Stride Docs.

en/contributors/website/media/alert-banner-example.jpg

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:5a652157b376de3e8880469ea5434cd26936fbfda358d5cd25c040c7f7e4c26f
+size 74911

en/contributors/website/media/alert-examples.jpg

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:9ca887d6a33d7cce6716964f3fd785c3adc17325948666df4560eecee891f401
+size 120834