Pico: proxying, themes?

tl;dr

I can’t get proxying and theming to work with Pico. Thank you.

EDIT 001 FWIW I’m using a Let’s Encrypt cert, and the “Intermediate” apache configuration recommended by Mozilla’s SSL config generator.

EDIT 002 I’ve since upgraded Nextcloud to v20.0.4. The issue persists.

(…)

More

I’d like to use Pico CMS with Nextcloud, primarily so I can create a private site to use as a personal wiki.

I can

  1. Create a test site and serve it at https://mydomain.com/index.php/apps/cms_pico/pico_proxy/test001

  2. Install themes by downloading them to /path_to_nextcloud_data/appdata_<string>/cms_pico/themes

…But:

Problem #1: Proxying

I can’t serve the test site at https://mydomain.com/sites/test001

…and I don’t understand why; it’s not that complicated(?) I enabled the required modules, then added the following to the vhost (as per the instructions):

ProxyPass /sites/ https://mydomain.com/index.php/apps/cms_pico/pico_proxy/
ProxyPassReverse /sites/ https://mydomain.com/index.php/apps/cms_pico/pico_proxy/
SSLProxyEngine on

…then restarted apache. But it doesn’t work: the browser says

Proxy Error
The proxy server could not handle the request
Reason: Error during SSL Handshake with remote server

…and the apache error log confirms:

[proxy:error] [pid 430085] (20014)Internal error (specific information not available): [client aaa.bbb.ccc.ddd:ppppp] AH01084: pass request body failed to 127.0.0.1:443 (my domain.com)
[proxy:error] [pid 430085] [client aaa.bbb.ccc.ddd:ppppp] AH00898: Error during SSL Handshake with remote server returned by /sites/test001
[proxy_http:error] [pid 430085] [client aaa.bbb.ccc.ddd:ppppp] AH01097: pass request body failed to 127.0.0.1:443 (mydomain.com) from aaa.bbb.ccc.ddd ()

THINGS I’VE TRIED

a. Editing the vhost file: I tried

  • proxying to localhost, rather than “mydomain.com” (made no difference)

  • proxying to http, not https (unsurprisingly, this produced the browser error “The requested url was not found on this server”)

  • proxying to …cms_pico/pico/ (not …cms_pico/pico_proxy/ ) (made no difference)

  • adding additional apache directives:

    SSLProxyVerify none
    SSLProxyCheckPeerCN off
    SSLProxyCheckPeerName off
    SSLProxyCheckPeerExpire off

b. The things recommended in this thread: https://help.nextcloud.com/t/picocms-step-by-step-instructions-for-installation-and-configuration/22643/10

Problem #2: Theming

I can’t apply custom themes to sites: the ones I’ve installed are listed in the drop-down at Settings > Administration > Pico CMS > Custom themes (i.e. they’re apparently recognised as global config options)…but when I go to Settings > Personal > Pico CMS, only the default theme is available.

THINGS I’VE TRIED

a. Obvious stuff e.g. www-data has write permissions to the various folders
b. Symlinking the “themes” subfolder of the appdata folder to (various locations in) the corresponding nextcloud app folder
c. Copying the themes wholesale (instead of symlinking them)
d. The things recommended in this thread: https://help.nextcloud.com/t/applying-a-pico-cms-theme-any-theme/30791

Any help would be gratefully received!

P.S.
Nextcloud 20.0.3 stable
Pico CMS for Nextcloud 1.0.12 (Pico 2.1.4)
Apache 2.4.41
Ubuntu 20.04.1

P.P.S.
“Plan B” (which I’m considering at this point): use a different flat file markdown-based CMS, then incorporate it into Nextcloud using the External Sites app.

Hello t-cubed! I have the very same problem right now, my browser returns a 503 - Service Unavailable error. I am as clueless as you. It would be great if we somehow could collaborate to get this to work. Feel free to dm me on Instagram (@smolinde)!

Hi smolinde.

My post was from December 2020, so forgive me if my memory is a bit rusty.

FWIW, I managed to solve the two problems (proxying, and theming) :slight_smile:

Proxying

I based my vhost configuration on the “Intermediate” config generated by the Mozilla SSL Config Generator. I use Apache 2.4.41 and OpenSSL 1.1.1f. The relevant section is:

# Proxies
    SSLProxyEngine on
    SSLProxyProtocol all -SSLv3 -TLSv1 -TLSv1.1
    ProxyPreserveHost on

# Pico CMS:
    ProxyPass "/sites/" "https://<my_public_IP>/index.php/apps/cms_pico/pico_proxy/"
    ProxyPassReverse "/sites/" "https://<my_public_IP>/index.php/apps/cms_pico/pico_proxy/"

…with <my_public_IP> replaced, obviously.

This (above) should serve Pico sites at:
“https://my_domain.tld/sites/name_of_site”

Theming

tl;dr It’s (slightly) complicated

There’s more than one “theme directory”. You should make any edits or changes to themes in the “upload” theme directory - see below - then reload the theme in Nextcloud to transfer those changes to the “working” theme directory (the one with the random string in its path).

  1. As per the instructions, upload themes to:
    /path_to_nextcloud_data_dir/appdata_<random_string>/cms_pico/themes/

Note that there needs to be an index.twig file in the theme subfolder i.e. /path_to_nextcloud_data_dir/appdata_<random_string>/cms_pico/themes/<theme name>/index.twig; otherwise it won’t be recognised and parsed as a theme.

  1. Correct ownership and permissions:
sudo chown -R www-data:www-data /path_to_nextcloud_data_dir/appdata_<random_string>/cms_pico/themes
sudo find /path_to_nextcloud_data_dir/appdata_<random_string>/cms_pico/themes -type d -exec chmod 0755 '{}' \;
sudo find /path_to_nextcloud_data_dir/appdata_<random_string>/cms_pico/themes -type f -exec chmod 0644 '{}' \;
  1. Click the “+” (Add custom theme) button in
  • Settings > Administration > Pico CMS

This will copy the theme to /path_to_nextcloud_install_dir/nextcloud/apps/cms_pico/appdata_public/themes/<ten_digit_alpha_string>/
(…at which point, the ten-digit alpha string will change).

Notes

  1. The “default” theme also appears in /path_to_nextcloud_install_dir/nextcloud/apps/cms_pico/appdata/themes/

  2. There’s also /path_to_nextcloud_install_dir/nextcloud/apps/cms_pico/vendor/picocms/pico/themes/ which is empty; IDK what it’s for(?)

  3. According to Pico sites, it looks for themes in /path_to_nextcloud_install_dir/nextcloud/apps/cms_pico/appdata_public/themes/<random string>/. I believe this is the “working” theme directory: the one the Pico app uses to actually generate sites.

A few hints

  1. This is probably stating the obvious, but it definitely helps to work in a “Nextcloudy” way i.e.
  • move files / folders around using the Nextcloud file browser
  • edit files using the Nextcloud markdown editor(s)
  • etc.

If you edit .md files (etc.) server-side i.e. on the command line, Nextcloud won’t automatically register the changes, of course; you have to use occ files:scan afterwards to scan the relevant directory.

  1. The documentation for Pico itself is very good…but some things work slightly differently in the Nextcloud Pico app (I assume because of Nextcloud folder versioning)

e.g. in terms of the variables used by Pico pages:

site_title  # parsed correctly
base_url    # doesn't include the domain(?) i.e. it starts at /sites/<name>
theme_url   # points to nextcloud appdata_public
assets_url  # has a random string appended to it
themes_url  # points to the parent dir of "theme_url"
plugins_url # again, points to a location in appdata_public

I hope that helps; best of luck!

t3

2 Likes