부트스트랩 폰트어썸 캡챠(kcaptcha) 적용
부트스트랩 반응형 적용하다보면 자동등록방지 캡차 이미지가 애매하더군요.
그누보드 원본파일 수정하기 싫었으나, 어쩔수 없었네요
아래 코드처럼 수정하시면 됩니다.
부트스트랩, 폰트어썸 적용했습니다.
수정파일 : /plugin/kcapcha/kcaptcha.lib.php
[code]
// 캡챠 HTML 코드 출력
/*
function captcha_html($class="captcha")
{
if(is_mobile())
$class .= ' m_captcha';
$html .= "\n".'<script>var g5_captcha_url = "'.G5_CAPTCHA_URL.'";</script>';
//$html .= "\n".'<script>var g5_captcha_path = "'.G5_CAPTCHA_PATH.'";</script>';
$html .= "\n".'<script src="'.G5_CAPTCHA_URL.'/kcaptcha.js"></script>';
$html .= "\n".'<fieldset id="captcha" class="'.$class.'">';
$html .= "\n".'<legend><label for="captcha_key">자동등록방지</label></legend>';
if (is_mobile()) $html .= '<audio src="#" id="captcha_audio" controls></audio>';
//$html .= "\n".'<img src="#" alt="" id="captcha_img">';
$html .= "\n".'<img src="javascript:void(0);" alt="" id="captcha_img">';
if (!is_mobile()) $html .= "\n".'<button type="button" id="captcha_mp3"><span></span>숫자음성듣기</button>';
$html .= "\n".'<button type="button" id="captcha_reload"><span></span>새로고침</button>';
$html .= '<input type="text" name="captcha_key" id="captcha_key" required class="captcha_box required" size="6" maxlength="6">';
$html .= "\n".'<span id="captcha_info">자동등록방지 숫자를 순서대로 입력하세요.</span>';
$html .= "\n".'</fieldset>';
return $html;
}
*/
// bootstrap, fontawesome 적용 수정
function captcha_html()
{
$html .= "\n".'<script>var g5_captcha_url = "'.G5_CAPTCHA_URL.'";</script>';
$html .= "\n".'<script src="'.G5_CAPTCHA_URL.'/kcaptcha.js"></script>';
$html .= "\n".'<div style="border:0px; width:200px;">';
$html .= "\n".'<div class="pull-left"><img src="javascript:void(0);" alt="" id="captcha_img"></div>';
$html .= "\n".'<div class="pull-right"><div class="btn-group-vertical btn-group-sm" role="group">';
if (!is_mobile()) $html .= "\n".'<button type="button" id="captcha_mp3" class="btn btn-default"><i class="fa fa-volume-up fa-fw"></i></button>';
$html .= "\n".'<button type="button" id="captcha_reload" class="btn btn-default"><i class="fa fa-refresh fa-fw"></i></button>';
$html .= "\n".'</div></div>';
if (is_mobile()) $html .= '<audio src="#" id="captcha_audio" controls style="width:200px;"></audio>';
$html .= '<input type="text" name="captcha_key" id="captcha_key" required class="form-control" maxlength="6" placeholder="숫자입력">';
$html .= '</div>';
return $html;
}
[/code]
제가 극하수라 디자인을 잘 할줄몰라서...
더 이쁘게 만들어주세요
그누보드 원본파일 수정하기 싫었으나, 어쩔수 없었네요
아래 코드처럼 수정하시면 됩니다.
부트스트랩, 폰트어썸 적용했습니다.
수정파일 : /plugin/kcapcha/kcaptcha.lib.php
[code]
// 캡챠 HTML 코드 출력
/*
function captcha_html($class="captcha")
{
if(is_mobile())
$class .= ' m_captcha';
$html .= "\n".'<script>var g5_captcha_url = "'.G5_CAPTCHA_URL.'";</script>';
//$html .= "\n".'<script>var g5_captcha_path = "'.G5_CAPTCHA_PATH.'";</script>';
$html .= "\n".'<script src="'.G5_CAPTCHA_URL.'/kcaptcha.js"></script>';
$html .= "\n".'<fieldset id="captcha" class="'.$class.'">';
$html .= "\n".'<legend><label for="captcha_key">자동등록방지</label></legend>';
if (is_mobile()) $html .= '<audio src="#" id="captcha_audio" controls></audio>';
//$html .= "\n".'<img src="#" alt="" id="captcha_img">';
$html .= "\n".'<img src="javascript:void(0);" alt="" id="captcha_img">';
if (!is_mobile()) $html .= "\n".'<button type="button" id="captcha_mp3"><span></span>숫자음성듣기</button>';
$html .= "\n".'<button type="button" id="captcha_reload"><span></span>새로고침</button>';
$html .= '<input type="text" name="captcha_key" id="captcha_key" required class="captcha_box required" size="6" maxlength="6">';
$html .= "\n".'<span id="captcha_info">자동등록방지 숫자를 순서대로 입력하세요.</span>';
$html .= "\n".'</fieldset>';
return $html;
}
*/
// bootstrap, fontawesome 적용 수정
function captcha_html()
{
$html .= "\n".'<script>var g5_captcha_url = "'.G5_CAPTCHA_URL.'";</script>';
$html .= "\n".'<script src="'.G5_CAPTCHA_URL.'/kcaptcha.js"></script>';
$html .= "\n".'<div style="border:0px; width:200px;">';
$html .= "\n".'<div class="pull-left"><img src="javascript:void(0);" alt="" id="captcha_img"></div>';
$html .= "\n".'<div class="pull-right"><div class="btn-group-vertical btn-group-sm" role="group">';
if (!is_mobile()) $html .= "\n".'<button type="button" id="captcha_mp3" class="btn btn-default"><i class="fa fa-volume-up fa-fw"></i></button>';
$html .= "\n".'<button type="button" id="captcha_reload" class="btn btn-default"><i class="fa fa-refresh fa-fw"></i></button>';
$html .= "\n".'</div></div>';
if (is_mobile()) $html .= '<audio src="#" id="captcha_audio" controls style="width:200px;"></audio>';
$html .= '<input type="text" name="captcha_key" id="captcha_key" required class="form-control" maxlength="6" placeholder="숫자입력">';
$html .= '</div>';
return $html;
}
[/code]
제가 극하수라 디자인을 잘 할줄몰라서...
더 이쁘게 만들어주세요
첨부파일
|
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기
댓글 6개
어디부터해야할지 모르겠네요.
http://getbootstrap.com/
매뉴얼 참고하시는게 제일 좋은 것 같습니다.
댓글 남겨주셔서 감사합니다