How to migrate a corporate website-store Wordpress + Woocommerce to October CMS + oc-Mall

It all started with learning Laravel. Then I discovered October CMS, which is based on this excellent framework. Then I felt a bit ashamed about a site I’d created on WordPress, which I thought was well-made. But now I could see that websites could be made so much better. I was also facing VPS issues – Apache kept crashing...

In general, changes were in order. But that’s just the introduction. So, let’s get started.

UPD: 2024. I recommend using Winter CMS, as October CMS became commercial and is now taking a different development path. Much of what is described here can be applied to Winter CMS. PHP 7.x is no longer relevant, so it’s better to use 8.x. Tailwind CSS – also have newer version 3 and above.

What is October CMS and how to get started with it?

If you're learning October CMS from scratch, as I was, then you’ll need to spend some personal time to, let’s say, "get into the subject." There’s a great official website, a variety of themes, plugins, and documentation to help. Besides, it’s important to understand how to develop everything on your computer and then transfer it to the server.

After tinkering with all this, I finally decided:

• for development on my Linux laptop, I’ll use Microsoft Visual Studio Code
• as a CSS framework, we’ll use tailwindcss v1.4.6
• for uploading, I’ll use the Sync-Rsync plugin (vscode-ext.sync-rsync)
• since October CMS is based on Laravel, we have a built-in server for local testing. It runs from the project folder with the console command:

php artisan serve

• you need to install MySQL server or Maria DB on your computer (preferably via docker)
• you also need php-cli (better version 7.3), as well as some PHP modules (php-gmp, php-bcmath, etc.), which might be missing for this CMS.

Installing October CMS in a folder on a local computer

Create a folder anywhere you like and name it as you wish :) and go into it:

mkdir ~/dev/octobercms_project
cd ~/dev/octobercms_project

Now we’ll install it in the console (I find this simpler and faster): First, download the installer:

curl -s https://octobercms.com/api/installer | php

*Of course, you can install via composer – I tried that too, but the process takes longer, resulting in a larger file count and size. Since I didn’t see a particular need for composer, I...

Create the database:

mysql -u root -p

CREATE DATABASE octoberdb;
GRANT ALL PRIVILEGES ON octoberdb.* TO "octoberdbu"@"localhost" IDENTIFIED BY "octoberpass";
FLUSH PRIVILEGES;
EXIT

Install, answering a few questions:

php artisan october:install

Install any updates

php artisan october:update

You can delete the demo theme immediately if you like things clean

php artisan october:fresh

October CMS - which plugins and themes to use for a corporate site-store?

On the official website, there are both paid and free plugins and themes. There’s a handy page https://octobercms.com/leaderboard which makes it quite easy to choose suitable themes and modules.

• I’ll be using only free ones, not always the most popular.

Here’s what caught my eye – plugins for content, multilingual support, site search from RainLab; the offline.mall plugin, which, while not the most popular, is excellent; for site themes, we’ll base it on offline.oc-mall-theme and mehedi.megakit, as well as some useful plugins.

Commands to install:

For content and store dependencies:

php artisan plugin:install rainlab.user
php artisan plugin:install rainlab.location
php artisan plugin:install rainlab.translate

Store, theme for it, pages and blog, contact form plugin:

php artisan plugin:install offline.mall
php artisan plugin:install offline.sitesearch

php artisan plugin:install rainlab.pages
php artisan theme:install offline.oc-mall-theme

php artisan plugin:install rainlab.blog
php artisan plugin:install rainlab.blogvideo

php artisan plugin:install pollozen.simplegallery
php artisan plugin:install janvince.smallcontactform

A kind of “SEO all-in-one” – no separate modules needed for sitemap.xml, robots.txt, etc.:

php artisan plugin:install arcane.seo

Twig extensions:

php artisan plugin:install vojtasvoboda.twigextensions

More for SEO and content:

php artisan plugin:install vdlp.redirect
php artisan plugin:install mey.breadcrumbs
php artisan plugin:install offline.responsiveimages
php artisan plugin:install anandpatel.wysiwygeditors
php artisan plugin:install offline.speedy

Creating a store based on October CMS

The best way to do this is described in the documentation: https://offline-gmbh.github.io/oc-mall-plugin/getting-started/installation.html#installation

A useful command that can be run every time you set up the store:

php artisan mall:check

Create a resources folder and set up node_modules there:

npm install tailwindcss postcss-import
npx tailwindcss init --full
npx tailwindcss build tailwind.main.css -c tailwind.config.js -o ../assets/css/compiled-full.css

Exporting pages from WordPress to October CMS (Rainlab Pages). Semi-automatic method.

I didn’t find any suitable tool for this task, so I decided to do it this way.

Part of the task is done with a script, and part manually, as there are multilingual content, meta tags, redirects, and other nuances.

1. On WordPress, I had the WP All Export plugin installed – its free version is enough to simply export the contents of all pages into an XML file.

2. Create one page in October CMS (using the RainLab.Pages plugin) and configure it across all fields, including SEO.

3. Generate a file (named [slug].htm) in the theme folder content/static-pages, which we’ll use as a template for the XML export.

4. Write a small script (in PHP or your preferred language) that loads the XML, processes it as an array, and generates [slug].htm files, which we then simply transfer to the static-pages folder. Additionally, you need to add entries to the meta/static-pages.yaml file so that October CMS recognizes the generated pages.

In PHP, it might look like this:

<?php

$xmlpages = simplexml_load_file("pages-export-2020-july-06-1408.xml");
$yaml = "";

foreach ($xmlpages as $page) {
    if ($page->Languages == "Russian" && $page->Content <> "") {

        $pagefile = '[viewBag]
title = "' . $page->Title . '"
url = "/' . $page->Slug . '"
layout = "default"
is_hidden = 0
navigation_hidden = 0
meta_description = "' . mb_substr(strip_tags($page->Content), 0, 160) . '"
robot_index = "index"
robot_follow = "follow"
enabled_in_sitemap = 1
use_updated_at = 1
changefreq = "always"
priority = 0.1
==
';

        $pagefile .= $page->Content;
        file_put_contents("pages/" . $page->Slug . ".htm", $pagefile);
        $yaml .= "    " . $page->Slug . ": {  }
";
    }
}

file_put_contents("static-pages.yaml", $yaml);

5. Then check all pages in October CMS admin panel, build the menu and hierarchy if needed.

6. I didn’t have many illustrations, so I adjusted them manually. If desired, you could probably convert image links to a new format. I placed uploaded images in a specifically created pages folder in the media library.

Exporting posts from WordPress to October CMS (Rainlab Blog)

This can be done with almost standard tools, through export-import in CSV format.

1. Again, use WP All Export to export blog posts to CSV.

2. In October CMS under the blog management panel (/backend/rainlab/blog/posts), click "Import posts," then select "File format" > "Custom format." I didn’t have to change much, just match fields (File columns) to database fields.