Clean URLs from pages in a custom Jekyll folder - yaml

I'm building a Jekyll site made of static pages (e.g. nothing in the _posts directory), and rather than keeping each page in the root directory, I'd like to keep it in a custom pages directory (for organization's sake).
However, I don't want this structure reflected in my URLs, so in my _config.yml I have:
permalink: /:title
With this configuration, my desired URL would be site.com/pagename, but I don't get a rendered page unless I hit site.com/pages/pagename.html.
Could anyone help me configure my build to achieve the former? Thanks!

Have you tried adding YAML Front Matter to these static pages? For example:
---
title: "pagetitle"
---
This way, Jekyll should recognize it as a Page (instead of a StaticPage) and would use your permalink configuration.

These are static pages so the entry in _config.yml is going to be ignored.
From the sounds of it you will need to create a URL rewrite rule. How to do this will depend on the web server that is servering up the pages.

Related

Use multiple themes on one website jeykll

I have recently found out about jekyll, and want to make a project landing page with it. I would like to have a home page using one theme (e.g. ubuild) and have another page for the docs (accessed via a navigation bar at the top) that uses a different theme (e.g. just-the-docs). How can I go about doing this?
EDIT: I want to use Github Pages for this.
Since you plan to use one of the themes on just a single page, I think the best solution would be to use two base layouts instead of two themes.
It will take some minor work initially, but will greatly ease future maintenance.
First set up the site to render just-the-docs theme for all pages including the landing page. Then modify _layouts/home.html to be a parent layout (like the default layout)
to render the markup from the ubuild.. theme.
I solved this with help from #JoostS's answer but with a few modifications:
Make an organization on GitHub pages with a repo called <org-name>.github.io. This repo should contain the theme for the home page (ubuild in my case) and all the content for it.
Make another repo with a jeykll site, called docs. This site should have the theme you want for the other page (just-the-docs in my case) and all the content along with it.
In the docs repo, add baseurl: "/docs" to your _config.yml
The <org-name>.github.io repo, should now be hosted at <org-name>.github.io/:
The docs repo should now be hosted at the <org-name>.github.io/docs url:
To link to the docs page, you should just be able to use /docs now.
The solution is to create two separate websites. The first site contains just the homepage and should be deployed to the root of your web folder. The second site contains all docs and should be deployed to a subdirectory, like '/docs/'. You might want to use baseurl for this: https://byparker.com/blog/2014/clearing-up-confusion-around-baseurl/
I do not think you can use this solution on Github pages. You can TRY to add the same CNAME to both repositories, as I am not 100% sure. Any other static hosting environment should work.
You can link from the docs to the homepage by linking to '/'. You can link from the homepage to the docs by linking to '/docs/pagename/' (assuming you use permalink: pretty).
The simplest way to maintain two layouts on the same site using Jekyll with GitHub Pages is for you to create a new repository for the new layout, so the main site is in a GitHub organization and the pages that need to use a different layout must be in your repositories.
However, if you are not using GitHub, just jekyll, just configure each folder as a new Jekyll project, and direct them to write to the respective subfolders in the _site folder. For everything to work out you need to start Jekyll Server from the main folder, and then build each subfolder separately, so it will update without removing the main one

link html files under public folder when using vuepress

I am using vuepress to build a personal notes.
I put some html, javascript demo files inside .vuepress/public/demo/javascript/01/.
When I writing my note using in .md file, I create a link by [demo](/demo/javascript/01/)
this seems not work well cause such relative path, vuepress will treat it as a .md file and try to look for the path and result as 404
(Although do a refresh on the 404 page, it works well..)
What is the better way to link files under public which I can use in .md and make vuepress treat it as normal external link without hardcoding the domain in the link.
here is the code
https://gitlab.com/changsijay/vuepress01
and here is the deployment result:
https://changsijay.gitlab.io/vuepress01/
I would move your code from index.html to a .vue-file and add the vue file to your index.html (except, I would name it README.md, since that is what VuePress looks for in every sub-directory) with the basic vue syntax <IndexCode />.
Then just link with [demo](/demo/javascript/01/) and it should automatically load the README.md
If for some reason you want to use the index.html, you can always link it with [demo](/demo/javascript/01/index.html)

Renaming index.php and accessing other pages in Joomla

I have to do some modifications online on my website, and I don't want the users to see those pages. So I renamed index.php to index_orig.php and I put another index.html that show a message (WebSite under construction) for my users.
My problem is that I want to access online to the rest of my pages to check the modifications until satisfaction, but when I try to access the rest of the pages by their whole URL (404 error is shown).
Example : www.mywebsite.com/floder1/pagetarget.php.
Put back index.php.
In your global configuration, set the site to offline and put up a message and a logo etc (assuming you are on 2.5 or 3). You'll be able to login and see the site.
Please keep in mind that in a database driven cms there are not pages in the way that you would think of them in a static html site. Everything gets pushed into the index.php of your template file.
Update the directory default document on whatever webserver you are using. Also update any rewrite rules that may be pointing to index.php

How does Jekyll know what layout it should use for each specific URL?

When I request a specific URL on a website ran on Jekyll, eg. www.mysite.com/blog.html how does Jekyll know what layout it should render to display blog.html?
I used to work with Django, where there was urls.py file that kept pairs of URL and templates to render for each URL. I'm new to RoR and Jekyll and couldn't find anything similar to urls.py in Jekyll.
You can choose which layout to use for a specific generated page using the YAML frontmatter. From the Jekyll documentation:
_layouts
These are the templates which posts are inserted into. Layouts are defined on a post-by-post basis in the YAML front matter, which is described in the next section. The liquid tag {{ content }} is used to inject data onto the page.
[...]
index.html and Other HTML/Markdown/Textile Files
Granted that this file has a YAML Front Matter section, it will be transformed by Jekyll. The same will happen for any .html, .markdown, or .textile file in your site’s root directory or directories not listed above.
The YAML front-matter is a section at the top of a file that specifies metadata for that file. It looks something like:
---
layout: post
title: Blogging Like a Hacker
---

How can I create a page in jekyll?

I know how to create a post in jekyll, but how can I create a page (like About) without it being considered as a post?
Also, I use Github pages, so I can't use extensions.
If you create a file called about.html, about.markdown or about.textile in the root of your project it will be treated as a static page.
You can still give it some YAML front matter and jekyll if you wish to share a template etc.
It's all explained on the jekyll wiki at https://github.com/mojombo/jekyll/wiki/usage
Here's an excerpt from my about.markdown file
---
layout: default
title: About | Purebreeze
---
I'm a software developer based in London...
That's saying use the default template, set title to "About | Purebreeze" (which is rendered via a liquid tag in my default template) and then the contents of my about page.
This is then rendered at http://purebreeze.com/about by github (by default this would have been (http://levent.github.com/about)
This looks like a bug. But there's a workaround: create a directory called eg. "about" and put your content into about/index.[fill in the blank]. (oh, and by the way, report it.)

Resources