1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"
lang="en" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<!-- metadata -->
<meta name="generator" content="Offline" />
<meta name="version" content="Offline 0.1" />
<!-- style sheet links -->
<link rel="stylesheet" media="all" type="text/css" href="../../../css/all.css" />
<link rel="stylesheet" media="screen" type="text/css" href="../../../css/screen.css" />
<link rel="stylesheet" media="print" type="text/css" href="../../../css/print.css" />
</head>
<body>
<div class="dokuwiki export">
<h1><a name="portal_customization" id="portal_customization">Portal customization</a></h1>
<div class="level1">
<p>
<p><div class="noteclassic">The portal is the visible part of LemonLDAP::NG, all user interactions are displayed on it.
</div></p>
</p>
</div>
<!-- SECTION "Portal customization" [1-142] -->
<h2><a name="skin" id="skin">Skin</a></h2>
<div class="level2">
<p>
LemonLDAP::NG is shipped with 3 skins:
</p>
<ul>
<li class="level1"><div class="li"> pastel</div>
</li>
<li class="level1"><div class="li"> impact</div>
</li>
<li class="level1"><div class="li"> dark</div>
</li>
</ul>
<p>
But you can make your own, see Skin customization below.
</p>
</div>
<!-- SECTION "Skin" [143-289] -->
<h3><a name="default_skin" id="default_skin">Default skin</a></h3>
<div class="level3">
<p>
You can change the default skin in Manager: <code>General Parameters</code> > <code>Portal</code> > <code>Customization</code> > <code>Default skin</code>.
</p>
<p>
<a href="/_detail/documentation/manager-portalskin.png?id=documentation%3A1.3%3Aportalcustom" class="media" title="documentation:manager-portalskin.png"><img src="../../../media/documentation/manager-portalskin.png" class="mediacenter" alt="" /></a>
</p>
</div>
<!-- SECTION "Default skin" [290-480] -->
<h3><a name="skin_rules" id="skin_rules">Skin rules</a></h3>
<div class="level3">
<p>
You might want to display different skin depending on the <acronym title="Uniform Resource Locator">URL</acronym> that was called before being redirected to the portal, or the <acronym title="Internet Protocol">IP</acronym> address of the user.
</p>
<p>
To achieve this, you can create a rule in the Manager: select <code>General Parameters</code> > <code>Portal</code> > <code>Customization</code> > <code>Skin display rules</code> on click on “New key”. Then fill the two fields;
</p>
<ul>
<li class="level1"><div class="li"> <strong>Rule</strong>: a <acronym title="Practical Extraction and Report Language">Perl</acronym> expression (you can use %ENV hash to get environment variables, or $_url to get <acronym title="Uniform Resource Locator">URL</acronym> called before redirection, or $ipAddr to use user <acronym title="Internet Protocol">IP</acronym> address). If the rule evaluation is true, the corresponding skin is applied.</div>
</li>
<li class="level1"><div class="li"> <strong>Skin</strong>: the name of the skin to use.</div>
</li>
</ul>
</div>
<!-- SECTION "Skin rules" [481-1123] -->
<h3><a name="skin_files" id="skin_files">Skin files</a></h3>
<div class="level3">
<p>
A skin is composed of different files:
</p>
<ul>
<li class="level1"><div class="li"> <strong>.tpl</strong>: <acronym title="Practical Extraction and Report Language">Perl</acronym> <acronym title="HyperText Markup Language">HTML</acronym>::Template files, for <acronym title="HyperText Markup Language">HTML</acronym> content</div>
</li>
<li class="level1"><div class="li"> <strong>.css</strong>: <acronym title="Cascading Style Sheets">CSS</acronym> (styles)</div>
</li>
<li class="level1"><div class="li"> <strong>.js</strong>: Javascript</div>
</li>
<li class="level1"><div class="li"> images and other media files</div>
</li>
</ul>
<p>
A skin will often refer to the <code>common</code> skin, which is not a real skin, but shared skin objects (like scripts, images and <acronym title="Cascading Style Sheets">CSS</acronym>).
</p>
</div>
<!-- SECTION "Skin files" [1124-1458] -->
<h3><a name="skin_customization" id="skin_customization">Skin customization</a></h3>
<div class="level3">
<p>
<p><div class="noteimportant">If you modify directly the skin files, your modifications will certainly be erased on the next upgrade.
</div></p>
</p>
<p>
To customize a skin, the simplest way is to create a new skin folder:
</p>
<pre class="code">
cd portal/skins
mkdir myskin
mkdir myskin/css
mkdir myskin/images
</pre>
<p>
Then create symbolic links on template files, as you might not want to rewrite all <acronym title="HyperText Markup Language">HTML</acronym> code (else, do as you want).
</p>
<pre class="code">
cd myskin
ln -s ../pastel/*.tpl .
</pre>
<p>
We include some template files that can be customized:
</p>
<ul>
<li class="level1"><div class="li"> customhead.tpl : <acronym title="HyperText Markup Language">HTML</acronym> header markups (like <acronym title="Cascading Style Sheets">CSS</acronym>, js inclusion)</div>
</li>
<li class="level1"><div class="li"> customheader.tpl : <acronym title="HyperText Markup Language">HTML</acronym> code int the header div</div>
</li>
<li class="level1"><div class="li"> customfooter.tpm : <acronym title="HyperText Markup Language">HTML</acronym> code in the footer div</div>
</li>
</ul>
<p>
To use custom files, delete links and copy them into your skin folder:
</p>
<pre class="code">
rm custom*
cp ../pastel/custom* .
</pre>
<p>
Then you <em>only</em> have to write <code>myskin/css/styles.css</code> and add your media to <code>myskin/images</code>. Put all custom <acronym title="HyperText Markup Language">HTML</acronym> code in the custom template files.
</p>
<p>
To configure your new skin in Manager, select the custom skin, and enter your skin name in the configuration field.
</p>
</div>
<!-- SECTION "Skin customization" [1459-2553] -->
<h3><a name="error_messages" id="error_messages">Error messages</a></h3>
<div class="level3">
<p>
Error messages are defined in source code. If they really do not please you, override them! You just need to know the ID of the error (look at Portal/Simple.pm) and then add to <code>lemonldap-ng.ini</code>:
</p>
<pre class="code file ini"><span class="re0"><span class="br0">[</span>portal<span class="br0">]</span></span>
# Custom error messages
<span class="re1">error_0</span> <span class="sy0">=</span><span class="re2"> Big brother is watching you, authenticated user</span></pre>
</div>
<!-- SECTION "Error messages" [2554-2891] -->
<h3><a name="template_parameters" id="template_parameters">Template parameters</a></h3>
<div class="level3">
<p>
Template parameters are defined in source code. If you need to add a template parameter for your customization, then add to <code>lemonldap-ng.ini</code>:
</p>
<pre class="code file ini"><span class="re0"><span class="br0">[</span>portal<span class="br0">]</span></span>
# Custom template parameters
<span class="re1">tpl_myparam</span> <span class="sy0">=</span><span class="re2"> world</span></pre>
<p>
Then you will be able to use it in your template like this:
</p>
<pre class="code file html4strict">Hello <span class="sc2"><TMPL_VAR <span class="kw3">NAME</span><span class="sy0">=</span><span class="st0">"myparam"</span>></span>!</pre>
</div>
<!-- SECTION "Template parameters" [2892-3262] -->
<h2><a name="other_parameters" id="other_parameters">Other parameters</a></h2>
<div class="level2">
<ul>
<li class="level1"><div class="li"> <strong>Auto complete</strong>: allow the browser to remember the password (for password based authentication backends)</div>
</li>
<li class="level1"><div class="li"> <strong>Check last logins</strong>: displays a checkbox on login form, allowing user to check his login history right after opening session</div>
</li>
<li class="level1"><div class="li"> <strong>User attribute</strong>: which session attribute will be used to display <code>Connected as</code> in the menu</div>
</li>
<li class="level1"><div class="li"> <strong>New window</strong>: open menu links in new window</div>
</li>
<li class="level1"><div class="li"> <strong>Anti iframe protection</strong>: will kill parent frames to avoid some well known attacks</div>
</li>
<li class="level1"><div class="li"> <strong>Password Management</strong>:</div>
<ul>
<li class="level2"><div class="li"> <strong>Reset password</strong>: display a link to <a href="../../documentation/1.3/resetpassword.html" class="wikilink1" title="documentation:1.3:resetpassword">reset a password</a> (for password based authentication backends)</div>
</li>
<li class="level2"><div class="li"> <strong>Require old password</strong>: used only in the password changing module of the menu, will check the old password before updating it</div>
</li>
<li class="level2"><div class="li"> <strong>Hide old password</strong>: used only if the password need to be reset by the user (<acronym title="Lightweight Directory Access Protocol">LDAP</acronym> password policy), will hide the old password input</div>
</li>
<li class="level2"><div class="li"> <strong>Send mail on password change</strong>: send a mail if the password is changed from the Menu, or from forced password reset (<acronym title="Lightweight Directory Access Protocol">LDAP</acronym> password policy)</div>
</li>
</ul>
</li>
</ul>
<p>
<p><div class="noteimportant">If you enable auto completion, authentication level will be decreased (-1) as you do not ask the user to type its password (it could be in browser passwords wallet).
</div></p>
</p>
</div>
<!-- SECTION "Other parameters" [3263-] --></div><!-- closes <div class="dokuwiki export">-->
|
