Is this ready for use?

[tyeeman]

Hi atmoz
Saw your ycombinator post about this. I did a "go get" and got an exe. I'm on Windows7. Shall I give it a try?

[atmoz]

I'm using this for my own personal website, but have been busy with exams lately, so I haven't been able to write documentation. I have some ideas for improvements as well.

Since there are no documentation at the moment, you could get inspiration from here: https://github.com/atmoz/atmoz-net (templates are in the .ply directory).

Any feedback or ideas is welcome for future development.

[tyeeman]

Ok, I'll give it a try. The only extra thing I need is tags for posts, is that doable?

I looked at your site you suggested above. Is it using the current version of ply? There seems to be a lot of extras there that are not described in this ply repo?

[atmoz]

Yes, I'm using tags on my own website.

I haven't written much documentation (yet), so for now, my website mentioned above is the best source to learn about this tool.

You can see available template functions here (if you do not mind reading some code): https://github.com/atmoz/ply/blob/master/templatefn.go

[tyeeman]

Ok, just ran it and got this error -

panic: regexp: Compile(`^g:\laragonServerPortable\www\ply\ply.build`): error parsing regexp: invalid
 escape sequence: `\l`

goroutine 1 [running]:
regexp.MustCompile(0xc04206c570, 0x2b, 0x1)
        C:/go/src/regexp/regexp.go:240 +0x178
main.(*Site).Init(0x70f100, 0x604edb, 0x8)
        C:/goWorkspace/src/github.com/atmoz/ply/site.go:64 +0x184
main.main()
        C:/goWorkspace/src/github.com/atmoz/ply/main.go:49 +0x1e4

Windows uses backslash not front slash, I think that's it??

[atmoz]

Yeah, the directory path is used as regex, and apparently backslash in the path is parsed as an escape character.

Haven't tried this on Windows yet (I'm using Linux). Good thing you tested it, so I'm now aware of the problem. I will have to test this on Windows and fix any related bugs.

[tyeeman]

Is there a quick change I can make at my end and recompile locally here just to get it to work?

[atmoz]

I'll take a closer look tomorrow, but I guess the solution is to replace \ with \\ on line 64 in site.go.

[tyeeman]

So I would have to do the "go get" command again to get the new version from github. I've never done anything but that. Is there a local command I can use to rebuild my exe after I do the local mod?

[atmoz]

Fixed in e68897f. I tested ply on a windows laptop for the first time and I can see there are some problems with newline that I have to look into as well.

[tyeeman]

Ok, I'm testing. Previous problem gone. Thanks. Now I'm getting something funny with the menuing. In the build folder if I load one of the main pages, not a blog page, it shows fine. All the links in the menu are perfect. If I click on a link to a blog post, I see it fine but then all my menu links have "blog" inserted into them which makes everything not work. Give it a try. I've never seen menu items change, strange. The page source file is unchanged -

<li><a href="blog\overview.html">Overview</a></li>
<li><a href="blog\welcome.html">Welcome</a></li>
<li><a href="quick-start.html">Quick Start</a></li>
<li><a href="serving-a-blog.html">Serving a Blog</a></li>

Note above - backslashes should be frontslashes.

Update- Must be something to do with relative links in the menu. Notice above the links are relative to where you are. So if I'm in a blog page and hover over other menu items, the above links take hold and I get "blog\blog\overview.html" etc. which does not exist. So how to prevent this? Make them absolute from root. I'll try it. Nope - not when ply is in a sub-folder of the root, which mine is.

One other thing - When I go into a blog post I lose the link to images because the image folder is in the main folder not the blog folder. How to fix? Duplicating the image folder into the blog folder is not a good remedy.

Update2 - Ok, I tried making everything absolute from the root and the menu items need to look like this

<li><a href="/blog/overview.html">Overview</a></li>
<li><a href="/blog/welcome.html">Welcome</a></li>
<li><a href="/quick-start.html">Quick Start</a></li>
<li><a href="/serving-a-blog.html">Serving a Blog</a></li>

Now all works. I suspect the images folder needs the same thing.
Is there any way to make it work using relative links?

I don't see any newline problems. My markdown seems to populate my template fine.

