Merge branch 'wordpress-roadmap' into 'master'

Add roadmap to wordpress

See merge request drupal/paas/drupal-documentation!40

docs/docs/1-Getting Started/1-a-landing.md

@@ -8,6 +8,13 @@ Welcome to **drupal.docs.cern.ch**, your one-stop Drupal resource at CERN.
 
 ## News
 
+### September 2024: Update to timeline and plans, WordPress Lite and much more
+
+Please check the dedicated section to the [Roadmap to WordPress](/roadmap-wordpress) to see the updates to the plans and timelines.
+
+We'll go over these details in the [Community Meeting](https://indico.cern.ch/event/1457632/) of 26th September via zoom. 
+
+
 ### April 2024: The road from Drupal to WordPress 🎉
 
 We write this news to share that the presentation at the Enlarged Directorate, on March 5th, on the topic of _“Web presence, Governance and Drupal to WordPress migration”_ was very well received.
@@ -53,21 +60,17 @@ Accordingly, users must ensure their website is running the supported Drupal ver
 
 All updates and upgrades are communicated to the users via the [Notifications service](cern.ch/n-91d) and/or via a [Service Status Board](https://cern.service-now.com/service-portal?id=service_status_board) announcement. 
 
-**The only supported version currently is Drupal 10.** Drupal 10 is expected to be supported at CERN until mid of 2026. Drupal 10 is expected to be the last release offered at CERN.
+**The only supported version currently is Drupal 10.** Drupal 10 is expected to be supported at CERN until February of 2026. Drupal 10 is expected to be the last release offered at CERN.
 
 Drupal 9 is EOL since November 2023.
 
 ### Drupal to WordPress
 
-The timeline for the availability of centrally managed WordPress is not available yet, neither for the migration from Drupal into WordPress. 
-Work will start in 2024, and plans will be shared as soon as they are available. 
-The migration is expected to last two years, with work commencing on the first voluntary websites within the first year; and batch migration in the second year.
+See the updated [roadmap](/roadmap).
 
 ** All Drupal users are recommended to uninstall non-essential custom modules from their websites, in order to prepare for the upcoming move to WordPress.**
 
-Current timeline is preliminary and subject to change, given the need for additional resources.
-
-The preliminary plan is to freeze the Drupal infrastructure as much as possible, in order to save resources for the upcoming migration (both for users and ourselves), therefore no active development is planned.
+Due to this change, the Drupal infrastructure is in maintenance mode, in order to save resources for the upcoming migration (both for users and ourselves), therefore no active development is planned.
 
 ## Service level
 

docs/docs/1-Getting Started/1-c-roadmap.md

+---
+slug: /roadmap-wordpress
+---
+
+# Roadmap to WordPress
+
+We are excited to share our roadmap for WordPress at CERN.
+
+WordPress presents a unique opportunity to modernise our extensive digital presence, leveraging the rich WordPress ecosystem to address the many shortcomings and difficulties inherent to Drupal, such as accessibility, responsiveness, and workflow efficiency.
+Our goal is to simplify the web development process for website owners, allowing them to focus on what truly matters: creating and managing their content, without the complexities associated with Drupal.
+
+Our roadmap is as follows:
+
+<div id="gantt-chart-container"></div>
+
+* **WordPress Lite** (October 2024): A lightweight version of WordPress offering an initial set of plugins and the first version of our official CERN WordPress theme running on the existing `app-catalogue` infrastructure. This offering will provide a simple and accessible way for website owners to familiarise themselves with WordPress.
+* _**WordPress MVP** (December 2024): An initial, internal version of the dedicated WordPress infrastructure. Available only to the Web Team for development and testing purposes._
+* _**WordPress Pilot** (March 2025): An internal pilot of the dedicated WordPress infrastructure. Available only to the Web Team and select websites for development and testing purposes._
+* **WordPress** (May 2025): WordPress becomes generally available to everyone at CERN.
+* **Migration** (July 2025): We begin automated migrations from Drupal to WordPress.
+
+## FAQ
+
+**Q1: Who can access _WordPress Lite_?**
+
+_Everyone. However, due to WordPress Lite being restricted and subject to numerous updates throughout its lifetime, .cern websites are not allowed and we generally discourage high-traffic websites from moving to WordPress Lite._
+
+**Q2: What happens once _WordPress Lite_ closes?**
+
+_Websites created on WordPress Lite will automatically be migrated to the official, dedicated WordPress infrastructure once available. No action will be necessary. We will share more information available about this once we are closer to the official release._
+
+**Q3: Can I move my Drupal website to _WordPress Lite_?**
+
+_While we will be migrating Drupal websites to WordPress automatically, we will not be offering this as part of WordPress Lite. As such, if you wish to shift your Drupal website to WordPress today, you are able to do so, but you have to manually migrate your content._
+
+**Q4: Can I install `x` plugin on _WordPress Lite_?**
+
+_No. WordPress Lite will come with a limited set of plugins that may expand during its lifetime. You will not be able to install your own plugins or themes. If you have requirements or suggestions, please get in touch and we may be able to include it in a future update._
+
+**Q5: What is _WordPress MVP_ and _WordPress Pilot_?**
+
+_These are internal versions of WordPress running on a new, dedicated WordPress infrastructure. It will not be possible to create a website on these versions as only the Web Team will be using them for development and testing purposes. Work includes refining the CERN WordPress Distribution, automated end-to-end testing, automated migration, and integration with various CERN services. The output of this work will conclude with the general release of WordPress._
+
+**Q6: What happens to Drupal and my Drupal website(s)?**
+
+_All Drupal websites which require a content management system will be migrated to WordPress. No website will be served on WordPress before it has been verified and approved. Drupal itself will continue to be supported and maintained throughout 2024 and 2025. However, Drupal will eventually be decommissioned as Drupal 10 reaches end-of-life in Q3/Q4 2026._
+
+**Q7: I need a new website. Where should I create it today?**
+
+_Firstly, only websites that require a content management system (CMS) should evaluate WordPress or Drupal. You can see an overview of other options available at [https://webservices-portal.web.cern.ch/](https://webservices-portal.web.cern.ch/)._
+
+_If indeed a CMS is needed, the general advice depends on a couple of factors:_
+
+- 1) _If you are already familiar with Drupal, a new website can be created in Drupal. Since customisation is already blocked for new websites, once time comes, your website will be migrated automatically into WordPress. In the meantime, you will benefit from all the perks a centrally managed infrastructure offers._
+- 2) _If you are not familiar with Drupal, or prefer not to continue with Drupal, then the advice is to wait to start development until WordPress Lite is available._
+    
+**Q9: I have a website on Drupal. What should I be doing to prepare for the migration?**
+
+_Websites confirming to the CERN Drupal Distribution will be migrated automatically to WordPress. The best you can do to prepare is strip away non-essential customisation._
+
+**Q10: I already have a website on WordPress in app-catalogue. What will happen to it? Should I be doing anything?**
+
+_Existing WordPress websites will co-exist with WordPress Lite. You will benefit from everything WordPress Lite offers, but we will not overwrite existing customisation._
+
+_Similarly to Drupal, it's your responsibility to remove existing customisation in order to conform with WordPress Lite. As soon as Lite in released (October 2024), you should adapt your website to use only the plugins centrally provided._
+
+_Once central WordPress is available (May 2025), WordPress Lite websites must migrate. If your website conforms, we will handle it automatically without any action needed._
+_WordPress Lite is not the final solution and will be decommissioned after May 2025._
+
+**Q11: I have a question not answered here?**
+
+_Please contact [wordpress-feedback@cern.ch](mailto:wordpress-feedback@cern.ch) and we will get back to you._
\ No newline at end of file

