POC for CIFACOM Week project
This is how to make an HTML page editable by content writers and clients in BackNode.
First open the HTML file in a text editor.
For all the nodes which are texts and which you want to be editable in BackNode, add the css class backnode-text or the HTML attribute data-bn="text".
For all the nodes which are images and which you want to be editable in BackNode, add the css class backnode-image or the HTML attribute data-bn="image".
The HTML pages created with Silex website builder can also be edited in BackNode. The designer has to enter the advanced mode of Silex - tools > Apollo mode, and add the css classes provided above to the desired elements.
clone the project:
> git clone https://github.com/silexlabs/BackNode.git && cd BackNode
Ok it's done, you can now build the project and start to work !
just enter make in your terminal :)
> make
this make command will install npm dependencies (express / unifile / grunt / etc..), but other if you want -> package.json launch grunt compilation and run the project (server.js)
The default port for BackNode is 8080, so now open the URL http://localhost:8080/ in a browser.
cms, content management system, free, easy, online, webapp, opensource, community, template, editable, duplicate, html content, edit, backnode, dynamic, tool, web tool, silexlabs, cifacom, cloud explorer
- data-bn="edit" : Edit your element
- data-bn="template" : To repeat the sub items of the type repeate
- data-bn="repeat" : Repeat element in a template.
<!doctype html>
<html>
<head>
<title>BackNode</title>
</head>
<body>
<h2 data-bn="edit">BackNode</h2>
<div data-bn="edit" >
Aliquam placerat vel rhoncus placerat turpis! Cum vel ut? Porttitor parturient phasellus.
</div>
<img src="https://www.google.com/images/srpr/logo11w.png" data-bn="edit"/>
</body>
</html>- You can follow us on facebook and twitter, can see the demonstration : http://www.backnode.io