PicoCMS for Nextcloud & Nginx

http://picocms.org/about/
Pico is a stupidly simple, blazing fast, flat file CMS. That’s definitely a mouthful, what does it even mean? In the most basic sense, it means that there is no administration backend or database to deal with. You simply create markdown files in the content folder and those files become your pages. There’s much more to Pico than that though.

https://nextcloud.com/blog/nextcloud-introduces-easy-website-builder-for-education-edition-with-picocms/
With PicoCMS you can create and manage websites with an address like: https://cloud.example.com/sites/my_site/ You can edit the website as easy text (Markdown style) files in Nextcloud.

You can make the pages visible for everyone or only for users or groups on your Nextcloud. You can also share the files that the website consists of so you can collaborate with others maintaining the site.

1. Download PicoCMS from the Nextcloud app store

https://apps.nextcloud.com/apps/cms_pico

2. Extract and upload PicoCMS to server

Extract and upload the cms_pico folder to your nextcloud apps directory (e.g. /var/www/cloud.yoursite.com/html/apps/ – or – /var/www/html/yoursite.com/nextcloud/apps/ – etc)

3. Enable the PicoCMS app in Nextcloud

Inside the administrator apps section of Nextcloud, Enable the PicoCMS app.

4. Update Nginx configuration

Below is the code to add to your nextcloud nginx config, replacing https://sub.domain.tld/ with your own domain:
https://github.com/nextcloud/cms_pico/issues/24

location /sites/ {
        rewrite /sites/(.*) /apps/cms_pico/pico/$1 break;
        proxy_redirect off;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Host $host;
        proxy_set_header X-Forwarded-Server $host;
        proxy_pass https://sub.domain.tld/;
    }

5. Restart Nginx:

$ sudo service nginx restart

6. Adding new sites

Go to the Nextcloud settings -> Pico CMS section of Nextcloud to add sites.

https://github.com/nextcloud/cms_pico/wiki

https://github.com/nextcloud/cms_pico/wiki/Security

Pico Plugins

Pico Themes

Markdown Sytax
https://daringfireball.net/projects/markdown/syntax

Markdown Extra
https://michelf.ca/projects/php-markdown/extra/

2 thoughts on “PicoCMS for Nextcloud & Nginx”

Hi Ken

thanks for your tutorial!

I followed your tutorial step by step using the latest Nextcloud 24 with nginx and traefik as a reverse proxy with letsencrypt ssl certificates. Everything runs in docker.

I configured the location /sites/ as described by you. However, I do get the following nginx error when calling the nexrcloud pico short url (long url works just fine):

ncfpm-nginx | 2022/10/10 21:25:50 [crit] 32#32: *3 SSL_do_handshake() failed (SSL: error:14094458:SSL routines:ssl3_read_bytes:tlsv1 unrecognized name:SSL alert number 112) while SSL handshaking to upstream, client: 11.1.111.11, server: , request: “GET /sites/investigator/ HTTP/1.1”, upstream: “https://11.1.111.11:443/apps/cms_pico/pico/investigator/”, host: “sub.domain.ddnss.de”

11.1.111.11 being my correct external IP address which I anonymized.

Do you have any idea what the problem could be?

Thanks, Det

Thanks for your comment Det. Just by looking at your error log it appears it has something to do with your SSL config. Have you tried using the url without port 443 in it? For example: “https://11.1.111.11/apps/cms_pico/investigator/”. Not sure if running this in docker makes a difference concerning the SSL issue but other than that it would probably be best to check the github page: https://github.com/nextcloud/cms_pico/issues

Ken Favors . com