Where does the head section come from when github pages generates source? - github-pages

I created index.md for my GitHub pages site
with the following in index.md
---
title: This is my title
layout: default
---
## Welcome to GitHub Pages My Index.md
etc
I am just editing the index.md directly in the GitHub editor. I have not installed Jekyll locally.
What do I change so that the generated source does not have my repository name in the title ?
Looking at the source I have
I have tried changing the theme.
I also tried experimented with adding a header.html to the _includes folder
This caused me to start receiving emails with subject containing "Page build failed"
Since then I have removed all the folders. I no longer get the "Page build failed" email, but I am unsure of how to proceed.

GitHub Pages silently sets default layouts using jekyll-default-layout, as described in Publishing with GitHub Pages, now as easy as 1, 2, 3.
To avoid this, you can create your own _layouts/default.html, which should look something like this:
<!doctype>
<html>
<head>
<title></title>
</head>
<body>
{{ content }}
</body>
</html>
And then apply the layout to your files:
---
layout: default
---
...
If you want to include the page title in the title tag, you can do something like this instead of the _layouts/default.html above:
<!doctype>
<html>
<head>
<title>{{ page.title }}</title>
</head>
<body>
{{ content }}
</body>
</html>
Which will use the title in your YAML front matter:
---
layout: default
title: Title
---
...
For more information, take a look at the Jekyll documentation:
https://jekyllrb.com/docs/home/

The site title can be set in _config.yml
However it seems that the _layout\default.html is also required to make the setting work.
The help to set up the default.html is here
under the title "Customizing your Jekyll theme's HTML layout"

HOW IT WORKS ?
Post content will mention name of layout file which will be in _layout folder. So for following post corresponding layout will be in _layouts/default.html
---
title: This is a post with default layout
layout: default
---
Some text for post
Typically default.html layout consumes files head.html and header.html inside _includes folder.
ACTION
Now you have to look at markdown of your page or post and identify its parent layout (inside _layouts) and from there drill-down into _includes. This will allow you to trace lines those are getting generated into output html. Also you can have your own _includes and _layouts for custom html output.

Related

Jquery Cycle2 won't produce slideshow

I'm trying to implement the cycle2 plugin with jquery on an HTML page.
I've used the site http://jquery.malsup.com/cycle2 as a guide
I downloaded (copied) the file jquery.cycle2.js I placed it on the server in on the server in the location public_html/cycle2/jquery.cycle2.js
In my HTML page's Header section I added the lines:
<!-- include jQuery library -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<!-- include Cycle2 -->
<script src="cycle2/jquery.cycle2.js"></script>
Then, in the HTML page's BODY I added:
<div class="cycle-slideshow">
<img src="cycle_images/image1.jpg" alt="Image1"/>
<img src="cycle_images/image2.jpg" alt="Image2"/>
<img src="cycle_images/image3.jpg" alt="Image3"/>
</div>
The guide doesn't give a css-type example for the class "cycle-slideshow". Instead it says that by using that class in the DIV tag it will auto-activate the slideshow.
This doesn't seem to activate the slideshow. Instead it lays out the images out in three rows, one row after another.
Any idea what I'm doing wrong to activate the cycle2 slideshow?
The problem was with the HTTP:// on the server line. Since the Cycle2 documentation was published, the GOOGLEAPIS sever must have obtained a certificate, making it HTTPS. The mismatch between HTTP and HTTPS caused the plugin to fail. The working code now reads:
<!-- include jQuery library -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<!-- include Cycle2 -->
<script src="cycle2/jquery.cycle2.js"></script>
It seems to me that it's safer to remove "HTTP" or "HTTPS" and just being the server line with "//".

How to deploy pure html to Octopress?

I am using Octopress to write posts, which uses markdown file to generate html files, using :
rake new_post['my_post']
rake generate
But what if I need to add some JavaScript demo inside my post, which I need to write some code inside the post, which may possibly be a html page I am writing as.
Can I achieve this with Octopress and remain overall consistency of style?
You can put your Javascript block into its own HTML file, in your source/_includes/ directory. Then you can embed that into your post using Liquid include tags:
---
layout: post
title: "JS Demo"
date: 2015-01-01 01:01:01
categories:
---
{% include myjs.html %}
and the contents of myjs.html would be:
<div id="myelement"></div>
<script>
$('div#myelement').text("hello world");
</script>
and myjs.html would be at source/_includes/myjs.html. Then your final page source code would (for example) render as:
<div><h1>JS Demo</h1></div>
<div id="myelement">hello world</div>
If you want to structure the Javascript code you're including a bit more, you can make a directory for Javascript files in (e.g.) source/_includes/demo/, then put your Javascript into source/_includes/demo.html. Then your markdown would have the following Liquid include tags:
{% include demo/demo.html %}