So only one mod to do, add that front slash in menu items first character and change the backslash to frontslash in the rest of their paths.

One other consideration - Instead of multiple links on the main menu to the blog posts how about one "Blog" menu item that links to a blog page with the blog menu items there.

[atmoz]

Backslashes should indeed be frontslashes. It's using relative paths from the filesystem right now.

Regarding relative paths, when a template is used on a page, all paths are relative to that page. So when you want to link to files on the same level as the template, e.g. index.html, it will work fine for all pages on that same level. But once you add more directories with pages that inherit that template, the links will point to the wrong file (i.e. missing the needed ../ in front.

The second problem you have identified is the use of page .Path will always output paths relative to the root site directory.

Both these relative path problems are solved by using .Rel, have a look at my main ply.template:

<link href="{{ .Rel "style.css" }}" rel="stylesheet" />

Since my style.css will always be in the same path (root of my site), but my template is used on different directories, I have to pass style.css to .Rel, so the path always becomes relative to the current page path being rendered by the template.

This makes the href become ../style.css when visiting a page one directory level down from site root.

I try to avoid using absolute paths, as that limits where you can deploy your website. By always using relative paths, it's easy to host the website independent of directory levels. Imagine if you one day want to move your blog from blog.domain to domain/blog.

Hopes that makes sense!

[tyeeman]

.Rel works for my images -

"{{ .Rel "img/lodge-r.jpg" }}"

but I changed my template to this but still not right for navigation -

<ul>
{{ range .Sitemap -}}
    <li><a href="{{ .Rel .Path }}">{{ .Title }}</a></li>
{{ end -}}
</ul>

[atmoz]

You are calling .Rel .Path in the context of range .Sitemap, meaning that you are asking for the relative page path on itself. Change it to $.Rel .Path, and you will use the outer context (the page the template is rendering for), and you will get the relative path from the rendered page to the menu item (which is what you want).

[tyeeman]

Great, thanks working good.
Any thoughts on making a "Blog" menu item that takes us to the blog page with post listings? Can you think of an easy way to get something like that. Currently if I have 30 blog posts they are going to be located in the menu aren't they? I have room for maybe 5 menu items in my template.

[atmoz]

Sure, that's how I solved it myself. I have a "notes" directory with an empty index.md file and a ply.template (stripped down version here for demonstration):

{ if eq .Path "notes/index.html" }}
    <h1>Notes</h1>
    <ul>
    {{ range .SitemapReversed -}}
        {{ if (pathMatch "notes/*" .Path) | and (not (pathMatch "*/index.html" .Path)) }}
        <li><a href="{{ $.Rel .Path }}">{{ .Title }}</a></li>
        {{ end }}
    {{ end -}}
    </ul>
{{ else }}
{{ .Content }}
{{ end }}

As you can see, I use some template magic to make this work, as I check if the current page being rendered is index.html, in that case a list of all pages from the current directory are outputted (making sure index.html itself is excluded).

[tyeeman]

So if I make a "Blog" directory and use the above like this, it should work -

{{ if eq .Path "Blog/index.html" }}
    <h1>Blog</h1>
    <ul>
    {{ range .SitemapReversed -}}
        {{ if (pathMatch "Blog/*" .Path) | and (not (pathMatch "*/index.html" .Path)) }}
        <li><a href="{{ $.Rel .Path }}">{{ .Title }}</a></li>
        {{ end }}
    {{ end -}}
    </ul>
{{ else }}
{{ .Content }}
{{ end }}

Update - tried it but I'm getting a menu item of "index" and the text from Blog/index.md for the content area.
Update2 - Ok, those nasty backslashes are at it again. Notice your using forward slash in the above script, well the first test won't match here of course. I changed the forward slash to backslash and got this error -

FATAL: template: g:\laragonServerPortable\www\ply\ply.build\blog\ply.template:3: invalid syntax

I don't know what it's doing here. It's reading the template after it copied it from the root. Why did it even copy the template when building? It didn't when I left the forward slash there. I guess the match got triggered and the next part of the script saw the backslashes and complained. I'll try double backslash just for fun.

Update3- Yup, double backslash works fine. The listing is horizontal, I'll try to make it vertical. I'm also getting "index" in the main menu. I'd like to see "Blog".

