lemonldap-ng/doc/pages/documentation/current/portalcustom.html
Xavier Guimard 8af300995c Update doc
2018-03-08 13:29:31 +01:00

312 lines
14 KiB
HTML

<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8" />
<title>documentation:2.0:portalcustom</title>
<meta name="generator" content="DokuWiki"/>
<meta name="robots" content="index,follow"/>
<meta name="keywords" content="documentation,2.0,portalcustom"/>
<link rel="search" type="application/opensearchdescription+xml" href="lib/exe/opensearch.html" title="LemonLDAP::NG"/>
<link rel="start" href="portalcustom.html"/>
<link rel="contents" href="portalcustom.html" title="Sitemap"/>
<link rel="stylesheet" type="text/css" href="lib/exe/css.php.t.bootstrap3.css"/>
<!-- //if:usedebianlibs
<link rel="stylesheet" type="text/css" href="/javascript/bootstrap/css/bootstrap.min.css" />
//elsif:useexternallibs
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"></script>
//elsif:cssminified
<link rel="stylesheet" type="text/css" href="/static/bwr/bootstrap/dist/css/bootstrap.min.css" />
//else -->
<link rel="stylesheet" type="text/css" href="/static/bwr/bootstrap/dist/css/bootstrap.css" />
<!-- //endif -->
<script type="text/javascript">/*<![CDATA[*/var NS='documentation:2.0';var JSINFO = {"id":"documentation:2.0:portalcustom","namespace":"documentation:2.0"};
/*!]]>*/</script>
<script type="text/javascript" charset="utf-8" src="lib/exe/js.php.t.bootstrap3.js"></script>
<!-- //if:usedebianlibs
<script type="text/javascript" src="/javascript/jquery/jquery.min.js"></script>
//elsif:useexternallibs
<script type="text/javascript" src="http://code.jquery.com/jquery-2.2.0.min.js"></script>
//elsif:jsminified
<script type="text/javascript" src="/static/bwr/jquery/dist/jquery.min.js"></script>
//else -->
<script type="text/javascript" src="/static/bwr/jquery/dist/jquery.js"></script>
<!-- //endif -->
<!-- //if:usedebianlibs
<script type="text/javascript" src="/javascript/jquery-ui/jquery-ui.min.js"></script>
//elsif:useexternallibs
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script>
//elsif:jsminified
<script type="text/javascript" src="/static/bwr/jquery-ui/jquery-ui.min.js"></script>
//else -->
<script type="text/javascript" src="/static/bwr/jquery-ui/jquery-ui.js"></script>
<!-- //endif -->
</head>
<body>
<div class="dokuwiki export container">
<!-- TOC START -->
<div id="dw__toc">
<h3 class="toggle">Table of Contents</h3>
<div>
<ul class="toc">
<li class="level1"><div class="li"><a href="#skin">Skin</a></div>
<ul class="toc">
<li class="level2"><div class="li"><a href="#default_skin">Default skin</a></div></li>
<li class="level2"><div class="li"><a href="#skin_background">Skin background</a></div></li>
<li class="level2"><div class="li"><a href="#skin_rules">Skin rules</a></div></li>
<li class="level2"><div class="li"><a href="#skin_files">Skin files</a></div></li>
<li class="level2"><div class="li"><a href="#skin_customization">Skin customization</a></div></li>
<li class="level2"><div class="li"><a href="#messages">Messages</a></div></li>
<li class="level2"><div class="li"><a href="#template_parameters">Template parameters</a></div></li>
</ul>
</li>
<li class="level1"><div class="li"><a href="#buttons">Buttons</a></div></li>
<li class="level1"><div class="li"><a href="#password_management">Password management</a></div></li>
<li class="level1"><div class="li"><a href="#other_parameters">Other parameters</a></div></li>
</ul>
</div>
</div>
<!-- TOC END -->
<h1 class="sectionedit1" id="portal_customization">Portal customization</h1>
<div class="level1">
<div class="noteclassic">The portal is the visible part of LemonLDAP::NG, all user interactions are displayed on it.
</div>
</div>
<!-- EDIT1 SECTION "Portal customization" [1-142] -->
<h2 class="sectionedit2" id="skin">Skin</h2>
<div class="level2">
<p>
LemonLDAP::NG is shipped with 4 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>
<li class="level1"><div class="li"> bootstrap</div>
</li>
</ul>
<div class="notetip">It is recommended to use <code>bootstrap</code> skin, as other may be deprecated in the future.
</div>
<p>
But you can make your own, see Skin customization below.
</p>
</div>
<!-- EDIT2 SECTION "Skin" [143-408] -->
<h3 class="sectionedit3" id="default_skin">Default skin</h3>
<div class="level3">
<p>
You can change the default skin in Manager: <code>General Parameters</code> &gt; <code>Portal</code> &gt; <code>Customization</code> &gt; <code>Default skin</code>.
</p>
<p>
Select the <code>Custom</code> skin, then set the name of the skin you want to use in the input below.
</p>
</div>
<!-- EDIT3 SECTION "Default skin" [409-648] -->
<h3 class="sectionedit4" id="skin_background">Skin background</h3>
<div class="level3">
<p>
Go in <code>General Parameters</code> &gt; <code>Portal</code> &gt; <code>Customization</code> &gt; <code>Skin background</code>. You can define a background by selecting one of the available image. Use <code>None</code> to use the default skin background configuration.
</p>
<p>
<img src="documentation/manager-skin-background.png" class="mediacenter" alt="" />
</p>
</div>
<!-- EDIT4 SECTION "Skin background" [649-950] -->
<h3 class="sectionedit5" id="skin_rules">Skin rules</h3>
<div class="level3">
<p>
You might want to display different skin depending on the <abbr title="Uniform Resource Locator">URL</abbr> that was called before being redirected to the portal, or the <abbr title="Internet Protocol">IP</abbr> address of the user.
</p>
<p>
To achieve this, you can create a rule in the Manager: select <code>General Parameters</code> &gt; <code>Portal</code> &gt; <code>Customization</code> &gt; <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 Perl expression (you can use %ENV hash to get environment variables, or $_url to get <abbr title="Uniform Resource Locator">URL</abbr> called before redirection, or $ipAddr to use user <abbr title="Internet Protocol">IP</abbr> 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>
<!-- EDIT5 SECTION "Skin rules" [951-1593] -->
<h3 class="sectionedit6" id="skin_files">Skin files</h3>
<div class="level3">
<p>
A skin is composed of different files:
</p>
<ul>
<li class="level1"><div class="li"> <strong>.tpl</strong>: Perl <abbr title="HyperText Markup Language">HTML</abbr>::Template files, for <abbr title="HyperText Markup Language">HTML</abbr> content</div>
</li>
<li class="level1"><div class="li"> <strong>.css</strong>: <abbr title="Cascading Style Sheets">CSS</abbr> (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 <abbr title="Cascading Style Sheets">CSS</abbr>).
</p>
</div>
<!-- EDIT6 SECTION "Skin files" [1594-1928] -->
<h3 class="sectionedit7" id="skin_customization">Skin customization</h3>
<div class="level3">
<div class="noteimportant">If you modify directly the skin files, your modifications will certainly be erased on the next upgrade. The best is to create your own skin, based on an existing skin.
</div>
<p>
Here we explain how to create a new skin, named <code>myskin</code>, from the <code>bootstrap</code> skin.
</p>
<pre class="code">cd /usr/share/lemonldap-ng/portal-skins/
mkdir myskin
cd myskin/
cp -a ../bootstrap/fonts/ .
cp -a ../bootstrap/js/ .
cp -a ../bootstrap/css/ .
mkdir images</pre>
<p>
Then create symbolic links on template files, as you might not want to rewrite all <abbr title="HyperText Markup Language">HTML</abbr> code (else, do as you want).
</p>
<pre class="code">ln -s ../bootstrap/*.tpl .</pre>
<p>
We include some template files that can be customized:
</p>
<ul>
<li class="level1"><div class="li"> customhead.tpl : <abbr title="HyperText Markup Language">HTML</abbr> header markups (like <abbr title="Cascading Style Sheets">CSS</abbr>, js inclusion)</div>
</li>
<li class="level1"><div class="li"> customheader.tpl : <abbr title="HyperText Markup Language">HTML</abbr> code int the header div</div>
</li>
<li class="level1"><div class="li"> customfooter.tpm : <abbr title="HyperText Markup Language">HTML</abbr> 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 -f custom*
cp ../bootstrap/custom* .</pre>
<p>
Create a symlink in main skin directory:
</p>
<pre class="code">ln -s /usr/share/lemonldap-ng/portal-skins/myskin /var/lib/lemonldap-ng/portal/skins/</pre>
<p>
Then you <em>only</em> have to edit JS/<abbr title="Cascading Style Sheets">CSS</abbr> and add your media to <code>myskin/images</code>. Put all custom <abbr title="HyperText Markup Language">HTML</abbr> 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>
<!-- EDIT7 SECTION "Skin customization" [1929-3319] -->
<h3 class="sectionedit8" id="messages">Messages</h3>
<div class="level3">
<p>
Messages are defined in source code. If they really do not please you, override them! You just need to know the ID of the message (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">&#91;</span>portal<span class="br0">&#93;</span></span>
&nbsp;
# Custom error messages
<span class="re1">error_0</span> <span class="sy0">=</span><span class="re2"> Big brother is watching you, authenticated user</span>
&nbsp;
# Custom standard messages
<span class="re1">msg_22</span> <span class="sy0">=</span><span class="re2"> Your last connections</span></pre>
<div class="notetip">You can alse define messages in several languages:
<pre class="code file ini"><span class="re0"><span class="br0">&#91;</span>portal<span class="br0">&#93;</span></span>
<span class="re1">error_en_0</span> <span class="sy0">=</span><span class="re2"> Big brother is watching you, authenticated user</span>
<span class="re1">error_fr_0</span> <span class="sy0">=</span><span class="re2"> Souriez vous êtes surveillés !</span></pre>
</div>
</div>
<!-- EDIT8 SECTION "Messages" [3320-3911] -->
<h3 class="sectionedit9" id="template_parameters">Template parameters</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">&#91;</span>portal<span class="br0">&#93;</span></span>
&nbsp;
# 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">&lt;TMPL_VAR <span class="kw3">NAME</span><span class="sy0">=</span><span class="st0">&quot;myparam&quot;</span>&gt;</span>!</pre>
</div>
<!-- EDIT9 SECTION "Template parameters" [3912-4282] -->
<h2 class="sectionedit10" id="buttons">Buttons</h2>
<div class="level2">
<p>
This node allows one to enable/disable buttons on the login page:
</p>
<ul>
<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>Reset password</strong>: display a link to <a href="resetpassword.html" class="wikilink1" title="documentation:2.0:resetpassword">reset your password page</a> (for password based authentication backends)</div>
</li>
<li class="level1"><div class="li"> <strong>Register</strong>: display a link to <a href="register.html" class="wikilink1" title="documentation:2.0:register">register page</a> (for password based authentication backends)</div>
</li>
</ul>
</div>
<!-- EDIT10 SECTION "Buttons" [4283-4740] -->
<h2 class="sectionedit11" id="password_management">Password management</h2>
<div class="level2">
<ul>
<li class="level1"><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="level1"><div class="li"> <strong>Hide old password</strong>: used only if the password need to be reset by the user (LDAP password policy), will hide the old password input</div>
</li>
<li class="level1"><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 (LDAP password policy)</div>
</li>
</ul>
</div>
<!-- EDIT11 SECTION "Password management" [4741-5191] -->
<h2 class="sectionedit12" id="other_parameters">Other parameters</h2>
<div class="level2">
<ul>
<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>Ping interval</strong>: Number of milliseconds between each ping (Ajax request) on the portal menu. Set to 0 to dismiss checks.</div>
</li>
<li class="level1"><div class="li"> <strong>Show error on expired session</strong>: Display the error “Session expired”, which stops the authentication process. This is enabled by default but can be disabled to prevent transparent authentication (like SSL or Kerberos) to be stopped.</div>
</li>
<li class="level1"><div class="li"> <strong>Show error on mail not found</strong>: Display error if provided mail is not found in password reset by mail process. Disabled by default to prevent mail enumeration from this page.</div>
</li>
</ul>
</div>
<!-- EDIT12 SECTION "Other parameters" [5192-] --></div>
</body>
</html>