Go language strange behavior by handling templates

gotemplates
Hello!
I'm learning Go language now and trying to port some simple WEB code (Laravel 4).
Everything was well, until I tried to reproduce Blade templates into text templates.
I found that Go can load my CSS and JavaScript files only from the catalog with a name "bootstrap" only.
Here is my catalog tree which I tried to use:
start-catalog
bootstrap (link to bootstrap-3.3.1)
bootstrap-3.3.1
css
bootstrap.min.css
js
bootstrap.min.js
jquery
jquery (link to jquery-2.1.1.min.js)
jsquery-2.1.1.min.js
go_prg.go
Here are my templates:
base_js.tmpl
{{define "base_js"}}
{{template "login_1"}}
<script src = "/bootstrap/js/jquery"></script>
<script src = "/bootstrap/js/bootstrap.min.js"></script>
{{end}}
base_header.tmpl
{{define "base_header"}}
<head>
<title>PAGE TITLE</title>
<meta name = "viewport" content = "width=device-width, initial-scale=1.0">
<meta charset="utf-8">
<link href = "/bootstrap/css/bootstrap.min.css" rel = "stylesheet">
</head>
{{end}}
If the catalog name differs from "bootstrap" Go language or Firefox can't load files from the templates above: bootstrap.min.css, bootstrap.min.js, jquery.
If I use not the link but the catalog name directly "bootstrap-3.3.1" than Go or Firefox can't load.
If all required files are moved under "bootstrap" I'm getting the results I expected (exactly the same as in Laravel 4).
To launch go language code the command go run go_prg.go was used.
Environment: Ubuntu 14.04, go-1.3.3, Firefox 31.
Who's wrong: Go language, Firefox or me?
Any help will be highly appreciated!
The problem described was caused by
http.Handle("/bootstrap/", http.StripPrefix("/bootstrap/", http.FileServer(http.Dir("bootstrap"))))
before any template was handled. It allowed access files under the directory 'bootstrap' only.
The problem was fixed by changing to
http.Handle( , http.StripPrefix(, http.FileServer(http.Dir("."))))
and adding to pathes for CSS and JavaScript files. Like so
/bootstrap/js/jquery">.

Sitemap in Django - Titles don't show in google search

I have followed the steps in the documentation and it seems to be working as expected.
I have got an automated sitemap generated: https://duelify.com/sitemap.xml
Yet somehow there is no way to specify the title.
If I search in google for my site: site:duelify.com and scroll down I see the main site's title for every link:
Duelify | Duel Your Friends & Foes
https://duelify.com/topics/discuss/2/vegetarian-diet/
That doesn't look right.
If I try this with Stackoverflow:
site:stackoverflow.com django
Each entry has a proper title.
How could I achieve that? It is not clear from the given site map references.
The title displayed in Google search results has nothing to do with the sitemap.
Use meta (http://www.w3schools.com/tags/tag_meta.asp) and title tags:
<head>
<meta name="description" content="Your page description">
<title>Your page title</title>
</head>
And don't forget to set proper HTML heading tags.

Using Protovis with Django

I am trying to get Protovis working in my Django site. Here is my sample code:
<html>
<head>
<script type="text/javascript" src="protovis-r3.2.js"></script>
</head>
<body>
<script type="text/javascript+protovis">
new pv.Panel().width(150).height(150).anchor("center")
.add(pv.Label)
.text("Hello, world!")
.root.render();
</script>
{{ object.name }}
</body>
</html>
When I open this file directly in firefox, a Protovis 'Hello World' image is displayed toguether with the string "{{ object.name }}".
But when accessing the .html file template from my Django server, I only see the {{ object.name }} (the object's name printed out).
I haven't found similar issues so far, catering to Protovis use in Django.
If anyone has gotten it working or know what I am doing wrong, please let me know.
Thanks,
You've asked for the javascript file using src="protovis-r3.2.js"
When you look at the html file directly, your browser will look in the same directory as the .html file for a file called protovis-r3.2.js.
However, when you ask Django to serve this same page, it doesn't follow the same protocol. See this article for more information.
To get it to work:
Move the protovis-r.32.js file to a new directory: /path/to/my/django_site/static (where /path/to/my/django_site is the absolute path to the django app)
Configure urls.py with the line:
(r'^static/(?P<path>.*)$', 'django.views.static.serve',
{'document_root': '/path/to/my/django_site/static'}),
Change the src attribute of the script tag in your html code to:
src="/static/protovis-r3.2.js"