Invenzzia »

Pages: [1]   Go Down
  Print  
Author Topic: OPTv2: How to build a main layout  (Read 1103 times)
Description: How to buil a main file template that is base of all the page
0 Members and 2 Guests are viewing this topic.
amichelin
User

Offline Offline

Posts: 10


View Profile
« on: April 27, 2009, 23:54:07 »

This is my template comented :

Code:
<?xml version="1.0" ?>
<!-- main.tpl -->
<opt:root>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt-br" lang="pt-br">
<head>
    <title>{$title}</title>
    <meta http-equiv="Content-Encoding" content="gzip" />
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <link rel="stylesheet" href="../themes/agenda.css" type="text/css" media="ALL" />
    <link rel="stylesheet" href="../themes/intranet.css" type="text/css" media="ALL" />
    <!-- this part is for adicional css, from externals libs -->
    <opt:section name="css">
    <opt:include view="$css" />
    </opt:section>
    <script type="text/javascript" src="../js/commonfunctions.js"></script>
    <!-- this part is for adicional javascript, externals libs -->
    <opt:section name="js">
    <opt:include view="$js" />
    </opt:section>
</head>
<body class="BodyProbrax">
    <!-- this part is page content area, all others tenplate are add here -->
<opt:section name="main">
    <opt:include from="main"><p class="error">Sorry, the requested module view could not be loaded.</p></opt:include>
</opt:section>
</body>
</html>
</opt:root>

This template is ok ?

How to do this, in the best way?

Thanks in advance
« Last Edit: April 28, 2009, 07:25:23 by eXtreme » Logged
eXtreme
Invenzzia
Administrator
User
*****
Offline Offline

Posts: 129

Jacek Jędrzejewski


View Profile WWW
« Reply #1 on: April 28, 2009, 07:30:17 »

Looks OK. The only thing is that you should change your DTD to:
Code:
<opt:dtd template="xhtml10strict"/>
Logged

Zyx
Your programmer
Administrator
User
*****
Offline Offline

Posts: 291



View Profile WWW
« Reply #2 on: April 28, 2009, 08:41:39 »

Doctype, as eXtreme said + I would also change the code for CSS and JS - do you really need to create external templates for them? In my code, I hard-code them manually, or if they need to be chosen dynamically, I prefer:

Code:
<opt:section name="js">
<link rel="stylesheet" parse:href="$js.filename" type="text/css" />
</opt:section>
Logged

PozDrX, Zyx
---Invenzzia group---
amichelin
User

Offline Offline

Posts: 10


View Profile
« Reply #3 on: April 28, 2009, 11:45:06 »

I need, becouse some page has more css.

This two  are for all the page :
<link rel="stylesheet" href="../themes/agenda.css" type="text/css" media="ALL" />
<link rel="stylesheet" href="../themes/intranet.css" type="text/css" media="ALL" />

When i use extjs i include :

<link rel="stylesheet" href="../js/ext/resources/css/ext-all.css" type="text/css" />

When i need to print :

<link rel="stylesheet" href="../themes/impressao.css" type="text/css" media="print"/>

Logged
Zyx
Your programmer
Administrator
User
*****
Offline Offline

Posts: 291



View Profile WWW
« Reply #4 on: April 28, 2009, 12:38:19 »

I understand. For me, creating separate templates just for the LINK tag is quite strange, but if you wish to add new CSS sets, this is a correct solution. However, below I suggest another way to achieve similar effect that does not require to include so many templates:

Code:
<opt:selector name="css">
  <opt:general>
    <link rel="stylesheet" href="../themes/agenda.css" type="text/css" media="ALL" />
    <link rel="stylesheet" href="../themes/intranet.css" type="text/css" media="ALL" />
  </opt:general>
  <opt:extjs>
    <link rel="stylesheet" href="../js/ext/resources/css/ext-all.css" type="text/css" />
  </opt:extjs>
  <opt:printable>
    <link rel="stylesheet" href="../themes/impressao.css" type="text/css" media="print"/>
  </opt:printable>
</opt:selector>

And the data:

Code:
$view->css = array(0 => array('item' => 'general'), array('item' => 'extjs'));

Depending on what you add to this array, the output result uses different number of CSS files, and everything is stored in only one template. If you need to use the same list across many templates, you can use the include attribute of opt:root and snippets.
Logged

PozDrX, Zyx
---Invenzzia group---
amichelin
User

Offline Offline

Posts: 10


View Profile
« Reply #5 on: April 28, 2009, 13:27:10 »

 Zyx, The code that you write is simples and i can add other css in the future. I will use the same code for js files.

the page need to be light weight becouse has many users and the responce time is very important.

The extjs library has 970kb in weight and i can not use  it in each page.
Logged
Pages: [1]   Go Up
  Print  
 
Jump to:  

Subject Started by Replies Views Last post
abercrombie, tail hair or waste products. In 1997 galardef 0 26 Last post May 05, 2012, 09:16:57
by galardef
abercrombie, due to fight the residue has become a fossil galardef 0 27 Last post May 04, 2012, 11:31:28
by galardef
Nike Free Norge,SARS is not terrible 14163 Kodkyssr30 0 1 Last post Yesterday at 08:31:16
by Kodkyssr30
OPT: wersja 1.1.5 w repozytorium gizmo 5 757 Last post September 15, 2009, 18:42:40
by gizmo
OPT 2 - problem z nagłowkami http / sesje zeus 11 2328 Last post May 20, 2009, 19:04:35
by Agares