Can a Jekyll site be a sub site within an existing website? - jekyll

I'm managing a site that is generated by Jekyll and hosted on github. The product manager does not like the home page and wants to redesign it and has asked if it could be created separately from the rest of the site (which is Jekyll).
Personally I'd love to pull the whole site out of Jekyll as what we are doing and what Jekyll is made for are two different things. But budget and time are factors and doing a major overhaul is not in the foreseeable future.
Has anyone tried this and if so what are the pain points/best practices?
Thanks

You are in luck. That is not a complex task AT ALL. Just create a folder called _layouts in the root and create a 'customhome.html' file in it.
Then create an 'index.md' file in the root and set this:
---
title: Home
layout: customhome
---
Write your whole (custom) webpage in the 'customhome.html' file, like this:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
The content of the document......
</body>
</html>
As a bonus you can test your customhome.html file directly in your browser without intalling Jekyll (as long as you keep everyting inline).
PS. You can even forget the above and put a simple 'index.html' file in the root... that works too! Make sure you delete the existing 'index.md' file if available.

Related

How to convert my HTML static site into an editable Github template?

I have my code with the following structure, where I only have a style.css, favicon.png, logo.png, and an external Javascript file in their respective folders.
index.html
assets
CSS
img
I'm looking to convert it to a template on GitHub, where a user can use it and change only the <title> of the head, the main <h1> and <h2> of the body, the logo.png (next to the <h1>) and the favicon.
I have no idea how to do it, as an example, I put this Github project, where using the template just edit .upptimerc.yml to configure your site, and Github Actions makes the deploy in Github Pages every time you modify it. While the source code is in another repository.
If someone could give me something to guide me or give me an example even with a "Hello world" HTML I would appreciate it. I couldn't find anything on the internet beyond the basics.

jekyll-seo-tag doesn't work within Github Pages

So I faced a problem while trying to add some SEO optimization for my simple static website served via Github Pages.
As the documentation says: https://help.github.com/articles/search-engine-optimization-for-github-pages/
I created the _config.yml file which includes next lines of code:
plugins:
- jekyll-seo-tag
and pushed this file along with my website files, so the structure looks like this
The problem is that after linking to my website I see the
output
And the head tag includes following content
I need help in understanding why the SEO plugin doesn't work. Thanks for all your replies and have a nice day!
If you want any file to be processed you must add a front matter to it.
Your index.html must be like :
---
# even an empty front matter is ok
---
<!DOCTYPE html>
...
David Jacquel's answer helped so much and I managed to resolve a problem. More about that:
I had to inject a valid front matter to resolve a problem e.g.
---
layout: main
title: Cheaterino
---
After that I still didn't manage to deal with the problem since my index.html was minified and so do the front matter.
After I disabled minification of the file everything worked!
head tag content after plugin worked
Thanks so much to David Jacquel!

Error application.html.erb

I just started rails today and it's very interesting. However, I've come across a problem. Whatever goes into application.html.erb should be seen in other webpages; such as the links, navbar. The problem is what I've put into application.htlm.erb is not showing in the other pages. If I put 2 links into application it won't show on the other webpages, the only way I could see the links is because I manually inserted the code into the individual webpage. I don't know if it's something wrong with application.html.erb itself, but I have 2 files in the layouts folder: application.html, and application.html.erb.
I'm also watching a video that goes along with my project, which means that I pretty much copied whatever the teacher was saying.
I really want to move on, but this problem is putting me back. If anyone can help please respond!
There should only be application.html.erb in the layouts folder. The ERB extension is a rails filename extension that allows you to Embed Ruby code and PARTIALS.
application.html.erb is your master layout file, it renders partials and assembles the HTML structure in a modular way. It gets more apparent when your application grows!
Basically you are not supposed to edit application.html.erb directly unless you want to make a change to the existing HTML structure, which is basically
<html>
<head>
</head>
<body>
<%= yield %>
</body>
</html>
If I were you, I would read the Rails Docs about layouts. It explains how pages get rendered and shows you where to place your logic (in this case your links).

