picocms / Pico

Pico is a stupidly simple, blazing fast, flat file CMS.
http://picocms.org/
MIT License
3.81k stars 616 forks source link

Where to put blog template / files? #612

Closed jlgarnier closed 2 years ago

jlgarnier commented 2 years ago

Hi all!

I've tried to create a blog-style pico site with the https://picocms.org/docs/#blogging indications and ended up with the following structure:

Capture d’écran 2021-11-19 172754

I've also added the blog-index.twig template into the /home/nextcloud/data/appdata_oc7hmh3uqrlj/cms_pico/themes/mytheme/ folder.

I understood there's no content/index.md file as the engine should look into the content/blog folder, but unfortunately Pico CMS (Nextcloud extension) just returns HTTP 404 when trying to render the site.

What's wrong or missing here?

Thanks in advance for any help!

mayamcdougall commented 2 years ago

Hi there. πŸ‘‹πŸ»

As I'm sure you noticed, our documentation isn't really the greatest. It's something I'm in the process of working on (it's going to be replaced altogether when it's done). πŸ˜…

The documentation isn't really clear, so I'm going to try to walk you through the current "blogging" example, and how it's expected to work.

Pico isn't blogging software (I know, it's the first line of that section. πŸ™„). There's no "blogging mode". Pico's "engine" (as you've put it) is completely unaware of your blogging intentions. Everything we do here is fancy trickery with Twig templates to create a page which displays links to your most recent content. It's simple, but can be rather effective. It does require that we fit all the puzzle pieces together though.

First of all, there should definitely be a content/index.md, so that's probably why you're seeing a 404. It seems like you want your blog to be the main part of your site. In Pico, content/index.md is always always your main index page. It displays when you visit the base_url of your site ( the basic, top-level, example.com page).

So, the instructions tell you to make a content/blog folder, and either a content/blog.md or content/blog/index.md to go with it. Either one of these page locations would resolve to the same example.com/blog url.

This is intended to be the "landing page" for your blog. It creates the list of articles (Pico's pages) ordered by the "date" property of their metadata.

On many blog websites, this would probably be on the front page itself. But the instructions in our Docs instead assume that you don't want your blog as the front page of your Pico site (content/index.md), but rather, as a separate page (eg example.com/blog instead of example.com). I think that might be where some of your confusion happened, as this isn't clearly stated in the documentation.

If you want your entire site to be the "blog", there's no reason you'd need this dedicated blog page. If you wanted, you could just use your content/index.md instead and the blog would be the front page. It sounds like that might be what you wanted. Also, if the whole site is going to be your "blog", having a blog folder itself would also be entirely by choice.

Next, by adding Template: blog-index to the metadata of a page (for example blog.md) we tell Pico to use blog-index.twig instead of index.twig when it goes to render the page. These templates are each full HTML/Twig pages, which get your content added in at runtime.

I'm not sure in reading your comment if your blog-index.twig is a full template or just the code snippet from the Docs.

What you want is to make a full copy of index.twig (named blog-index.twig), and stick the code example somewhere near where {{ content }} is (or perhaps even replace it). This, together with having Template: blog-index set will cause Pico to use this modified template whenever you visit said page. The code snippet itself is only responsible for making entries to your recent pages.

Now, explanation aside, there are pre-existing Themes on Pico's website that support blogging out-of-the-box. All the themes in the gallery are third-party creations, so many of them vary a bit in implementation and usability. I'm not sure exactly how Themes work in Pico for Nextcloud (I've never used the Nextcloud app), but I can look into it if it's something you need help with.

Depending on your experience level, going with an existing option might give you a result closer to what you were looking for. The Default Theme can be a bit sparse to start with, as it's really meant to be more of a barebones, reference implementation of how to use Pico than a production-grade website.

Typically with Pico, some coding is required (though I would personally like to create more "Ready-to-go" themes in the future to mitigate this a little). I can't tell by your comment how familiar you are with HTML/CSS, but it helps to have at least a little bit of knowhow under your belt when dealing with Pico. Pico's flexibility is nice, but it can sometimes be a very manual process to get what you want from it.

Let me know if this explanation helps at all. I'd be happy to go into more details and/or troubleshoot things with you. Pico can be a little daunting at times. Its incredible simplicity and versatility comes at the cost of having to implement a lot of things yourself.

Sorry for the information-dense introduction here. πŸ˜…

I'd be happy to walk you through whatever you need to get things going though. 😁

jlgarnier commented 2 years ago

What a great answer! πŸ‘ Thank you very much for taking the time to return so much information!

I now clearly understand the principles for tweaking Pico CMS into a blog engine! I've played a bit with the cleanblog theme and will probably stick with it as it fits most of my needs. I'll then base my own theme onto this one to tightly adapt its behavior to our site if needed.

Thanks again for such a great support!

mayamcdougall commented 2 years ago

I now clearly understand the principles for tweaking Pico CMS into a blog engine!

Glad to hear it! 😁

Yeah, Pico's pretty simple when it comes down to it. It's really more like the glue that holds together the various technologies (Twig, Markdown, etc). Once you've got a good grasp of how they work together, it's amazing what you can build from it. πŸ˜‰

If you have any other questions, don't be afraid to reopen this issue or create a new one (or if you just want to have a support discussion, we can keep chatting on this closed issue too).

Good luck and take care! ❀️