I'm using jekyll 3.1.2 with the jekyll-paginator to try and create a website that has a homepage at index.html and a blog at /blog/index.html. The website is generated correctly (including each post in the output directory), but the blog directory is not generating the pagination directories. Here is my config:
gems: [jekyll-paginate]
# Site settings
title: Site Title
description: >
Description here
baseurl: "/" # the subpath of your site, e.g. /blog
url: "http://<my url here>com" # the base hostname & protocol for your site
# Build settings
markdown: kramdown
paginate: 3
paginate_path: "/blog/page:num/"
I have a bunch of posts that generate HTML properly in the output folder but the /blog subdirectory only has the index.html file, no subdirectories...however, using the verbose output I see the following during generation:
Rendering: /blog/page2/index.html
Pre-Render Hooks: /blog/page2/index.html
Rendering Liquid: /blog/page2/index.html
Rendering Markup: /blog/page2/index.html
Rendering Layout: /blog/page2/index.html
Rendering: /blog/page3/index.html
Pre-Render Hooks: /blog/page3/index.html
Rendering Liquid: /blog/page3/index.html
Rendering Markup: /blog/page3/index.html
Rendering Layout: /blog/page3/index.html
Rendering: /blog/page4/index.html
Pre-Render Hooks: /blog/page4/index.html
Rendering Liquid: /blog/page4/index.html
Rendering Markup: /blog/page4/index.html
Rendering Layout: /blog/page4/index.html
Rendering: /blog/page5/index.html
Pre-Render Hooks: /blog/page5/index.html
Rendering Liquid: /blog/page5/index.html
Rendering Markup: /blog/page5/index.html
Rendering Layout: /blog/page5/index.html
Rendering: /blog/page6/index.html
Pre-Render Hooks: /blog/page6/index.html
Rendering Liquid: /blog/page6/index.html
Rendering Markup: /blog/page6/index.html
Rendering Layout: /blog/page6/index.html
Rendering: /blog/page7/index.html
Pre-Render Hooks: /blog/page7/index.html
Rendering Liquid: /blog/page7/index.html
Rendering Markup: /blog/page7/index.html
Rendering Layout: /blog/page7/index.html
Any ideas why the subdirectories will not show up in the output folder?
Related
I have a Vuepress repository on GitHub and I'm trying to use NetlifyCMS without the option to depoly on the Netlify website.
I can install the CMS without problems, with the config.yml and index.html files but if I go to www.site.com/admin I get the API error - Failed to load entry: API_ERROR: Not Found
If I create the OAuth App on GitHub I can use the https://api.netlify.com/auth/done Authorization callback URL and set up it with the Client ID and Client Secret on Netlify I won't get the API error but I only want the CMS option from Netlify. Is it possible?
I was trying to check the documentation but I got lost:
https://www.netlifycms.org/docs/add-to-your-site/
https://www.netlifycms.org/docs/authentication-backends/
The folder structure for admin services:
.vuepress
|_public
|_admin
|_config.yml
|_index.html
Inside admin folder:
config.yml:
backend:
name: github
accept_roles: #optional - accepts all users if left out
- admin
- editor
repo: "Company/repositoryName"
branch: master # Branch to update (optional; defaults to master)
publish_mode: editorial_workflow
media_folder: "/.vuepress/public/images"
public_folder: "/images"
collections:
- name: "docs" # Used in routes, e.g., /admin/collections/blog
label: "Docs" # Used in the UI
folder: "docs" # The path to the folder where the documents are stored
create: true # Allow users to create new documents in this collection
slug: "{{slug}}" # Filename template, e.g., YYYY-MM-DD-title.md
fields: # The fields for each document, usually in front matter
- {label: "Title", name: "title", widget: "string"}
- {label: "Body", name: "body", widget: "markdown"}
index.html
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Content Manager</title>
</head>
<body>
<!-- Include the script that builds the page and powers Netlify CMS -->
<script src="https://unpkg.com/netlify-cms#^2.0.0/dist/netlify-cms.js"></script>
</body>
</html>
in a nuxt layout (default.vue) I want to load an image and a css file from assets folder
the image loaded successfully, but the css file not, why?
/layouts/default.vue
<template>
<img src="~assets/photo.jpg" />
<!-- converted to /_nuxt/assets/photo.jpg and loaded successfully -->
</template>
<script>
export default{
head:{
link: [ { rel: 'stylesheet', href: '~assets/style.css' }]
}
}
</sript>
when I view the source code:
<link href="~assets/style.css" />
and it fails to be loaded
also navigating to http://localhost:3000/_nuxt/assets/style.css faild, but http://localhost:3000/_nuxt/assets/photo.jpg successed
note:
I don't want to put style.css in 'static' folder as I want to load it via webpack css-loader to add caching hashes
The image src is automatically compiled by Vue, you can see more at relative path import; From the docs:
all asset URLs such as <img src="...">, background: url(...) and CSS
#import are resolved as module dependencies.
For a custom path besides cases listed above, you need to explicitly require the path for it to be compiled as a path to static assets:
export default{
head:{
link: [{ rel: 'stylesheet', href: require('~assets/style.css') }]
}
}
I'm currently trying to a) add some non-standard fonts and b) the font-awsome icon library to my project. I've donwloaded the the newest version of FA 4.7.0 on their website.
My project structure is like this:
web
----resources
---- css
---- default.css
---- fonts
---- Raleway-Regular.ttf
---- Roboto-Regular.ttf
---- Questrial-Regular.ttf
---- Poppins-Regular.ttf
---- font-awesome-4.7.0
---- css
---- font-awesome.css
---- font-awesome.min.css
---- fonts
---- fontawesome-webfont.eot
---- fontawesome-webfont.woff
---- fontawesome-webfont.woff2
---- fontawesome-webfont.svg
---- fontawesome-webfont.ttf
---- js
---- default.js
Both fontawesome.css and my default.css file define fonts via #font-face.
Knowing that JSF cannot handle the fonts as a resource without the use of EL, I changed the code of the stylesheet:
font-awesome.css
#font-face {
font-family: 'FontAwesome';
src: url("#{resource['font-awesome-4.7.0:fonts/fontawesome-webfont.eot']}&v=4.7.0");
src: url("#{resource['font-awesome-4.7.0:fonts/fontawesome-webfont.eot']}&#iefix&v=4.7.0") format('embedded-opentype'), url("#{resource['font-awesome-4.7.0:fonts/fontawesome-webfont.woff2']}&v=4.7.0") format('woff2'), url("#{resource['font-awesome-4.7.0:fonts/fontawesome-webfont.woff']}&v=4.7.0") format('woff'), url("#{resource['font-awesome-4.7.0:fonts/fontawesome-webfont.ttf']}&v=4.7.0") format('truetype'), url("#{resource['font-awesome-4.7.0:fonts/fontawesome-webfont.svg']}&v=4.7.0#fontawesomeregular") format('svg');
font-weight: normal;
font-style: normal;
}
My css file is referencing the fonts as below:
#font-face {
font-family: Railway;
src: url("#{resource['fonts:Raleway-Regular.ttf']}") format("truetype");
}
#font-face {
font-family: Questrial;
src: url("#{resource['fonts/Questrial-Regular.ttf']}") format("truetype");
}
#font-face {
font-family: Poppins;
src: url("#{resource['fonts/Poppins-Regular.ttf']}") format("truetype");
}
#font-face {
font-family: "Roboto";
src: url("#{resource['fonts:Roboto-Regular.ttf']}") format("truetype");
}
The fact that I'm using both the ":" and "/" seperator is to test which one's working... apparently none :)
I also added all necessarry MIME type mappings in my web.xml.
In the home.xhtml file, I use these resources like that:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:f="http://xmlns.jcp.org/jsf/core">
<h:head>
<h:outputStylesheet library="font-awesome-4.7.0" name="css/font-awesome.css" />
<h:outputStylesheet name="css/default.css" />
<h:outputScript name="js/default.js" />
</h:head>
Now after all these configurations, it seems as if the resource handler is not able to load the fonts (my costum and the FA ones) as well as the JavaScript file. The interesting part is that all other styles of the css file are imported correctly. Also it's strange that it worked the exact same way when I booted the server for the first time today - after adding a favicon to the page, it didn't work anymore.
I'm getting notified of the following errors in my browser:
Uncaught TypeError: Cannot read property 'children' of null(…)
http://localhost:8080/$root/javax.faces.resource/css/resources/fonts/Questrial-Regular.ttf
Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:8080/$root/javax.faces.resource/css/resources/fonts/Raleway-Regular.ttf
Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:8080/$root/javax.faces.resource/fonts/fontawesome-webfont.woff2?v=4.7.0 Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:8080/$root/javax.faces.resource/css/resources/fonts/Poppins-Regular.ttf Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:8080/$root/javax.faces.resource/css/resources/fonts/Roboto-Regular.ttf Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:8080/$root/javax.faces.resource/fonts/fontawesome-webfont.woff?v=4.7.0 Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:8080/$root/javax.faces.resource/fonts/fontawesome-webfont.ttf?v=4.7.0 Failed to load resource: the server responded with a status of 404 (Not Found)
I'd be grateful for any help
Server: Glassfish 4.1.1
Disappointing as this may sound, it was just my browser caching all resources.
After using Ctrl + F5, the browser reloaded the page and all according stylesheets
Generally it turned out to be beneficial to turn off the browser cache while doing web development :-).
Using Jekyll 2.5.3, I've tried to set default values in _config.yml (I'm just playing around to get a feel for it right now). I'm trying to set a default layout right now on a site I'm serving locally. I have set --watch and that's working fine. When I set any YAML defaults in _config.yml, Jekyll does not apply the defaults at all.
Here's the config file I'm currently using:
name: jekyll test
description: test server
url: "http://localhost:4000"
markdown: rdiscount
permalink: pretty
defaults:
-
scope:
path: ""
values:
layout: "default"
The default layout is not applied to any page. I've tried with the title as well, with the same result.
My index.md:
---
title: index
----
{{ page.title }}
My default.html:
<style>
body {
background-color: black;
color: white;
font-family: "Helvetica", Arial, sans-serif;
}
</style>
<body>
{{ content }}
</body>
The default layout works fine when put into the YAML Front Matter of the index page itself, the main reason I'm looking for this is so I can apply default.html to 404 pages. The other elements in config.yml aren't giving me any trouble. Is there something I've done wrong?
Fixed it myself - --watch does not listen for changes to files that aren't included in the site itself (namely _config.yml, which is used to generate pages at runtime). To apply changes to the site configuration, I just had to restart Jekyll and feel a little stupid.
Bottom line: I have learned my lesson. If changes don't appear to be saving, turn it off and on again before asking.
I had this issue. There was an extra space after toggling a comment '#' tag in the frontmatter of my index.md:
---
#title: index
title: index2
----
and I fixed it by removing the space:
---
#title: index
title: index2
----
I have a node/express app with:
.set('views', __dirname + '/dist')
dist has a subdirectory guestApp.
in dist/guestApp I have an html page guest.html and a JavaScript file: vendor.js.
The html page has a script tag with: src='vendor.js'
I render the page with: response.render('guestApp/guest.html', {activeProfile: 'Me', title: 'World'});
The page is rendered, but the JavaScript is not found. I have tried all sorts of combinations but I can't seem to get it right. What is the correct relative path to that script please?
If your html file is not dynamic you don't need to set views. You have to setup the static middleware.
app.use(express.static(__dirname+'/dist'));
And the javascript file should also be referenced relative to the dist directory -
src='guestApp/vendor.js'