Update4- Ok, got the menu vertical, and used this to get "Blog' in the main menu -

<article>

{{ if eq .Path "Blog\\Blog.html" }}
    <h1>Tony Blog Posts</h1>
    <ul>
    {{ range .SitemapReversed -}}
        {{ if (pathMatch "Blog\\*" .Path) | and (not (pathMatch "*\\Blog.html" .Path)) }}
        <li><a href="{{ $.Rel .Path }}">{{ .Title }}</a></li>
        {{ end }}
    {{ end -}}
    </ul>
{{ else }}
{{ .Content }}
{{ end }}

</article>

Don't know if I need <article> or not. Most likely not. It's not being styled in my template so that's good.

Now I need to remove from the menu the items that are showing in the Blog menu.

I suspect this has to be edited a little -

{{ range .Sitemap -}}
    <li><a href="{{ $.Rel .Path }}">{{ .Title }}</a></li>
{{ end -}}

This removed the Blog folder items but I lose my "Blog" menu item.

{{ range .Sitemap -}}
{{ if (not (pathMatch "Blog\\*" .Path)) }}
    <li><a href="{{ $.Rel .Path }}">{{ .Title }}</a></li>
	{{ end }}
{{ end -}}

[atmoz]

I'll have to normalize the file paths in some way, so it's consistent across operating systems, or else people wouldn't be able to share templates.

