Creating a Qtag
For this tutorial You will need:
In order to understand the Quanta data model, we are going to demonstrate how easily a "node" can be created, by creating the corresponding folder by hand.
We will also add a template, and some JSON metadata into it.
This is not something you are going to do everyday, but will definitely help you in starting to get your hands dirty.
Step 1: (optional) check your site structure
In order to get acquainted with a basic Quanta site structure, have a look at the site you just installed.
You will see all the default folders, including at least:
_components
_languages
_roles
_statuses
_users
pages
Step 2: (optional) check your "pages" folder
Go into your pages folder.
Most probably, it will contain the "home" node.
Step 3: Create a new folder into the "pages" folder
While into your pages folder, create a new "helloworld" folder into it.
So your site structure will look like:
(root)
|_ pages
|_ helloworld
Step 4: Create a new tpl.html file into the "helloworld" folder
Inside the hello_world folder, create a new html file, called tpl.html
This file will allow you to create a template for this node.
Your structure will now look like:
(root)
|_ pages
|_ helloworld
|_ tpl.html
Step 5: Put some code in the tpl.html file and look how it renders
Inside the tpl.html file you just added, put some text:
Hello World! I am a template.
Easy, isn't it? You have just create a node, and decided how it should display.
Now, try to access the node via your browser:
http://(yourhost)/helloworld
You should see the output of the template you just created.
Step 6: Create a data.json file into the helloworld folder
Inside your node's folder, create a data.json file.
This is the file that will contain all of your node's metadata, and it's the equivalent of a database entity.
Your structure will now look like:
(root)
|_ pages
|_ helloworld
|_ tpl.html
|_ data.json
Step 7: Put some data in your data.json
Let's put some basic data inside your newly created data.json file.
We can put, as an example, a title and a body
Step 8: Use a qTag in your template to display the JSON metadata
Open again your tpl.html file, and change its text to:
--------------
[TITLE]
[BODY]
--------------
...now open again your node in the browser, and see the magic!
Step 9: Use different qTags to do the same thing
In the previous steps, we have used the [TITLE] and [BODY] core qTags, that are respectively fetching attributes named "title" and "body".
Another way to do the same, could have been:
--------------
[ATTRIBUTE|name=title:helloworld]
[ATTRIBUTE|name=body:helloworld]
--------------
Try and see...
Step 10: Done!
You have just learnt a bit about how data is modeled and rendered in Quanta, doing it by hand.
While normally you will do the same things with more advanced UI tools like Shadow, it was useful to start from the basics and understand the things from their root.