Have you ever click on a button that take you to GitHub issue that look something like this,

githubissue

As you can see, the information about the blog URL and the GitHub source URL is already prepopulated. User simply need to put down their concerns and that is it. Look nice and all right?

Ever wonder how this works? You are in luck, this article will teach you how it works and how to include it in your Jekyll site.

This is actually pretty simple. The magic is done through the query parameters.

What is a query parameters?

Query parameters is the bits that appended at the end of an URL. For example,

queryparameters

From the picture, we can see that the key fields are q and type, while the values are poanchen and repositories. Each set of key-value pair is separated by ‘&’. In case where the value has special character like ‘&’, the value would need to be encoded. For example, ‘&’ became ‘%26’.

How it works?

Natively, GitHub issue supports the following query parameters,

And the format would look like this,

https://github.com/[github_username]/[repository_name]/issues/new?title=[customized_title]&body=[customized_body]

For example, create an issue.

How do I add this to my Jekyll blog website?

Say, you want to prepopulate your GitHub issue in such a way,

Hey poanchen,

I found an issue where [Enter feedback here].

---

Blog title: How to prepopulate GitHub issue to make people's life easier in Jekyll?
Site URL: https://poanchen.github.io/blog/2020/10/27/How-to-prepopulate-GitHub-issue-to-make-people-life-easier-in-jekyll
Blog Date: 2020-10-27 08:30:30 +0000

source code hosted on GitHub

Then, this is how you would do it.

Hey {{ page.author }},

I found an issue where [Enter feedback here].

---

Blog title: {{ page.title }}
Site URL: {{ site.url }}{{ page.url }}
Blog Date: {{ page.date }}

source code hosted on GitHub

Once, you are happy with your customized body message. Simply copy and paste it into this place to encode it. This should give you a long encoded string. Simply add it as body in the format described above.

For example, create an issue.

which should look something similar to this,

githubissuedone

Now, simply include this magic long URL into one of your Jeykll blog so that others can start creating issue on your end effortlessly.

Tada! Now that you have learned how to prepopulate GitHub issue with customized title and body message, start adding!!!

Wrapping Up

Hopefully this article has help you to prepopulate GitHub issue with customized text and thank you for reading!

Resources

I’ll try to keep this list current and up to date. If you know of a great resource you’d like to share or notice a broken link, please let us know.

Getting started