For showing only the index (I really would recommend using index.html and not Blog.html (and keep every filename lowercase), here is one solution:

<li><a href="{{ .Rel "Blog\Blog.html" }}">Blog</a></li>
{{ range .Sitemap -}}
    {{ if (not (pathMatch "Blog\\*" .Path)) }}
    <li><a href="{{ $.Rel .Path }}">{{ .Title }}</a></li>
    {{ end }}
{{ end -}}

EDIT: Fixed code typo

[tyeeman]

That one didn't work. I got multiple "Blog" items in the menu, so I changed it to this -

<li><a href="Blog\Blog.html">Blog</a></li>
{{ range .Sitemap -}}
    {{ if (not (pathMatch "Blog\\*" .Path)) }}
    <li><a href="{{ $.Rel .Path }}">{{ .Title }}</a></li>
    {{ end }}
{{ end -}}

Update - The above nearly works. Once I get to the blog page then hover over the Blog menu item I get

http://localhost/ply/ply.build/blog/blog/blog.html

[atmoz]

Oh, that's right, I meant to put the line on the outside of the range loop, my bad.

Try <li><a href="{{ .Rel "Blog\Blog.html" }}">Blog</a></li> instead, so the path always are relative to current page being rendered.

[tyeeman]

That works if I add the double backslash. Thanks.

Now all I have left to add is Tags!

[atmoz]

It's possible to include custom meta data in the top of pages like so:

---
tags: [pgp]
some_list: [1, 2, 3]
whatever: "you want can be included, as long as it's YAML"
---

But tags is a special keyword that will be appended to a global list available as .Site.Tags in all templates (normal page meta data are only made available in each page object as .Meta["keyword"]).

You can see how I've used this feature here: https://github.com/atmoz/atmoz-net/tree/master/.ply/tags – this is how it looks when it's built: http://atmoz.net/tags/

[tyeeman]

Yeah, I really like that tag page although I don't need feeds I guess. I will take a look at your code.
I am used to meta too so that's nice to see.

What I would like is to have a page of tags like yours but also to have a line in each blog post with the tags associated with that post like this -

Title of Blog post
Tags: tag1, tag2, etc

Content of post here

I can put the Title of Blog post and the Tag: line in the meta for sure. I'll try to see if I can figure it out.

[atmoz]

{{ if .Meta.tags }}
    {{ range .Meta.tags }}<a href="{{ $.SiteRoot }}/tags/index.html#{{ . }}">{{ . }}</a> {{ end }}
{{ end }}

For commas between tags you would have to do something like this: https://stackoverflow.com/questions/21305865/golang-separating-items-with-comma-in-template

EDIT: Actually, I forgot that I included stringsJoin as template function, so you can also use stringsJoin .Meta.tags "," like so (if you don't care about linking them):

{{ if .Meta.tags }}
    {{ stringsJoin .Meta.tags "," }}
{{ end }}

[tyeeman]

I added your code to tags/ply.template then added this to the top of a blog post -

---
tags: [home welcome]
---

When I build, I get a tag folder with nothing in it.

[atmoz]

Did you remember to add a markdown file ala index.md in the tags directory?

[tyeeman]

No I forgot, but just added and now I get in my main menu an "index" item with the contents of tags/index.md in it. Do I have to make the tags template similar to the blog template with an "if" statement at the beginning?

[atmoz]

There are multiple ways to solve that.

Simplest solution is to use if condition in the template as we talked about above.

It's also possible to use meta data, e.g. "hideFromMenu" and set that to "true" or something like that on pages you want to hide from the main menu.

Another is to use an YAML file with ignore patterns for the menu and read this file in the template to check with an if statement.

One of my goals was to make it as flexible as possible and not force too much predefined structure onto the content or templates.

[tyeeman]

Ok, I edited the tags template to this and now I get my "Tags" heading but the page of tags is still blank -

{{ if eq .Path "tags\\index.html" }}
    <h1>Tags</h1>
    <ul>
    {{ if .Meta.tags }}
    {{ range .Meta.tags }}<a href="{{ $.SiteRoot }}\tags\index.html#{{ . }}">{{ . }}</a> {{ end }}
{{ end }}
    </ul>
{{ else }}
{{ .Content }}
{{ end }}

[atmoz]

.Meta.tags is for pages, you probably meant to use the code in .ply/tags/ply.template

[tyeeman]

That feed info is confusing me. I'm not sure what to leave or what to delete.

[atmoz]

Here is the relevant parts only:

{{ .Content }}

{{ range $tag, $pages := .Site.Tags -}}
    <h2>{{ $tag }}</h2>
    <ul>
    {{ range $pages }}
    <li>
        <a href="{{ $.Rel .Path }}">{{ .Title }}</a>
    </li>
    {{ end -}}
    </ul>
{{ end -}}

[tyeeman]

Ok, I'm nearly done I think. I added the meta for the blog pages like this and it works although I would prefer to have the tags under the Heading of the post I don't think that's possible because that would be within the markdown content, true?

{{ if eq .Path "blog\\index.html" }}
    <h1>Tony Blog Posts</h1>
    <ul>
    {{ range .SitemapReversed -}}
        {{ if (pathMatch "blog\\*" .Path) | and (not (pathMatch "*\\index.html" .Path)) }}
        <li><a href="{{ $.Rel .Path }}">{{ .Title }}</a></li>
        {{ end }}
    {{ end -}}
    </ul>
{{ else }}
{{ if .Meta.tags }}
tags: 
    {{ range .Meta.tags }}<a href="{{ $.SiteRoot }}\tags\index.html#{{ . }}">{{ . }}</a> {{ end }}
{{ end }}
{{ .Content }}
{{ end }}

[atmoz]

That is correct. You could use a CSS trick where you put the content into a div and then hide the heading with #content h1 { display: none; }. In the template you could output the title of the page before the tags with <h1>{{ .Title }}</h1>.

Instead of hiding the header with CSS (which is not optimal), another possibility is to remove the header before outputting it, using regex: {{ regexReplaceAll "<h1>.*</h1>" .Content "" }}.

[tyeeman]

I moved them to the bottom of the posts, that seems ok for now.

[tyeeman]

Back from xmas. Hope yours was a good one! Back to tweaking the code a little. Is it possible to grab the first sentence of each blog post and put it under the tag listing for that post? My blog template is currently this -

    <h1>Tony Blog Posts</h1>
    <ul>
    {{ range .SitemapReversed -}}
        {{ if (pathMatch "blog\\*" .Path) | and (not (pathMatch "*\\index.html" .Path)) }}
        <h3><li><a href="{{ $.Rel .Path }}">{{ .Title }}</a></li></h3>
		{{ if .Meta.tags }}
      tags: 
    {{ range .Meta.tags }}<a href="{{ $.SiteRoot }}\tags\index.html#{{ . }}">{{ . }}</a> {{ end }}
	<br/><br/>
        {{ end }}
        {{ end }}
    {{ end -}}
    </ul>
{{ else }}
{{ .Content }}
{{ if .Meta.tags }}
tags: 
    {{ range .Meta.tags }}<a href="{{ $.SiteRoot }}\tags\index.html#{{ . }}">{{ . }}</a> {{ end }}
{{ end }}
{{ end }}

giving me this -

Maybe adding it to the meta is the easiest??

[atmoz]

This can also be solved with some regex magic:

{{ $intro := regexFindSubmatch `<p>(.*?[\.!\?])(?:\s|$)` .Content }}
{{ if $intro }}{{ index $intro 1 }}{{ end }}

BTW, I have worked on the path issues. I pushed the code now (8e81c39). You must update your code for it to work, unfortunately.

Basically I solved it by keeping the Page.Path internally and adding Page.Url, that always will output the path with / as separators. For this to work, I had to change some variable and function names.

Old code	New code
.Path	.Url
.Rel	.UrlRelTo
.SiteRoot	.UrlToRoot
.DirParts	.UrlDirParts
pathBase	urlBase
pathDir	urlDir
pathExt	urlExt
pathMatch	urlMatch
pathRel	urlRel
"blog\\index.html"	"blog/index.html"
\tags\index.html	/tags/index.html

Remember to always use / in URLs in your code from now on. This will make your code work on all operating systems (so your code should work if you decide to deploy it on a Linux server).

[tyeeman]

I tried the code above and it works for one of my blog posts but not the other -

Tony Blog Posts

    Welcome
    tags: home welcome

    Overview
    tags: home overview
    This is the first sentence.

Overview post looks like this -

---
tags: [home, overview]
---

# Overview

*Nov 19, 2015*

This is the first sentence.

and Welcome post looks like this -

---
tags: [home, welcome]
---

# Welcome

*Nov 19, 2014*

*Home, Welcome*

This is the first sentence!

[atmoz]

Try this regex: <p>(.*[\.!\?](?:</.*>)*)</p>, that will capture the first sentence in paragraphs, including *Home, Welcome*.

You can tweak the regex using https://regex-golang.appspot.com/assets/html/index.html and for example use this test string:

<h1>Welcome</h1>
<p><em>Nov 19, 2014</em></p>
<p><em>Home, Welcome.</em></p>
<p>This is the first sentence! More text here.</p>
<p>First sentence in another paragraph. Even more text.</p>

Regex syntax: https://github.com/google/re2/wiki/Syntax

[tyeeman]

Tried your suggestion above but some pages match and others don't.
OK, found the solution - it grabs the first paragraph

{{ $intro := regexFindSubmatch `(?s)</p>.*?<p>(.*?)</p>` .Content }}

[tyeeman]

I'm ready to run my static ply site using Netlify but a couple of minor issues popped into my mind.

1. I've noticed that when I run the build command here on my PC, all files in the root are copied to the ply.build folder which is good except the ply.exe is also copied. I don't know if this happens when you use it but I don't see any reason for any exe to be in the static site. Actually Netlify will not accept a static site folder with an exe in it. Am I doing something wrong here?

2. As I've mentioned I'm on Windows here. For Netlify, they use Linux servers so I need the Linux version of the build exe. Is there an option for the "go get" command to create the Linux build exe on my Windows PC? I will google and try to find out.

Update - I ran

set GOARCH=amd64
set GOOS=linux
go build -v github.com/atmoz/ply

and I got what I think is a linux exe without the .exe extension.

[tyeeman]

I see in main.go there is command line usage using
--ignore=
So if I use regex for exe files it should work. Currently it says
/\.
Which means any character?

[tyeeman]

OK, this regex ignores exe and bat files in the root folder -

ply.exe --ignore="^.*?\.(exe|bat)$"

[tyeeman]

Ok, I changed all my path codes to the new values as shown above and got the new exe and all works good!

[atmoz]

Good to hear that it works! There are a lot of sharp edges so early in the development stage, so any feedback is appreciated! Since it looks like you have tried a variety of static website tools, you probably know what features are lacking the most?

[tyeeman]

Yes, I've tried a lot and ply is in my top 3! So many lack must have's like tags (for me anyway), others just don't work properly, others use paths from root only, etc. I used to use only php script cms's but since static is the current rage and I can't see a downside to using it for just pages or blogs that's what currently interests me. And all these frameworks, nodejs, gatsby, vue, etc. A user like myself is not going to take months to learn those just to build a simple blog site although many are. I suspect they are developers themselves because someone who uses something like Wordpress cannot just decide to build a new site using gatsby and have it running in a few minutes like Wordpress can (although Netlify has one click installers now, but then to modify takes knowledge). My top 3 builders currently are all written in GO language. It is very nice to only have one exe to deal with and it's so fast to build the site. With your help in this issue, I have picked up more GO knowledge but I am not a coder and I don't have to be to use GO.
The only thing I will try to add to my ply site is a photo gallery. I guess a javascript one is the easiest? If you have something in mind that could do a gallery let me know.

[atmoz]

I have plans for adding template functions for image processing, i.e. being able to write something like imageResize img/file.jpg img/file-small.jpg 400x300 or just image img/file.jpg 400x300 (outputting new url for resized version). With these template functions available, it should be pretty easy to create a gallery with thumbnails.

But you should be able to make a simple image gallery without resizing now as well. I just tested this by creating a new directory and putting some pictures into it, including this ply.template:

{{ .Content }}

<ul>
{{- range $url, $name := listFiles "." true }}
    {{- if regexFind `\.(jpg|jpeg|png|gif)$` $name }}
    <li><a href="{{ $url }}"><img src="{{ $url }}" alt="{{ $name }}" /></a></li>
    {{- end }}
{{- end }}
</ul>

and this index.md (where the template will be outputted into):

# Gallery

It's hard to balance ease of use and flexibility, and being a programmer myself, I tend to lean more against having more flexibility, but that will require more template programming (like you have seen here).

[tyeeman]

Thanks, I tried the above but get some error about the .UrlDir. I removed the dot and used a small case u like you said above -

pathDir | urlDir

but it's still not building properly.

This is the error -

template: g:\laragonServerPortable\www\plyNew\ply.build\gallery\ply.template:3:31: executing "g:\\la
ragonServerPortable\\www\\plyNew\\ply.build\\gallery\\ply.template" at <.UrlDir>: can't evaluate fie
ld UrlDir in type *main.Page

but ply.template is not supposed to be in the ply.build folder. This is what occurs when it doesn't build properly so it's nothing unusual but I don't know if it's pointing to the actual problem?

[atmoz]

I got ahead of myself, .UrlDir is a function I have added locally, not yet pushed to GitHub. But I don't need it, so you can just remove that line (I updated the code above).

[tyeeman]

Thanks, works good but because of no resize I have portions of the full image but that is to be expected. I'll resize first.

[tyeeman]

Greetings, long time no talk!
Everything is working good except I would like to not have a "Tags" menu item in my menu. Here is the menu generation in my template -

<div id=topmenu>
 <p>
 <strong class=hide>Main menu:</strong>
 <ul>
{{ range .Sitemap -}}
    {{ if (not (urlMatch "blog/*" .Url)) }}
    <li><a href="{{ $.UrlRelTo .Url }}">{{ .Title }}</a></li>
    {{ end }}
{{ end -}}
<li><a href="{{ .UrlRelTo "blog/index.html" }}">Blog</a></li>
</ul>
 </p>
 </div>

I tried a couple of things but the build failed. I guess I want to urlmatch tags/* and not have it in the menu. I still want the tag page available though which already works good.
I tried the below, wanting an "and" function, but it failed -

{{ if (not (urlMatch "blog/*" "tags/*" .Url)) }}

[atmoz]

Hi! Nice to hear that it still works! I haven't worked much more on this (as you can probably tell by the activity in this repo), but it works well for blogs and small websites as-is.

You would need to use and, like shown in this code example: https://gist.github.com/rms1000watt/308ce7e525ebbf5981275981fa002a94#file-golang-template-if-and-go-L23

{{ if and (eq .Age 33) (eq .Name "Mary")}}

Which in your case would be

{{ if and (not (urlMatch "blog/*" .Url)) (not (urlMatch "tags/*" .Url)) }}

[tyeeman]

Very nice, thanks, works great.