skohub-io / skohub-blog

https://blog.skohub.io
Apache License 2.0
0 stars 1 forks source link

Add initial skohub blog #2

Closed katauber closed 2 years ago

katauber commented 3 years ago

Resolves #1

acka47 commented 2 years ago

I copied the posts from lobid-blog (with some adjustments to the YAML frontmatter and the img refs). Also added a post about the SWIB20 and the LIS workshop (with co-author @sroertgen who should review those.)

There is a problem with the images of the first post (2019-05-17-skohub) which I don't understand as all of the other images are fine. Here is one error output:

Failed to process image /home/acka47/git/skohub-blog/content/blog/2019-05-17-skohub/pushing-notification.png.
It is probably corrupt, so please try replacing it.  If it still fails, please open an issue with the image attached.

  Error: pngload: non-recoverable state
  vips2png: unable to write to target target

 ERROR #gatsby-transformer-remark_gatsby-plugin-sharp-20000 

I like the approach with the gatsby dummy posts that there is a folder for each post that contains the markdown file and the images. However, we will have to think about a naming convention as folder and md file name are part of the URL. Currently, I named them both the same but I don't think this is the best way to do it.

Here is an example URL from the local setup: http://localhost:8000/2020-11-25-swib20-workshop/2020-11-25-swib20-workshop/

Maybe something like this is better: 2020-11-25-swib20-workshop/post or 2020-11-25-swib20-workshop/index

With regard to the layout, most things look fine, there is only one thing: there is not enough spacing between the button side of an image and the following text:

grafik

sroertgen commented 2 years ago

Hello there,

regarding @acka47 path issue I added the possibilty to add a pathattribute in the markdown frontmatter which can be used for custom urls. See https://github.com/skohub-io/skohub-blog/blob/2a14a172c85fe1f7bab74ab62a1b2fb434ecf6b7/content/blog/lis-workshop-2021/lis-workshop-2021.md#L10

Would that solve your issue? If one does not specify a specific path in the markdown frontmatter, the standard URL will be used as before

sroertgen commented 2 years ago

@acka47 I upgraded the gatsby-plugin-sharp to 3.1.2 as mentioned in this issue. The images are working for me now. You might have to delete package-lock.json and the node_modulesfolder. After that run npm i and gatsby develop again.

katauber commented 2 years ago

With regard to the layout, most things look fine, there is only one thing: there is not enough spacing between the button side of an image and the following text:

If we use the markdown syntax instead of html tags the images are styled properly because the style already provided by the project is used. I converted every html img tags to markdown links in 80b3972f5a664517308ad7cfcc27fc85de626934

katauber commented 2 years ago

Maybe something like this is better: 2020-11-25-swib20-workshop/post or 2020-11-25-swib20-workshop/index

I think the best way is to rename the md-files in each folder to index.md. What I like most in this solution that the 'index'-part won't be in the url and only show the name of the folder.

regarding @acka47 path issue I added the possibilty to add a pathattribute in the markdown frontmatter which can be used for custom urls.

Adding the path attribute requires some more work because switching between the blog posts (at the end of a blog post) does not work anymore this way.

Renaming the md files to index.md is the easiest way I think.

sroertgen commented 2 years ago

Renaming the md files to index.md is the easiest way I think.

I totally agree.

acka47 commented 2 years ago

I fixed a few URLs and updated some text. Running this locally I always got this error although everything worked fine in the browser:

image

Does anybody else encounter this problem?

Otherwiese, this already looks fine for me for publication. However, there are a few more questions we need to address before publication wrt most of the posts being copied from the lobid blog:

  1. Which ones will we handle as canonical posts?
  2. Will we add links SkoHub blog posts to point to lobid blog and/or the other way round?
  3. Add a link rel="canonical" statement to both versions for the hypothes.is annotations, see https://web.hypothes.is/help/how-hypothesis-interacts-with-document-metadata/#link-relcanonical.

I suggest using the posts from the SkoHub blog as canonical although they were created later and are not the original posts. We could then add links in different posts something like this:

katauber commented 2 years ago

Does anybody else encounter this problem?

I can't reproduce this problem 😕

I suggest using the posts from the SkoHub blog as canonical although they were created later and are not the original posts. We could then add links in different posts something like this:

  • on lobid blog: "See this post in the SkoHub blog."
  • on SkoHub blog: "This post was originally pubished here."

👍 Using the posts from the SkoHub blog as canonical sounds good, so people searching for SkoHub will be directed to the Skohub blog.

acka47 commented 2 years ago

Ok, I opened https://github.com/hbz/lobid-blog/issues/78 to set canonical link header in the lobid blog. To add canonical links in the SkoHub blog there is a plugin: https://www.gatsbyjs.com/plugins/gatsby-plugin-canonical-urls/

sroertgen commented 2 years ago

Hello all,

@acka47 I reviewed the SWIB and LIS articles. Ok for me! Thank you for writing them down.

I noticed a very small design issue(?): The bullet points are outside the text block

Screenshot 2021-08-04 at 11 31 13

If this is not intended I guess we could set list-style-position: inside in https://github.com/skohub-io/skohub-blog/blob/7f2fbaaec16f5fb428ba049d44d38e2fd1477db5/src/style.css#L176

But if you like and it does not bother you just keep it.

Otherwise I also can't reproduce https://github.com/skohub-io/skohub-blog/pull/2#issuecomment-890988399

acka47 commented 2 years ago

I noticed a very small design issue(?): The bullet points are outside the text block

Same with numbered lists:

image

I'd like lists to rather be indented as usual.

sroertgen commented 2 years ago

I noticed the same for blockquotes:

Screenshot 2021-08-04 at 12 05 22

https://github.com/skohub-io/skohub-blog/pull/2/commits/2153cf3e6d700ef414d1d415c15d6c38645eab83 should fix that (or if you liked it for the blockquotes, let me know and I will revert that 😃 )

acka47 commented 2 years ago

Ok, now lists and block quotes are aligned with the normal text. In the lobid blog (and elsewhere) those are rather indented. I'd like to try this out here as well. Can one of you please make such a commit?

katauber commented 2 years ago

Ok, now lists and block quotes are aligned with the normal text. In the lobid blog (and elsewhere) those are rather indented. I'd like to try this out here as well. Can one of you please make such a commit?

Like this? image https://github.com/skohub-io/skohub-blog/pull/2/commits/71cc53caa736393d63ccb0b070db7e5d7ee1bf6c

acka47 commented 2 years ago

Looks good and ready to deploy now. +1

acka47 commented 2 years ago

The blog is set up so far. Publishing will be dealt with in a separate ticket/PR. Merging.