묻고답하기
염치없지만 ㅠㅠ 로그인,회원가입 질문좀...
2010.09.14 23:50
죄송하지만 제가 여기 레이아웃스킨 말고 그냥 드림위버로 페이지를 만들어 페이지랑 게시판을 달았는데요.
문제는 페이지맨위에 (로그인 회원가입 / 로그아웃 회원정보) 이렇게만 문자로
로그인이랑 회원가입을 연동하려는데 xe는 도통 어떻게해야할지 막막하네요 ㅠㅠ
초보입니다 ㅜㅜ layout.html 여기에다가 삽입해서 달려고 합니다.
메뉴 들어갈 부분과 하단에 어케해야하나요?
또 css 는 이름과 어케해야할지 모르겠네요
일단 공식스킨 filter 폴더 는 제 레이아웃 스킨에 통체로 가져다놨는데 이담부터가 막막해요 ㅠㅠ
시간나시면 친절히 초보를위해 답변 부탁드립니다.ㅜㅜ
댓글 2
-
mindpainter
2010.09.16 11:33
공식사이트 처럼 로그인 버튼을 누르면 브라우저 전체에 로그인창이 나타나는 방식입니다. 1. 자료실에서 XE Official Ver2 레이아웃 스킨을 다운받으세요. 2. layout.html 파일을 엽니다. 37번 줄 부터 몇줄 아래까지가 로그인과 관련된 내용입니다. 로그인과 회원가입만 그대로 링크 걸어주세요. 보실줄 모르시면 다시 질문주시구요.. 3.layout.html 문서의 230번째 줄부터 제일 끝까지를 복사해서 본인 layout.html문서 제일 하단에 붙여넣기 합니다. 4.css/layout@official.css 파일의 238번째 줄부터 제일 끝까지를 복사해서 본인의 css파일에 붙여넣기 합니다. css 파일 하단부에 /* modalWindow */라고 주석이 붙어있는 부분. 5.img/bgLoginText.gif, bgOpenidText.gif, buttonLoginAction.gif, buttonCloseX.gif 총 4개를 본인 레이아웃의 img폴더에 복사합니다. 6. filter 폴더 통째로 복사합니다. 성공하시길 바랍니다. ^^;; -
셋쇼마루^^
2010.09.16 12:24
일단 답변 감사드립니다 ㅜㅜ 근데 죄송하지만 이미지로 바뀌는 방법말고 그냥 문자Text로 로그인 회원가입 / 로그아웃 회원정보 이렇게 바뀌게하고싶어요 ㅠ 제가 php쪽이나 자바스크립트 쪽에 좀약해서요 ㅠㅠ 37번째줄부터 어디까지인지 잘모르겟네요 ㅜㅜ죄송합니다. -
mindpainter
2010.09.16 19:03
앞 답글에 언급된 이미지는 로그인 버튼이미지가 아니라 로그인 창이 열렸을때 보이는 로그인버튼과 창닫기 버튼등입니다. - 여기 사이트 참조 앞 답글 넘버링 순서대로 답변 추가합니다. 2. <!--@if($is_logged)-->
<a href="{getUrl('act','dispMemberLogout')}">로그아웃</a><a href="{getUrl('act','dispMemberInfo')}">회원정보</a>
<!--@else-->
<a href="#loginWindow" onclick="jQuery('#loginWindow').css('display','block');" accesskey="L">로그인</a><a href="{getUrl('act','dispMemberSignUpForm')}">회원가입</a>
<!--@end--> 3. <!--@if(!$is_logged)-->
{@ $member_config = MemberModel::getMemberConfig(); }
<!--%import("./filter/login.xml")-->
<!--@if($member_config->enable_openid=='Y')--><!--%import("./filter/openid_login.xml")--><!--@end-->
<!-- loginWindow -->
<div id="loginWindow" class="loginWindow">
<!-- class="loginWindow" | class="loginWindow open" -->
<span class="modalWindow"></span>
<div id="loginLayer" class="loginLayer loginTypeA">
<!-- class="loginLayer loginTypeA" | class="loginLayer loginTypeB" -->
<button type="button" class="close" onclick="document.getElementById('loginWindow').style.display='none'" accesskey="X"><span>Close Login Layer</span></button>
<form action="" method="post" class="typeA" id="commonLogin" onsubmit="return procFilter(this, login)">
<fieldset>
<legend>XE Login</legend>
<dl>
<dt><label for="uid">{$lang->user_id}</label></dt>
<dd><input name="user_id" type="text" class="inputText" id="uid" /></dd>
<dt><label for="upw">{$lang->password}</label></dt>
<dd><input name="password" type="password" class="inputText" id="upw" /></dd>
</dl>
<p class="keep"><input name="keep_signed" type="checkbox" id="keepA" value="Y" class="inputCheck" onclick="if(this.checked) return confirm('{$lang->about_keep_signed}');"/><label for="keepA">{$lang->keep_signed}</label></p>
<span class="loginButton"><input name="" type="submit" value="{$lang->cmd_login}" /></span>
</fieldset>
</form>
<!--@if($member_config->enable_openid=='Y')-->
<form action="./" method="post" class="typeB" id="openidLogin" onsubmit="return procFilter(this, openid_login)">
<fieldset>
<legend>OpenID Login</legend>
<dl>
<dt><label for="oid">Open ID</label></dt>
<dd><input name="openid" type="text" class="inputText" id="oid" /></dd>
</dl>
<span class="loginButton"><input name="" type="submit" value="{$lang->cmd_login}" /></span>
</fieldset>
</form>
<!--@end-->
<ul class="help">
<li class="join"><a href="{getUrl('act','dispMemberSignUpForm')}">{$lang->cmd_signup}</a></li>
<li class="find"><a href="{getUrl('act','dispMemberFindAccount')}">{$lang->cmd_find_member_account}</a></li>
<li class="find"><a href="{getUrl('act','dispMemberResendAuthMail')}">{$lang->cmd_resend_auth_mail}</a></li>
<!--@if($member_config->enable_openid=='Y')-->
<li class="typeA"><a href="#openidLogin" onclick="document.getElementById('loginLayer').className='loginLayer loginTypeB'">OpenID</a></li>
<li class="typeB"><a href="#commonLogin" onclick="document.getElementById('loginLayer').className='loginLayer loginTypeA'">OpenID</a></li>
<!--@end-->
</ul>
<button type="button" class="close" onclick="document.getElementById('loginWindow').style.display='none'" accesskey="X"><span>Close Login Layer</span></button>
</div>
</div>
<!-- /loginWindow -->
<!--@end--> 4. /* modalWindow */
.loginWindow{ display:none; position:fixed; left:0; top:0; _position:absolute; width:100%; height:100%; z-index:100;}
.loginWindow.open{ display:block;}
.loginWindow .modalWindow{ display:block; position:fixed; border:0; left:0; top:0; _position:absolute; width:100%; height:100%; background:#000; opacity:.3; filter:alpha(opacity:30);}
.loginWindow .loginLayer{ position:absolute; width:289px; top:120px; left:50%; padding:30px; border:2px solid #737373; margin:0 0 0 -175px; background:#fff;}
.loginWindow .loginLayer form{ display:none; *zoom:1; margin:0 0 29px 0;}
.loginWindow .loginLayer form:after{ content:""; display:block; clear:both;}
.loginWindow .loginLayer form legend{ position:absolute; width:0; height:0; overflow:hidden; font-size:0; line-height:0; visibility:hidden;}
.loginWindow .loginLayer fieldset{ border:0; margin:0; padding:0;}
.loginWindow .loginLayer.loginTypeA form.typeA,
.loginWindow .loginLayer.loginTypeB form.typeB{ display:block;}
.loginWindow .loginLayer dl{ margin:0; padding:0 0 1px 0;}
.loginWindow .loginLayer dt{ font-size:12px; font-weight:bold; color:#868d95; margin:0 0 2px 0;}
.loginWindow .loginLayer dd{ margin:0 0 21px 0;}
.loginWindow .loginLayer .inputText{ width:269px; height:31px; padding:6px 9px 0 9px; border:1px solid #ddd; font:20px Tahoma; color:#333;}
.loginWindow .loginLayer .inputText:focus{ background-color:#fbfbfb;}
.loginWindow .loginLayer .inputCheck{ margin:0 3px 0 0; width:13px; height:13px; vertical-align:middle;}
.loginWindow .loginLayer.loginTypeA .inputText{ background-image:url(../img/bgLoginText.gif)undefined; background-repeat:no-repeat; background-position:right top;}
.loginWindow .loginLayer.loginTypeB .inputText{ background-image:url(../img/bgOpenidText.gif)undefined; background-repeat:no-repeat; background-position:right top; padding:6px 9px 0 35px; width:243px;}
.loginWindow .loginLayer .keep{ margin:0; float:left; font-size:11px; line-height:normal; white-space:nowrap;}
.loginWindow .loginLayer .keep label{ color:#555;}
.loginWindow .loginLayer .loginButton,
.loginWindow .loginLayer .loginButton input{ position:relative; border:0; color:#fff; font-size:12px; font-weight:bold; display:inline-block; height:36px; line-height:36px; background-color:transparent; background-image:url(../img/buttonLoginAction.gif)undefined; background-repeat:no-repeat; overflow:visible;}
.loginWindow .loginLayer .loginButton{ float:right; background-position:0 0; right:11px;}
.loginWindow .loginLayer .loginButton input{ left:11px; background-position:right 0; padding:0 30px 0 45px; cursor:pointer;}
.loginWindow .loginLayer .help{ margin:0 -30px -30px -30px; padding:14px 0; list-style:none; text-align:center; background:#fafafa; border-top:1px solid #f2f2f2;}
.loginWindow .loginLayer .help li{ display:inline; font-size:11px; line-height:11px; padding:0 0 0 5px;}
.loginWindow .loginLayer .help li.join{ font-weight:bold;}
.loginWindow .loginLayer .help li.find{ border-left:1px solid #b3b3b3;}
.loginWindow .loginLayer .help li.typeA,
.loginWindow .loginLayer .help li.typeB{ display:none; border-left:1px solid #b3b3b3;}
.loginWindow .loginLayer.loginTypeA .help li.typeA,
.loginWindow .loginLayer.loginTypeB .help li.typeB{ display:inline;}
.loginWindow .loginLayer .help li a{ text-decoration:none; color:#555;}
.loginWindow .loginLayer .help li a:hover,
.loginWindow .loginLayer .help li a:active,
.loginWindow .loginLayer .help li a:focus{ text-decoration:underline;}
.loginWindow .loginLayer .close{ position:absolute; cursor:pointer; border:0; padding:0; top:0; right:0; width:27px; height:27px; background:transparent url(../img/buttonCloseX.gif) no-repeat center center;}
.loginWindow .loginLayer .close span{ position:absolute; font-size:0; line-height:0; width:0; height:.; overflow:hidden; visibility:hidden;}