faulty path to css file in octopress generation

I'm just getting started with Octopress; pretty green on web development, and I'm having the following issue:
When I run rake generate to make my octopress page, it mostly generates everything fine but it's not giving a good reference to the .css file. Here is the link it generates:
<link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css">
This leaves my index.html page with bare html formatting. But if I change the link to read:
<link href="stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css">
it works. All I did was take out the forward slash.
My question is this: what do I need to change for rake generate to put the proper reference in the html file?
A slash in front will point to the root directory of the project.
Whereas without slash, it will point to the current directory of the HTML file
So if in your case, project structure is:
Project/something/index.html
Any link with "/stylesheets/" will point to a folder in the Project directory. ie it will look for "Project/stylesheets"
Whereas a link with "stylesheets/" will point to a folder in the something directory, which is the current directory of the project.
You need to edit your Rakefile.
I wrote an article about Rake commands in Octopress here:
http://www.tomordonez.com/blog/2013/03/12/rake-commands-in-octopress-on-github/
Inside your main Octopress directory there should be a file called "Rakefile"
Open this file and look for this line:
desc "Generate jekyll site
task :generate do
In here there is a line that says:
system "compass compile -css-dir #{source_dir}/stylesheets"
The source_dir is assigned toward the top of the Rakefile where it says ## Misc Configs ##.
It should say:
source_dir = "source"
I gave you almost all the solution. Put these together and try it out to see if you can make it work :)
Since you're new, I'll give you some ideas as to how this can work
--
Assets
Firstly, when you make use of the asset piepline in Rails, it does a lot of the work for you. Specifically, the stylesheet feature is very well documented:
<%= stylesheet_link_tag "screen" %>
If your page has hard-coded references to your stylesheets, it's going to cause all sorts of compatibility issues down the line (with production etc).
I know this is not an answer to your question directly, but you need to ensure your HTML files are making use of the Rails helper methods - these create dynamic paths, which your app will automatically follow
--
Generate
As for your generator, I've got no experience with octopress
If the gem is not written by you, I would not worry about the generator too much. Having written my own gems & other software, it's very difficult to create a system which works for every single system
If you have the ability to change the path yourself (after generation), I'd do that, and raise an issue with the author on Github

Making a relative path HTML Shortcut

I have pretty much no experience with HTML, but I am using Doxygen to create code documentation. I have all the Doxygen generated HTML files in a sub-directory within my C project.
This documentation is for a library I have built and I would like the user to be able to view the HTML documentation without having to search through the Doxygen sub-directory for index.html. I tried to make a Windows shortcut to index.html, but that only works on my working computer. Whenever I try on another computer, Windows requests the username and password of my working computer. Then I tried copying the index.html file to the top-level of my library; however, in doing so, it seems like many links were broken and the file did not open properly.
Please note that I am not looking to host this documentation on a server, the documentation will be distributed with the source code, since this library is (currently) for internal, educational university use and I am not sure if I am allowed to make it open-source.
In other words, this is the type of file structure I'm looking for:
Project Folder
-Doxygen Documentation Folder
-index.html
-Source Code Folder
-Shortcut to index.html
There's a thread here that should help.
Essentially the suggestion is to have a top-level index.html that links or redirects the reader to the one in the doxygen folder. I note you're new to HTML but it's quite simple.
There's an example of a minimal index.html you could use towards the bottom of that thread which I'll replicate here in case that thread ever disappears. It was contributed by Clemens Feige.
<head>
<meta http-equiv="refresh" content="1; URL=doxygen/index.html">
</head>
<body>
<p>You will be redirected automatically, otherwise please click here.</p>
</body>
You'll need to tweak the paths according to your set-up.
I ended up using this software But I think I like Cheeseminer's solution better