add contributors guide and begin integration

This commit is contained in:
Infominer 2020-01-05 04:16:39 -05:00
parent 683c45ba97
commit 52b89dfd66
5 changed files with 1160 additions and 2 deletions

165
_HowToContribute/intro.md Normal file
View File

@ -0,0 +1,165 @@
---
title: "DIDecentral: Contributors Intro"
description: "Getting started contributing to DIDecentral via Twitter, Discord Chat, and GitHub."
excerpt: >
A variety of ways to contribute to DIDecentral with a minimal barriar to entry. Starting from Twitter, Discord Chat, and GitHub.
header:
caption: "Quickstart for [GitHub](https://github.com/didecentral), [Twitter](https://twitter.com/didecentral)."
tags:
- Discord
- Archives
- GitHub
- Twitter
- How-To
toc_sticky: true
date: 2019-07-06
author_profile: false
authors:
- "<a href='https://infominer.id'>Infominer</a>"
- "<a href='https://www.caballerojuan.com'>JuanSC</a>"
published: false
last_modified_at: 2019-07-14T11:22:33-23:00
---
We are happy for contributions from anyone, regardless of technical skills, or pre-existing knowledge. The intention for this Community Website is to focus on detailing a variety of ways to contribute, and to enable anyone to become more familiar with web-publishing, in a low stakes environment, while pursuing a passion for Sovereign Identity.
## Comments!!!!
Yay! Because of the static nature of webpages hosted from GitHub, its required to make an integration of some sort. Some active agent online must recieve the comment, and leave a properly formatted pull-request.
It would be simple enough to use a third party comments system. However, I really wanted to use @Staticman which is an open source application that I could independently run on a pi, or even a free heroku instance. It's a portable solution, that enables complete operator control over its implementation.
![](https://imgur.com/4x0dN7k.png)
It took quite a bit of effort, searching through github issues, and following all trails, but I finally figured out a good build and got it properly set up.
Soon, you will be able to leave a comment on any page in the DIDecentral ecosystem. Making it simple for **anyone** to note ideas, share links, suggestions, and typos as you browse.
## GitHub is Designed for Collaboration
We welcome issues or pull requests for question, comments, or contributions of every type. While some may feel intimidated to get started with GitHub, we assure you it's just like any other social platform with user profiles, content, text fields and buttons.
If you have questions, other people probably want to know the answer also. Its not easy to remember and document every sticky point of working with github pages, discord, and associated digital tools.
However, over time, through the process of collaborative editing, crowdsourcing ideas, and learning together, to discover and extract value from various datasets.
{% include figure image_path="https://imgur.com/WJVcyXT.png" alt="github.com/didecentral" caption="[github.com/didecentral](https://github.com/didecentral)" %}
### DIDecentral - Repositories
A number of repositories which will be good sources for content creation have been forked into this organization for reference. The following are the primary repositories under our care.
* [DIDecentral](https://github.com/DIDecentral)
* [didecentral/community-website](https://github.com/didecentral/community-website) - Community Site and Archive
* [didecentral/decentralized-id.com](https://github.com/didecentral/decentralized-id.com) - Decentralized Identity
* [didecentral/rwot-dir](https://github.com/didecentral/rwot-dir) - Rebooting Web of Trust - Archive (once built, to be integrated with WebOfTrust.Info, somehow)
* [Identitywoman/identity-commons](https://github.com/Identitywoman/identity-commons) - To become *the* source for Decentralized ID history, merging our combined resources.
Besides these, @infominer33 commonly forks repositories into the organization that seem like good sources for future collaboration and\or content creation.
## GitHub Issues
* [didecentral/community-website/issues](https://github.com/didecentral/community-website/issues)
* [didecentral/decentralized-id.com/issues](https://github.com/didecentral/decentralized-id.com/issues)
* [didecentral/rwot-dir/issues](https://github.com/didecentral/rwot-dir/issues)
Generally speaking, this is a good place if you have a link or two to contribute, a question, ideas, want to point out a broken feature, or even just to say Hello :D
Github issues are just like the comments feature, except it lets you note where exactly in the source there is a problem, or you have a suggestion. We're open to feedback and collaboration in whichever venue you prefer.
## Pull-Requests
* [didecentral/community-website/pulls](https://github.com/didecentral/community-website/pulls)
* [didecentral/decentralized-id.com/pulls](https://github.com/didecentral/decentralized-id.com/pulls)
* [didecentral/rwot-dir/pulls](https://github.com/didecentral/rwot-dir/pulls)
These are good if you'd like to correct something, or suggest some changes to any aspect of the site. Also, a pull-request is the official pipeline for introducing changes to a repository.
Over time we will introduce more fine grained guides on how to do this in a way so that your contribution is easily accepted and recorded in the git history.
### "Edit This Page"
![](https://imgur.com/Fv7L2yC.png)
Nearly every page has a section like this, where you can share socially, or edit\view on GitHub.
Clicking that button takes you to the unformatted version of the page on GitHub. When you are logged in to GitHub, that puts you one click away from editing this page: look for the pencil icon on the right side, just above where the line-numbered raw file begins.
![](https://imgur.com/vb59ogs.png)
Clicking it will reload an take you to an editable version of the page, which proposes an update through github. The monitor icon will open an editable change-proposal of the file. This allows you to contribute through a familiar interface (your web-browser), without having to understand anything about GitHub.
Whether it's an actual improvement, fully functioning with proper markup, or simply a note, it will be read and appreciated! Even if your change isn't perfect: We'll try to accept it and include your "commits", which are Git's way of recording contributions that GitHub has built a web-interface over.
None of us are necessarily professional or experts with git or web-publishing. However, we do wish to learn and grow our digital skillset.
## If you all could just..
![](https://infominer.id/bookmark-donations/that-would-be-great.jpg)
If you would export me a copy of your bookmarks.... that would be great! After a while I'll make a few fine grained how-to. This is one of the simplest ways that nearly anyone could make a significant contribution.
We would be happy to accept your raw unsorted bookmark exports! :D
I will create detailed guides, to ensure that everyone is able to click a few buttons and share the wealth!.
## Twitter @ Mention and Hash Tags
You can simply @ mention @didecentral, and it's activity will be preserved, soon to by syndicated here on this website, via [indieweb](https://web-work.tools/indieweb/) design. I will also follow related hash-tags and see about re-publishing them here, somehow.
I will track #decentralizedidentity, #selfsovereignidentity, and #didecentral. The final one is similar to @mention, a way for the community to track a larger volume and variety of content than would typically warrant a @mention.
## Contributing Via Discord
>Discord is, hands down, my favorite way to organize information on the fly. It's also quite useful for collaboration. -@infominer33
If you've never used it before, Discord is a powerful, free-to-use, closed-source communication/collaboration platform like Slack or Telegram, originally designed for the gaming community but since popular with opensource projects and startups.
![](/assets/images/share-button.png){: .align-right}
There are a couple simple ways of sharing to discord that have made it quite convenient for keeping track of information.
Its also possible to leave comments, and questions inline with the links. Any that have substance, and are on-topic for the channel they are in, will be re-published in the periodic export of discord to this web-site.
One of the great things about Discord is that they have made it a very welcoming space for developers. There are a multitude of open source bots already made for discord, and plenty of people learn to develop by building them. (leaving a wide open door for future integrations)
### Discord Desktop
Desktop is much nicer than Moble, for my purposes. Once opened to the Discord App, hit `ctrl + k` and begin typing the name of the channel where you'd like to go.
![](https://imgur.com/LBIoqR7.png)
Even if you don't remember the channel name, it's usually simple enough, even dropping it in the #library-submissions or #general will suffice on the fly, and later, the link will be dropped in its appropirate channel.
### Discord Mobile Share
I have an iPhone, and will have to discover how to do this with Android. However, I hope it's rather intuitive, once you think of it.
I had to enable sharing to discord, and you might have to do the same type of thing with android. Once you've set up the sharing integration, then it's simple to do, on the go.
**1** ![](https://infominer.id/assets/img/discord-share-workflow-1.png) **2** ![](https://infominer.id/assets/img/discord-share-workflow-2.png)
**3** ![](https://infominer.id/assets/img/discord-share-workflow-3.png) **4** ![](https://infominer.id/assets/img/discord-share-workflow-4.png)
### Discord Web App
There is totally a web-app for discord if for some reason you are unable to install the app. We'll embed it into the website sometime :)
* [discordapp.com](https://discordapp.com/)
## Telegram Chat
I've heard complaints that Discord uses a lot of mobile bandwidth, and that we should have a telegram channel.
If you want to open a DIDecentral telegram chat, please do and invite [@infominer](https://t.me/infominer33), invites open.
## Thanks for Visiting!
As I hope is clear, we are committed to making this resource as accessible for collaboration as possible. To eventually include how-tos for everything from the simple to the big picture.
Feel free to visit [Web-work.tools](https://web-work.tools) for an array of entry-level web-work how-tools.

View File

@ -0,0 +1,313 @@
---
title: "Contributors Quickstart (A Gentle Introduction to GitHub)"
excerpt: "Learn how to revise/add content to a page, or submit your first blog-post via web-browser."
tags: ["Quickstart","Tools", "GitHub Pages", "Minimal Mistakes"]
author: Infominer
author_profile: false
toc_sticky: true
date: 2019-07-13
last_modified_at: 2019-07-14T11:22:33-23:00
---
So far, we've covered quite a lot of ground in our contributors guides!
* [Welcome DIDecentral](https://didecentral.com/welcome/) - A high level overview of the projects we're working on.
* [Intro](https://didecentral.com/contributors-guide/intro/) - The easiest ways to participate with DIDecentral.
* [Quickstart](https://didecentral.com/contributors-guide/quickstart/)
* [Infobot Hello](https://didecentral.com/test/infobot-hello/) - Teplate for your first community blogpost.
* [Site Setup and Configuration](https://didecentral.com/contributors-guide/site-config/) - 'Everything' about how this site is configured.
* [Social Curation Archive](https://didecentral.com/contributors-guide/discord-archive-howto/) - How to export discord history and integrate with Minimal Mistakes Jekyll.
What is needed is a quickstart guide, so that you don't have to read all of that to revise \ add a few links to a page, or even submit your first blog-post.
All that's required to follow this guide is a web-browser and a GitHub account. If you don't already have one, go ahead and [sign up](https://github.com/join) so you can follow along.
{: .notice--primary}
If you've been following along with these posts from the beginning, you'll want to go back and review, since I forgot to wrap any liquid templating that I was showing in codesnippets with "raw tags" (see source for details). As a result, a significant portion of the value was lost to any early readers.
{: .notice--warning}
## Edit This Page
Feel free to submit test pull-requests while following along or exploring on GitHub.
![](https://imgur.com/txuSpMs.png)
Besides using social media, such as [twitter](https://didecentral.com/contributors-intro/#twitter--mention-and-hash-tags) or [discord](https://didecentral.com/contributors-intro/#contributing-via-discord), the simplest way to contribute to these web-sites is by clicking "Edit this page", which should be found at the bottom of every page run by DIDecentral.
If everything is properly set up on our side of things, you will find yourself transported from our website to that pages source file on GitHub.
<img src="https://didecentral.com/assets/images/edit-this-page.png" alt="Pencil Edit Button on GitHub Source File">
If you click the little pencil icon (red circle in above image), you will find a basic text editor and the pages source. If you don't have commit access to the repository, a patch copy of that file will be created in your github account where you can edit, and propose changes.
![](https://imgur.com/2UEOj9V.png)
## Front Matter
This is where configuration on the page level happens.
```markdown
{% raw %}
---
title: "Welcome to DIDecentral Community Site and Social Archive"
description: "DIDecentral is a collaborative curation initiative aiming to create quality educational content related to Decentralized Identity: Principles, Specs, Code and Initiatives."
# the excerpt is what supplies preview text on the post-index.
excerpt: >
A high-level overview of our organization, its projects, and their general state of development.
header:
image: /assets/images/didecentral-community-header.png
teaser: /assets/images/didecentral-community-teaser.png
caption: ""
tags:
- "Decentralized Identity"
- "Web of Trust"
- "Self Sovereign Identity"
- Archive
- How-To
categories: ["DIDecentral", "Welcome"]
author: Infominer
#If you are making some revisions to existing content you can use the following example that will add a contributors section at the bottom of the page near tags and categories (be sure to uncomment and edit those lines to fit the situation of whatever page you are on).
authors:
- #"<a href='https://infominer.id'>Infominer</a>"
- #"<a href='https://www.caballerojuan.com'>JuanSC</a>"
#If you want to change a permalink, you must add the current permalink to the `redirect_from` list, or create one if it does not already exist.
permalink: welcome/
redirect_from:
- welcome-didecentral/
- welcome
- welcome-didecentral
toc_sticky: true
published: true
last_modified_at: 2019-07-10T11:22:33-23:00
#Be sure to change the modified date. I create my own custom made-up time, with the actual date. You can simply ignore the time, and update the date, or use whatever you'd like for the time. Later, the most recently modified content will be featured.
---
{% endraw %}
```
In yaml documents, and the yaml front-matter of posts, the #hashtag is used for comments. Hopefully with the commented front-matter above, it's reasonably clear how the configuration of a page works. There are other page settings, but this covers all the essentials.
## Saving your changes
Once you've completed any edits, whether you've added a link or corrected a spelling error, leave a simple comment explaining what type of change you're proposing.
![](https://imgur.com/2s6Kspq.png)
Once you've submitted a change, GitHub compares the original with your proposed changes and asks if you'd like to create a pull-request.
![](https://imgur.com/rWSn2nr.png)
Assuming you're happy with the changes (in green at the bottom) go ahead and create a pull-request.
![](https://imgur.com/1ak7bhi.png)
Leave a comment explaining your changes. There is plenty of room to be as descriptive as you want in the pull-request comments, compared to the commit comment which is typically short.
## Checking on your Pull-Request
You should get an e-mail notifying you of any updates related to your pull-request. However, you can always see updates related to your open issues and pull-requests by clicking the GitHub logo at the top of any page on GitHub.
![](https://imgur.com/qAEcp7w.png)
That feed also includes notifications for any individuals you follow or repositories you watch.
![](https://imgur.com/EQQdzri.png)
Since the account I used to create this guide doesn't follow anyone or have any activity, here's an example of an active feed:
![](https://imgur.com/PBhPqtH.png)
If you don't have time to get into GitHub, don't feel obliged to read any further. Above should be plenty to begin making simple contributions, as you browse, without getting too technical.
{: .notice--primary}
## Fork didecentral.github.io
One advantage of forking the repository is that you can make as many changes as you like, and take as long as you want in your local repository. Then submit a pull-request when you're satisfied.
![](/assets/images/fork-repository.png)
Now you'll have a copy of the repository in your account.
![](https://imgur.com/8lNavU8.png)
## Write a Blog Post
Since you have full permissions to this repository, you can upload files or create them right in your browser!
This site is for the community. Anyone is welcome to sumbit a post. This should be a low-stakes environment where anyone could learn to use GitHub and GitHub Pages for the first time.
Even if you just want to write about what brings you to DIDecentral, share what project you are working on. If you aren't currently working on anything identity related, that's fine, share what you'd like, use your imagination.
The idea is to be as welcoming as possible, and encourage people to try it out. Editing text files on GitHub is a gateway to digital transformation.
You don't have to be very technical to get started. If you start with the simple things, after a while, you'll find that you're getting to know the lay of the land. It's possible to build from there to learn any number of technical skills, as @infominer33 has been discovering.
## authors.yml
If you're submitting a new post, or planning to make any contributions, why not add yourself to the [authors.yml](https://github.com/didecentral/community-website/edit/master/_data/authors.yml)?
This way an "author profile" will be shown next to your posts. Later, we can modify the author profile template to include info about all of your contributions to the site, and eventually each author will have their own page made with user-generated Jekyll data.
![](https://imgur.com/9tXkp0t.png)
```yaml
Infobot:
name : "Info-bot"
bio : "Digital Helper"
avatar : "https://imgur.com/LPDefso.png"
links:
- label: "Email"
icon: "fas fa-fw fa-envelope-square"
url: "mailto:infominer@protonmail.com"
- label: "Website"
icon: "fas fa-fw fa-link"
url: "https://infominer.id"
- label: "GitHub"
icon: "fab fa-fw fa-github"
url: "https://github.com/info-bot/"
- label: "Twitter"
icon: "fab fa-fw fa-twitter-square"
url: "https://twitter.com/infominer33"
- label: "Discord"
icon: "fab fa-fw fa-discord"
url: "https://discord.gg/29mZwPQ"
- label: "Telegram"
icon: "fab fa-fw fa-telegram"
url: "https://t.me/InfoMiner33"
```
Simply copy-paste this example, removing any social networks you don't use, and if you don't see your preferred social networks listed, go to [fontawesome.com](https://fontawesome.com/icons/telegram?style=brands) to see how your favorite social site is labeled (mostly you can just use it's name and copy the format shown above).
Save your addition to `authors.yml`, and we'll cover pull-requests after submitting our post.
## Create New File
Now that you've added your info into the author data file, you are ready to create your first blog-post with DIDecentral.
![](https://imgur.com/lIn4hRm.png)
Click "Create new file" where the hand pointer is in the illustration, above the file listing, below the "watch" icon.
Name your post starting with the date, and then the title, with `-` dashes instead of spaces.
`YEAR-MONTH-DAY-title.md`
```html
{% raw %}
---
title: "Hi I'm info-bot!"
author: Infobot
permalink: test/
---
**Hello world**, this is my first Jekyll blog post.
I hope you like it!
I'm an account that @infominer33 uses for experimenting with various features.
This post was written during the creation of our [Contributors Quickstart](/contributors-quickstart/) guide.
{% endraw %}
```
![](https://imgur.com/EMiBZzQ.png)
For now we'll just commit to the master branch, and submit a pull-request. However, in the future, we'll detail how to create (and merge back in) a new working branch, to leave the master branch in sync with its source while you work (especially helpful for bigger changes that might take a while).
## Submit a Pull Request
Now that we've saved the file in our personal copy of the repository, lets create a pull-request and get it published.
**Click the "Pull-Requests" tab on the upper left below your repository name:**
![](https://imgur.com/xlLx8s1.png)
**Then click the "New Pull Request" Button**
![](https://imgur.com/qWHet5w.png)
Any time you are creating a pull-request, remember, the `base repository` is wherever you're trying to send the suggested changes, and the `head repository` is wherever you've made the changes.
[![](https://imgur.com/PqpNCuRl.png)](https://imgur.com/PqpNCuR.png)
Once you're sure that you've included only changes you intended, and that you are making changes where you meant to, go ahead and "Create pull-request"
![](https://imgur.com/hZSoJVM.png)
Enter some comment and click "Create a pull-request" on this page:
![](https://imgur.com/FMAUa8L.png)
Now the project collaborators will recieve a notice that a pull-request has been submitted, and within a day or so (hopefully sooner) you're pull-request will have been accepted, or at least commented on.
Should it take longer than you'd expect, visit [DIDecentral Discord Chat](https://discord.gg/eYm2XvZ) and check to see if anyone has seen your pull-request.
## Changes After Request is Submitted
After you submit a pull-request, you can continue to change the branch or repository where your pull-request originated, and any additional updates will be included in the request.
{ .notice}
Head over to [didecentral/community-website/pulls](https://github.com/didecentral/community-website/pulls) and you can see the active pull-requests.
Whether you were working from a personal copy of the site, or a patch automatically created by GitHub after clicking the "edit this page" button, you can get there from this page:
![](https://imgur.com/nCA1zfl.png)
Clicking [info-bot:patch-2](https://github.com/info-bot/didecentral.github.io/tree/patch-2) leads me to the patch that was created and I can edit to my hearts content, here, if I'd like those edits to be included in the same pull-request.
## Site Structure:
```
/_application
/_blockchain
/_multi-media
/_organizations
/_private-sector
/_public-sector
/_tech
/_resources # This line and above are "categories" as explained in discord archive post
/_data # Data files including authors.yml, and navigation.yml
/assets # images javascript and css live here.
/bookmark-donations # Upload your bookmarks export file here.
/example-site # Find example posts here.
/_includes # Partials used to inject modularized html blocks into pages
/_layouts # These are large partials defining the layout of different page types
/_pages # These don't require a dated filename, or get added to the blog feed.
/_posts # This is where you'll be submitting a blog post
/_sass
/_site # This is the latest local build of the site, not the live version.
/_config.yml # Site Configuration
/Gemfile # Local Site Configuration
/CNAME # Site url
/index.html
/favicon.ico
/README.md
```
## That's all for now
**Let us know in the comments if you have any questions!**
### More Info
* [jekyllrb.com/docs/posts](https://jekyllrb.com/docs/posts/)
* [What is the JAMstack?](https://jamstack.org/)
>You may have already seen or worked on a JAMstack site! They do not have to include all attributes of JavaScript, APIs, and Markup. They might be built using by hand, or with Jekyll, Hugo, Nuxt, Next, Gatsby, or another static site generator...

View File

@ -0,0 +1,665 @@
---
title: "Minimal-Mistakes-Jekyll - Setup and Configuration"
description: "Contributing to the websites of DIDecentral via GitHub, Jekyll and Minimal Mistakes."
excerpt: >
This is to help anyone to understand how we're using Minimal Mistakes to publish this and other web-sites. For contributors, or your own use, outside of this organization.
header:
caption: "Minimal Mistakes Setup and [Quick-Start](https://mmistakes.github.io/minimal-mistakes/docs/quick-start-guide/)."
date: 2019-07-04
authors:
- "<a href='https://infominer.id'>Infominer</a>"
- "<a href='https://www.caballerojuan.com'>JuanSC</a>"
published: true
last_modified_at: 2020-01-05T11:22:33-23:00
---
I'm creating this resource while I do the initial setup so that DIDecentral, the Organization, has a guide to how its websites work. This will compliment [decentralized-id.com](https://decentralized-id.com), and support its co-creation.
This guide should make it easier for contributors to understand how this site works, or even for you to use this guide and create your own web-site!
Granted, you don't *need* to know any of this to participate with and contribute to this resource. I'm sharing this here, for anyone who wants to see how this site works.
Soon, there will other guides that simplify onboarding, so that anyone can contribute to this resource, via their preferred social platform.
## Why Minimal Mistakes?
Generally speaking, I like to use and learn know a variety of [static site generators](https://web-work.tools/static-site-generators/) and theier themes.
However, I've used Minimal Mistakes to publish large websites and small web-sites. It really works. It works well. Even before you know how to use all of it's features, its a really reliable framework.
It supports an incredible variety of functions that simply work. So for building public-domain educational resources, it makes sense for me to stick with what's tried and true. I've tried to find other themes that offer a comprable feature set, and it's not easy.
Much respect to [Michael Rose](https://mademistakes.com/)!!
I've used a few of his themes; they are well put together, often ported to other SSGs besides Jekyll, and really a class of their own when it comes to Jekyll themes.
## Getting Started
* [Minimal-Mistakes Quick-Start Guide](https://mmistakes.github.io/minimal-mistakes/docs/quick-start-guide/)
* [GitHub Pages Starter Pack](https://web-work.tools/github-pages-starter-pack)
You shouldn't need the above for our imediate purposes, but will likely find them useful at some point.
* [mmistakes/minimal-mistakes](https://github.com/mmistakes/minimal-mistakes/)
* [didecentral/decentralized-id.com](https://github.com/didecentral/decentralized-id.com)
* [didecentral/community-website](https://github.com/didecenral/didecentral.github.io)
### Pre-requisites
You must have installed [Git](https://web-work.tools/command-line-git-ssh/),` and the [Ruby Bundler](https://bundler.io/).
I'll also recommend using [VSCode](https://web-work.tools/content-creation/), because it's fully integrated with `git`, so that you don't have to worrying about learning git commands.
Also, I usually create a new repository on github, first. Then I clone it locally, again, avoiding the terminal. Meaning we can learn git in more depth, at our leisure.
### [Site Structure](https://mmistakes.github.io/minimal-mistakes/docs/structure/)
Before we get started, here is a high-level view of the site-structure.
* [minimal-mistakes](https://github.com/mmistakes/minimal-mistakes/)
```
minimal-mistakes
├── _data # data files for customizing the theme
| ├── navigation.yml # main navigation links
| └── ui-text.yml # text used throughout the theme's UI
├── _includes
| ├── analytics-providers # snippets for analytics (Google and custom)
| ├── comments-providers # snippets for comments
| ├── footer # custom snippets to add to site footer
| ├── head # custom snippets to add to site head
| ├── feature_row # feature row helper
| ├── gallery # image gallery helper
| ├── group-by-array # group by array helper for archives
| ├── nav_list # navigation list helper
| ├── toc # table of contents helper
| └── ...
├── _layouts
| ├── archive-taxonomy.html # tag/category archive for Jekyll Archives plugin
| ├── archive.html # archive base
| ├── categories.html # archive listing posts grouped by category
| ├── category.html # archive listing posts grouped by specific category
| ├── collection.html # archive listing documents in a specific collection
| ├── compress.html # compresses HTML in pure Liquid
| ├── default.html # base for all other layouts
| ├── home.html # home page
| ├── posts.html # archive listing posts grouped by year
| ├── search.html # search page
| ├── single.html # single document (post/page/etc)
| ├── tag.html # archive listing posts grouped by specific tag
| ├── tags.html # archive listing posts grouped by tags
| └── splash.html # splash page
├── _sass # SCSS partials
├── assets
| ├── css
| | └── main.scss # main stylesheet, loads SCSS partials from _sass
| ├── images # image assets for posts/pages/collections/etc.
| ├── js
| | ├── plugins # jQuery plugins
| | ├── vendor # vendor scripts
| | ├── _main.js # plugin settings and other scripts to load after jQuery
| | └── main.min.js # optimized and concatenated script file loaded before </body>
├── _config.yml # site configuration
├── Gemfile # gem file dependencies
├── index.html # paginated home page showing recent posts
└── package.json # NPM build scripts
```
### CSS - Stylesheets
At the moment, I'm quite CSS agnostic. One thing at a time.. However, if you wanted to add a little style to the page, the community might appreciate that.
* [mmistakes.github.io/minimal-mistakes/docs/stylesheets/](https://mmistakes.github.io/minimal-mistakes/docs/stylesheets/)
The themes assets/css/main.css file is built from several SCSS partials located in _sass/ and is structured as follows:
```
minimal-mistakes
├── _sass
| └── minimal-mistakes
| ├── vendor # vendor SCSS partials
| | ├── breakpoint # media query mixins
| | ├── magnific-popup # Magnific Popup lightbox
| | └── susy # Susy grid system
| ├── _animations.scss # animations
| ├── _archive.scss # archives (list, grid, feature views)
| ├── _base.scss # base HTML elements
| ├── _buttons.scss # buttons
| ├── _footer.scss # footer
| ├── _masthead.scss # masthead
| ├── _mixins.scss # mixins (em function, clearfix)
| ├── _navigation.scss # nav links (breadcrumb, priority+, toc, pagination, etc.)
| ├── _notices.scss # notices
| ├── _page.scss # pages
| ├── _print.scss # print styles
| ├── _reset.scss # reset
| ├── _sidebar.scss # sidebar
| ├── _syntax.scss # syntax highlighting
| ├── _tables.scss # tables
| ├── _utilities.scss # utility classes (text/image alignment)
| └── _variables.scss # theme defaults (fonts, colors, etc.)
├── assets
| ├── css
| | └── main.scss # main stylesheet, loads SCSS partials in _sass
```
>To make basic tweaks to themes style Sass variables can be overridden by adding to `<your_project>/assets/css/main.scss`. For instance, to change the link color used throughout the theme add:
```yaml
$link-color: red;
```
### [_variables.scss](https://github.com/infominer33/infominer33.github.io/blob/master/_sass/minimal-mistakes/_variables.scss)
There are a number of other variables, you may find by following the link. These are the variables I have changed, so far. Before messing with CSS please check the variables, to be sure you aren't doing too much work!
### Changing the Font-Size
* [Upgrade-friendly way of adjusting font sizes globally](https://github.com/mmistakes/minimal-mistakes/issues/1219)
>So what you can do is add any overriding/new CSS after the @import minimal-mistakes;, in your case:
```
{% raw %}
@import "minimal-mistakes";
html {
font-size: 16px; // change to whatever
@include breakpoint($medium) {
font-size: 18px; // change to whatever
}
@include breakpoint($large) {
font-size: 20px; // change to whatever
}
@include breakpoint($x-large) {
font-size: 22px; // change to whatever
}
}
{% endraw %}
```
Because this theme is entirely responsive, if you want to change the font-size, you should do it like so.
## Minimal Mistakes Initial Setup
I clone minimal-mistakes into the same directory as whatever website I'm working on, so they are right next to eachother.
```
git clone https://github.com/mmistakes/minimal-mistakes.git
```
![](https://imgur.com/m8HG3Dg.png)
Then I copy over these files and directories to the folder that is linked to the github repository where I want to be able to publish it from.
According to the quickstart guide, when forking these can be safely deleted:
```
.editorconfig
.gitattributes
.github
.git
/docs
/test
CHANGELOG.md
minimal-mistakes-jekyll.gemspec
README.md
screenshot-layouts.png
screenshot.png
```
I've moved /docs and /test to /example-site, and added .git, since we're cloning the project, but not forking it, we won't be keeping them linked and can also remove the .git file, and then copied everything that's left over to my project directory, that has its own history and .git files.
![](https://imgur.com/FAXK5SK.png)
I might delete some of the layouts and includes, later. test push I'm pretty sure all I need is a `gem-file` and `_config.yml`. The Gem Install means that GitHub will use a Ruby Gem Package that contains everything needed to run the website. You only need the files that you want to customize or configure somehow. For me, I usually need to change the head, and footer, as well as the social share, but I also change the home layout.. well you see it's easier to just have them all, if you want to customize, at all.
I'm just starting to get comfortable existing with CSS, I've even edited some _scss files, now and again, producing the desired effect. However, that's not my strength.
### Gemfile
The gem-file must be properly set up to build and test your changes locally. Not necessary for minor changes, but if you get very deep into working on a web-site, you'll not want to depend on live testing every change ;)
I'm following instructions from [Minimal-Mistakes Quick-Start Guide](https://mmistakes.github.io/minimal-mistakes/docs/quick-start-guide/), but also I've figured some of this out as I go.
Change the Gemfile so it looks like so:
```
gem "github-pages", group: :jekyll_plugins
# To upgrade, run `bundle update`.
gem "github-pages", group: :jekyll_plugins
# If you have any plugins, put them here!
group :jekyll_plugins do
gem "jekyll-paginate"
gem "jekyll-sitemap"
gem "jekyll-gist"
gem "jekyll-feed"
gem "jemoji"
gem "jekyll-include-cache"
gem "jekyll-redirect-from"
gem "jekyll-mentions"
gem "html-proofer"
end
```
Every plugin listed in your _config.yml should be also listed in your gem-file, if you want it to work locally, and if your features depend on some of these plugins, then its best to put them in the gemfile as well.
Then, once saved, run the bundle command in the root directory of your project.
`bundle install`
then
`bundle update`
then
`bundle exec jekyll serve`
if all went well you should be looking at a screen like this:
![](https://imgur.com/rnfQchG.png)
### _config.yml
We'll aim to keep this page updated with whatever is the most recent configuration, with notes of explanation when necessary.
```yaml
minimal_mistakes_skin : "air" # "air", "aqua", "contrast", "dark", "dirt", "neon", "mint", "plum", "sunrise"
# Site Settings
locale : "en-US"
title : "Sovereign ID Curated"
title_separator : "| "
name : "Infominer"
description : "Creating a Vendor Agnostic, User-Controlled, Identity Layer for the Internet."
url : "https://decentralized-id.com"
baseurl : ""
repository : "didecentral/didecentral.github.io"
github : [metadata]
teaser : /images/didecentral-tw.png
logo : "https://decentralized-id.com/images/DID.png"
masthead_title : "Identity Decentralized"
# breadcrumbs : false # true, false (default)
words_per_minute : 200
comments:
provider : # "staticman_v2"
staticman:
allowedFields : ["name", "email", "url", "message"]
repository : didecentral/didecentral.github.io
branch : "master"
commitMessage : "New comment by {fields.name}"
filename : comment-{@timestamp}
format : "yml"
moderation : true
path : "_data/comments/{options.slug}"
requiredFields : ["name", "email", "message"]
```
I don't have comments on this site, I just tested them out on the 'community site'. I *will* set this up for Algolia Search, soon, and provide the deets on that.
```yaml
# Social Sharing
twitter:
username : "infominer33"
site: "didecentral"
# description : "Resources for Creating a Vendor Agnostic, User-Controlled, Identity Layer for the Internet."
# image : "https://decentralized-id.com/images/IDecentralized.png"
facebook:
username :
app_id :
publisher :
og_image : https://decentralized-id.com/images/didecentral-tw.png
# For specifying social profiles
# - https://developers.google.com/structured-data/customize/social-profiles
social:
type : # Person or Organization (defaults to Person)
name : # If the user or organization name differs from the site's name
links: # An array of links to social media profiles
# Analytics
analytics:
provider : google # false (default), "google", "google-universal", "custom"
google:
tracking_id : UA-132558656-3
anonymize_ip : true
# Site Author
author:
name : "DIDecentral"
avatar : https://didecentral.com/assets/images/did-square.png
bio : "Collaborative Curation, Community Research Initiative"
location : "Curating the Web"
links:
- label: "Email"
icon: "fas fa-fw fa-envelope-square"
url: mailto:identitydecentralized@gmail.com
- label: "Website"
icon: "fas fa-fw fa-link"
url: "https://decentralized-id.com"
- label: "GitHub"
icon: "fab fa-fw fa-github"
url: "https://github.com/didecentral"
- label: "Twitter"
icon: "fab fa-fw fa-twitter-square"
url: "https://github.com/didecentral/didecentral.github.io"
# Site Footer
footer:
links:
- label: "Email"
icon: "fas fa-fw fa-envelope-square"
url: mailto:identitydecentralized@gmail.com
- label: "Website"
icon: "fas fa-fw fa-link"
url: "https://decentralized-id.com"
- label: "Twitter"
icon: "fab fa-fw fa-twitter-square"
url: "https://twitter.com/didecentral"
- label: "GitHub"
icon: "fab fa-fw fa-github"
url: "https://github.com/didecentral/didecentral.github.io"
```
I just went to [fontawesome.com](https://fontawesome.com) and it's pretty simple to try and match above formula without thinking too deeply on the matter.
### _config.yml - Permalink Defaults
The permalink default defines permalinks, in the case that they are not defined within a post.
```yaml
# Outputting
permalink: /:categories/:slug/ # https://jekyllrb.com/docs/permalinks/
paginate: 5 # amount of posts to show
paginate_path: /page:num/
timezone: # https://en.wikipedia.org/wiki/List_of_tz_database_time_zones
category_archive:
type: liquid
path: /categories/
tag_archive:
type: liquid
path: /tags/
```
You also need a page for both categories and tags in _pages, if you want a page to show at that URL.
### _config.yml - Frontmatter Defaults
You can over-ride these defaults on a page-by-page basis.
```yaml
collections:
HowToContribute:
output: true
permalink: /how-to-contribute/:path/
# Defaults
defaults:
# _pages
- scope:
path: "_pages"
type: pages
values:
layout: single
author_profile: false
read_time: false
comments: # true
share: true
related: true
sidebar:
title: DIDecentral
nav: didnav
toc: true
toc_sticky : true
# _posts
- scope:
path: "_posts"
type: posts
values:
layout: single
author_profile: false
read_time: true
comments: # true
share: true
classes: wide
related: true
sidebar:
title: DIDecentral
nav: didnav
toc: true
toc_label : "Contents"
toc_icon : "link"
toc_sticky : true
# _HowToContribute
- scope:
path: "_HowToContribute"
type: HowToContribute
values:
layout: single
share: true
related: true
sidebar:
nav: "didnav"
classes: wide
```
## Navigation
[_data/navigation.yml](https://github.com/didecentral/community-website/blob/master/_data/navigation.yml)
Then if you look up there in the front-matter defaults, you'll see where the navigation is called as a part of the sidebar class.
```yaml
# main links
main:
- title: "Our Aim"
url: "/aim/"
- title: "Posts by Tag"
url: "/tags/"
- title: "Sitemap"
url: "/sitemap/"
- title: "identitywoman/identity-commons"
url: "https://github.com/identitywoman/identity-commons"
- title: "RebootingWebOfTrust - Archive"
url: "https://decentralized-id.com/rwot-dir/"
- title: "Decentralized Web - History"
url: "https://sourcecrypto.pub/decentralized-web/"
# DID Nav
didnav:
- title: "History"
url: "/history/"
children:
- title: "• Resources & Pre-History"
url: "/history/"
- title: "• 2000-2009"
url: "/history/2000-2009/"
- title: "• 2010-2014"
url: /history/2010-2014/
- title: "• 2015-2019"
url: /history/2015-2019/
- title: Feature
children:
- title: "• Web Standards"
url: "/specs-standards/"
- title: " - JSON-LD"
url: "/specs-standards/JSON-LD/"
- title: "• GitHub Repositories"
url: "/identity-github/"
- title: " - Identity Commons on Github"
url: "https://github.com/identitywoman/identity-commons"
- title: "• Literature"
url: "/literature/"
- title: " - RWoT - Papers Index"
url: "/workshops/rebooting-web-of-trust/"
- title: " - Microledgers and Edgechains"
url: "/hgf-2018/Microledgers-Edgechains-Hardman-HGF/"
- title: "• #indieweb-dev on IIW RWoT and DID's"
url: " /chatlog/indieweb-dev-on-did/"
```
## Social Share
This is the code that makes social share and donation button on each page. The Bitcoin, Tippin.me, and DOGE addresses are specific for DIDecentral, and currently under @infominer33's control.
[_includes/social-share.html](https://github.com/didecentral/community-website/blob/master/_includes/social-share.html)
```html
{% raw %}
<section class="page__share">
<h2><a href="https://github.com/didecentral/decentralized-id.com/blob/master/{{ page.path }}" class="edit">Edit this page <i class="fa fa-pencil"></i></a></h2>
<h3>Social Share</h3>
<a href="https://twitter.com/intent/tweet?{% if site.twitter.username %}via={{ site.twitter.username | url_encode }}&{% endif %}text={{ page.title | url_encode }}%20{{ page.url | absolute_url | url_encode }}" class="btn btn--twitter" onclick="window.open(this.href, 'window', 'left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;" title="Share on Twitter"><i class="fab fa-fw fa-twitter" aria-hidden="true"></i><span> Twitter</span></a>
<a href="https://www.facebook.com/sharer/sharer.php?u={{ page.url | absolute_url | url_encode }}" class="btn btn--facebook" onclick="window.open(this.href, 'window', 'left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;" title="Share on Facebook"><i class="fab fa-fw fa-facebook" aria-hidden="true"></i><span> Facebook</span></a>
<a href="https://www.linkedin.com/shareArticle?mini=true&url={{ page.url | absolute_url | url_encode }}" class="btn btn--linkedin" onclick="window.open(this.href, 'window', 'left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;" title="Share on LinkedIn"><i class="fab fa-fw fa-linkedin" aria-hidden="true"></i><span> LinkedIn</span></a>
<a href="https://www.reddit.com/submit?url={{ page.url | absolute_url | url_encode }}&title={{ page.title | url_encode }}" class="btn btn--reddit" title="Share on Reddit"><i class="fab fa-fw fa-reddit" aria-hidden="true"></i><span> Reddit</span></a>
<h3>Tips Welcome</h3>
<table class="table table-bordered table-hover table-condensed">
<thead>
<tr>
<th title="Field #1">Bitcoin</th>
<th title="Field #2">DOGE</th>
</tr>
</thead>
<tbody>
<tr>
<td>1D9382Y1hwF9mx8tRu8ZUVxcm2aq6yZDYR</td>
<td>D9y38ChAZP9aZG2mAJ94VAynAG4YGSvTpp</td>
</tr>
<tr>
<td><img src="https://imgur.com/j1hzcTo.png" width="150"></td>
<td><img src="https://i.imgur.com/V3EnMAes.png" width="150"></td>
</tr>
</tbody>
</table>
<!-- Beginning of tippin.me Button -->
<div id="tippin-button" data-dest="didecentral"></div>
<script src="https://tippin.me/buttons/tip.js" type="text/javascript"></script>
<!-- End of tippin.me Button -->
</section>
{% endraw %}
```
**Reddit Button**
[_sass/minimal-mistakes/_buttons.scss](https://github.com/didecentral/community-website/blob/master/_sass/minimal-mistakes/_buttons.scss)
If you copy that part to get the reddit button included with the others, you might find that you are missing the actual button.
just head over to buttons.css :rofl: (idk why that's so funny to me)
```
/* button colors */
$buttoncolors:
(primary, $primary-color),
(inverse, #fff),
(light-outline, transparent),
(success, $success-color),
(warning, $warning-color),
(danger, $danger-color),
(info, $info-color),
(facebook, $facebook-color),
(twitter, $twitter-color),
(linkedin, $linkedin-color),
(reddit, $reddit-color);
```
Because the Reddit Color is already defined in [_variables.scss](https://github.com/didecentral/community-website/blob/master/_sass/minimal-mistakes/_variables.scss), all you need to do is reference it here.
## Author vs Authors
There are two variables that must always be considered.
Author, is for the initial or primary author.
Authors is for all the people who have contributed to that document.
So if you make a new post be sure to set both in your front-matter
```yaml
---
title: "Your Awesome Post"
author: "AwesomeYou"
authors: ["AwesomeYou"]
---
```
Then if I came and touched up your post, I would add myself to the authors:
```yaml
---
title: "Your Awesome Post"
author: "AwesomeYou"
authors: ["AwesomeYou","infominer33"]
---
```
Every post and page should have these, but I'm used to being the only author, so that will require some work, or maybe will leave old articles alone... not sure
### Authors Code
This was really crudely hacked together from the other lists in this section.
[_includes/authors-list.html](https://github.com/infominer33/didecentral.github.io/blob/master/_includes/authors-list.html)
```html
{% raw %}
<p class="page__taxonomy">
<strong><i class="fas fa-fw fa-users" aria-hidden="true"></i> Authors:</strong>
{% assign authorCount = page.authors | size %}
{% if authorCount == 0 %}
No author
{% elsif authorCount == 1 %}
{{ page.authors | first }}
{% else %}
{% for author in page.authors %}
{% if forloop.first %}
<a href="{{ author.url }}" rel="author">{{ author }}</a>
{% elsif forloop.last %}
and <a href="{{ author.url }}" rel="author">{{ author }}</a>
{% else %}
, <a href="{{ author.url }}" rel="author">{{ author }}</a>
{% endif %}
{% endfor %}
{% endif %}
</p>
{% endraw %}
```
[/_includes/page__taxonomy.html](https://github.com/infominer33/infominer33.github.io/blob/master/_includes/page__taxonomy.html)
Also, I added this line to the page taxonomy:
```html
{% raw %}
{% if page.authors %}
{% include authors-list.html %}
{% endif %}
{% endraw %}
```
## To be continued....
There are a number of tweaks that I make to minimal-mistakes sites. All will be explained :D

View File

@ -272,6 +272,11 @@ compress_html:
envs: development
collections:
HowToContribute:
output: true
permalink: /how-to-contribute/:path/
# Defaults
defaults:
@ -310,3 +315,14 @@ defaults:
toc_label : "Contents"
toc_icon : "link"
toc_sticky : true
# _HowToContribute
- scope:
path: "_HowToContribute"
type: HowToContribute
values:
layout: single
share: true
related: true
sidebar:
nav: "didnav"
classes: wide

View File

@ -1,6 +1,7 @@
---
layout: home
author_profile: false
excerpt: "Categorizing facts and references is a valuable process for navigating complex info-systems."
sidebar:
nav: didnav
header:
@ -18,8 +19,6 @@ classes: wide
excerpt: "DIDecentral is a collaborative curation initiative aiming to create quality, Public Domain, educational content about Sovereign-Identity: Principles, Specs, Code and Initiatives."
url: "https://didecentral.com/welcome/"
btn_class: "btn--primary"
excerpt: "This site has now been rebuilt from the ground up, and a considerable amount of information has been added to pages which were previously lacking. This trend shall continue."
feature_row:
- image_path: https://infominer.xyz/assets/img/infohub-contributors-thumb.png
alt: "Contributors Intro Teaser"