I have a large quantity of HTML files can i use these and turn them into blog posts??
I am trying to work out a way to turn these into blog posts, and i am not sure if Jekyll is the right option.
Given your original post post-title.html is :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<h2>Intro</h2>
<p>Text here</p>
</body>
</html>
You just keep the content part :
<h2>Intro</h2>
<p>Text here</p>
Add a front matter to it :
---
layout: post
---
<h2>Intro</h2>
<p>Text here</p>
Rename it to 2014-12-21-post-title.html. And you're good to go ! Jekyll post can be markdown, but html too !
Note : the title (page.title) is here derived from the file name. If you want to use an elaborated title, you can add it in the front matter :
---
...
title: I'm a blogger, sometimes !!
---
Useful informations can be found in Jekyll documentation.
Related
I'm using Jekyll to generate some static html pages. However I'd like to also generate the same layouts but with different variables. I for the life of me can't seem to articulate what I mean, so here's a basic example:
_config.yml
title: Foos and Bars
Generated index.html
<!DOCTYPE html>
<html>
<body>
<h1>Foos and Bars</h1>
</body>
</html>
And then I'd like to use the same base template (index.html) to generate more pages:
Generated index_2.html
<!DOCTYPE html>
<html>
<body>
<h1>Bars and Foos</h1>
</body>
</html>
Generated index_3.html
<!DOCTYPE html>
<html>
<body>
<h1>And Foos Bars</h1>
</body>
</html>
Do I need to create another _config.yml file and run it each time? It just seems too inefficient. Can all of these variables be stored in the same _config.yml? Is there a program/method that's much more efficient?
Let me know what and if I can clarify. Thanks for taking a look and any input you might offer.
If I understand your problem, your solution would be to use a YAML front matter in each of your pages where the dedicated "_config.yml variables" are declared.
Given you have a layout file page.html in the _layouts directory of your jekyll project like this:
<!DOCTYPE html>
<html>
<body>
<h1>{{ page.title }}</h1>
<p>{{ page.content }}</p>
</body>
</html>
You can then create a page -- let's call it index.html -- using this layout as follows:
---
layout: page
title: Foos and Bars
---
This is the text of my page
This will generate the following index.html in your _site directory:
<!DOCTYPE html>
<html>
<body>
<h1>Foos and Bars</h1>
<p>This is the text of my page</p>
</body>
</html>
This other page -- let's call it index_2.html:
---
layout: page
title: Bars and Foos
---
This is the other text of my other page
will generate index_2.html in your _site directory:
<!DOCTYPE html>
<html>
<body>
<h1>Bars and Foos</h1>
<p>This is the other text of my other page</p>
</body>
</html>
See official documentation.
These two simplified HTML5 codes gets the same result:
code #1:
<html>
<head>
<title>test</title>
</head>
<body>
<p>test1</p>
</body>
</html>
--
code #2:
<html>
<head>
<title>test</title>
</head>
<body>
test1
</body>
</html>
====
The output is the same in both cases, the screen prints the word "test1", so what the use of the tag <p> ? how does the browser understand the two codes? please note that the file code is .html extension
The <p> tag stands for paragraph, which is used for text, and you can read more about it at MDN: https://developer.mozilla.org/en/docs/Web/HTML/Element/p
If you take a a good look you'll see the output is not the same, the p is slightly far down the page because it has a default margin set, which for example a div does not.
The browser parse through the code/markup and render the content in each tag accordingly to that particular tags default layout settings.
Editing a README.md for a git repository. But I want to embed raw HTML into the the readme. I'm using Markdown, which is an excellent tool. Yet, the code just keeps showing up as rendered HTML.
How do I keep it Raw?
And formatted like code?
Here it is if you're curious:
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Welcome</title>
</head>
<body>
<h1>Django Site</h1>
<hr />
<p>Thanks for visiting.</p>
</body>
</html>
The heck? It works here.
I suppose you are on GitHub.
GitHub only allows certain HTML elements and attributes inside their markdown: all others are stripped to prevent XSS and defacing.
And of course, <body> is one of the forbidden tags as it would make the HTML invalid if present (a body inside a body)
This is documented at: https://help.github.com/articles/github-flavored-markdown/#html
Use "`" This Sign To Use Raw Code Snippets
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Welcome</title>
</head>
<body>
<h1>Django Site</h1>
<hr />
<p>Thanks for visiting.</p>
</body>
</html>
It Will Allow A User To Copy Your Code Directly From Your README.md File In Github By Just Pressing A Button !!!
I am working with a very big HTML file, which has a lot of content in the body section.
Are there any "compilers" or merging applications for HTML that can merge multiple HTML files?
Example:
a.htm
<!DOCTYPE html>
<html>
<head>
<title>Title</title>
</head>
<body>
INCLUDE "b.htm"
<div>
INCLUDE "c.htm"
</div>
</body>
</html>
b.htm
some text
Link
INCLUDE "c.htm"
c.htm
more <span>text</span>
would be merged to:
<!DOCTYPE html>
<html>
<head>
<title>Title</title>
</head>
<body>
some text
Link
more <span>text</span>
<div>
more <span>text</span>
</div>
</body>
</html>
There are indeed – depending on your needs these offer drastically different mechanisms and tools.
One particular quite simple HTML compiler that is fashionable at the moment is Jekyll. Jekyll powers the blogging engine on GitHub Pages and is both easy to use and extensible.
In your case, you’d for instance write
{% include c.htm %}
instead of
INCLUDE "c.htm"
I decided to write htmlcat for exactly this purpose.
I was watching tutorials about html for beginners and tried to make a simple html file.
when I open this on google chrome the body "hello" is showing up but the title part "first page" doesn't. Did I type something wrong? thanks in advance for your response.
//I apologies for those of you who already answered this. I now see that I have made a mistake on explaining my problem. I meant to show it as a header not title. I already got the answer from the given answers//
<html>
<head>
<title> first page </title>
</head>
<body>
hello
</body>
</html>
Where do you expect title to be shown?
Title is what usually is displayed in the tab bar of your browser, or as text in your window switcher in your operating system. It does not show up inside your webpage.
Your markup seems to be correct, just look for the title in the browser window.
If you meant to make a title (in the meaning of a large text displaying in your website) one way of doing this is to, below your body-tag, write
<h1>Title here</h1>.
<title> is not showing in web page; it is shown in Tab / Window's title.
Suggested to learn the basic HTML structure first.
i think you want a header
<html>
<head>
<title>my page </title>
</head>
<body>
<h1> first page </h1>
hello
</body>
</html>
I learned that the title is the meta tag (the SEO bits), and the H1 is what shows up on the page. So if you'd like both to be the same, example: Things I've Learned is the title and the header of your website, you'd repeat the line.
<html>
<head>
<title>Things I've Learned</title>
</head>
<body>
<h1>Things I've Learned</h1>
<p>These are the things</p>
</body>
</html>
VIA QUORA:
"The key difference between these tags is where their content appears. That difference impacts how search engines and web surfers analyze your page. Title Tag: The Title Tag is known as a meta tag. ... Because it displays the largest text, the H1 Header tag is often used to create a title at the top of the page."
More on how to optimize titles for search engines here.