Difference between revisions of "Updatable Website"
From Publication Station
(Created page with " =Updatable Website= How to integrating changing content & website creation? Our problem: like in inDesign '''we want to work on the identity and navigation of our website,...") |
|||
Line 1: | Line 1: | ||
* Download [https://github.com/wdka-publicationSt/book-website/archive/master.zip book-website structure] | |||
* unzip master.zip | |||
* place `book-website-master/` in the folder dedicated to the publication | |||
How to integrating changing content & website creation? | How to integrating changing content & website creation? | ||
Line 12: | Line 15: | ||
[[File:website-inner_outer.svg]] | [[File:website-inner_outer.svg]] | ||
== book-website == | |||
The ''book-website'' try address this issue, with a quick'n'dirty JS+HTML system for '''loading html content from content.html into index.html''', without a webserver. | |||
NOTE: '''it will only work in Firefox'''; Chrome will refuse to so, due to same origin policies | |||
The motivation to do so, is to allow content (in content.html) to be easily updatable, and decoupled from the rest of the webpage files. | |||
Folder structure: | |||
<pre>book-website/ | |||
├── content.html ----> CONTENT | |||
├── index.html ----> LANDING PAGE | |||
├── jquery-3.1.1.min.js | |||
├── load.js ----> JS where content is loaded, sections and TOC are created | |||
├── README.md | |||
└── style.css ----> CSS style info | |||
</pre> | |||
* <code>content.html</code> will store updatable content | |||
* <code>style.css</code> stores the CSS Making changes to CSS can be done in | |||
* <code>index.html</code> receives the content from content.html allows HTML (such as menus) to be added | |||
* <code>load.js</code> besides loading content, also includes a function which generates a Table-of-contents <code>generate_toc</code>, using the h1 elements to create entries: | |||
<pre> <ul> | |||
<li><a href="#id_of_firsth1">First h1</a></li> | |||
<li><a href="#id_ofsecond_h1">Second h2</a></li> | |||
<ul></pre> |
Latest revision as of 16:10, 18 February 2018
- Download book-website structure
- unzip master.zip
- place `book-website-master/` in the folder dedicated to the publication
How to integrating changing content & website creation?
Our problem: like in inDesign we want to work on the identity and navigation of our website, while keeping the content updatable.
inDesign addresses this issue with the use of chapter styles.
How can it work for the website creation?
book-website
The book-website try address this issue, with a quick'n'dirty JS+HTML system for loading html content from content.html into index.html, without a webserver.
NOTE: it will only work in Firefox; Chrome will refuse to so, due to same origin policies
The motivation to do so, is to allow content (in content.html) to be easily updatable, and decoupled from the rest of the webpage files.
Folder structure:
book-website/ ├── content.html ----> CONTENT ├── index.html ----> LANDING PAGE ├── jquery-3.1.1.min.js ├── load.js ----> JS where content is loaded, sections and TOC are created ├── README.md └── style.css ----> CSS style info
content.html
will store updatable contentstyle.css
stores the CSS Making changes to CSS can be done inindex.html
receives the content from content.html allows HTML (such as menus) to be addedload.js
besides loading content, also includes a function which generates a Table-of-contentsgenerate_toc
, using the h1 elements to create entries:
<ul> <li><a href="#id_of_firsth1">First h1</a></li> <li><a href="#id_ofsecond_h1">Second h2</a></li> <ul>