Joomla Templates Club 406,261 posts

[jdponce Friend jdponceJoin date: October 2006Posts: 91Downloads:0Uploads:5 Thanks: 11]

#132932

Hi, I want to use the login form like Ja Helio in Ja Iris, It is possible?. I got another login module in user4 position but there’s no enough space, please help me with this. 🙂

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#268693

Hi jdponce !
it is posible , please copy mod_login folder in templates/ja_helio/html folder and paste to templates/ja_iris/html folder.

[Menalto Friend MenaltoJoin date: May 2007Posts: 4736Downloads:0Uploads:43 Thanks: 2 Thanked: 531 times in 361 posts]

#268738

And the css for it also and the images named in the css file, this is from 1.0.xx:

/* Login Form */
#ja-login {
position: absolute;
top: 25px;
right: 0;
}

#ja-login #login-wrap {
background: url(../images/login-bg.gif) no-repeat;
height: 22px;
width: 338px;
}

#logout-wrap form input.button {
font-size: 11px !important;
float: left;
color: #333333;
background: #CCCCCC !important;
border: 1px solid #B4B4B4 !important;
}

#ja-login form {
float: left;
}

#ja-login form label {
float: left;
}

label.ja-login-user span,
label.ja-login-password span {
display: none;
}

#ja-login form input.button {
font-size: 11px !important;
float: left;
background: none;
border: none;
}

#ja-login form #mod_login_username,
#ja-login form #mod_login_password {
width: 100px;
margin: 3px 0 0 22px;
font-size: 11px !important;
padding: 2px;
background: none;
border: none;
}

#ja-login form #mod_login_password {
margin: 3px 18px 0 35px;
}

#ja-login form a {
padding: 0 8px 0 13px;
text-decoration: none;
font-size: 10px;
background: url(../images/arrow.png) no-repeat left center;
}

#ja-login form a:hover,
#ja-login form a:active,
#ja-login form a:focus {
text-decoration: underline;
}

.ja-login-links {
display: block;
clear: both;
padding-top: 8px;
}

#mod_login_password, #mod_login_username {
width: 90%;
font-size: 11px !important;
padding: 2px;
}

#mod_login_username {
margin-bottom: 10px;
}


[jdponce Friend jdponceJoin date: October 2006Posts: 91Downloads:0Uploads:5 Thanks: 11]

#268760

Thanks, I’ll do it right now, but I forgot say I’m using Joomla 1.5.6, what should I change on css file?

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#268823

ah ! No problem. Please try and response for us.

[jdponce Friend jdponceJoin date: October 2006Posts: 91Downloads:0Uploads:5 Thanks: 11]

#268844

Hum, not is what I want… I want the horizontal login form of Ja Helio but on Ja Iris. I already copied the mod_login folder of Ja Helio to the html folder of Ja Iris, but I see the same module, please help me if I am wrong. I published it on user4 position and was a disaster!

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#268888

Hi jdponce !
what joomla version do you use ? please send url of your site !

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#269032

Hi jdponce !
this is full way for it , please do it step by step below :
1. Open index.php file in templates/ja_iris folder , find following code line at about line 67 :


<div id="ja-search">
<jdoc:include type="modules" name="user4" />
</div>


change to :


<div id="ja-login">
<jdoc:include type="modules" name="user4" />
</div>


2. go to admin >> extensions >> module manager >> assign login form to “user4” position . and disable search module .

3. Open template.css file in templates/ja_iris/css folder , add following code section to bottom of it :


/* Login Form */
#ja-login {
position: absolute;
top: 25px;
right: 0;
}

#ja-login #login-wrap {
background: url(../images/login-bg.gif) no-repeat;
height: 22px;
width: 333px;
}

#logout-wrap form input.button {
font-size: 11px !important;
float: left;
color: #333333;
background: #CCCCCC !important;
border: 1px solid #B4B4B4 !important;
}

#ja-login form {
float: left;
}

#ja-login form label {
float: left;
}

label.ja-login-user span,
label.ja-login-password span {
display: none;
}

#ja-login form input.button {
font-size: 11px !important;
float: left;
background: none;
border: none;
}

#ja-login form #mod_login_username,
#ja-login form #mod_login_password {
width: 100px;
margin: 3px 0 0 22px;
font-size: 11px !important;
padding: 2px;
background: none;
border: none;
}

#ja-login form #mod_login_password {
margin: 3px 18px 0 35px;
}

#ja-login form a {
padding: 0 8px 0 13px;
text-decoration: none;
font-size: 10px;
background: url(../images/arrow.png) no-repeat left center;
}

#ja-login form a:hover,
#ja-login form a:active,
#ja-login form a:focus {
text-decoration: underline;
}

.ja-login-links {
display: block;
clear: both;
padding-top: 8px;
}


continue , find following code sections in template.css file at about line 1430 and 1026 :


#ja-login {template_css.css (line 1430)
position:absolute;
right:0;
top:25px;
}



#ja-header {template_css.css (line 1026)
border-bottom:1px solid #CCCCCC;
height:80px;
line-height:normal;
padding:0;
position:relative;
text-align:left;
z-index:2;
}


change to :


#ja-login {template_css.css (line 1430)
position:absolute;
right:0;
top:55px;
}



#ja-header {template_css.css (line 1026)
border-bottom:1px solid #CCCCCC;
height:125px;
line-height:normal;
padding:0;
position:relative;
text-align:left;
z-index:2;
}


4.copy login-bg.gif file from templates/ja_helio/images folder to templates/ja_iris/images folder.

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#269033

this is image then i try to do 4 step obove in my local :
2736

1 user says Thank You to Sherlock for this useful post

1. jdponce

[jdponce Friend jdponceJoin date: October 2006Posts: 91Downloads:0Uploads:5 Thanks: 11]

#269145

Excellent! is done!, thanks hainn84, what a good help you gave me! thanks very much, this login form looks very nice in that position.

Thanks again.

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#269271

Ok jdponce !
i will mark this thread to “solved”.

[Author]

Posts