add support for internal or external css/js/googlefonts
This commit is contained in:
Dean Attali
parent
d2965a16bd
commit
e2f16fd06d
|
|
@ -3,6 +3,4 @@ TODO write instructions
|
|||
|
||||
known bug (problem on GitHub Pages part) - if you have a project page and want a custom 404 page, you must use a custom domain. See https://help.github.com/articles/custom-404-pages/. This means that if you have a regular User Page you can use the 404 page from this theme, but if it's a website for a specific repository, the 404 page will not be used.
|
||||
|
||||
mention that avatar img + css + js have to be served locally, not from a URL
|
||||
|
||||
can also give googlefonts
|
||||
|
|
|
|||
|
|
@ -1,8 +1,19 @@
|
|||
<script src="{{ site.baseurl }}/js/jquery-1.11.2.min.js"></script>
|
||||
<script src="{{ site.baseurl }}/js/bootstrap.min.js"></script>
|
||||
{% if page.common-ext-js %}
|
||||
{% for js in page.common-ext-js %}
|
||||
<script src="{{ js }}"></script>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
{% if include.full %}
|
||||
<script src="{{ site.baseurl }}/js/main.js"></script>
|
||||
{% if page.common-js %}
|
||||
{% for js in page.common-js %}
|
||||
<script src="{{ js | prepend: site.baseurl | replace: '//', '/' }}"></script>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
{% if page.ext-js %}
|
||||
{% for js in page.ext-js %}
|
||||
<script src="{{ js }}"></script>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
{% if page.js %}
|
||||
|
|
|
|||
|
|
@ -8,23 +8,41 @@
|
|||
<meta name="author" content="{{ site.author.name }}" />
|
||||
<meta name="description" content="{{ site.description }}">
|
||||
|
||||
<link rel="stylesheet" href="{{ site.baseurl }}/css/bootstrap.min.css" />
|
||||
<!-- I choose not to use the bootstrap theme css, I think it looks less appealing
|
||||
<link rel="stylesheet" href="{{ site.baseurl }}/css/bootstrap-theme.min.css" /> -->
|
||||
<link rel="alternate" type="application/rss+xml" title="{{ site.name }} - {{ site.description }}" href="{{ site.baseurl }}/feed.xml" />
|
||||
|
||||
{% if page.common-ext-css %}
|
||||
{% for css in page.common-ext-css %}
|
||||
<link rel="stylesheet" href="{{ css }}" />
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
{% if include.full %}
|
||||
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" />
|
||||
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic" />
|
||||
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800" />
|
||||
<link rel="stylesheet" href="{{ site.baseurl }}/css/main.css" />
|
||||
<link rel="alternate" type="application/rss+xml" title="{{ site.name }} - {{ site.description }}" href="{{ site.baseurl }}/feed.xml" />
|
||||
{% else %}
|
||||
<link rel="stylesheet" href="{{ site.baseurl }}/css/main-minimal.css" />
|
||||
{% if page.common-css %}
|
||||
{% for css in page.common-css %}
|
||||
<link rel="stylesheet" href="{{ css | prepend: site.baseurl | replace: '//', '/' }}" />
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
{% if page.common-googlefonts %}
|
||||
{% for font in page.common-googlefonts %}
|
||||
<link rel="stylesheet" href="//fonts.googleapis.com/css?family={{ font }}" />
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
{% if page.ext-css %}
|
||||
{% for css in page.ext-css %}
|
||||
<link rel="stylesheet" href="{{ css }}" />
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
{% if page.css %}
|
||||
{% for css in page.css %}
|
||||
<link rel="stylesheet" href="{{ css | prepend: site.baseurl | replace: '//', '/' }}" />
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
{% if page.googlefonts %}
|
||||
{% for font in page.googlefonts %}
|
||||
<link rel="stylesheet" href="//fonts.googleapis.com/css?family={{ font }}" />
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
</head>
|
||||
|
|
@ -1,7 +1,22 @@
|
|||
---
|
||||
common-css:
|
||||
- "/css/bootstrap.min.css"
|
||||
- "/css/main.css"
|
||||
common-ext-css:
|
||||
- "//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css"
|
||||
common-googlefonts:
|
||||
- "Lora:400,700,400italic,700italic"
|
||||
- "Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800"
|
||||
common-js:
|
||||
- "/js/jquery-1.11.2.min.js"
|
||||
- "/js/bootstrap.min.js"
|
||||
- "/js/main.js"
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
{% include head.html full = true %}
|
||||
{% include head.html %}
|
||||
|
||||
<body>
|
||||
|
||||
|
|
@ -13,7 +28,7 @@
|
|||
|
||||
{% include footer.html %}
|
||||
|
||||
{% include footer-scripts.html full = true %}
|
||||
{% include footer-scripts.html %}
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,16 @@
|
|||
---
|
||||
common-css:
|
||||
- "/css/bootstrap.min.css"
|
||||
- "/css/main-minimal.css"
|
||||
common-js:
|
||||
- "/js/jquery-1.11.2.min.js"
|
||||
- "/js/bootstrap.min.js"
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
{% include head.html full = false %}
|
||||
{% include head.html %}
|
||||
|
||||
<body>
|
||||
|
||||
|
|
@ -11,7 +20,7 @@
|
|||
|
||||
{% include footer-minimal.html %}
|
||||
|
||||
{% include footer-scripts.html full = false %}
|
||||
{% include footer-scripts.html %}
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@
|
|||
layout: minimal
|
||||
js: "/js/contact.js"
|
||||
css: "/css/contact.css"
|
||||
googlefonts: Lobster
|
||||
---
|
||||
|
||||
Just kidding, you can't contact me here.
|
||||
|
|
@ -14,4 +15,6 @@ It's also an example of how you can easily add CSS or JavaScript files to a temp
|
|||
|
||||
<button type="button" class="btn btn-default" id="contact-btn">
|
||||
Click me
|
||||
</button>
|
||||
</button>
|
||||
|
||||
<p id="googlefont-test">You can even use any <a href="http://www.google.com/fonts/">Google fonts</a> you'd like to be extra fancy, like this Lobster font</p>
|
||||
|
|
@ -1,3 +1,11 @@
|
|||
body {
|
||||
padding-top: 30px;
|
||||
}
|
||||
|
||||
#contact-div {
|
||||
color: red;
|
||||
}
|
||||
|
||||
#googlefont-test {
|
||||
font-family: Lobster;
|
||||
}
|
||||
Loading…
Reference in New Issue