Sync GitHub Pages Configuration Between Projects and Organization - github

I have a GitHub organization where I publish a webpage from the repository orgname.github.io. Of course, I have several project repositories where I'd like to host documentation about those projects. This is all possible through GitHub Pages.
However, I'm not sure how to synchronize the configuration of the organization page with the project pages. I want the website to look the same whether I'm at
http://orgname.github.io or if I'm at http://orgname.github.io/project.
What can I do to keep the Jekyll-based configuration in sync?

This is the solution we've come up with:
Create a repository to contain the Jekyll configuration, jekyll-website.
Fork/copy the repository to the repository <orgname>.github.io.
In every project, create a git subtree as the docs directory.
Whenever you need to make change to the look/design of the webpage, do it in jekyll-website, then pull those changes into <orgname>.github.io and all the project subtrees. This is a little bit of work whenever you need to make changes to the website, but it gets the job done.

Since the Github pages sites are hosted in the gh-pages branch of their respective repos, they are independent from each other and the project pages.
I'm assuming your content will be unique for each repo, so you're asking about syncing the theme/structure etc, which as far as I know that cannot be synced. I would recommend choosing a Jekyll theme for all of your sites and stick to editing content.

Related

I forked the repo for a Github Pages that I liked, but my fork will not load

I am a total programming noob and assume I'm missing something basic.
I forked this repo: https://github.com/colinmorris/tour-of-heroes
Here is the author's page for that repo: https://colinmorris.github.io/tour-of-heroes/
My fork: https://github.com/SmallFryHero/tour-of-heroes
My page based on that fork: https://smallfryhero.github.io/tour-of-heroes/
My page does not load.
I deployed the Github Pages using the gh-pages branch and from the /root folder.
I imported the code into a different web editor, CodeSandBox, and I can get it to run there along with my changes.
What do I need to fix to get it to run on my Github Pages? I added a readme to get the page to build. It seems to be deployed, but doesn't get past the "loading..." step.
Thanks for any help! Sorry for the total noob question.
The issue is that GitHub Pages, by default, use a static site generator called Jekyll under the hood. It basically converts a set of Markdown files into HTML (and provides templating, themes, plugins, and more).
In the case of your repo, which consists exclusively of static assets, Jekyll doesn't do much, but it does exclude the node_modules directory (see logs), which leads to the scripts in there being unavailable to the deployed page.
To fix this, you can indicate that you wish to skip any Jekyll processing and just upload the files as they are; to do so, add an empty file .nojekyll to the root directory in the gh-pages branch, as described in the documentation.
The repo from which you forked was last deployed multiple years ago, and I suspect the Jekyll default configuration back then didn't exclude node_modules yet.

Deploy project created with foundation-cli?

I'm trying to figure out if there's any way to deploy this project https://github.com/nataliecardot/zeus-hosting-setup, preferably to GitHub Pages. No dist folder is created when I run foundation build, which apparently is an old issue. Is it possible for my to deploy this in any way? Or if not, any other way to get it online?
You need to generate the static pages that will be published online, and do so in the appropriate branch.
Since master includes what is necessary to generate the pages, said pages need to be stored in a gh_pages branch.
See "Types of GitHub Pages sites" and its next section "Publishing sources for GitHub Pages sites".
The point remains: that repository as it is, with only its master branch, would not make any page visible on its own.

Github Pages - Maintaining Multiple versions

