automatic loading
4-2-2025
the banner, navigation, and footer are now loaded with javascript to lessen html repitition
js-css > global.js > loadContent(type)
function loadContent(type) {
if (type === "page") {
banner.innerHTML = "<img src='images/banner.png' class='banner'>";
nav.innerHTML = `
<a href='index.html'>home</a>
<a href='about.html'>about</a>
<a href='blog.html'>blog</a>
<a href='projects.html'>projects</a>`;
footer.innerHTML = `
<button onclick='setTheme('""&)'>default</button>
<button onclick='setTheme('lightTheme')'>light</button>
<button onclick='setTheme('darkTheme')'>dark</button>
<hr>
<p>since nov 3, 2024 :: hosted with cloudflare</p>
<a href='https://github.com/Xleepree/xleepree-webtite'>repository</a>
<a href='mailto:xleepree.pages.mail@gmail.com'>contact</a>`;
} else if (type === "blogPost") {
banner.innerHTML = "<img src='../images/banner.png' class='banner'>";
nav.innerHTML = `
<a href='../index.html'>home</a>
<a href='../about.html'>about</a>
<a href='../blog.html'>blog</a>
<a href='../projects.html'>projects</a>`;
footer.innerHTML = `
<button onclick='setTheme('""&)'>default</button>
<button onclick='setTheme('lightTheme')'>light</button>
<button onclick='setTheme('darkTheme')'>dark</button>
<hr>
<p>since nov 3, 2024 :: hosted with cloudflare</p>
<a href='https://github.com/Xleepree/xleepree-webtite'>repository</a>
<a href='mailto:xleepree.pages.mail@gmail.com'>contact</a>`;
} else {
console.log("unusable or nonexistent parameter.");
return;
}
document.body.prepend(banner);
document.body.prepend(nav);
document.body.append(footer);
}