108
Ok i would like to integrate the login bar from wox theme...as can be seen here in xoops.org to my theme.....
here's what i did
1. downloaded the wox theme from svn
http://xoops.svn.sourceforge.net/viewvc/xoops/XoopsThemes/wox.tar.gz?view=tar2. copy this code from wox\tpls\content.html to my current theme.html
<div id="top-links-container">
<div class="login_links" id="wox-login-all">
<div class="wox_search">
<img src="<{$xoops_imageurl}>images/srh.png" alt="" />
<input type="text" name="keyword" value="Search here..." id="wox-searchi" />
div>
<div class="the_links">
<{if $xoops_isuser}>
<span class="icons">
<a href="<{$xoops_url}>/viewpmsg.php" title="Private Messages"><img src="<{$xoops_imageurl}>images/email.png" alt="Messages" />a>
<a href="<{$xoops_url}>/notifications.php" title="Notifications"><img src="<{$xoops_imageurl}>images/alerts.png" alt="Notifications" />a>
span>
<a href="<{$xoops_url}>/user.php?op=logout">Logouta> |
Welcome back <strong><a href="<{$xoops_url}>/user.php"><{$xoops_uname}>a>strong> |
<{else}>
<a href="<{$xoops_url}>/modules/profile/register.php">Registera> | <a href="javascript:;" id="wox-login-link">Logina>
<{/if}>
div>
div>
<{if !$xoops_isuser}>
<div class="login_links" id="wox-login-login" style="display: none;">
<form action="<{$xoops_url}>/user.php" method="post" id="wox-login-form">
<label for="uname">User:label>
<input type="text" name="uname" id="uname" />
<label for="pass">Password:label>
<input type="password" name="pass" id="pass" />
<input name="op" value="login" type="hidden">
<input type="hidden" name="xoops_redirect" value="<{$xoops_requesturi}>" />
<input type="hidden" name="xoops_login" value="1" />
<a href="javascript:;" onclick="$('#wox-login-form').submit();">Logina>
<a href="javascript:;" id="wox-cancel-login">Cancela>
form>
div>
<{/if}>
div>
3. copy the css class from wox\css\general.css to my theme css stylesheet
/* Login Links */
div#top-links-container{
overflow: hidden;
width: 950px;
margin: 0 auto;
height: 32px;
}
div#top-links-container div.login_links{
float: right;
background: #D6DEE4;
height: 22px;
text-align: center;
font-size: 0.9em;
padding: 4px 15px 6px 5px;
color: #213A4E;
-moz-border-radius: 0 0 8px 8px;
-khtml-border-radius-bottomleft: 8px;
-khtml-border-radius-bottomright: 8px;
-webkit-border-bottom-left-radius: 8px;
-webkit-border-bottom-right-radius: 8px;
border-radius: 0 0 8px 8px;
overflow: hidden;
*width: 420px;
}
div.login_links div.wox_search{
float: left;
border: 1px solid #CCC;
overflow: hidden;
background: #FFF;
-moz-border-radius: 8px;
-khtml-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
padding-right: 5px;
*width: 160px;
}
div.login_links input[type='text'],
div.login_links input[type='password']{
border: 0;
background: #FFF;
width: 130px;
padding: 3px;
-moz-border-radius: 8px;
-khtml-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
color: #666;
}
div.login_links input[type='submit']{
display: block;
float: right;
border: 0;
background: #D6DEE4;
text-decoration: underline;
color: #213A4E;
cursor: pointer;
}
div.login_links div.wox_search img{
cursor: pointer;
float: right;
padding-top: 4px;
}
div.login_links div.the_links{
float: right;
padding: 4px 0 0 10px;
}
div#top-links-container a{
color: #213A4E;
text-decoration: none;
}
div#top-links-container a:hover{
text-decoration: underline;
}
div#top-links-container span.icons{
display: block;
float: right;
margin-left: 5px;
margin-top: -1px;
}
4. copy wox theme jquery definition in wox\theme.html to my current theme.html
<script type="text/javascript" src="<{xoImgUrl js/jquery-1.3.2.min.js}>">script>
<script type="text/javascript" src="<{xoImgUrl js/jquery-ui-1.7.2.custom.min.js}>">script>
<script type="text/javascript" src="<{xoImgUrl js/effects.js?ver=1.01}>">script>
<script type="text/javascript" src="<{xoImgUrl js/jquery.cookie.js}>">script>
the login bar appear in my theme but when i click login..nothing happens...
what am i missing ?
btw does anyone know if there is any other cool login bar for XOOPS from other themes ? please let me know..
TQ
