- name: "link 2"
icon: "fas fa-book"
url: "https://github.com/bastienwirtz/homer"
+ # this will link to a second homer page that will load config from page2.yml and keep default config values as in config.yml file
+ # see url field and assets/page.yml used in this example:
+ - name: "Second Page"
+ icon: "fas fa-file-alt"
+ url: "#page2"
# Services
# First level array represents a group.
--- /dev/null
+# this config is used by a page linked in the navbar
+# this pages will use the same configuration from config.yml, but will overwrite fields present here
+
+# this overwrites title and subtitle:
+title: "Page2"
+subtitle: "this is the second page"
+
+# this overwrites message config. Setting it to empty to remove message from this page and keep it only in the main one:
+message:
+
+# as we want to include a differente link here (so we can get back to home page), we need to replicate all links or they will be revome when overwriting the links field:
+links:
+ - name: "Home"
+ icon: "fas fa-home"
+ url: "/"
+ - name: "Contribute"
+ icon: "fab fa-github"
+ url: "https://github.com/bastienwirtz/homer"
+ target: "_blank" # optional html a tag target attribute
+ - name: "Wiki"
+ icon: "fas fa-book"
+ url: "https://www.wikipedia.org/"
+
+# we keep the first group from the main page, but remove the second group. We need to replicate that first group or it will be removed:
+services:
+ - name: "NEW"
+ icon: "fas fa-cloud"
+ items:
+ - name: "Awesome app on a second page!"
+ logo: "assets/tools/sample.png"
+ subtitle: "Bookmark example"
+ tag: "app"
+ url: "https://www.reddit.com/r/selfhosted/"
+ target: "_blank"
<section v-if="config.header" class="first-line">
<div v-cloak class="container">
<div class="logo">
- <img v-if="config.logo" :src="config.logo" alt="dashboard logo" />
+ <a href="#"><img v-if="config.logo" :src="config.logo" alt="dashboard logo" /></a>
<i v-if="config.icon" :class="config.icon"></i>
</div>
<div class="dashboard-title">
created: async function () {
const defaults = jsyaml.load(defaultConfig);
let config;
+ window.onhashchange = function() { location.reload(); };
try {
config = await this.getConfig();
+ const path = (window.location.hash.substring(1) != '') ? window.location.hash.substring(1) : null;
+ if (path) {
+ let pathConfig = await this.getConfig(`assets/${path}.yml`); // the slash (/) is included in the pathname
+ for (const prop in pathConfig) config[prop] = pathConfig[prop];
+ }
+ // config = await this.getConfig(path ? `assets/${path}.yml` : null);
+ //config = await (path ? this.getConfig(`assets/${path}.yml`) : this.getConfig())
} catch (error) {
console.log(error);
config = this.handleErrors("⚠️ Error loading configuration", error);