I need to host the documentation of multiple versions of my project (say 1.0, 2.0 and 3.0) and all are active (documentation)branches and we shall keep on adding improvements to all of these.
Is it possible to use GitHub pages for this purpose?
Appreciate any help on this.
This is feasible using Github Actions along with a static site generator (SSG) of your choice such as VuePress, Gatsby, Jekyll etc.
In its simplest form, create a GH action to generate the static site folder of the branch/release, then push the folder to corresponding folder in the branch pointed to by GH pages, say gh-pages. One of the branches/releases should be pushed to root. GitHub Pages Deploy Action can be helpful. Lastly add a dropdown list of versions to your static website pointing to the matching folder. The list of items can be statically maintained or dynamically populated using GitHub API. The selected item depends on the current URL path.
Example:
To provide multi-version docs for software product NotifyBC,
input - docs folder of the product created by VuePress
output - gh-pages branch
GitHub action, with main branch pushed to root of gh-pages branch and releases pushed to version folder
dynamically populated dropdown list implemented in Vue component
rendered site powered by GH pages
You can have a look at gh-pages-multi.
It is a small nodejs tool I wrote to push different versions of docs to subdirectories in a gh-pages branch. It also generates a index.html file listing those subdirectories.
It is fairly easy to integrate in a CI workflow if you want to automate building and pushing the docs.
Also note the "--no-history" option that will prevent bloating the git repo if your docs contain some built files or binary assets.
These other answers over-complicate things. As #jhpratt suggests in the comment, you can just copy the code corresponding to a version of your site you want to deploy to a dir (labelled e.g. v1.0) within the dir that you deploy to gh-pages. You then access the version with https://your-name.github.io/your-repo/v1.0/.
Of course, depending on the type of site you're building you may have to worry about the content of <base href="..."> tag, etc., for each version, but you need to worry about this tag in any case since github pages do not deploy to the url root.

How to view github pages at specific commit?

I'm trying to view the documentation of a repository at a specific point in time. Is the github pages url hackable enough that I can specific a specific commit hash?
I can't seem to find any information on the web about this.
Once you push your gh-pages branch, old files are replaced by new ones on the static files server. Only one Jekyll build snapshot allowed.
No, you can't. GitHub pages only serves the current content of the gh-pages branch.
You can, however, clone the repo and check out the commit you are looking for locally. You might have to run Jekyll locallly, though, since ts possible to not have the actual HTML files in the gh-pages branch, but a corrrectly set up jekyll page which will get converted by GitHub on-the-fly.
It's not possible via the url but you can always clone the repo and generate the doc yourself at the commit you want.
I am also unable to find an ideal solution. What I do at the moment is to have subdirectories under the branch gh-pages named for example, v1,v2 etc. Then they are accessible as
org.github.io/repo/v1/
org.github.io/repo/v2/
...
This works, but there is almost 100% duplication of content with every version upgrade.

Creating my own Jekyll template for GitHub pages to make 100s of identical pages for similar projects

My GitHub org is github.com/Obrary (apologies for not putting the full url, but I don't have enough reputation points for that yet). There, I have 100s of open designs for products. Each is a project. I want each to have a GitHub page for the project.
I created a simple GitHub page for one of the projects. See http://obrary.github.io/Alex-Chair/. The page is created so that I can add it to any projects gh-pages branch and it will work for the new project. To see that in action, http://obrary.github.io/Alexey-Surfboard-Rack/.
Now I want to use this page across all of my open design projects. As I said, there are 100s. So I don't want to just copy and paste the files. Is there a way to make a project that is the 'master template' for all of the projects that I want to associate it to? I'd like to be able to edit the master and have the changes automatically reflected on all the GitHub pages.
Thanks
What's a challenge !
You already have 100's projects site structured on the same templates in 100's separate repositories and you want to share a common design.
Sharing common style-sheets
Just create a repository to host common stylesheets (eg: https://github.com/Obrary/styles. And from every gh-pages, just grab this stylessheets, you then can replicate styles over your entire networks.
Sharing common templates
If you want to share common templates, the only solution is to group all the projects sites under the same repository.
But here you loose the ability to offer the zip download, specific to every project, and the ability (I think) to allow contributor to work in a specific repository.
The ultimate solution
Having a central repository for templates and styles with a rake task that pushes updates to all the projects repositories. This will make Github pages regenerates automatically on every project. Cool!
Let's elaborate a little on this solution.
You have a central repository for all common files needed in your
projects sites. Those files are mainly _includes, _layouts and
_sass folders.
All your projects sites are based on this repository. Their pages,
posts and static files can evolve independently from the central
repository.
Any time you're updating the central repository, a webhook calls
a script on a server. This script can be a rake task or a bash script
or anything you're good at.
The script simply copies files or pulls from central repository and
then push to all projects sites.
Github then will publish automatically.