docs/docusaurus.config.js

@@ -9,6 +9,9 @@ module.exports = {
   favicon: "img/drupal.ico",
   organizationName: "Drupal",
   projectName: "https://gitlab.cern.ch/drupal/paas/drupal-documentation",
+  clientModules: [
+    require.resolve('./static/assets/js/gantt_chart.js'),
+  ],
   themeConfig: {
     announcementBar: {
         id: 'customisation_block',

docs/static/assets/js/gantt_chart.js

+export function onRouteDidUpdate({location, previousLocation}) {
+
+  function createGanttChart() {
+    const canvas = document.createElement("canvas");
+    canvas.width = 900;
+    canvas.height = 450;
+
+    const container =
+      document.getElementById("gantt-chart-container") || document.body;
+    container.appendChild(canvas);
+
+    const ctx = canvas.getContext("2d");
+
+    // Enhanced color palette
+    const colors = ["#FF9AA2", "#FFB7B2", "#FFDAC1", "#E2F0CB", "#B5EAD7"];
+    const backgroundColor = "#F7F7F7";
+    const gridColor = "#E0E0E0";
+    const textColor = "#333333";
+
+    const milestones = [
+      {
+        name: "WordPress Lite",
+        start: new Date("2024-10-01"),
+        end: new Date("2025-05-31"),
+        internal: false,
+      },
+      {
+        name: "WordPress MVP",
+        start: new Date("2024-12-01"),
+        end: new Date("2025-03-31"),
+        internal: true,
+      },
+      {
+        name: "WordPress Pilot",
+        start: new Date("2025-03-01"),
+        end: new Date("2025-05-31"),
+        internal: true,
+      },
+      {
+        name: "WordPress",
+        start: new Date("2025-05-01"),
+        end: new Date("2027-02-31"),
+        internal: false,
+      },
+      {
+        name: "Migration",
+        start: new Date("2025-07-01"),
+        end: new Date("2026-01-31"),
+        internal: false,
+      },
+    ];
+
+    const margin = {top: 70, right: 30, bottom: 80, left: 180};
+    const width = canvas.width - margin.left - margin.right;
+    const height = canvas.height - margin.top - margin.bottom;
+
+    const startDate = new Date("2024-08-01");
+    const endDate = new Date("2026-01-31");
+    endDate.setMonth(endDate.getMonth() + 1);
+    const timeScale = (date) =>
+      ((date - startDate) / (endDate - startDate)) * width;
+
+    // Draw chart background
+    ctx.fillStyle = backgroundColor;
+    ctx.fillRect(0, 0, canvas.width, canvas.height);
+
+    // Draw grid
+    ctx.strokeStyle = gridColor;
+    ctx.lineWidth = 1;
+
+    const monthsBetween =
+      (endDate.getFullYear() - startDate.getFullYear()) * 12 +
+      endDate.getMonth() -
+      startDate.getMonth();
+    for (let i = 0; i <= monthsBetween; i++) {
+      const x = margin.left + (i / monthsBetween) * width;
+      ctx.beginPath();
+      ctx.moveTo(x, margin.top);
+      ctx.lineTo(x, height + margin.top);
+      ctx.stroke();
+    }
+
+    const rowHeight = height / 5;
+    for (let i = 0; i <= 5; i++) {
+      const y = margin.top + i * rowHeight;
+      ctx.beginPath();
+      ctx.moveTo(margin.left, y);
+      ctx.lineTo(width + margin.left, y);
+      ctx.stroke();
+    }
+
+    // Draw title
+    ctx.font = "bold 28px Arial";
+    ctx.fillStyle = textColor;
+    ctx.textAlign = "center";
+    ctx.fillText("WordPress Roadmap", canvas.width / 2, 40);
+
+    // Draw x-axis labels
+    ctx.font = "12px Arial";
+    ctx.fillStyle = textColor;
+    ctx.textAlign = "right";
+    ctx.save();
+    for (let i = 0; i <= monthsBetween; i++) {
+      const date = new Date(startDate.getFullYear(), startDate.getMonth() + i, 1);
+      const x = margin.left + timeScale(date);
+      ctx.translate(x, height + margin.top + 15);
+      ctx.rotate(-Math.PI / 4);
+      ctx.fillText(
+        date.toLocaleString("default", {month: "short", year: "2-digit"}),
+        0,
+        0,
+      );
+      ctx.rotate(Math.PI / 4);
+      ctx.translate(-x, -(height + margin.top + 15));
+    }
+    ctx.restore();
+
+    // Draw milestones
+    milestones.forEach((milestone, index) => {
+      const y = margin.top + index * rowHeight + rowHeight / 2;
+      const x1 = margin.left + timeScale(milestone.start);
+      const x2 = margin.left + timeScale(milestone.end);
+
+      // Draw milestone bar with rounded corners
+      ctx.fillStyle = colors[index % colors.length];
+      ctx.beginPath();
+      ctx.moveTo(x1 + 5, y - 15);
+      ctx.lineTo(x2 - 5, y - 15);
+      ctx.quadraticCurveTo(x2, y - 15, x2, y - 10);
+      ctx.lineTo(x2, y + 10);
+      ctx.quadraticCurveTo(x2, y + 15, x2 - 5, y + 15);
+      ctx.lineTo(x1 + 5, y + 15);
+      ctx.quadraticCurveTo(x1, y + 15, x1, y + 10);
+      ctx.lineTo(x1, y - 10);
+      ctx.quadraticCurveTo(x1, y - 15, x1 + 5, y - 15);
+      ctx.fill();
+
+      // Draw milestone name
+      ctx.font = "bold 14px Arial";
+      ctx.fillStyle = textColor;
+      ctx.textAlign = "right";
+      ctx.fillText(milestone.name, margin.left - 15, y + 5);
+
+      // Draw "Internal Only" label if applicable
+      if (milestone.internal) {
+        ctx.font = "italic 10px Arial";
+        ctx.fillStyle = "#666666";
+        ctx.fillText("Internal Only", margin.left - 15, y + 20);
+      }
+    });
+
+    // Draw today's date line
+    const today = new Date("2024-08-19");
+    const todayX = margin.left + timeScale(today);
+    ctx.strokeStyle = "#FF6B6B";
+    ctx.lineWidth = 2;
+    ctx.setLineDash([5, 5]);
+    ctx.beginPath();
+    ctx.moveTo(todayX, margin.top);
+    ctx.lineTo(todayX, height + margin.top);
+    ctx.stroke();
+    ctx.setLineDash([]);
+
+    // Add centered legend for today's date
+    ctx.font = "bold 14px Arial";
+    ctx.fillStyle = "#FF6B6B";
+    ctx.textAlign = "center";
+    ctx.fillText("Today", todayX, margin.top - 15);
+
+    // Add a subtle border to the chart
+    ctx.strokeStyle = "#D0D0D0";
+    ctx.lineWidth = 2;
+    ctx.strokeRect(1, 1, canvas.width - 2, canvas.height - 2);
+
+    // Add tiny line in the bottom right
+    ctx.font = "8px Arial";
+    ctx.fillStyle = textColor;
+    ctx.textAlign = "right";
+    ctx.fillText(
+      `Generated ${new Date().toLocaleDateString()}`,
+      canvas.width - 10,
+      canvas.height - 10,
+    );
+  }
+
+  if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", createGanttChart);
+  } else {
+      if (location.pathname !== previousLocation?.pathname && location.pathname === "/roadmap-wordpress") {
+        createGanttChart();
+      }
+  }
+}
\ No newline at end of file