Ionize Doc Webdesigner
Click here to load reader
-
Upload
amabel-damara-elysia -
Category
Documents
-
view
24 -
download
1
Transcript of Ionize Doc Webdesigner
Ionize for WebdesignerIonize documentation
Contents
General information.......................................................................................................... 3License.............................................................................................................................................. 3
Requirements.................................................................................................................................... 4
Basic requirements........................................................................................................................................................4
Additional requirements............................................................................................................................................... 4
Ionize philosophy...............................................................................................................................4
Installation steps.............................................................................................................. 5Troubles after installation...................................................................................................................5
Server internal error...................................................................................................................................................... 5
Settings saving errors, no thumbnail creation.................................................................................................... 5
Content organization in Ionize............................................................................................6Languages.........................................................................................................................................6
Pages................................................................................................................................................ 6
Articles...............................................................................................................................................6
Media.................................................................................................................................................6
URL................................................................................................................................................... 6
Language detection........................................................................................................................... 6
How will the website be displayed by Ionize ?................................................................................... 7
Content displaying......................................................................................................................................................... 7
Standard URL.................................................................................................................................................................. 7
Reserved URL................................................................................................................................................................. 7
Themes........................................................................................................................... 8Create one theme..............................................................................................................................8
Create views......................................................................................................................................8
Steps................................................................................................................................................................................... 8
Default views....................................................................................................................................................................9
Tags and template language..............................................................................................................9
Single data object...........................................................................................................................................................9
Containers objects / Iterator.....................................................................................................................................10
Tags index........................................................................................................................................11
Website data...................................................................................................................................................................11
Languages.......................................................................................................................................................................11
Navigation....................................................................................................................................................................... 12
Current page.................................................................................................................................................................. 13
Articles.............................................................................................................................................13
Article filter : “with”....................................................................................................................................................... 14
Article date : “date”...................................................................................................................................................... 14
Media...............................................................................................................................................15
Other tags........................................................................................................................................16
Categories tags.............................................................................................................................................................16
Archives tag....................................................................................................................................................................16
General information
Ionize is a content management system (CMS) based on the PHP CodeIgniter framework.
The main purpose of Ionize is to make creation and content editing very easy for the web designer and for the content editor.
License
This software is released under the Open Source MIT license.
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions :
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
Requirements
Basic requirements
• PHP 5.2.0 or higher,
• MySQL,
• FTP access to your server.
Additional requirements
The PHP user also needs to have writing privileges on following folders:
Folder Description
/application/config/ The config files folder
/files/ User's media folders.
Writing rights must also be set to each subfolder
/themes/your_theme/config The theme config folder
/themes/your_theme/language Static translations files folder
Ionize philosophy
Website
In Ionize, the website is composed of :
• Content, stored in database
• One theme, containing display items
• Media files : pictures, videos, music, etc.
Theme
A theme defines how the content of a website will be displayed.
A theme is a folder containing all the website templates, assets and optional widgets used by the website. Themes are located in the themes folder.
View
A view is one file used to display data. This could also be called a “template”.
Common views are articles and page templates.
Their extension is .php, even they don’t use PHP but a template tag language.
Tag
A tag is a template language element used to display data easily. All tags start with the “ion” prefix.
Example of tag :
<ion:last_articles num=”3” paragraph=”1” />
This tag will display the last 3 articles list, with the first paragraph.
Installation steps
1. Copy the ionize zip package content to your server
2. Launch http://your-domain/install and follow the installation steps
3. Delete the /install folder after the installation is complete in order to use Ionize
Important : During the install process, you will create the admin account. This account will be mandatory to log onto the admin part of Ionize.
Troubles after installation
Server internal errorDepending on your server configuration, you should edit the .htaccess file and remove the comment before the line :
#RewriteBase /
Settings saving errors, no thumbnail creation...The server PHP user must have writing privileges on folders :
• /application/config/
• /themes/*
• /files/
Content organization in Ionize
Ionize organizes content by language, pages and articles.
The entry point is the language, which will be detected when the user enter the website.
If no language was found, the default one will be loaded (en/english on a default installation).
Languages
Everything can be translated, from dynamic database stored data to "static" elements directly displayed in templates (such as company footers address).
Pages
Pages organize the content. They are used to build the navigation.
Pages can be nested, to create a multi-level navigation.
Pages are also containers used to display data or simply links to internal content or external URLs.
Articles
Articles contains the textual content.
An article can be a simple one or a blog post, depending on the way it is displayed.
Media
By media, we mean pictures, videos, files, music, everything which can be linked to an article or inserted in an article as inline content.
All data (articles text, media metadata, website metadata, etc.) can be translated to the defined languages.
URL
Ionize produces user-friendly URLs, containing the language code.
Example of an URL produced by Ionize :
http://www.my_domain.com/ en /my_page
Language detection
Language is detected through the following steps. At each step, if a language is found, detection stops.
1. Does the URL contains the language code ?
2. Is each of the browser (taken by ordering) language present in the website language definition config file ?
3. Use the default website language
How will the website be displayed by Ionize ?
Content displayingThe content (page / articles) will be displayed through “views”.
A view is a PHP file containing HTML and Ionize tags. Ionize tags are used to display the database stored content. See Tags and template languages for more about tags.
Views can be linked to pages and articles.
Standard URLThe URL will define what will be displayed.
Ionize displays pages, and articles in pages.
The language code is a part of the URL. It is still possible to create a one language website and not to display the language code in the URL. This choice will be achieve by views, which will not integrate the lang code in the URL.
Example of URL What will be displayed ?
www.my_domain.com/ The first page of the website, with the detected languages.
All produced links in this page will include the lang code in their URL.
www.my_domain.com/en/services The page named services, in english.
All articles in this page will be displayed as defined by the attached page view.
www.my_domain.com/services/web-design The article called web-design in the page services.
As no language is defined, the detected one or the default website language will be used.
Reserved URLSome URL display content in a special way. They're called “reserved URL”.
Important : No page or article can be named using these names, to avoid collision when detecting what should be displayed.
URI name Example URL What will be displayed ?
category http://www.my_domain/my-page/ category /xxx The articles list from category xxx in the page my-page
archives http://www.my_domain/my-page/ archives /2009/10
The articles list published in 2009/10, in the page my-page
Themes
All themes are located in the /themes/ folder.
Create one theme
Creating one theme is quite simple. You can copy one of the existing theme folder and start your work, or, if you want to start from scratch, create one folder in the themes/ folder and include at least the following folders :
Important : Never delete the /themes/admin folder. This theme is used by the admin back-end of Ionize.
Folder Description
my_theme/ Base folder of one theme. In this case, the theme is my_theme
assets/ Theme assets, like CSS and CSS images. Can be organized as you wish or named differently.
config/ Theme configuration files.
config/views.php : Contains the link between one physical template file and the Ionize displaying name in the admin part. This file is updated by the back-end, so there is no need to edit it.
language/ Contains the languages translation files, grouped by language code folder.
language/xx/my_theme_lang.php : One language “static” language elements translation file. Generated by the admin part of Ionize. See “Static languages in views” for more information about these elements.
views/ Contains views of the current theme
widgets/ All the widgets.
See Developer : Widget creation for more information about widgets.
Create views
Steps1. Create the view file
2. Declare the created view as page view or article view
3. Use it in the admin panel when editing page or article
To create a view, simply create a new PHP file in the /themes/your_theme/views folder or in a sub folder of this folder.
To use this view to display pages or articles, you have to declare this view through the admin panel :
1. Log on the admin panel and go to Settings → Theme...
2. Click on Current theme views list : You will see all views from your theme
3. In your view “Logical name” field, put the name you want to see appearing and select one type of view and save.
4. Check in one article / page : the view name will be available in the view list of the item.
Illustration 1 : View declaration in admin panel
Note : Some views do not have any logical name : It’s normal since they are not used for content editing but are used directly by tags.
For example : The “last_news” views is not declared and does not have to be declared as it is used by the tag “last_news”.
Default viewsEach theme contains default views.
These views are used to display content if no view is defined by the editor.
These files are stored in the views/default folder.
Mandatory default views :
page.php default view for each page
Article.php default view for each article
navigation.php default view for the navigation menu
categories.php default view for categories list block
archives.php default view for archives list block
last_articles.php default view for last_articles displaying
Tags and template language
Tags are used in views to display content from the database. They can display simple data as a string or nested data, depending on the tag properties.
Single data objectA single data object doesn't have any children. It contains the data.
Calling such a tag is quite simple.
<!-- This will display the website keywords -->
<ion:meta_keywords />
Containers objects / IteratorA container object, or iterator, contains child data objects. Some containers needs to be displayed through views while others can be directly outputted to the view page.
<!-- Last articles : Container with a specific view
The base folder for the views is my_theme/views/
As our view is in the “articles” folder, we need to give
the path to this folder.
-->
<ion:last_articles num=”3” paragraph=”1” view=”articles/last_articles” />
The above example will display the last three articles with the view “my_last_articles”.
The file themes/my_theme/views/articles/last_articles.php must exist.
Example of content of the last_articles.php file :
<!-- my_last_article.php content : display each article
of the “last_articles” parent object
-->
<div class="result">
<!-- This can be understood as : “foreach article” -->
<ion:articles>
<!-- display the article title and use the URL for the link -->
<h3><a href="<ion:url />"><ion:title /></a></h3>
<!-- display the article content
In this case, as we define the paragraph attribute to “1”,
it will only display the first paragraph of the article
-->
<ion:content />
<!—Close the “foreach article” tag -->
</ion:articles>
</div>
Tags index
Tags usage :
<ion:parent_object_name attribute=”my_attribute”>
<ion:object_name />
</ion:parent_object_name>
They are available tags for:
• Website data
• Languages
• Navigation
• Current page data
• Articles
• Medias
Website data
Usage :
<ion:file_path />
TAG Description
file_path User’s media folder
theme Current theme
google_analytics Google analytics script as defined in the Ionizes Advanced settings
meta_keywords Website META KEYWORDS
meta_description Website META DESCRIPTION
site_title Title of the website
base_url Website base_url. Without the lang code.
LanguagesThese tags contains data about existing Ionize languages.
Usage :
<ion:languages>
<ion:lang /><ion:name />
</ion:languages>
TAG Parent TAG Description
languages Iterator for each language element.
lang languages Lang code, on 2 chars.
name languages Lang name
NavigationEach navigation item is a page. The designer will be able to display the data of each page in the navigation menu.
Usage example in a page views :
<ion:navigation level=”0” class_active=”active” view=”navigation/menu.php”>
In navigation/menu.php :
<ion:items>
<a class="<ion:class_active />" href="<ion:name />"><ion:title /></a>
</ion:items>
TAG Parent TAG Description Attribute Optional
navigation Navigation menu container level :
0 is the first level. “1” will show the subnavigation menu of the current 0 level displayed page
no
class_active :
The CSS class to use for the current visited menu item
Yes.
Default value : active
view :
the path to the view to be used to display the navigation
Yes.
Default value : default/navigation
items navigation Iterator for each navigation item
class_active items Current item CSS class. If the item is the current visited page, will be set to “active” (default value) or to the
“active_class” attribute value
name items The page name
title Items The page title
subtitle1 items The page subtitle 1
subtitle2 items The page subtitle 2
meta_description Items Page specific meta description
meta_keywords Items Page specific meta keywords
Current pageThese data concern the current displayed page
Usage in a page view :
<ion:title />
TAG Parent TAG Description
name The page name
title Items The page title
subtitle1 The page subtitle 1
subtitle2 The page subtitle 2
meta_description Page specific meta description
meta_keywords Page specific meta keywords
Articles
Usage in a page view :
<ion:articles >
<ion:article />
</ion:articles>
Notice : In the above case, each article will be displayed with its own view, depending on the attached view in the admin panel.
In one article view :
<h2><ion:title /></h2>
<p><ion:date format="d.m.Y" /></p>
<ion:content />
…
TAG Parent TAG Description Attribute Optional
articles Articles iterator
article articles Article output. view Yes.
Overwrite the view set by the editor.
paragraph Yes.
Limit the displayed paragraph to the given number
with Yes.
Article filter.
type Filter articles with the given view name.
Must be the complete path to the view
title article Article title
subtitle1 article Article subtitle 1
subtitle2 article Article subtitle 2
pictures article Pictures iterator. See Media for details
date article Article date format Yes.
Article filter : “with”If only a field name is passed, it will display the article if this field is not empty.
You can also create advanced filter like :
<ion:article with=”views:!=article_toto” />
This will show only the articles with another view than article_toto
Article date : “date”Use the PHP date format to display the article date.
<ion:date format=”d” />
The above example will output the day as a number.
Have a look at : www.php.net/date/ for supported date format
Media
These media tags are available in containers :
• page
• article
Example in a page view :
<ion:pictures>
<img title="<ion:title />" alt="<ion:alt />" src="<ion:base_url /><ion:file_name />" />
</ion:pictures>
Each of the following described child tag is usable for the parents tags :
• pictures
• videos
• musics
• files
TAG Parent TAG Description
pictures Pictures iterator
videos videos iterator
musics musics iterator
files files iterator
base_path pictures / videos / musics / files
Base picture path.
file_name pictures / videos / musics / files
Media complete file name
copyright pictures / videos / musics / files
Media copyright
date pictures / videos / musics / files
Media date
link pictures / videos / musics / files
Media link
title pictures / videos / Media title
musics / files
alt pictures / videos / musics / files
Media alternative text
description pictures / videos / musics / files
Media description
Other tags
These tags can be used on page views.
Categories tagsUsed to display a list of link with each category.
TAG Parent TAG Description Attribute Optional
categories Display the pages articles categories list, depending on the languages.
class_active :
The CSS class to use for the current visited menu item
view :
the path to the view to use to display the categories list
Yes.
Default value : default/categories
category categories Iterator through categories
class_active category Current active item class
url category URL to the page which displays the articles by categories
title category Category title
Archives tagUsed to display a list of link to articles / period.
TAG Parent TAG Description Attribute Optional
archives Display the pages articles archives periods as a list
class_active :
The CSS class to use for the current visited archive
view :
the path to the view to use to display the
Yes.
Default value : default/archives
archives list
format Yes.
PHP date Format of the month name. ‘F’ by default.
archive archives Archives items iterator
class_active archive Current active item class
url archive URL to the page which displays the articles by period
period archive Period, as specified by the format attribute
nb_articles archive Number of articles published in this period