라이믹스팁

라이믹스 게시글 댓글 신고 시 신고사유 반영할 수 있는 팝업창으로 뜨게 하기

꿀팁관리소장 — Wed, 25 May 2022 12:37:00 +0900

라이믹스에는 위와 같이 글,댓글을 신고할때 신고 이유를 선택 또는 직접 작성하여 제출할 수 있는 dispDocumentDeclare, dispCommentDeclare 액션이 추가되었습니다. 이 기능을 사용하여 신고를 할 수 있도록 신고버튼에 적용된 링크를 변경해야 합니다. 물론 최근에 배포된 스킨의 경우는 이미 변경이 되었겠지만 오래된 스킨의 경우는 직접 변경해주어야 합니다.

우선 문서신고시

<a cond="$mi->declare" class="blamed declare bd_login" href="#" onclick="doCallModuleAction('document','procDocumentDeclare','{$oDocument->document_srl}');return false;"|cond="$is_logged">

이런식으로 처리가 되어 있는 경우가 있을텐데..

<a cond="$mi->declare" class="blamed declare bd_login" onclick="window.open('{getUrl('', 'act', 'dispDocumentDeclare', 'target_srl', $document_srl)}','win','popopen(this.href); return false;')"|cond="$is_logged">

이런식으로 변경을 해주거나...

<a cond="$mi->declare" class="blamed declare bd_login" href="{getUrl('act','dispDocumentDeclare','target_srl',$document_srl)}" onclick="popopen(this.href, 'popup'); return false;">

이렇게 변경해서 사용할 수 있습니다.

댓글신고도 마찬가지로

<a href="{getUrl('act','dispCommentDeclare','target_srl',$comment->comment_srl)}" onclick="popopen(this.href, 'popup'); return false;">

비슷하게 변경하여 사용하면 됩니다.

똥남기는 모듈 게시글 삭제시 삭제된 게시글 처리시 썸네일까지 삭제해 주기.

꿀팁관리소장 — Mon, 23 May 2022 17:01:35 +0900

똥남기는 모듈을 사용하시는 분들이 계실지 모르겠는데 저의 경우 1개의 커뮤니티에 적용해서 아직까지 사용하고 있습니다.

게시글을 삭제시 "삭제된 게시글 입니다." 라는 제목, 내용으로 변경하여 게시글을 존치시키는 모듈입니다.

회원들이 수시로 글 작성 후 삭제하는 것에 대한 댓글 작성자의 포인트 차감의 피해 기타 피로도 발생등의 문제가 있어서 해당 모듈로 게시글을 삭제하지는 않고 삭제에 준하는 조치를 하고 있습니다.

해당 모듈에서 제공했던 것에 부족한 부분을 제가 조금씩 추가해서 보완을 해 사용해 오고 있는데 최근 문제가 게시글이 삭제되는 절차를 거치지 않게 되니 썸네일이 삭제가 되지 않아 글 목록에서 썸네일이 계속 보여지고 하는 사소한 문제가 발생할 수 있습니다.

- 파일 첨부 없이 썸네일이 생성되는 경우가 많습니다. ex)유튜브 영상등의 썸네일 또는 외부 이미지의 썸네일이 생성이 된 경우.

라이믹스의 게시글 삭제 함수에서 썸네일을 처리하는 코드를 그대로 똥남기는 모듈의 함수에 복사해서 넣어 썸네일이 삭제가 되도록 했습니다.

deleteDocument 함수의 하단에 보면

// Remove the thumbnail file
Rhymix\Framework\Storage::deleteDirectory(RX_BASEDIR . sprintf('files/thumbnails/%s', getNumberingPath($document_srl, 3)));

위와 같은 부분이 발견되어 그대로 복사해서

똥남기는 모듈의 아래 함수에 첨부파일을 삭제해주는 코드 바로 아래에 붙여넣어 추가해 주었습니다.

function triggerBeforeDeleteDocument(&$obj) {

       $oFileController = getController('file');
       $output = $oFileController->deleteFiles($document_srl);
       Rhymix\Framework\Storage::deleteDirectory(RX_BASEDIR . sprintf('files/thumbnails/%s', getNumberingPath($document_srl, 3)));

}

따로 테스트를 하지는 않았지만 글 작성자가 글 삭제를 시도하면 삭제된 게시글로 처리하면서 썸네일 폴더까지 잘 삭제될 것으로 예상이 됩니다.

라이믹스를 사용하고 있어 따로 XE에서도 동일하게 사용할 수 있는 코드는 살펴보지 않았습니다.

라이믹스 읽지 않은 쪽지(새쪽지) 표시해 주기

꿀팁관리소장 — Sun, 01 May 2022 15:33:43 +0900

라이믹스에서는 회원에게 필요한 알림을 알림센터로 알려주고 있습니다. 쪽지 또한 도착 사실을 알림센터의 알림으로 발생되게 해 줄수 있으나 알림이 많아 알림을 무시하는 회원에게는 쪽지 도착 사실을 알릴 수 없는 문제가 발생합니다.

알림 자체를 읽지 않으려는 사람에게 쪽지도 비슷하게 취급하면 되지 라는 생각에 개인적으로은 약간 다른 생각을 가지고 있습니다.

회원에게 쪽지로 알리는 것 중 운영자가 굉장히 중요한 사실을 고지해 줄 수도 있고 시스템에서 쪽지로 회원이 열람해서 조치해야 할 내용이 전달 될 수도 있습니다. (누군가 로그인 시도를 해서 실패했다는 정보의 쪽지 등...)

개인적으로는 새로운 쪽지가 도착했는데 읽지 않는다면 사이트의 중요한 페이지 몇군데를 접속하지 못하면서 쪽지를 읽어야 한다는 메시지를 보여주는 애드온을 사용합니다. 자료실에 공개한 애드온입니다.

https://rxtip.kr/download/368

사실 쪽지 정도는 필수로 열람해야만 서비스 이용이 가능하도록 하는 강제적인 조치가 지나치지는 않다고 생각하는 운영자 입니다만 그렇지 않은 운영자도 있을 것 입니다. 사용은 각자 판단에 따라서 결정하면 되겠죠.

여기서 다루고자 하는 것은 새로운 쪽지가 도착했다는 사실 다시 말하면 읽지 않은 쪽지가 있다는 사실을 알림센터 알림 외 별도의 구분된 알림으로 알려줄 필요가 있어 알림을 모두 지우는 회원에게도 쪽지 도착 사실은 알려줄 수 있게 레이아웃 또는 로그인정보 위젯 스킨 등에 적용하는 것 입니다.

제가 운영하는 커뮤니티의 한곳에 PC의 경우 위와 같이 별도로 읽지 않은 쪽지를 확실히 알 수 있도록 위와 같이 처리해 주고 있습니다.

새로운쪽지 : 1

에서 쪽지숫자 1이 깜빡이게 css에서 처리해 놓아서 놓칠 수가 없습니다. 별도로 읽지 않은 쪽지를 쿼리해서 가져온 데이터라 알림센터 알림을 모두 지우더라더도 저 알림은 지워지지 않습니다. (쪽지를 읽어야 지워집니다.)

모바일의 경우는 로그인을 하면 이렇게 명시적으로 읽지않은 쪽지가 있습니다. 라는 메시지가 발생하며 회원정보를 열람하는 곳에 알림 카운트가 발생됩니다.

저 my 아이콘을 누르고 회원정보 등을 열람하는 곳으로 들어가면

이렇게 쪽지 항목에 읽지 않은 쪽지의 카운트가 표시가 되고 있어 눌러서 쪽지를 열람하러 갈수 있죠.

위와 같이 필요한 곳(레이아웃 또는 로그인정보 위젯 등)에 새로운쪽지수를 쿼리해서 결과의 데이터로 표시해 주면됩니다.

XE시절부터 사용하는 것이니 라이믹스 XE 구분없이 사용 가능합니다.

{@
     $logged_info = Context::get('logged_info');
     $args = new stdClass();
     $args->receiver_srl = $logged_info->member_srl;
     $output = executeQuery('communication.getNewMessage', $args);
 }

위와 같이 로그인 한 회원의 새쪽지 정보를 쿼리하는 코드를 작성해 줍니다.

라이믹스의 경우 읽지 않은 쪽지수만 조회하는 쿼리(getNewMessageCount)가 추가된 것을 확인하고 이것을 사용하는 라이믹스에서 사용 가능한 코드를 하단에 추가했습니다. 라이믹스의 경우는 쪽지를 전부 불러오는 것이 아닌 쪽지 숫자만 가져오는 아래 추가한 코드를 사용해주세요.

그리고 결과를 가지고 무언가 표시를 해주거나 하고 싶은 곳에

쪽지가 있다고 뭔가 알려주고 싶은 코드 작성

위와 같이 읽지 않은 쪽지 갯수가 0보다 큰 경우 (한개 이상인 경우) 무언가 출력되도록 해주면 됩니다.

<li class="mcount">message : <a href="{getUrl('act','dispMemberMessages','member_srl',$logged_info->member_srl)}"><span>새로운 쪽지</span><span class="count">{$output->page_navigation->total_count}</span></a></li>

위와 같이 작성하면

새로운쪽지 : 쪽지수

이렇게 출력이 되면서 클릭하면 쪽지 열람페이지로 이동되겠죠.

이렇게 처리하는 것도 귀찮다면 그냥 제가 위에 언급한 애드온만 사용하셔도 됩니다.

개인적으로는 정보도 제공하고 애드온으로 필수적으로 쪽지를 열람해야만 하는 운영정책 모두 사용하고 있습니다.

* 라이믹스 전용 쿼리 *

글을 작성하고 라이믹스 코드를 확인해 보니 읽지않은 쪽지수 쿼리를 별도로 제공하는 것이 추가되어 쪽지 숫자만 확인해서 처리하는 코드를 추가합니다. 라이믹스 사용자의 경우는 이 코드 사용을 추천합니다.

{@
     $logged_info = Context::get('logged_info');
     $args = new stdClass();
     $args->receiver_srl = $logged_info->member_srl;
     $output = executeQuery('communication.getNewMessageCount', $args);
 }

그리고 결과를 가지고 무언가 표시를 해주거나 하고 싶은 곳에

쪽지가 있다고 뭔가 알려주고 싶은 코드 작성

위와 같이 읽지 않은 쪽지 갯수가 0보다 큰 경우 (한개 이상인 경우) 무언가 출력되도록 해주면 됩니다.

<li class="mcount">message : <a href="{getUrl('act','dispMemberMessages','member_srl',$logged_info->member_srl)}"><span>새로운 쪽지</span><span class="count">{$output->data->count}</span></a></li>

위와 같이 작성하면

새로운쪽지 : 쪽지수

이렇게 출력이 되면서 클릭하면 쪽지 열람페이지로 이동되겠죠.

랜덤게시글 모듈 게시글 이동을 php header location 으로 이동하게 하기

꿀팁관리소장 — Sun, 13 Mar 2022 15:45:51 +0900

오늘은 커뮤니티 한 곳에 새롭게 랜덤으로 게시글을 열람할 수 있는 랜덤게시글 모듈을 설치하고 적용했습니다. 그런데 선택된 게시글로 이동할때 스킨의 스크립트를 이용해서 이동을 하게 되다 보니 스킨을 로딩해야하고 하는 등의 과정 그리고 이로인해 모바일 등의 환경에서 원치하는 모습이 잠깐 연출되기도 합니다.

차라리 스킨을 가져와서 해당 스킨에서 선택된 게시글로 이동하기 보다는 직접 선택된 게시글을 곧바로 php에서 이동해 버리면 빠르고 깔끔한 동작으로 이동이 되어서 오늘 코드를 추가해서 적용하였습니다.

/modules/randocument/randocument.view.php

위 파일을 열어보면

   function dispRandocumentRand()
   {
       if(!$this->module_info->seleted_module_srl)
       {
           return new BaseObject(-1, '설정을 불러 올 수 없습니다.');
       }

$oRandocumentModel = getModel('randocument');

       $output = $oRandocumentModel->getRandocumentToDocumentSrl($this->module_info->seleted_module_srl);
       if(!$output->toBool())
       {
           return $output;
       }

       if($output->data->document_srl)
       {
           $oDocument = getModel('document')->getDocument($output->data->document_srl);
           $link = $oDocument->getPermanentUrl();
           Context::set('getlink', $link);
       }
       else
       {
           Context::set('getlink', null);
       }
       if($this->module_info->test_mode === 'yes')
       {
           Context::set('document', $oDocument);
       }
       else
       {
           Context::set('document', null);
       }

$this->setTemplateFile('rand');
}
}

위와 같은 함수에서 랜덤으로 게시글 1개를 선택한 후 해당 게시글 정보를 모듈의 스킨을 불러와서 스킨에서 해당 게시글 정보를 기반으로 이동하게 되어있습니다.

$this->setTemplateFile('rand');

스킨을 로딩하게 되는 코드 바로 위쪽에 바로 선택된 게시글로 php header location 으로 이동해 버리는 코드를 추가했습니다.

if($link != null && $this->module_info->test_mode != 'yes')
 {
 if(Mobile::isMobileCheckByAgent() && $this->module_info->option_url_mobile)
 {
 header('Location: ' .$link .$this->module_info->option_url_mobile);
 }
 else if($this->module_info->option_url_pc)
 {
 header('Location: ' .$link .$this->module_info->option_url_pc);
 }
 else
 {
 header('Location: ' .$link );
 }
 }

위 코드가 추가되었습니다.

변경된 함수 전체는 아래와 같습니다.

function dispRandocumentRand()
 {
 if(!$this->module_info->seleted_module_srl)
 {
 return new BaseObject(-1, '설정을 불러 올 수 없습니다.');
 }
 
 $oRandocumentModel = getModel('randocument');
 
 $output = $oRandocumentModel->getRandocumentToDocumentSrl($this->module_info->seleted_module_srl);
 if(!$output->toBool())
 {
 return $output;
 }
 
 if($output->data->document_srl)
 {
 $oDocument = getModel('document')->getDocument($output->data->document_srl);
 $link = $oDocument->getPermanentUrl();
 Context::set('getlink', $link);
 }
 else
 {
 Context::set('getlink', null);
 }
 if($this->module_info->test_mode === 'yes')
 {
 Context::set('document', $oDocument);
 }
 else
 {
 Context::set('document', null);
 }
 if($link != null && $this->module_info->test_mode != 'yes')
 {
 if(Mobile::isMobileCheckByAgent() && $this->module_info->option_url_mobile)
 {
 header('Location: ' .$link .$this->module_info->option_url_mobile);
 }
 else if(!Mobile::isMobileCheckByAgent() && $this->module_info->option_url_pc)
 {
 header('Location: ' .$link .$this->module_info->option_url_pc);
 }
 else
 {
 header('Location: ' .$link );
 }
 }
 $this->setTemplateFile('rand');
 }

이렇게 코드를 추가하면 모듈의 스킨을 화면에 출력해서 해당 스킨에서 게시글로 이동하는 스크립트를 실행하고 하는 과정으로 진입하지 않고 뽑힌 랜덤 게시글로 곧바로 이동하여 불필요한 시간,과정 그리고 그 과정속에서 부자연 스러운 장면이 노출되는 그런 부분들을 방지 할 수 있게 되었습니다.

게시판 스킨에서 문서가 가지는 태그를 출력해주고 태그 목록으로 링크를 걸어줄때 url을 초기화

꿀팁관리소장 — Fri, 11 Feb 2022 20:00:51 +0900

스케치북 게시판 스킨도 그렇고 대부분의 게시판 스킨에서 글 읽는 화면에 해당 글이 가지는 태그를 출력해 주는 부분들이 있습니다.

출력을 해 줄때 같은 태그를 가진 다른 글을 검색해 볼 수 있도록 링크를 걸어주는데요.

스킨마다 조금씩 차이는 있겠지만

<a href="{getUrl('search_target','tag','search_keyword',$tag,'document_srl','')}">{escape($tag, false)}</a>

이런 링크를 가진 곳이 있습니다.

현재 위 url로 사용을 하면 읽고 있는 글이 2페이 이상에 위치하고 있을때 태그 검색결과에서도 글이 가지고 있던 페이지를 찾아가게 됩니다. 같은 태그를 가진 글이 많아 여러페이지로 출력이 될때 저 링크를 클릭할 시점의 페이지를 그대로 가져가서 그런 결과가 나옵니다.

굳이 문서번호만 초기화 하는 코드를 사용할 필요가 없이 모든 변수를 다 초기화 하는 것이 좋아 보입니다.

전체 초기화를 한후 현재의 게시판의 글을 조회하는 것이니 mid 만 현재 mid로 가지게 하고 나머지는 tag 검색으로 그대로 사용하면 될 것 같습니다.

대부분 스킨이 다 동일한 문제의 링크를 생성하고 있네요.

라이믹스 게시판 목록에서 문서의 태그 출력해 주기

꿀팁관리소장 — Sun, 30 Jan 2022 17:50:29 +0900

만약 글 목록을 SNS 스타일로 글제목+글요약+이미지 등의 정보를 모두 제공하는 것으로 하고 있다면 게시글의 정보중 중요한 것을 목록에서 보여주는 것도 좋습니다.

컨셉 자체가 그러한 컨셉이라면 말이죠.

이런 스타일로 꾸미기 좋게 만들어진 스킨이 바로 저희 라이믹스 꿀팁에서 사용하고 있는 flexstagrm 테마의 게시판 스킨 sns 스타일 일 것입니다.

요건 저희 라이믹스 꿀팁에 적용되어 태그가 입력되어 있는 글이 목록에서 부터 태그를 출력해 주고 있습니다. 글의 주제나 핵심을 파악하기 좋죠.

요건 동일한 스킨을 사용하고 있는 제가 운영하는 SNS 스타일의 커뮤니티에도 적용한 모습입니다.

flexstgram 스킨을 기준으로 설명을 해드리면

https://github.com/calvinsnax/rx-flextagram/blob/main/modules/board/skins/rx-flextagram/templates/sns/sns.html#L6

<li loop="$document_list=>$no,$document">

이런 게시글을 반복해서 목록을 출력하는 코드 안쪽(아래)에 각 게시글이 가지고 있는 태그를 가져오는 코드를 추가로 작성해 줍니다.

{@
$args = new stdClass();
$args->document_srls = $document->document_srl;
$tag_list = executeQuery('document.getDocumentTags', $args)->data->tags;
$tag_lists = [];
if ($tag_list) $tag_lists = explode(',', $tag_list);
}

위와 같이 작성해 주면 각 목록의 게시글들이 가지는 태그를 가져오게 됩니다.^[1]

--> 라이믹스 2.0.18 버전 이상 사용자는 위 쿼리가 아닌 하단부의 설명된 코드로 사용하시기 바랍니다.

그리고 이제 저 가져온 태그를 출력해 주면 됩니다.

저의 경우는 글 요약부분이 끝나는 다음 줄에 출력을 해주었습니다.

https://github.com/calvinsnax/rx-flextagram/blob/main/modules/board/skins/rx-flextagram/templates/sns/sns.html#L40

위 부분이 요약을 출력하는 부분인데 요약 바로 아래로 문서가 가지는 태그를 출력할 수 있도록 코드를 추가합니다.

{nl2br($document->getSummary(200))}
<br>
<block loop="$tag_lists=>$tag">
<span class="tag-list">#{$tag}</span>
</block>

위와 같이 코드를 추가해 주면 글요약 아래에 태그가 출력이 되는데 글자 색상등의 효과를 주기 위해 span 요소에 class를 부여 했습니다. 해당 class에 저는 글자 색상만 효과를 주었습니다.

지금 수정하는 파일에

<style>

span.tag-list {color: #649ed2;}

</style>

위와 같이 css style을 적당한 곳에 추가해 주면 글자 색상이 적용이 되는 것이죠.

일반적인 간단 목록에서는 필요가 없겠지만 저 처럼 SNS 형태로 목록을 제공한다면 추가해 볼만한 것 같습니다.

*참고사항 : 글 목록에서 글의 태그를 바로 가져올 수 없어 쿼리를 통해 가져오는 코드를 사용했습니다. 이부분 따로 쿼리 없이 바로 $document 에서 게시글의 태그도 포함해서 가질 수 있도록 이슈로 요청해 놓았습니다. 추후 이 이슈가 반영이 된다면 쿼리 없이 정보를 가져올 수 있을 것입니다.

https://github.com/rhymix/rhymix/issues/1867

해당 이슈는 처리가 되었네요.

https://github.com/rhymix/rhymix/commit/7e922cf2bc11e637822dc3b0edd1dfee0414c413

마스터버전으로 배포는 다음 버전에 될 것으로 예상됩니다.

[1] 위 패치를 미리 적용하시거나 혹은 정식으로 배포된 버전으로 라이믹스를 사용하게 되실 경우

위 설명중 태그를 가져오기 위해 쿼리하는 부분 없이 바로 태그를 가져오는 코드로 변경하시면 됩니다.

--> 라이믹스 2.0.18에서 패치가 적용되었습니다. 라이믹스 2.0.18 버전 사용자는 아래 변경된 코드로 사용하시면 됩니다.

를 아래 코드로 변경하시면 됩니다.

↓↓↓↓↓

{@
$tag_lists = $document->get('tag_list') ?? array();
}

라이믹스 form 태그에 지저분하게 붙는 속성 없애는 방법

꿀팁관리소장 — Mon, 24 Jan 2022 19:03:06 +0900

라이믹스나 XE로 form 태그를 만들어 사용하다보면 필요하지 않는 지저분한 속성이 무조건 붙어버려서 주소가 지저분하게 생기는 불편함이 있었습니다.

act, mid 가 붙어버리는데요.

라이믹스 2.0.15 에 자동으로 붙는 속성을 붙지 않도록 하는 옵션이 생겼습니다.

https://github.com/rhymix/rhymix/pull/1779

rx-autoform="false" 옵션을 추가해 주면 실제 지정한 속성만 붙게 됩니다.

위와 같은 경우

https://도메인/search?q=검색어

이렇게 깔끔하게 주소가 완성되어집니다.

rx-autoform="false" 를 사용하지 못했을 과거에는

https://도메인?act=&mid=search&q=검색어

이런식의 지저분한 url로 만들어졌었습니다.

rx-autoform="false" 덕분에 깔끔한 주소를 만들어줄 수 있게 되었네요.

스케치북 스킨 FAQ 원하는 항목으로 이동하며 A(답변) 펼치기 구현

꿀팁관리소장 — Thu, 20 Jan 2022 21:01:30 +0900

사이트를 운영하다보면 미리 알고 있으면 유용한 것을 FAQ 로 작성해서 방문자에게 미리 알리게 되는데요. 스케치북 스킨을 사용하는 경우 이 FAQ 목록스타일을 사용하면 쉽게 구성할 수 있습니다.

게시글로 제목,내용으로 작성을 하면 FAQ 스타일로 지정되면 Q(질문), A(답변) 으로 보여주게 되고 클릭시 답변이 펼쳐지고 다시 클릭시 답변이 접히게 되는 방식입니다.

그런데 여기에 설명을 해 놓은 특정한 것을 지정해서 링크를 걸어주고 싶은데 게시글 주소로 링크를 걸면 FAQ 스타일이 아닌 일반 문서를 읽는 형태로 보여지게 됩니다.

개인적으로 이왕이면 그냥 정확히 지정된 순서의 항목에 답변이 펼치지는 형태로 링크를 걸어주고 싶습니다.

스케치북의 FAQ 스킨의 하단에 스크립트 하나를 추가해 줍니다.

/modules/board/skins/sketchbook/_list_faq.html

위와 같이 스크립트를 추가해 주었으면 내가 FAQ에 작성한 것 중 하나를 링크를 걸고 싶다면

개발자도구로 보면 FAQ 각 항목이 li 단위로 구분되어 있는게 확인되고 id가 bdFaq_문서번호 로 표시되는 것을 확인할 수 있습니다.

각 faq 제목에 마우스를 올리면 게시글 주소도 보이기도 합니다.

이 게시글 주소를 직접 링크를 걸면 그냥 일반 문서를 열람하듯이 보이기 때문에 지금 하려고 하는 #id로 링크를 걸어주려고 합니다.

미리 스킨에 넣어둔 스크립트로 인해서 해당 id와 매칭되는 항목을 펼치는 함수가 실행되도록 되어있습니다.

링크는

https://rxtip.kr/faq#bdFaq_28404 이렇게 걸어주면됩니다. 스크립트가 없다면 그냥 해당 id 위치까지 자동으로 찾아가기만 하고 답변을 펼쳐주지는 못합니다.

faq 목록에서 링크를 위 설명한 링크를 직접 가지도록 수정하는 법을 하단에 추가했습니다.

어떤 한페이지에 설명을 할때 어떤 엘리먼트(div,p,span,li 등)에 id="특정할수있는문자열" 로 하여 문서를 작성하면 쉽게 해당 id로 스크롤이 찾아가는 링크를 사용할 수 있습니다. 해당페이지주소#id 를 사용하면 됩니다.

단, 여기서 설명하는 것은 스크립트를 추가해서 스케치북에서 제공하는 답변 펼치는 함수를 자동으로 실행해주게 하는 것 입니다.

- 추가사항 -

FAQ의 게시글 링크 주소를 보다 편하게 바꿔주기

문서에서 특정 FAQ를 언급해서 링크를 걸어줄때 위 설명한대로 id값을 확인해서 작성해줘야 하는 불편을 덜기 위해 스킨에 직접 원하는 링크주소를 가지도록 고쳐보았습니다.

_list_faq.html 을 열어보면

<!--// Normal -->
 <li loop="$document_list=>$no,$document" id="bdFaq_{$document->document_srl}" class="article clear">
 <input cond="$grant->manager" type="checkbox" name="cart" value="{$document->document_srl}" class="iCheck" title="Check This Article" onclick="doAddDocumentCart(this)" checked="checked"|cond="$document->isCarted()" />
 <a class="q clear" href="{getUrl('document_srl',$document->document_srl,'cpage','')}" onClick="bdFaq({$document->document_srl});return false;">
 <b class="mrk mrkQ">Q<span>:</span></b>
 <strong cond="$mi->use_category=='Y' && $document->get('category_srl')" class="cate">[{$category_list[$document->get('category_srl')]->title}]</strong>
 <span class="tl">{$document->getTitle($mi->subject_cut_size)}</span>
 <span class="fr">
 <span cond="$document->getExtraEidValue('rating')" class="starRating" title="{$document->getExtraEidValue('rating')}점"><span style="width:{$document->getExtraEidValue('rating')*10}%">{$document->getExtraEidValue('rating')}점</span></span>
 <span cond="$list_config['nick_name']" class="nick">{$document->getNickName()}</span>
 <span cond="$list_config['regdate']" class="date">{$document->getRegdate('Y.m.d')}</span>
 </span>
 <i class="fa fa-chevron-up"></i>
 <i class="fa fa-chevron-down"></i>
 </a>
 <div class="a clear">
 <b class="mrk mrkA">A<span>:</span></b>
 <div class="editArea">
 <!--a class="url" href="{$document->getPermanentUrl()}">{$document->getPermanentUrl()}</a-->
 <block cond="$document->isEditable()">
 <a class="edit" href="{getUrl('act','dispBoardWrite','document_srl',$document->document_srl,'comment_srl','')}"><span class="ico_16px write"></span>{$lang->cmd_modify}</a>
 <a class="edit" href="{getUrl('act','dispBoardDelete','document_srl',$document->document_srl,'comment_srl','')}"><span class="ico_16px delete"></span>{$lang->cmd_delete}</a>
 </block>
 </div>
 {$document->getContent(false)}
 </div>
 </li>

지금 강조한 줄의 url에서 문서번호를 지워주고 #id 값을 붙여주게 수정하면 됩니다.

<a class="q clear" href="{getUrl('document_srl','','cpage','')}#bdFaq_{$document->document_srl}" onClick="bdFaq({$document->document_srl});return false;">

이렇게 고쳐주면 FAQ 화면에서 해당 항목에 링크주소가 지금 개별 항목을 가리키는 주소로 가지게 되어 오른쪽 마우스로 링크복사를 쉽게 할 수 있습니다.

zip 다운로드 애드온 라이믹스 2.0.17 업데이트 후 잘못된 요청 오류 수정법

꿀팁관리소장 — Thu, 13 Jan 2022 11:33:34 +0900

zip 다운로드 애드온의 경우 게시글에 첨부된 파일을 한번에 모두 zip 파일로 다운받을 수 있게 해주는 애드온입니다.

라이믹스 2.0에서의 오류는 이미 수정법을 작성해 드린 적이 있는데요.

https://rxtip.kr/rx_tip/4650

이번에 라이믹스 2.0.17에서 새로운 문제가 발생되어 수정하였습니다.

addons/zipdownload/zipdownload.addon.php

파일을 열어보면 대략 50번째 라인에

$download_url = sprintf('?document_srl=%s&action=%s&mid=%s', $oDocument->document_srl, 'zip', Context::get('mid'));

위와 같이 act -> action 으로 변경합니다.

act 를 임의로 생성해서 사용하면 안되게 변경이 되었습니다.

90번째 라인 즈음에도 보면

// download process
if ($called_position == 'after_module_proc' && Context::get('action') == 'zip') {

마찬가지로 act -> action 으로 변경해 주시면 됩니다.

이렇게 하면 정상적으로 작동이 됩니다.

라이믹스 설문조사 비회원참여를 막는 방법

꿀팁관리소장 — Sun, 05 Dec 2021 14:47:39 +0900

라이믹스 설문조사가 회원,비회원 구분없이 모두 참여가 가능한거 알고 계신가요? 비회원 참여가 열려있는 경우 설문에 굉장한 외곡이 발생할 수 있다는 것을 잘 모르는 분들이 많으실 겁니다.

비회원의 경우 ip로만 중복을 체크하기 때문에 Tor 와 같은 브라우저로 접속해서 설문응답을 반복한다면 아주 짧은 시간에 내가 원하는 항목의 응답을 최고의 응답으로 만들어 낼 수 있습니다.

개인적으로는 회원에게만 참여기회를 주어 중복참여 자체를 근본적으로 차단하는게 설문조사 기능의 결과 때문에 이용조차 하지 않게 되는 그런 일을 막을 수 있다고 생각합니다.

모든 페이지에 작동하는 애드온에

$logged_info = Context::get('logged_info');
if(Context::get('act') == 'procPoll' && $called_position == 'before_module_proc') {
   if(!$logged_info) {
   $this->act = 'true';
   $this->stop('로그인해야 참여할 수 있습니다.');
   }
}

이러한 코드를 추가하여 설문참여 요청이 발생할때 로그인여부를 확인해서 로그인이 안된 참여는 차단하게 해주면 회원만 설문응답을 할 수 있게 됩니다.

이런식으로 차단이 됩니다.

라이믹스 설문조사 등록시 항목선택 갯수를 숫자로 입력하지 않았을 경우 발생하는 문제

꿀팁관리소장 — Sun, 05 Dec 2021 14:29:01 +0900

제가 운영하는 커뮤니티에 회원이 등록한 설문에 설문참여를 하려하니 다중선택이라 선택을 여러개 해야 한다는 의미의 알림창이 뜨고 설문참여가 되지 않는 상황이 발생해서 확인해 보았습니다.

제가 여러가지로 테스트로 확인한 결과는 항목선택 갯수를 숫자로 정확히 입력하지 않고 문자열 같은 것을 실수로 입력했을때 발생하는 것을 확인했습니다.

문자로 입력시 선택항목 갯수가 db에 0으로 입력되면서 발생하는 문제입니다.

1이면 단일, 1이 아닌경우 다중선택으로 코드가 짜여있는데 0이 입력되면서 다중입력으로 분류가 되고 다중입력 숫자와 선택한 항목이 숫자가 일치해야 하는데 일치할 수 없는 상황이 벌어지는 것입니다.

라이믹스 코어에서는 사용자가 선택항목 갯수 1을 지우고 비워둔 채로 등록을 시도하면 1로 보정해서 db에 입력되도록 해주는 코드가 있습니다.

https://github.com/rhymix/rhymix/blob/master/modules/poll/poll.controller.php#L94

if(!$val->checkcount)
{
$val->checkcount = 1;
}

이렇게 설문 항목선택 갯수를 입력하지 않은채 설문등록 요청이 들어오면 1을 강제로 넣어주어 단일선택으로 등록을 해주는 것입니다.

여기에 문자로 이상하게 입력하게 되면 값이 있기 때문에 1로 바꿔서 입력되지 못하고 문자를 입력을 시도하게 되는데 db 설정에 따라서 SQL 에러가 발생해서 설문등록이 안되는 경우가 있고 제가 운영하는 사이트는 0으로 인식되서 설문이 등록되어 버립니다.

저 상태로 설문이 등록되면 더 문제가 되는게 아무도 설문 참여를 할 수 없는 문제가 발생합니다.

개인적으로는 입력 받은 값을 정수(INT)로 변환하여 해당값이 0보다 큰 값이 아니면 보정치로 1을 입력하도록 코드를 보완했습니다.

if(!$val->checkcount || !(int)$val->checkcount > 0)
{
$val->checkcount = 1;
}

(int)$value

의 경우 문자열을 정수의 숫자로 변환해 주는데 문자열이 숫자가 아닌 경우 0으로 반환을 해주게 됩니다. 따라서 숫자가 아닌 형식의 문자를 사용자가 입력하게 되면 0을 가지게 되어 대체값이 1을 가지게 만드는 것 입니다.

여기서 문자열을 숫자로 변환해주는 것을 사용해야 하는 이유는 설문등록시 입력받은 설문항목 선택에 입력된 내용이 숫자가 아닌 문자로 취급되어 넘어오기 때문입니다. 0과 비교를 하기 위해서는 문자와 0 을 비교하여 원하는 연산결과를 얻어내지 못해서 입니다.

해당 문제는 이슈로 등록해 놓았으니 이후 더 좋은 방법으로 패치가 될 것으로 예상이 됩니다.

현재 배포중인 2.0.16 버전까지는 이러한 문제가 있으니 필요하다면 선조치를 해두는 것이 좋습니다.

https://github.com/rhymix/rhymix/issues/1831

*해당 이슈는 2.0.17 에서 처리 되었습니다.

rx-flextgram 테마의 댓글 추천 직후 추천수 잘못 표시되는 문제 해결

꿀팁관리소장 — Fri, 03 Dec 2021 11:36:13 +0900

flextgram 테마의 댓글 추천시 새로고침 없이 즉시 추천이 반영되고 추천수도 표시가 되게 js 로 구현이 되어있습니다. 그런데 댓글 추천 직후 새로고침 없이 추천수를 반영해 주는 부분에서 오류가 있어 잘못된 추천수를 보여주는 것이 발견되어 확인해 보았습니다.

콜백 함수 쪽에 추천수를 표시해 주는 코드에서 기존 추천수와 새롭게 변경된 추천수를 합산하는 부분 때문에 문제가 발생되는 것을 확인했습니다.

/modules/board/skins/rx-flextagram/assets/js/comment-vote.js

// 콜백
function callback(res) {
if(res.error) {
// console.log(el)
appToast(res.message, 'danger')
return
}

var appliedCount = res.voted_count || res.blamed_count

var getVoteCount = Number($(el).find('.app-comment-vote__count').text())

if(appliedCount) {
//var count = getVoteCount + appliedCount
var count = appliedCount

} else if(getVoteCount > -1) {
var count = getVoteCount -1

} else {
var count = getVoteCount + 1
}

$(el).find('.app-comment-vote__count').text(count)
$(el).toggleClass('active')

appToast(res.message)
}

굵게 표시해 드린 부분을 저는 주석처리 하고 해당 코드에서 새롭게 반영된 추천수만 반영되도록 고쳐서 아랫줄에 다시 추가해 주었습니다.

그냥 지우시고 아랫줄 추가하거나 저 처럼 주석처리하고 아랫줄 추가하면 됩니다.

그리고 추천수를 바로 고쳐주어야 하는데 추천,비추천이 아예 없는 경우는 고쳐줄 자리가 존재하지 않아 추가된 추천수가 표시되지 않는 문제가 있습니다.

/modules/board/skins/rx-flextagram/components/comment/comment-vote.html

위 파일이 추천버튼과 추천수를 표시해 주고 있는 코드들이 있습니다.

<div class="app-comment-vote" data-target-srl="{$comment->comment_srl}">
<button class="app-comment-vote__up"|cond="!$comment->getVote() == 1" class="app-comment-vote__up active"|cond="$comment->getVote()" data-type="up" onclick="alCommentVote(this)">
<ion-icon name="thumbs-up-sharp"></ion-icon>


<span class="app-comment-vote__count">{$comment->get('voted_count')}</span>

</button>

<button class="app-comment-vote__down"|cond="!$comment->getVote()" class="app-comment-vote__down active"|cond="$comment->getVote() == -1" data-type="down" onclick="alCommentVote(this)">
<ion-icon name="thumbs-down-sharp"></ion-icon>

<span class="app-comment-vote__count">{$comment->get('blamed_count')}</span>

</button>
</div>

위 원래 코드에서 추천,비추천수가 있을때만 추천수를 표시해 주는 부분의 조건을 제거해 주고 대신 추천이 없을 경우는 0 을 표시해 주고 싶지 않아 추천이 있을 경우만 값을 출력하도록 추가해 주었습니다.

아래와 같이 고치시면 됩니다.

<span class="app-comment-vote__count">{$comment->get('voted_count')?:''}</span>

</button>

<button class="app-comment-vote__down"|cond="!$comment->getVote()" class="app-comment-vote__down active"|cond="$comment->getVote() == -1" data-type="down" onclick="alCommentVote(this)">
<ion-icon name="thumbs-down-sharp"></ion-icon>
<span class="app-comment-vote__count">{$comment->get('blamed_count')?:''}</span>
</button>
</div>

이 레이아웃 제작자분께서 만드신 다른 레이아웃 테마의 게시판 스킨에서도 동일한 문제가 있을 것으로 보여집니다. 비슷하게 고치시면 될 것 같네요.

쿠키를 이용한 목록 스타일 변경 제공하기

꿀팁관리소장 — Sat, 20 Nov 2021 18:17:57 +0900

라이믹스의 경우 일반적으로는 운영자가 지정한 목록 스타일로 목록을 보여주는데요. 때로는 방문자가 원하는 스타일로 보게 해주는 것도 보다 선호하는 스타일을 선택할 수 있어 해당 기능이 반가운 방문자도 있을 수 있습니다.

제가 운영하는 커뮤니티에 지금 SNS스타일의 목록 형태를 제공합니다. 본문요약 + 섬네일 + 각종지표 등 많은 정보를 목록에서 한번에 다 확인이 가능한 목록형태입니다.

rx-flextagram 테마의 게시판 스킨에서 제공하는 sns 스타일 목록을 제공하고 있는데요. 이 스킨의 경우 테이블형 list 목록도 사용이 가능합니다.

기본 sns 스타일로 제공하고 방문자가 원할경우 간단 list 형태로 볼수 있는 버튼을 제공해서 해당 버튼을 클릭하면 쿠키가 생성되고 테이블형 간단 목록형태로 목록을 열람할 수 있도록 코드를 짜 보았습니다.

게시판 설정에 따라 목록 유형을 결정해주는 곳은

/modules/board/skins/rx-flextagram/components/board/board.html

위 파일의 코드에서 작동합니다.

<include target="../../templates/list/list.html" />

<include target="../../templates/sns/sns.html" />

굵게 표시해 드린 코드가 사용자가 버튼을 클릭해서 쿠키가 생성되었을 경우 list.html 파일로 목록을 보여주게 하는 부분입니다.

그리고 위 파일의 하단에는

       $(".force_list").click(function(){
       $.cookie('force_list_' + current_mid, 'Y', { path: '/', expires: 600 });
       location.reload();
       });

       $(".del_force_list").click(function(){
       $.removeCookie('force_list_' + current_mid, { path: '/' });
       location.reload();
       });

});
</script>

위와 같은 코드로 force_list, del_force_list 클래스 버튼을 클릭했을때 각각 쿠키를 생성하거나 삭제하는 작동을 할수 있도록 해줍니다.

같은 파일의 상단쪽에 목록 유형을 전환할 수 있는 버튼을 만들어 줍니다.

<div cond="$mid=='feed' && !$oDocument->isExists()" style="text-align:right;font-size: 12px;margin-bottom:10px;">

<span class="del_force_list" style="padding: 10px;cursor: pointer;">SNS 스타일 전환 <ion-icon name="grid-outline"></ion-icon></span>

<span class="force_list" style="padding: 10px;cursor: pointer;">간단 목록 전환 <ion-icon name="list-outline"></ion-icon></span>

</div>

$mid=='feed' 의 코드는 특정 feed 게시판에서만 작동하게 한 코드인데 여러 게시판에서 작동하게 하려면 해당 코드를 제거하시면 됩니다.

&& !$oDocument->isExists() 의 코드는 글 열람 페이지에서는 보이지 않도록 조건을 추가한 것입니다.

위와 같이 적용해 주면

평상시 SNS 스타일로 목록이 보이고 상단에는 간단목록 으로 전환할 수 있는 버튼이 보이게 됩니다.

간단 목록으로 전환해서 보고싶어 버튼을 누르게 되면....

이렇게 제목만 표시되는 간단한 테이블형 목록의 형태로 전환되어 보이게 됩니다. 상단의 버튼은 다시 쿠키를 삭제하여 SNS 스타일의 목록으로 돌아갈 수 있도록 버튼이 바뀌어 보이게 됩니다.

설문조사 기능을 활성화 하기 위해 문서에 설문조사 포함시 설문조사 태그 포함하기

꿀팁관리소장 — Sun, 14 Nov 2021 15:23:39 +0900

라이믹스의 설문조사 기능이 사실 커뮤니티에서 찬반이나 투표 기능으로 재미있게 회원들이 이용할 수 있는 기능임에 불구하고 사용이 잘 안되는 이유는 사용의 접근성이 많이 떨어는 점이 큰 이유 일 것이라 분석하고 있습니다.

이에 설문등록이라는 문구가 노출되도록 버튼을 분리해서 보여주었고

여기에 설문조사가 포함된 게시글은 태그에 "설문조사" 라는 태그를 가지도록 해보았습니다.

애드온을 새롭게 만들지는 않았고 기존에 사용하는 글 등록 직전 컨텐츠 내용을 확인하고 결과에 따라 글 등록을 차단하거나 하는 기능의 애드온에 추가적인 코드를 작성해서 이 기능까지 담당하도록 해 보았습니다.

코드가 유효한 위치는 $called_position=='before_module_proc' 그리고 act=='procBoardInsertDocument' 인 위치에 코드가 존재해야 합니다.

   if(strpos($_obj->content, 'poll_maker') !== false) {
   $tags_arr = explode(',', Context::get('tags'));
   if(in_array('설문조사', $tags_arr)) return;
   array_push($tags_arr, '설문조사');
   $tags = implode(',', $tags_arr);
   Context::set('tags', $tags, true);
   }

   if(Context::get('tags') && strpos($_obj->content, 'poll_maker') === false && strpos($_obj->content, '설문') === false) {
   $tags_arr = explode(',', Context::get('tags'));
   if(!in_array('설문조사', $tags_arr)) return;
   $key = array_search('설문조사', $tags_arr);
   array_splice($tags_arr, $key, 1);
   $tags = implode(',', $tags_arr);
   Context::set('tags', $tags, true);
   }

$_obj->content 는 작성된 문서의 내용을 그대로 가져온 것의 변수로서 Context::get('content') 으로 대체해서 사용하셔야 합니다.

설문조사 에디터 컴퍼넌트가 포함된 경우 poll_maker 의 문자열을 가지기 때문에 이것을 기준으로 "설문조사" 라는 태그를 추가해주는 코드가 진행되었습니다.

기존의 태그를 가져와 "설문조사" 태그를 추가해서 태그를 재정의 해주는 코드 입니다.

그 아래 코드는 설문을 본문에서 지우거나 할 경우 설문조사 태그를 작성자가 지우지 않는 것에 대비해서 반대로 "설문조사" 태그를 없애주고 태그를 재정의 해주는 코드입니다.

이렇게 하게 되면 장점은 설문조사가 포함된 게시글을 모두 보고 싶은 분들은 태그가 노출된 곳의 "설문조사" 라는 태그를 클릭하거나 혹은 검색에서 태그로 설문조사를 검색 하게 되면 설문이 등록된 게시글을 쉽게 볼 수 있게 되는 것입니다.

단, 단점은 설문조사 에디터 컴퍼넌트가 없을 경우 "설문조사" 라는 태그를 넣지 못하게 되는 경우가 발생하게 되는데 이 경우 보완책으로 글 내용에 "설문" 이라는 단어가 있다면 "설문조사" 태그를 작성자가 입력하더라도 유지되도록 보완을 했습니다. 에디터 컴퍼넌트 없이 설문조사에 관한 글을 작성할 수도 있기 때문이죠. 제가 지금 작성하고 있는 이 글이 바로 설문조사 기능을 사용하지 않고 설문에 관한 내용을 쓰고 있으니 이런 글이 대상이 될 것 입니다.

흥미로운 주제를 가지고 투표에 참여하고 결과를 가지고 의견을 나누는 흥미로는 상호작용이 될 수 있는 라이믹스 설문조사 기능이 활성화 될 수 있으면 좋겠습니다.

블라인드 모듈 최고관리권한 계정도 블라인드 되는 것 안되게 고치기

꿀팁관리소장 — Thu, 28 Oct 2021 20:51:57 +0900

블라인드 모듈이 회원간 분쟁을 멈추게 해줄 수 있는 모듈이라 커뮤니티 같은 곳에서 사용하면 좋습니다.

그런데 사용하다보니 최고관리권한 계정도 그냥 블라인드 할 수 있는데 뭔가 이상합니다. 나름 모든 권한을 가진 계정을 블라인드 한다는게...

그래서 최고관리권한 계정은 블라인드 하지 못하도록 몇 줄 추가해 보았습니다.

/modules/blind/blind.controller.php

위 파일에서

public function procBlindInsert() 함수 안에

       if($member_info->is_admin=='Y')
       {
           return $this->stop('관리자는 블라인드할 수 없습니다.');
       }

최고 관리계정의 경우 리턴해주는 코드를 추가해 줍니다.

현재 읽고 있는 글의 목록 위치로 바로 가기 만들기

꿀팁관리소장 — Thu, 28 Oct 2021 11:08:10 +0900

글 읽는 본문 하단에 위와 같이 목록으로 페이지로 완전히 전환하는 목록으로 가기 버튼 바로 옆에 현재 본문 하단의 목록에서 현재 글의 위치로 찾아갈 수 있도록 버튼을 넣어주었습니다.

물론 지금 이 글이 있는 이곳 스킨에는 필요가 없어서 구현하지 않았습니다.

https://rxtip.kr/talk/

위와 같은 블로그 타입의 목록 형태를 가진 곳에서 필요해서 블로그,회원광자 쪽의 스킨에 적용했습니다.

블로그 타입은 목록에서 내용의 대부분을 파악하는데 초점이 맞춰줘 있다보니 목록에서 하나의 게시글이 가지는 정보가 많고 세로로 길어지게 됩니다. 이때 목록에서 특정 글을 찾으려면 스크롤을 내려가면서 찾아야 합니다. 그렇지 않은 리스트형 목록은 화면에 많은 목록이 다 보이기 때문에 스크롤 없이도 보이는 화면에서 찾고 싶은 글을 쉽게 찾을 수 있죠.

블로그 타입에서 글을 순차적으로 읽어 가려고 한다면 현재 읽고 있는 글 다음글을 찾아야 하는데 목록에서 내가 방금 읽었던 글을 기억해서 찾아야 하고 그 글의 다음 글을 읽어가야 합니다. 그런데 이게 쉽지 않습니다.

그래서 위와 같이 글 읽고 나서 버튼 한번 클릭으로 지금 읽고 있는 글의 위치까치 바로 이동하니 다음 글을 클릭하고 읽어가면 됩니다.

제가 수정한 rx-flextagram 스킨의 수정사항을 알려드리면

/modules/board/skins/rx-flextagram/templates/sns/sns.html

/modules/board/skins/rx-flextagram/templates/list/list.html

두개의 파일을 열어서 목록에 게시글들을 반복해서 출력해주는 반복문에 각 게시글의 문서번호가 붙은 ID를 가지도록 해주어야 특정한 위치로 이동이 가능해지는 기본 정보를 가지게 됩니다.

<li id="list_{$document->document_srl}" loop="$document_list=>$no,$document">

위 굵게 표시해 드린 부분을 추가해 주세요.

그리고 글 열람하는 곳 을 수정해 줍니다.

위 스킨에서 목록으로 가는 버튼을 제공하는 파일은 아래 파일입니다.

/modules/board/skins/rx-flextagram/components/board/board.html

<div>
<a class="app-button" href="{getUrl('category', '', 'document_srl', '')}" style="width: calc(100% - 165px);">
<ion-icon name="arrow-back-outline"></ion-icon>
<span>목록</span>
</a>

<a class="app-button scroll_move" href="#list_{$document_srl}" style="width:160px;">
<ion-icon name="arrow-back-outline"></ion-icon>
<span>이글 목록 위치</span>
</a>
</div>

굵게 표시해 드린 부분을 추가하는 것으로 코드를 수정해 줍니다.

지금 수정하는 파일 하단에 아래의 스크립트도 추가해 줍니다.

-80 의 경우는 글 읽기 시 상단 헤더 부분 때문에 거리를 띄운 것이니 조절이 필요할 경우 변겅하시면 됩니다.

라이믹스 서명 html을 허용하지 않을 경우 엔터
태그 2개가 들어가는 문제 회피

꿀팁관리소장 — Tue, 26 Oct 2021 14:42:39 +0900

현재 라이믹스의 서명 에디터에 html 태그를 허용하지 않는 것으로 설정하면 한가지 애로사항이 발생합니다. 엔터가 기대하는 줄바꿈 P태그 이거나 혹은 <br> 한번 삽입으로 줄바꿈 효과만 나오길 기대하지만 html 태그 허용 안함으로 설정한 경우에만 <br><br> 2회가 삽입이 되어 2줄이 떨어진 간격으로 소스가 완성이 됩니다.

이 서명을 활용하는 많은 곳에서 이러한 줄간격 낭비가 발생하고 디자인을 해도 디자인을 넘어가는 영역에 서명의 문구가 위치하여 많이 잘리게 되는 문제가 생깁니다.

현재 이문제에 관해서 라이믹스 이슈에 등록을 해 둔 상태이지만 해결이 되기 전까지 임시라도 조치를 해본다면 <br> 태그가 연속으로 붙어있는 경우 1개로 줄여주는 정규식을 사용하면 될 것 같습니다. 구글링을 통해 찾은 정규식은

{preg_replace("/(<br\s*\/>\s*)+/", "<br />", $string)}

위 정규식인데 필요한 게시판,위젯 등 다양한 서명을 출력하는 곳에 $string 변수만 서명의 변수로 바꿔서 사용하면 <br> 태그가 연속으로 들어간 것은 1개로 줄여주게 됩니다.

{preg_replace("/(<br\s*\/>\s*)+/", "<br />", $item->signature)}

위 예시는 위젯에서 서명 출력을 {$item->signature} 이런식으로 하고 있었을 경우의 예시입니다.

게시판 등 다양한 곳에서 서명의 출력의 변수는 다르니 적절히 사용하면 되겠습니다.

서명에 html 사용을 허용했다면 위와 같은 문제는 현재시점에서 발생하지 않으니 신경쓰지 않으셔도 됩니다.

* 라이믹스 2.0.17에서 html을 허용하지 않는다면 textra 에디터를 사용하게 패치되어 위와 같은 문제는 발생하지 않게 되었습니다.

회원정보에 스킨 수정없이 특별한 내용 추가해주기 (코노리님 포인트 레벨 표시 애드온 이용)

꿀팁관리소장 — Mon, 25 Oct 2021 17:28:01 +0900

회원정보에 특별한 정보를 추가해 주기 위해 주로 회원정보 스킨을 수정해서 정보를 추가해 주기 마련인데요. 이 경우 기본 스킨을 사용할 경우 코어 업데이트 때 마다 수정해야 하는 불편이 따를 수 있습니다.

오늘 잔머리를 굴려보다가 코노리님께서 배포하신 회원정보에 포인트,레벨 표시해 주는 애드온에 내가 출력하고 싶은 내용을 추가해 주면 될 것 같아 추가해 주었습니다.

제가 추가한 것을 블로그 기능으로 해당 회원의 블로그 주소를 출력해 주도록 해보았습니다.

애드온의 코드에

회원정보를 가져오는 코드를 추가해 줍니다.

$thismemberInfo = getModel('member')->getMemberInfoByMemberSrl($member_srl);

그리고 여기서 닉네임만 사용하면 됩니다.

닉네임까지 추가한 블로그 주소를 완성해 줍니다.

$show_blog = "<a href='/@$thismemberInfo->nick_name'>https://rxtip.kr/@$thismemberInfo->nick_name</a>";

지금 표시해 드린 부분에 넣으시면 유지관리하기 편리하겠죠.

다음 실제 정보를 출력해주는 부분에 지금 정보를 출력해주도록 추가해 줍니다.

       $melist = new stdClass;
       $melist->title = '블로그';
       $melist->value = $show_blog;
       $displayDatas[] = $melist;

위치는 아래 이미지를 보시고 찾아서 넣어보세요.

요렇게 애드온에서 처리를 해주면 이제 기본회원정보 스킨을 사용하는 경우 코어 업데이트시 신경을 쓰지 않아도 됩니다.

블라인드 모듈 블라이드 게시글 목록에서 섬네일이 나오는게 신경쓰일 경우

꿀팁관리소장 — Sun, 24 Oct 2021 16:46:05 +0900

블라인드 모듈로 특정 회원을 블라인드 할 경우 해당 회원의 글은 목록에서 '블라인드 처리된 글입니다.' 라는 문구가 제목+내용에 표시가 됩니다.

그런데 섬네일을 함께 제공하는 목록일 경우 섬네일이 보여서 블라인드 한 입장에서 뭔가 부족하다는 느낌을 받을 수도 있고 섬네일 조차도 보여주지 않아야 할 것 같아 처리해 봤습니다.

스킨의 섬네일을 출력하는 곳을 찾아서

cond="strip_tags($document->getTitle()) !='블라인드 처리된 글입니다.'"

이렇게 조건을 걸어주면 블라인드 처리되어 제목이 '블라인드 처리된 글입니다.' 라는 글은 목록에서 섬네일이 출력되지 않을 수 있습니다.

섬네일을 감싸고 있는 곳을 잘 찾아서 해당 부분에 조건을 걸어주시면 됩니다.

본문에 게시글 스크랩 버튼 추가하기 (스크랩 여부에 따라 스크랩하기 취소하기 토글기능)

꿀팁관리소장 — Thu, 14 Oct 2021 10:55:35 +0900

본문 열람시 해당글을 스크랩할 수 있는 스크랩 버튼이 없는 경우도 있고 있어도 스크랩만 지원하고 스크랩 취소를 지원하지 않는 경우가 많습니다. 지금 이 글을 보여주는 스케치북 스킨에는 스크랩 버튼 자체가 없어서 추가가 필요한데요. 제가 추가한 코드를 팁으로 제공해 드립니다.

로그인한 회원의 스크랩한 문서를 쿼리해서 해당 데이터에 있는 글이면 스크립했음으로 표시하고 스크랩취소 버튼을 제공하고 스크립한 데이터에 없는 게시글이라면 스크랩 버튼을 제공하게 했습니다. 즉시 반영과 토글을 위해 새로고침이 발생하도록 했습니다.

그리고 비로그인에게는 작동하지 않도록 했고 버튼이 보이지도 않습니다.

스케치북 _read.html 파일의 게시글 추천,비추천,신고 버튼을 보여주는 코드 아래에 스크랩 버튼 제공코드를 추가해 줍니다.

를 찾으시면 빨리 찾으실 수 있을 겁니다.

{@ // 스크랩 }

   {@
   $args = new stdClass();
   $args->document_srl = $oDocument->document_srl;
   $args->member_srl = $logged_info->member_srl;
   $scrapdocs = executeQuery('member.getScrapDocument', $args);
   $scrapdocs_count = 0;
   $scrapdocs_count = $scrapdocs->data->count;
   }

<a cond="$is_logged" href="#" onclick="doDeleteScrap({$document_srl});return false;" class="bd_login" style="border:2px solid #d3447f;color:#ffffff;background-color:#f189a9;">
   <b><i class="fa fa-bookmark" aria-hidden="true"></i></b>
   <span>스크랩함</span>
</a>
   
<a cond="$is_logged" href="#" onclick="doAddScrap({$document_srl});return false;" class="bd_login" style="border:2px solid #{$mi->color};color:#{$mi->color};">
   <b><i class="fa fa-bookmark-o" aria-hidden="true"></i></b>
   <span>스크랩</span>
</a>
   
   <script>
   function doDeleteScrap(document_srl) {
       var params = new Array();
       params['document_srl'] = document_srl;
       exec_json('member.procMemberDeleteScrap', params, function() { alert('스크랩을 취소했습니다.');location.reload(); });
   }

function doAddScrap(document_srl) {
       var params = new Array();
       params['document_srl'] = document_srl;
       exec_json('member.procMemberScrapDocument', params, function() { alert('스크랩 등록했습니다.');location.reload(); });
   }
   </script>

* 이글을 쓰고 있는 현재 시점에서 코어에 버그가 있어 스크랩을 등록한 후 함수가 작동하지 않는 문제가 있습니다. 스크랩 등록했습니다. 라는 커스텀된 문구와 새로고침이 일어나야 하는데 되지 않습니다. 이는 코어가 고쳐지기 전까지는 코어에서 한줄을 주석해주세요.

https://github.com/rhymix/rhymix/blob/master/modules/member/member.controller.php#L402

버전에 따라 라인수가 바뀔 수 있고 버그가 수정될 수 도 있으니 이후 이부분 참고해주세요.

//$this->setError(-1);

주석처리

* 위 주석처리 해야 하는 부분이 라이믹스 2.0.17 에서 반영되어 주석처리할 부분이 없어져서 조치가 필요하지 않습니다.

통합게시판(타임라인 모듈) 의 게시글도 사이트운영관리 모듈의 설정에 따라 글 열람 제한하기

꿀팁관리소장 — Tue, 05 Oct 2021 14:03:21 +0900

통합게시판을 이용하다보면 다른 모듈에서 컨트롤 하는 부분이 작동하지 않는 경우가 있습니다.

예를 들면 사이트운영관리 모듈에서 각 게시판(모듈) 별로 활동내역에 따라 권한을 부여하는 경우 통합게시판에서 글 열람할 경우에는 이게 먹히지 않습니다.

- 원 게시판의 제한 설정이 되어 있다면 해당 글은 제한이 됩니다. 하지만 통합게시판 전체를 컨트롤 할 수는 없습니다.

이게 무슨 이야기인가 하면 타임라인모듈 또는 라이믹스 통합게시판 기능으로 통합게시판을 운영할때 여러 게시판을 모아놓은 통합게시판의 게시글 열람 권한을 사이트활동모듈을 이용해서 설정 기간동안 글 N개, 댓글 N개, 레벨 을 만족해야 글 열람이 가능하도록 하고 싶어도 할 수 가 없습니다.

왜냐면 사이트운영관리 모듈에서 해당 글이 읽혀질때 해당 문서의 원래 모듈(게시판)이 사이트운영관리 모듈에 활동제한 설정이 있는지 확인을 하고 그에 따라 제한을 하기 때문입니다.

- 라이믹스 2.0 통합게시판 에서는 문서 열람시 이 코드의 도움 없이도 사이트운영관리 모듈의 통합게시판의 설정에 따라 연동이 되고 있음을 확인했습니다. 문서정보가 가지는 모듈정보는 분명히 원게시판의 모듈정보를 가리키고 있으나 다른 변화가 있는 듯 합니다.

뭐 원글이 제한이 잘되니 문제는 없는 것 처럼 이해될 수 있지만 지금 원하는 것은 그게 아니고 통합게시판 전체를 특정 활동내역의 기준으로 글 열람을 하지 못하도록 하려고 하는 것입니다.

그런데 이렇게 되려면 사이트운영관리 모듈의 설정에서 통합게시판의 게시글 열람 제한 조건을 입력하고 이 입력에 따라서 통합게시판의 모든 게시글이 이 조건에 따르도록 해주어야 합니다.

사이트운영관리 모듈에서 제한하는 코드를 통합게시판의 게시글 열람 권한을 확인하는 애드온 등에 이식해 주어서 똑같이 통합게시판의 전체글을 활동내역에 따라 열람을 허용할 수 있게 할 수 있습니다.

제가 배포한 통합게시판에서 원게시글의 게시판의 글 열람 권한에 따라 통합게시판의 글 열람도 똑같이 권한을 부여할 수 있도록 해주는 애드온에 지금 팁으로 작성하는 코드를 넣으면 제일 좋습니다.

https://rxtip.kr/download/17680

그리고 최근 배포한 통합게시판을 이용한 블로그 기능 제공 애드온에도 똑같은 기능이 제공되고 있으니 이 애드온을 이용하시는 분들도 애드온에 코드를 넣으시면 됩니다.

https://rxtip.kr/download/17680

애드온의 코드를 열어보시면 원 게시글의 게시판 열람권한을 확인후 열람권한을 부여받지 못한 방문자에게는 권한이 없다는 메시지를 보여주고 게시글 열람을 차단하는 코드가 있습니다.

여기에 한가지 더 사이트운영관리 모듈의 설정을 게시글의 원게시글 모듈이 아닌 지금 현재 통합게시판의 설정을 확인한 후 그에 맞게 제한하거나 혹은 허용하는 것을 추가해 주는 것 입니다.

코드를 추가하지 않으면 사이트운영관리 모듈에서 통합게시판의 게시글을 열람하려면 작성 글 N개 가 필요하다고 설정을 하여도 사이트운영관리 모듈에서 통합게시판 글을 열람할때 이 게시글이 통합게시판에 포함된 글인지 모르기 때문에 원게시글의 게시판의 설정만 참조하고 통과가 되어 버립니다.

$module_config = $oModuleModel->getModuleConfig('sitemanagement');

$timeline_module_info = $oModuleModel->getModuleInfoByMid(Context::get('mid'));
$timeline_module_srl = $timeline_module_info->module_srl;
$module_part_config = $oModuleModel->getModulePartConfig('sitemanagement',$timeline_module_srl);

if(($logged_info->is_admin == 'Y') && $module_config->limit_access_admin_pass == 'yes') return;
//회원레벨 구함 (설정값 존재시)
if($module_part_config['limit_access_module']['level'] || $module_part_config['limit_access_document']['level']){
   if($logged_info){
       $oPointModel = &getModel('point');
       $point_config = $oModuleModel->getModuleConfig('point');
       $member_point = $oPointModel->getPoint($logged_info->member_srl);
       $member_level = $oPointModel->getLevel($member_point, $point_config->level_step);
   }
}

//작성한 게시물 수 가져옴 (설정값 존재시)
if($module_part_config['limit_access_module']['doc'] || $module_part_config['limit_access_document']['doc']){
   if($logged_info){
       $args = new stdClass();
       $args->regdate_more = $module_part_config['limit_date'] ? date('Ymd',strtotime(sprintf('-%s days', $module_part_config['limit_date']))) : '';
       $args->member_srl = abs($logged_info->member_srl);
       $member_doc_count = executeQuery('sitemanagement.getDocumentCountByMemberSrl', $args)->data->count;
   }else{
       $member_doc_count = 0;
   }
}

//작성한 덧글 수 가져옴 (설정값 존재시)
if($module_part_config['limit_access_module']['com'] || $module_part_config['limit_access_document']['com']){
   if($logged_info){
       $args = new stdClass();
       $args->regdate_more = $module_part_config['limit_date'] ? date('Ymd',strtotime(sprintf('-%s days', $module_part_config['limit_date']))) : '';
       $args->member_srl = abs($logged_info->member_srl);
       $member_com_count = executeQuery('sitemanagement.getCommentCountByMemberSrl', $args)->data->count;
   }else{
       $member_com_count = 0;
   }
}
//레벨확인
if($module_part_config['limit_access_document']['level'] && $module_part_config['limit_access_document']['level'] > $member_level){
   $message = "레벨 부족으로 인해 접근이 제한되었습니다.\n".$module_part_config['limit_access_document']['level'].' 레벨 이후 접근이 가능합니다.';
   if(!Context::get('logged_info')) $message = '로그인이 필요합니다';
   header("Content-Type: text/html; charset=UTF-8");
   alertScript($message);
   echo '<script type="text/javascript">history.back()</script>';
   Context::close();
   exit;
}
//게시글수 확인
if($module_part_config['limit_access_document']['doc'] && $module_part_config['limit_access_document']['doc'] > $member_doc_count){
   $msg_date = $module_part_config['limit_date'] ? $module_part_config['limit_date'].'일간 ' : '';
   $message = "활동 부족으로 인해 접근이 제한되었습니다.\n".$msg_date.'게시글 '.$module_part_config['limit_access_document']['doc'].'개 댓글 '.$module_part_config['limit_access_document']['com']."개 이상 작성 후 접근이 가능합니다.\n현재 작성한 게시글 ".number_format($member_doc_count).'개 댓글 '.number_format($member_com_count).'개 입니다.';
   if(!Context::get('logged_info')) $message = '로그인이 필요합니다';
   header("Content-Type: text/html; charset=UTF-8");
   alertScript($message);
   echo '<script type="text/javascript">history.back()</script>';
   Context::close();
   exit;
}
//댓글수 확인
if($module_part_config['limit_access_document']['com'] && $module_part_config['limit_access_document']['com'] > $member_com_count){
   $msg_date = $module_part_config['limit_date'] ? $module_part_config['limit_date'].'일간 ' : '';
   $message = "활동 부족으로 인해 접근이 제한되었습니다.\n".$msg_date.'댓글 '.$module_part_config['limit_access_document']['com']."개 이상 작성 후 접근이 가능합니다.\n현재 작성한 댓글 ".number_format($member_com_count).'개 입니다.';
   if(!Context::get('logged_info')) $message = '로그인이 필요합니다';
   header("Content-Type: text/html; charset=UTF-8");
   alertScript($message);
   echo '<script type="text/javascript">history.back()</script>';
   Context::close();
   exit;
}

추가하는 곳으로 표시해 드린 곳에 이 코드 전체를 넣어주어서 사이트운영관리 모듈에서 체크하지 못한 것을 모듈의 정보를 통합게시판의 모듈정보로 한번더 설정확인 과 그에 따른 제한을 하게 하는 것 입니다.

이렇게 해주면 사이트운영관리 모듈에서 원하는 통합게시판에 원하는 게시글 열람 기준 설정을 해주면 통합게시판의 글 열람시 활동기준에 맞지 않는 방문자는 통합게시판의 모든 글을 열람하지 못하게 됩니다.

이번 팁에서 가장 중요하게 볼 부분은 사실 굵게 표시해 드린 부분입니다. 기존에 사이트운영관리 모듈에서 현재 글이 어떤 모듈의 글인지 확인할 경우 문서의 모듈정보를 따라가기 때문에 원게시글의 원래 게시판 모듈의 소속글로 확인되는 것이 맞습니다.

하지만 이렇게 될 경우 타임라인의 소속된 모든 게시판의 사이트운영관리 모듈에서 제한이 동일하게 되어있거나 해야 활동내역으로 제한이 가능해지는 불가능한 상황입니다.

그래서 이렇게 통합게시판의 게시글을 열람하는 순간 권한을 체크하는 코드가 있는 곳에 통합게시판의 전체설정을 따르도록 하는 코드를 구현해 두면 쉽게 가능해집니다.

** 라이믹스 2.0 주의사항 **

테스트를 위해서 라이믹스 꿀팁에 통합게시판을 임시로 만들어 테스트를 해 보았는데 이 코드 추가 없이 라이믹스 2.0의 통합게시판에서 문서 열람시 사이트운영관리 모듈에서 통합게시판 설정의 제한에 따라 문서열람의 제한이 되고 있습니다.

따라서 라이믹스 2.0 사이트에서는 이 기능 자체가 필요없을 수 있습니다.

라이믹스 2.0 + 타임라인 모듈의 통합게시판에서도 동일한 결과가 나오는지는 확인이 필요할 수 있겠습니다.

이 코드를 추가한 시연용으로 보여드리려고 했는데 코드 없이 사이트운영관리 모듈의 설정에 따라 제한이 되는 것을 보여드리게 되었네요.

https://rxtip.kr/test_merge

라이믹스 2.0.15 업데이트 후 글쓰기 확장변수 입력 항목 디자인이 틀어지는 문제

꿀팁관리소장 — Wed, 29 Sep 2021 14:43:49 +0900

게시판 마다 게시글 본문 외 확장변수로 입력을 받는 경우가 있습니다. 한줄입력,이메일,전화번호,url 등 다양한 입력을 받을 수 있는데요. 이 입력란의 디자인이 라이믹스 2.0.15 업데이트 후 틀어지는 경우가 있을 겁니다.

경우에 따라서는 디자인 외 기능이 작동하지도 않을 수 있습니다.

이유는 해당 입력 input의 타입이 모두 text 에서 개별적인 특성에 맞춰 세분화 되어 새롭게 변경이 되었기 때문입니다.

각 입력항목에 맞춰 디자인을 다르게 하거나 할경우 input의 type="text" 이 값에 의존하여 이 항목에 일괄적으로 css name을 추가하거나 기능을 제어했던 스킨들의 경우 text 타입을 버리고 새로운 type으로 변경된 이메일,전화번호,url 등에는 기존의 의도했던 css name이 추가되지 못하고 또 해당 클래스로 제어했던 부분도 제어하지 못하게 됩니다.

그리고 해당 변경사항을 적용하면서 text 타입의 경우 기존에 부여했던 class 명 "text" 가 누락되는 버그가 생겼습니다.

https://github.com/rhymix/rhymix/issues/1791

해당 이슈로 인해 위 버그는 개발자 버전에서는 해결이 되었습니다.

일단 input의 타입이 변경이 되면서 기존방식으로 css name 추가가 불가능해지거나 혹은 css의 기준이 되는 것에서 제외되는 스킨들은 변경된 type의 class로 새롭게 디자인이 적용되도록 css에 추가해주거나 js 에서 추가를 해주어야 합니다.

스케치북 스킨의 경우는 기존에 .itx 라는 클래스를 input type "text" 를 가지면 추가가 되도록 js에서 컨트롤 하고 있었습니다.

text 타입을 잃게 된 나머지 타입에도 .itx 가 부여가 되도록 조치를 해주어야 합니다.

/modules/board/skins/sketchbook/js/editor.js

파일을 열어보시면

// Extra Form
   var ex = $('.bd .exForm');
   ex.find('input[type=text]').addClass('itx');
   ex.find('input[type=button]').addClass('bd_btn');

위와 같이 itx 를 추가해 주는 코드가 있는데 여기에 새로운 타입을 추가해 줘야 합니다.

// Extra Form
   var ex = $('.bd .exForm');
   ex.find('input[type=text]').addClass('itx');
   ex.find('input[type=url]').addClass('itx');
   ex.find('input[type=tel]').addClass('itx');
   ex.find('input[type=email]').addClass('itx');
   ex.find('input[type=button]').addClass('bd_btn');

제가 파악한 바로는 일단 3가지 타입 정도만 추가를 해주면 현재로선 기존에 의도된 디자인에서 틀어지는 것이 없는 것 같습니다. 새롭게 발견이 된다면 조치를 쉽게 할 수 있을 겁니다.

스케치북과 같이 js에서 따로 컨트롤 하는 것이 없다면 css 파일을 열어서

.text 로 컨트롤 했던 부분 중 이번에 타입이 변경되어 코어에서 기본으로 제공하던 .text 클래스명을 가지지 못하는 것들에 대응을 해줘야 합니다.

이번 패치로 기본스킨에 적용되는 부분을 참고하시면 됩니다.

https://github.com/kijin/rhymix/commit/9b5ebb3a797ccc941e9222675a13e9d1f7ef36b3

라이믹스 버전에 따라 다른 코드진행을 하기 위한 버전 비교 함수

꿀팁관리소장 — Wed, 22 Sep 2021 22:22:09 +0900

version_compare();

함수를 이용해서 현재 라이믹스코어와 지정한 버전과 비교하여 비교한 결과를 리턴해주어 해당 리턴값에 따라 분기를 처리할 수 있습니다.

참고로 라이믹스 버전은 RX_VERSION 변수에서 확인이 가능합니다.

제가 아직까지 라이믹스 1.9.9.9 버전을 유지하는 커뮤니티가 하나 있습니다. 제가 주력으로 운영하는 커뮤니티 이지만 사이트에 사용하는 푸시앱이 라이믹스 2.0에 아직 대응을 하지 못하고 있어 현재 라이믹스2 로 업데이트를 하지 못하고 있는데요.

여기에 사용한 애드온 코드 중 라이믹스 2.0에서는 주소형태가 바뀌어서 다른 코드로 바뀌어야 할 부분이 있는데 라이믹스 2.0 업데이트 후에 고치려고 했으나 제가 까먹을 수도 있고 미리 버전을 확인하고 알아서 버전에 맞게 코드가 진행되도록 해 두면 편할 것 같아 오늘 이 함수를 이용해 코드를 작성했습니다.

if(version_compare(RX_VERSION, '2.0', '>=')) {

라이믹스 2.0 이상에서 사용될 코드

}else{

라이믹스 2.0 미만에서 사용될 코드

}

만약 라이믹스만을 위한 자료가 아닌 XE에서도 사용이 가능한 자료라면 XE에서도 오류 없이 작동할 수 있도록 코어 버전 변수를 바꾸어야 합니다.

if(version_compare(__XE_VERSION__, '2.0', '>=')) {

라이믹스 또는 XE 2.0 이상에서 사용될 코드

}else{

라이믹스 또는 XE 2.0 미만에서 사용될 코드

}

XE 코어에서 2.0 버전이 나올 가능성은 제로에 가까우므로 아마도 위 버전비교도 계속 유효하게 될 것 입니다.

라이믹스 댓글 이동시 fixed header에 댓글이 가리는 부분 스크립트로 해결해보기

꿀팁관리소장 — Sat, 18 Sep 2021 13:21:42 +0900

제가 사용하는 레이아웃과 게시판 스킨이 본문을 열람할때 상단의 헤더가 유지되는 경우가 있습니다. 위젯 등에서 댓글을 클릭하고 이동을 하게 되면 해당 댓글이 상단에 위치해서 바로 선택한 댓글을 바로 확인 할 수 있습니다. 그런데 헤더가 가리는 경우는 다시 스크롤을 조정해야 하는 불편이 생기는데요.

이를 스크립트로 한번 위치를 재조정해 보았습니다.

위젯에서 댓글 링크를 클릭했지만 본문을 출력하는 곳에서 헤더가 가려버립니다.

스크립트를 댓글을 출력하는 파일에 추가해 주었습니다.

참고로 저는 modules/board/skins/rx-flextagram/components/comment/comment.html

이 파일의 하단에 추가를 해 주었습니다. 위 flextagram 의 문제를 해결하기 위해서 입니다.

$('a[href*="#comment_"]').click(function(){
var t = $(this).attr("href").replace(/.*#comment_/,'');
t = '#comment_' + t;
target = $(t);
var position = target.offset().top - 80;
$("html, body").animate({ scrollTop: position }, 100);
});
});
</script>

비슷한 코드가 두번 등장하는 이유는 위젯에서 처음 클릭해서 해당 문서 열람 페이지로 이동할때 작동을 해서 클릭한 댓글의 위치를 잘 보이게 조정을 해주었는데 이때 다시 한번 위젯에서 다시 클릭하게 되면 작동을 하지 않아서 아래 코드를 추가했습니다.

아래 코드는 클릭을 감지해서 작동하는 방식의 추가적인 작업을 추가해 준 것입니다. 이렇게 해서 언제 클릭하더라도 위치 조정이 되게 했습니다.

제가 클라이언트 언어에 깊숙히 잘 알지 못해서 코드를 작성해서 시연해 보고 안되는 부분은 그냥 추가한 것이니 더 좋은 방법이 있을 수도 있습니다.

위 코드에 등장하는 80 은 헤더의 높이에 따라 조정해서 사용해야 하고, 100의 경우는 스크롤 되는 속도를 조정할 수 있습니다.

url에서 선택한 댓글의 id를 추출하하는 코드는 알림센터에서 사용하는 js에서 그대로 차용했습니다.

라이믹스 글 작성 시 금칙어 적용이 확장변수에도 적용이 되어야 할 경우도 있습니다.

꿀팁관리소장 — Tue, 14 Sep 2021 23:17:56 +0900

지나치게 글 작성자에게 제한을 하는 것은 작성자에게 좋은 경험이 될 수 없지만 때로는 운영상 꼭 금지해야 하는 것들이 있을 수 있습니다. 그중 금지해야 할 것들을 작성자가 스스로 하지 않는 것을 기대하고 또 발견이 되었을때 규칙에 위반사항을 고지하며 하는 행위는 회원과 운영자간 마찰이 생기기 쉬운 방법입니다.

그래서 운영자 입장에서는 금지해야 할 것들은 기계적으로 가능하지 않도록 해주는 것이 좋습니다.

그런 방법 중 하나가 금칙어를 라이믹스의 스팸필터에 등록을 해서 해당 키워드가 문서에 포함되면 글이 등록이 되지 않도록 해주는 것 입니다.

그런데 문제는 작성자로부터 입력 받는 부분이 제목,내용 뿐 아니라 확장변수에 입력을 받아야 하는 경우가 있습니다.

예를 들면 구매정보에 관한 글을 작성하도록 하는데 해당 구매처의 URL을 공유할 수 있도록 하는 경우입니다.

그런데 특정 URL을 금지해야 할 경우가 사이트에 따라서는 있을 수 있습니다. 이런 경우 스팸필터에 의존할 수 없습니다. 확장변수를 체크하지 않기 때문인데요.

저도 마침 이부분이 필요해서 기존에 금칙어를 다루는 애드온에 확장변수 부분을 추가해 주었습니다.

물론 제가 금칙어 등록을 방지하는 애드온을 만들어 배포하는 것이 아니고 또 제가 작업한 부분이 기존 사용중인 애드온에 확장변수 정도 추가한 것이라 이 글에서 방법을 구체적으로 알려드리긴 어려울 것입니다. 하지만 대략 이런 문제가 있고 해결이 가능하다는 취지의 글을 작성하고 있습니다.

보통은 글 작성후 등록버튼을 누르면 글이 DB에 입력되기 직전 글 제목,내용에 금칙어가 포함되어있는지 확인후 있으면 메시지를 띄우고 중지 시키는 애드온을 많이 사용합니다.

이경우

Context::get('title');

Context::get('content');

이렇게 제목,내용을 가져와서 정규식으로 미리 지정한 금칙어가 있는지 확인하는 과정을 거칩니다.

그래서 저는 확장변수 첫번째,두번째 까지도 똑같이 정규식으로 금칙어를 확인하는 작업을 하도록 코드를 똑같이 작성해 주었습니다.

Context::get('extra_vars1');

Context::get('extra_vars2');

기존에 제목,내용을 확인해서 금칙어가 있다면 중지시키고 메시지를 반환하는 코드에 똑같이 확장변수 부분만 대입해서 코드를 똑같이 작성해 주면 되니 복붙 수준이죠.

활용할 수 있는 부분은 개인이 수익을 얻기 위한 링크를 금칙어로 등록을 시키면 확장변수,제목,내용,댓글 어디에도 작성할 수가 없게 되는 것이죠.

라이믹스 게시판 스킨 현재 읽고 있는 글 목록에 표시해 주기

꿀팁관리소장 — Mon, 06 Sep 2021 10:22:20 +0900

간혹 보면 글 읽기 화면에 글 목록을 제공하면서 현재 읽고 있는 글이 어떤 글인지 표시가 나도록 처리해 주지 않은 스킨들이 있습니다. 이게 제법 불편한 상황이 되는데요. 이유는 내가 읽고 있는 글 다음 글을 찾거나 이전글을 찾기 위해서는 목록에서 현재 읽고 있는 글이 표시가 나야 합니다.

제가 블로그,회원소통,파트너쉽 게시판에 사용하고 있는 스킨이 그러한 경우인데요.

이런 경우 직접 수정해서 표시가 나도록 해볼 수 있을 겁니다.

그냥 간단하게 해당목록에 백그라운드 컬러로 표시가 나도록 만 해보았습니다. 표현하는 방법은 다양하게 각자 취향에 맞체 추가를 할 수 있겠죠.

일단 목록단위의 엘리먼트가 무언지 덩어리를 찾으셔야 합니다. 개발자도구를 보셔도 쉽게 구분이 되고 소스를 보셔도 금방 알아챌 수 있습니다. 목록이라는 것은 반복문으로 글번호만 바뀌면서 출력되는 반복문에서 사용됩니다.

이 반복을 하는 단위를 찾으면 되는데....

소스에서 보실때는 list 를 당당하는 파일에서

<li loop="$document_list=>$no,$document">

이런식으로 loop 로 반복을 시키는 케이스가 있고

foreach 로 반복시키는 케이스가 있고 합니다. 유심히 보시면 어떤 것인지 확인하실 수 있습니다.

<li loop="$document_list=>$no,$document"> 케이스를 예를 들면

<li loop="$document_list=>$no,$document" style="background-color:#f8f9fa;">

이런식으로 현재의 읽고 있는 글번호와 목록의 글번호가 일치할때 style="background-color:#f8f9fa; 의 백그라운드 컬러가 적용되도록 조건을 걸어 코드를 작성하면 됩니다.

여기서 주의점은 조건문은 앞쪽의 코드와 붙여서 작성하고 조건문 안의 코드는 공백 하나를 띄워주고 작서을 해야 합니다.

이유는 조건문은 실제 브라우저에는 적용되지 않고 조건으로만 사용되고 조건이 일치하면 조건문 안의 것이 브라우저에 적용이 될텐데 이때 공백이 없으면 앞쪽 코드와 붙어버려서 에러가 나거나 의도한 작동이 되지 않는 무의미한 코드가 되어버립니다.

**주의 사항**

위와 같인 style을 직접 적용하면 다크모드에 대응하기 어렵습니다.

귀찮더라도 조건을 걸어 class 명을 부여하여 해당 class에 css를 적용하여 다크,라이트 모드에 대응하는 색상이 적용되도록 해야 바람직합니다.

<li loop="$document_list=>$no,$document" class="selected">

기존에 class가 부여되지 않아 새롭게 만드는 케이스로 selected 라는 class명이 부여되도록 했습니다.

기존에 이미 사용할 class가 부여된 경우

class="abcd"

<li loop="$document_list=>$no,$document" class="abcd selected>"

새롭게 부여된 .selected 에 필요한 효과(배경색 등)를 css에서 처리해 주면 되겠죠?

자동첨부 애드온으로 첨부된 GIF 파일이 GIF CONVERT PRO 모듈로 MP4로 변환되지 못하는 문제 해결

꿀팁관리소장 — Sun, 05 Sep 2021 12:13:14 +0900

고용량인 효율이 낮은 GIF 에니메이션 파일을 MP4로 변환해 주는 유료 모듈인 GIF CONVERT PRO의 경우 글 작성,수정시에 gif 에니메이션 파일을 작은 용량의 MP4로 변환을 해줍니다.

물론 라이믹스의 기본 기능에도 MP4 변환 기능이 있어 유료 모듈을 구입할 필요는 없지만 원본을 유지해주는 기능등이 제공되고 있어 구입하여 사용하거나 혹은 라이믹스 기본 기능으로 제공되기 전에 구입해서 사용하시는 분들이 계실 것입니다.

참고로 이 자료는 암호화되어 제공되어 개발자의 적극적인 기능개선 패치 등이 이루어지지 않으면 기능개선이나 버그패치 등을 사용자가 할 수 없는 구조라 구입은 추천하지 않습니다.

이미 구입하신 분들께 자동첨부 애드온으로 첨부된 GIF 파일이 고용량 GIF파일로 남고 MP4로 변환되지 못하는 문제를 모듈에서 패치가 반영되지 않아 애드온으로 해결하는 팁을 제공해 드리려고 합니다.

외부의 글을 복사해서 붙여넣기 하면서 gif 움짤을 함께 복사해 온 경우 자동첨부 애드온을 사용해서 본서버로 업로드 하려는 운영자가 많을 겁니다. 외부 이미지를 사이트 서버에 첨부하지 않으면 원 게시글이 삭제되면 해당 이미지는 보이지 않게 되기 때문인데요.

그래서 자동첨부 애드온을 사용해서 그리고 gif도 첨부를 선택했기 때문에 발생되는 문제이기 때문에 자동첨부 애드온에서 추가적인 작업을 해주도록 코드를 추가해 주는게 제일 좋은 선택입니다.

addons/autoattach/autoattach.addon.php

위 파일을 열어사 파일의 하단에 아래의 코드를 넣어주세요.

if ($called_position === 'before_module_proc' && Context::get('document_srl') && preg_match('/^disp[A-Z][a-z0-9_]+Content(?:View)?$/', $this->act))
 {
 $document_srl = Context::get('document_srl');
 if (!$document_srl) return;
 $oDocumentModel = &getModel('document');
 $oDocument = $oDocumentModel->getDocument($document_srl);
 $have_file_list = $oDocument->getUploadedFiles();
 
 if ($have_file_list && time() - $oDocument->getRegdateTime() < 120) {
 $content = $oDocument->get('content');
 if (preg_match_all('@<img\s[^>]*?src=(\'[^\']+\'|"[^"]+"|[^\'"\r\n\t\x20>]+)[^>]*?>@i', $content, $matches, PREG_SET_ORDER))
 {
 foreach ($matches as $match)
 {
 if (strpos($match[0], 'data-autoattach="success"') !== false && stripos($match[1], 'gif') !== false)
 {
 $auto_gif = true;
 break;
 }
 }
 }
 if ($auto_gif) {
 $trigger_obj = new stdClass();
 $trigger_obj->module_srl =$oDocument->get('module_srl');
 $trigger_obj->content = $content;
 $trigger_obj->document_srl = Context::get('document_srl');
 getController('z_gifconvert')->triggerupdateDocumentAfter($trigger_obj);
 }
 }
 }

불필요하게 함수를 작동시키는 것에 대한 방지책이 몇가지 들어가 있습니다. 물론 매번 함수가 작동되어도 큰 문제는 될 것은 없지만 그래도 필요할때만 동작하도록 해보았습니다.

1.첨부가 없다면 동작하지 않습니다.

2.첨부가 있는 게시글이라면 글 작성 직후 2분 동안만 작동합니다.

- 코드에서 120(초)을 변경하면 글 작성 후 원하는 시간 동안 계속 작동하게 할 수 있습니다.

- 글 작성자가 글 작성 직후 해당 게시글을 열람하게 되므로 사실은 글 작성자에 의해서 변환이 바로 되게 됩니다. 그래서 작동 시간을 120초로 제한해도 무방합니다.

3.첨부가 있고 글이 작성된지 2분이 지나지 않은 상태라면 이제 첨부파일 중에 자동첨부 애드온으로 첨부 성공한 gif 가 있는지 확인합니다. gif 가 없고 다른 파일만 있다면 이때도 함수를 동작시키지 않습니다.

라이믹스 CK에디터 툴바의 링크 버튼 제거해 주기

꿀팁관리소장 — Sat, 04 Sep 2021 12:32:06 +0900

링크 사용에 악용 또는 부작용이 있어 링크 사용 자체가 안되기 때문에 링크 버튼을 제공하는 것은 모순이 될 수 있어 제거해 보았습니다.

https://rxtip.kr/rx_tip/15821

https://rxtip.kr/rx_tip/14381

컨텐츠의 링크를 제거하는 것에 대한 관련글은 위 두개의 글입니다. 참조해 보세요.

툴바에 위치한 여러 버튼 중 저 링크 버튼을 제거할 생각입니다.

라이믹스에서 제공하는 플러그인 제거하고는 다른 버튼을 제거해야 합니다.

버튼을 제거하는 기능은 라이믹스에서 제공하지 않으므로 js로 제거 버튼을 적용해 주어야 합니다.

/common/js/plugins/ckeditor/ckeditor/

위 경로에 config.js 를 만들어주고 적용할 내용을 만들어 주어야 합니다.

기존에 적용한게 있다면 적절히 추가해 주셔야 하구요.

CKEDITOR.editorConfig = function( config ) {
config.removeButtons = 'Link';
}

위와 같은 내용을 넣어주고 config.js 를 만들어 위 경로에 업로드 해 주면 됩니다.

다른 버튼을 추가로 제거한다면 ,(콤머) 로 구분해서 추가해 주면 됩니다.

- 앞선 버튼의 이름을 먼저 적어야 합니다. 개발자도구에서 보면 버튼 이름을 확인할 수 있습니다.

- 개발자도구에서 유추되는 버튼 이름에서 단어의 첫 글자는 대문자로 해야 합니다. (ex:PasteFromWord)

- 콤머 뒤에 공백이 없어야 합니다.

적용한 사이트에서는 링크 버튼이 보이지 않게 되었습니다.

라이믹스 글 작성 시 사용된 a 링크를 제거해 주면 좋은점.

꿀팁관리소장 — Sat, 04 Sep 2021 10:46:18 +0900

물론 사용자가 링크를 특정한 곳으로 걸수 있는 링크를 사용하지 못하게 하는 제약이 어떤 경우에는 불편할 수도 있지만 url만 사용하게 하고 해당 url에 자동으로 링크를 걸어주는 것으로 링크를 걸려고 했던 목적은 충분히 달성할 수 있도록 할 수 있습니다.

https://rxtip.kr/rx_tip/14381

위 게시글에서 글을 작성할때 사용된 a링크를 자동으로 제거해 주는 것을 정규식 필터를 사용할 수 있게 해주는 애드온으로 할수 있는 팁을 제공해 드렸습니다.

숨겨진 악성링크나 의도하지 않은채 복사해 온 글에서 옮겨지는 링크 등이 문제가 발생되는 경우가 많아 방법을 찾다가 해당 방법으로 해결을 했습니다.

a 링크를 제거해 주면 운영에 도움이 되는 것 중 하나가 더 있는데요.

여러 사이트에서 퍼져서 공유되는 게시글의 경우 이미지에 링크가 걸린 경우가 많습니다. 그 이유는 각 사이트마다 해당 이미지를 클릭했을때 원본을 보여주거나 하는 등의 기능을 제공하는데 이때 링크가 걸려있습니다.

드래그로 긁어서 복사해서 붙여넣기 하여 글을 작성하게 되면 이때 이 링크가 복사되는데 이미지를 클릭하면 해당 사이트의 주소로 이동하게 되면서 정상적인 접근이 아니라는 등의 메시지를 보게 되겠죠.

처음에는 구매정보,이벤트 등을 다루는 게시판에만 제한적으로 적용을 했다가 일반 게시판에도 적용을 해야할 필요가 있어 모두 적용하면서 지금 설명드린 편리함이 추가되는 것을 알려드려고 이 글을 작성했습니다.

물론 <a herf="url">바로가기</a>

이렇게 작성하고 싶은 작성자에게는 다소 제하이 되겠지만 위 링크 작성 방법이 악용 또는 의도하지 않아도 사실과 다른 링크를 사용하게 될 소지가 다분하여 전체가 사용을 금지하는 편이 운영적인 면에서 훨씬 유리해 지게됩니다.

위와 같은 링크가 사용되지 못해 크게 문제가 될 만한 사항은 없다고 봐도 무방할 듯 하네요.

태그 연관글 애드온 띄어쓰기 된 태그의 경우 적용이 안되는 문제 해결

꿀팁관리소장 — Thu, 02 Sep 2021 16:18:57 +0900

보통은 태그 입력에 공백의 제한을 두지 않기 때문에 자연스럽게 띄어쓰기가 들어간 태그 입력이 많이 됩니다.

그런데 우연히 이 띄어쓰기가 들어간 태그는 애드온에서 검색이 안되어 관련글로 추천이 되지 못하는 것을 발견한 것 입니다.

phpmyadmin 에서는 검색이 잘 되는 것으로 보아 라이믹스 오류인가? 하고 이슈를 등록했더니.... 헐....

https://github.com/rhymix/rhymix/issues/1783#issuecomment-911280229

처음부터 잘못된 코드가 사용이 되었네요. 그리고 지금은 굳이 콤마로 연결하는 문자열로 만들지 않고 그냥 배열로 요청해도 되니 그냥 요청 자체를 바꾸는 것으로 간단히 해결이 되네요.

같은 태그가 들어간 문서가 무척 많은데 하나도 추천이 안되는게 이게 코드작성 오류였네요. 이거 꽤 오래전에 배포된 것이라...

태그 연관글 애드온의 lib.php 파일을 열어보면 쿼리할때 사용되는 코드

대략 82번째 즈음..(가지고 있는 자료마다 라인번호는 굉장히 틀리 수 있습니다.)

$args = [];
//$args['tag_list'] = $tags;
$args['tag_list'] = $tag_list;
if (count($module_srls)) {
$args['module_srls'] = implode(',', $module_srls);
} else {
$args['module_srl'] = 1;
}
$output = executeQueryArray('addons.rxp_tag_related.getDocumentListWithinTag', $args);
if (!$output->data) {
return;
}

굵게 칠한 부분을 넣어주시고 바로 윗줄을 주석처리 해주세요.

이제 많은 연관글들이 제대로 검색되어 글 하단에 추천이 되어질 겁니다.

태그 연관글 애드온 태그가 없는 글에도 연관글이 출력이 되는 문제 회피 방법

꿀팁관리소장 — Tue, 31 Aug 2021 20:48:14 +0900

태그 연관글 애드온이 태그를 사용하는 곳에서 관련된 글을 추가로 추천해 주기 좋아 즐겨 사용하고 있는데 원인을 찾기 어려운 버그 같은게 있습니다. 오늘 처리한 부분은 원글에 태그가 없는 글인데 관련된 글 목록이 출력이 되어 버립니다.

이게 모두 그런것도 아니라 원인을 찾기 어려워서 원인은 못찾고 태그가 없는 글은 원천적으로 애드온 실행을 중지 하는 것으로 해결을 해 보았습니다.

태그연관글 애드온의 경우

addon.php 에서 출력위치와 애드온 변수 정도를 결정하고

실제 문서의 태그와 연관된 글을 수집하는 것은 lib.php 파일에서 담당을 합니다.

addon.php 파일에서 lib.php 파일을 불러오는 형식입니다.

그런데 태그가 없는 문서는 작업을 중단하는 코드가 있는데 이게 어떤 글에서는 그냥 엉뚱한 글이 수집이 되어 버리는데 함수들이 복잡하게 엮여 있어 원인을 찾기 어렵네요.

그래서 lib.php 에서 문서에 태그가 없는 경우 리턴 시키는 작업을 그대로 addon.php 에도 적용해 주어서 태그가 없는 문서는 아예 lib.php 를 불러오는 것은 물론 애드온 자체가 실행이 되지 않게 해주었습니다.

기존에

if ($called_position !== 'before_display_content') {
return;
}

// 변수 정리

이렇게 진행되는 상단부분의 코드에

if ($called_position !== 'before_display_content') {
return;
}

$document_srl = Context::get('document_srl');
if (!$document_srl) {
return;
}

$oDocumentModel = getModel('document');
$oDocument = $oDocumentModel->getDocument($document_srl);

$tags = $oDocument->get('tags');
// 태그가 없으면 종료
if (!$tags) {
return;
}
$tag_list = explode(',', $tags);
if (!count($tag_list)) {
return;
}

// 변수 정리

위와 같이 태그가 없는 경우 리턴하는 코드를 작성해 주어 태그가 없으면 이후 코드가 아예 진행되지 않도록 해서 따로 관련글을 수집하는 함수가 있는 파일 로딩 자체도 안되고 아무것도 하지 않게 조치 했습니다.

*문서에 태그가 있는지 확인하는 코드는 애드온에서 이미 사용한 코드 그대로를 차용했습니다.

페이지 목록에서 게시글 읽기 에 접근하여 목록으로 돌아갈때 페이지 변수를 없애는 경우

꿀팁관리소장 — Tue, 24 Aug 2021 14:48:24 +0900

개인적으로 본문을 읽는 화면의 하단에 목록을 제공해 주는 것을 선호합니다. 그렇게 구성되지 않은 스킨의 경우 조건을 걸어 출력을 하지 않았던 목록을 조건을 제거하여 출력하도록 해서 방문자들에게 제공하곤 합니다.

그런데 스킨을 디자인 한 분의 의중이 들어가 있는 부분 중 제가 선호하는 것과 약간 다른 것들이 종종 발견되는데 오늘은 글 읽는 화면에서 다시 목록으로 바로 돌아가고 싶을때 제공하는 목록으로의 url에 관해 이야기를 해 보려고 합니다.

게시판의 접근하여 특정한 페이지에 서 읽고 싶은 글을 선택하여 글 읽기에 진입을 했습니다.이때 url에는 page를 구분하는 값이 담겨져 있습니다. 그냥 이해를 쉽게 하기 위해 그냥 변수라고 부르겠습니다.

2페이지에 있는 글을 읽을때는 ?page=2 또는 &page=2 의 형태로 현재 접근하고 싶은 페이지를 전달하여 방문자가 원하는 페이지를 보여주게 됩니다.

그런데 제가 블로그,소통광장에 사용하는 스킨의 경우

목록으로 가기를 누르면 지금 표시한 부분의 페이지에 해당하는 변수를 제거한 주소를 제공해서 해당 게시판의 처음으로 돌아가게 됩니다.

특정 페이지의 글을 읽다가 해당 페이지의 다음 페이지 또는 같은 페이지의 다른 글을 읽고 싶어서 무심코 목록으로 가기를 누르고 다시 찾으려 의도했던 방문자는 첫페이지로 이동을 해서 방글 읽었던 글이 몇 페이지 였는지 기억을 해 내야 합니다.

제가 경험했던 대부분의 스킨으 저 페이지를 초기화 하지 않았는데 이 스킨에서 페이지가 제거되어 불편하다는 생각이 들어 찾아 보았습니다.

/modules/board/skins/rx-flextagram/components/board/board.html

위 경로의 파일에

위와 같은 코드로 목록으로 이동하는 url을 만들어주는 코드가 있습니다.

href="{getUrl('category', '', 'document_srl', '')}"

url 부분에서 page 를 제거하는 부분의 코드를 없애주어서 현재 읽고 있는 글의 페이지로 이동하게 고쳤습니다.

물론 페이지 변수를 달고 진입하지 않고 게시글 본문주소만으로 진입해서 읽게 되면 페이지를 참조할 부분이 url 자체에 없었기 때문에 게시판 처음으로 이동하게 되는 점은 참고해야 합니다.

스티커 모듈 스티커 관리자가 검토 공개 등 변경사항 저장시 tag 입력 1글자 이상 입력해야 한다고 뜨는 문제

꿀팁관리소장 — Sat, 21 Aug 2021 21:06:47 +0900

오늘 라이믹스 2.0.14 를 사용하는 사이트에 스티커모듈의 신규 스티커 세트를 등록하고 관리자 계정으로 해당 스티커세트를 검토에서 공개로 수정하려고 하니 태그(tag) 에 1글자 이상이 입력되어야 한다는 에러가 떠서 수정이 되지 않는 것을 확인했습니다.

Variable tag for column tag must contain no less than 1 characters

대략 위와 같은 메시지 입니다.

태그입력을 필수로 해야 할 이유가 없는데 왜 저 메시지가 뜨는지 여기저기 확인해 보다가 쿼리 파일에서 최소 글자수가 지정되어 있는 것을 확인하고 제거했습니다.

/modules/sticker/queries/updateStickerAdmin.xml

파일의

위 부분에서 minlength="1" 부분을 제거했습니다.

이렇게 하니 수정한 부분이 잘 저장이 되어 검토에서 공개로 전환할 수 있었습니다.

수정이 귀찮으면 태그를 넣으면 되겠습니다.

** 추가 사항 **

스티커 등록자가 스티커 수정을 할때도 동일한 문제가 있습니다.

modules/sticker/queries/updateSticker.xml

위 파일도 동일하게 제거해 주면 됩니다.

라이믹스 글 작성 시 a 태그 링크만 제거하고 텍스트만 남기기

꿀팁관리소장 — Wed, 18 Aug 2021 14:37:33 +0900

제목이 무슨 이야기인지 좀더 풀어서 이야기 하면 회원들이 사이트에 글을 작성할때 url 을 남길 수 있습니다. 직접 타이핑하는 경우는 흔치 않고 복사해서 붙여넣기를 하거나 하는 등 url 주소가 작성됩니다.

그런데 url 중 단축주소의 경우 사용을 금하는 경우가 많은데요. 이는 이 url이 실제 어디로 향하는지 알 수 없어 악의적인 혹은 수익을 목적으로 하는 링크인지 알수없고 또 사이트 자체적으로 제휴된 곳의 이동되는 링크임에도 단축추소로 인해 해당 url이 제휴링크로 변환되지 못해 사이트 수익에 악영향을 줄 수도 있어 금지합니다.

그런데 이 단축 url이 아닌 아예 링크가 걸린 경우 문제가 될 수 있습니다.

실제 텍스트에 보이는 url과 a 태그에 url이 다른 경우입니다. 겉으로 보기에는 그냥 쇼핑몰 url인데 실제 a태그에 가진 링크 속성에 수익코드 등이 들어가 있는 경우가 있을 수 있습니다.

https://naver.com

위 url이 네이버로 이동될 것 같지만 a 태그를 작성한 것이라면 ????

이는 악의적으로 하는 경우와 그냥 다른 사이트의 노출된 링크를 가져오면서 발생될 수 있는 아주 흔한 상황인데 이게 관리적인 측면에서 굉장히 소모적인 문제로 골치거리가 될 수 있습니다.

따라서 특정한 게시판에(사이트 수익과도 연관이 있고 url이 공유 되어야 하는 게시판) 본문과 댓글에 아예 a 태그가 제거되도록 할 필요가 있습니다.

a 태그가 제거가 되도라도 자동링크 애드온이나 혹은 제휴링크로 변환하는 자료 등에서 자동으로 url에 a 태그를 만들어 주니 문제가 되지 않습니다.

글 작성시 아예 a 태그만 제거된 상태의 글로 작성이 완료되어 db에 저장되도록 해야 하는데 어떻게 해볼까 찾아보다가 글,댓글 작성 단계에서 정규식 처리를 해주는 애드온이 있어 이 애드온으로 간단하게 처리를 했습니다.

문서 저장 정규식 필터 애드온 입니다.

https://xe1.xpressengine.com/index.php?mid=download&package_id=22753653

위 애드온을 설치하고 글 작성시에 정규식으로 a 태그를 제거하고 싶은 게시판을 지정하고

애드온 설정의 정규식을 위한 입력란에

array('@<a\b[^>]*>(.+?)</a>@is', '$1')

라고 넣으면 이제부터 작성되는 게시글,댓글에

로 작성된 것은 모두 '텍스트' 만 남게 됩니다.

사용된 정규식은 기진곰님께서 작성해 주셨습니다.

문서를 복사해서 붙여넣기 하면서 이런 부분이 많이 옮겨 질텐데 이때

이런 부분도 모두 보이지 않던 a 태그는 사라질 것 이기 때문에 글 작성자는 직접 url을 입력해야 한다는 것을 글 작성 후 눈치 챌 수도 있습니다.

이부분은 많은 사람들이 함께 이용하는 커뮤니티에서 링크로 인한 문제를 해결하려면 감수해야할 작은 부분이며 크게 문제되지 않을 사항으로 판단 됩니다.

물론 정규식으로 a 태그를 완벽히 제거할 수 없을 수도 있지만 거의 대부분 그리고 글 작성자도 의도하지 않은 복사붙여넣기로 인해 다른 사이트의 수익 링크가 그대로 옮겨지고 하는 일은 없어질 것 입니다.

GG뉴스레터 위젯 게시판 메일링 구독 비회원 신청 안되는 문제 해결

꿀팁관리소장 — Sun, 15 Aug 2021 15:50:47 +0900

기존에 팁으로 알려드렸던 저희 라이믹스 꿀팁의 게시판 새글 메일링 구독에 사용된 위젯이 비회원 신청에 오류가 조금 있었던 것 같습니다.

https://rxtip.kr/rx_tip/1447

오늘 다른 기능을 추가하다가 우연히 테스트 해보니 비회원은 신청한 것이 등록이 되지 않는 것을 확인했구요.

https://github.com/ForPeople/GGNewsletter/blob/master/ggnewsletter.class.php#L26

위젯 php 파일의 코드 중 위 코드에서 로그인 회원번호가 업을 경우 ' ' 공란으로 대체해주는 부분이 문제가 되었습니다.

$args->ggmailing_member_srl = $logged_info->member_srl ? $logged_info->member_srl : 0; //비회원도 가능

공란이 아닌 이렇게 직접 회원번호 0 을 넣어주게 해서 등록이 가능한 것을 확인했습니다.

그동안 많은 분들이 신청하셨을텐데 모르고 있었네요.

세진님 글 댓글 작성수 제한 애드온 제한 문구에 기간 표시해주기

꿀팁관리소장 — Sun, 08 Aug 2021 13:45:41 +0900

세진님이 배포해주신 게시글,댓글 작성수 제한 애드온의 경우 제한에 걸린 경우 메시지 출력이 "작성량 (N)개 초과입니다." 라는 문구로 되게 코딩되어 있습니다.

얼마동안의 기간인지 따로 공지를 해서 알리지 않으면 쉬게 알수 없어 사이트마다 다르게 설정할 수 있는 이 기간을 애드온 설정의 값을 가지고 와서 출력해주도록 수정해 보았습니다.

이렇게 1일 이라는 설정된 기간이 출력이 되게 해주는 것 입니다.

우선 출력 문구에 대한 메시지는 /addons/sejin7940_write_limit//lang 폴더의 언어팩 파일에서 지정되어 있습니다.

저희는 한글만 사용하므로 ko.lnag.php 파일만 열어서 수정했습니다.

$lang->msg_limit_document = '%d일 작성량(%d개)초과입니다.';
$lang->msg_limit_comment = '%d일 댓글 작성량(%d개)초과입니다.';

위와 같이 %d 를 추가해 주어 애드온 설정의 기간입력값의 변수가 대응 할 수 있도록 준비해 줍니다.

다음 애드온의 /addons/sejin7940_write_limit/sejin7940_write_limit.addon.php 파일을 열어서 문구를 출력하는 부분에 기간에 해당하는 변수를 추가해 줍니다.

Context::getLang('msg_limit_document')

Context::getLang('msg_limit_comment')

위 두가지 문구가 등장하는 모든 곳에 추가를 해 주면 됩니다.

printf("<?xml version=\"1.0\" encoding=\"UTF-8\"?>\r\n<response>\r\n<error>-1</error>\r\n<message>".Context::getLang('msg_limit_document')."</message>\r\n</response>", $addon_info->term, $addon_info->document_limit);

$output = new BaseObject(-1, sprintf(Context::getLang('msg_limit_document'), $addon_info->term, $addon_info->document_limit));

printf("<?xml version=\"1.0\" encoding=\"UTF-8\"?>\r\n<response>\r\n<error>-1</error>\r\n<message>".Context::getLang('msg_limit_comment')."</message>\r\n</response>", $addon_info->term, $addon_info->comment_limit);

제가 사용하는 자료 기준

84107,142 라인에 해당 부분이 있습니다.

글 읽기 화면 아래 글 목록 부분 표시되는 걸 선호 하시나요? flextagram 스킨의 수정

꿀팁관리소장 — Mon, 26 Jul 2021 15:25:35 +0900

개인적으로는 글 열람하는 페이지 하단에 글 목록이 함께 표시되는 것을 선호합니다. 글 하나를 읽고 같은 게시판의 다른글 예를 들면 지금 읽고 있는 글 보다 먼저 작성된 글을 읽어 내려가고자 하는 경우 목록으로 돌아가서 선택하는 작업을 하지 않아도 되어서 입니다.

물론 성향에 따라서 현재 글에만 집중을 하게 하고 간결한 것을 좋아 한다면 글 열람 페이지 하단에 아무것도 두지 않을 것 입니다. 그런데 선택은 할 수 있게 해 두는게 좋지 않나 하는 생각을 해 봅니다. 해당 스킨이 개발중인 스킨이라 이후 어떤 변경이 있을지 모르겠지만 현재로서는 글 열람 페이지에서 목록을 볼 수 없게 되어있는데 보통 이런 경우는 글 목록을 표시하는 코드에 "문서 열람페이지가 아니라면" 이라는 조건이 걸려 있기 때문입니다.

flexstagram 스킨에 이러한 부분의 코드를 제거해서 글 열람 페이지 하단에 글 목록이 보이도록 해보았습니다.

/modules/board/skins/rx-flextagram/components/board/board.html

위 파일을 열어서 보시면

{@ // 목록 }
<block cond="!$oDocument->isExists()">
<include target="../head/head.html" />


<include target="../../templates/list/list.html" />

<include target="../../templates/sns/sns.html" />

<include target="../footer/footer.html" />
</block>

글 목록을 출력하는 코드에 <block cond="!$oDocument->isExists()"> </block> 감싸져 있어서 글 읽는 페이지가 아니라면 이라는 조건이 걸려서 작동하게 되어있습니다.

이 감싸진 부분을 제거해 주면 글 읽기 화면에서도 아래쪽에 글 목록이 출력이 됩니다.

물론 현재 읽고 있는 글을 하단 목록에서 표시되게 표현해주거나 하는 것은 별도 작업이 필요하고 현재 읽고 있는 글의 페이지가 잘 표시되는지 등의 부분은 좀 더 살펴봐야 합니다. 제가 아직 1페이지 이상 글을 작성하지 않아 검토는 해보지 않았습니다.

요렇게 현재 읽고 있는 글을 다 읽어내려간 부분에 글 목록 부분이 나타납니다.

https://rxtip.kr/talk

위 블로그 게시판에서 글을 읽어보시면 하단에 목록이 나오는 것을 볼 수 있을 것 입니다. (물론 대부분의 스킨을 글 읽는 곳 하단에 목록이 나옵니다.)

태그 연관글 애드온 다른 애드온 등에 현재문서 정보의 오류를 발생시키는 문제

꿀팁관리소장 — Fri, 16 Jul 2021 14:35:34 +0900

코어에서 만들어내는 함수나 변수 등을 이용할때 특히 다른 곳에서 많이 호출해서 사용하게 되는 변수의 경우 사용을 주의 해야 합니다.

현재 열람되고 있는 문서 정보를 담고 있는 $oDocument 의 경우 특히 많은 애드온등에서 현재 페이지가 문서의 열람 페이지 인지 그렇다면 어떤 문서번호를 가지고 있고 제목은 무어며 내용은 무엇인지 등의 현재 문서의 정보를 여기에 담긴 것을 가지고 파악하게 됩니다.

그런데 애드온 등에서 $oDocument 변수를 사용해서 다른 정보를 담아 버리게 되면 이 정보가 덮어씌워지면서 다른 자료에서 현재의 문서가 아닌 엉뚱한 다른 문서의 정보를 가져오게되어 다른 정보를 제공하게 하는 오류를 발생시킬 수 있습니다.

이번에 발견한 자료는 태그 연관글 애드온 입니다.

$oDocument 변수가 스킨에 사용되면서 이 애드온 보다 늦게 실행되는 다른 애드온에서 태그 연관글 애드온이 마지막으로 덮어 씌운 $oDocument 정보를 현재 문서정보로 가져가게 되는 문제를 야기 합니다.

태그 연관글 애드온의 스킨 index.html 을 열어 보시면

문서내 포함된 태그와 관련된 다른 글의 목록을 가져와서 그 목록을 반복 출력하는 코드가 있습니다.

이런 부분이 보일겁니다. 라이믹스용이 아닌 경우는 rxp_ 이부분은 안보일거구요.

$oDocument 안에 여러개의 문서의 정보가 모두 담기게 되었고 저 반복문이 실행되고 난 후 마지막 문서가 다른 애드온에서

$oDocument 을 이용하려고 할때 저기의 정보의 담긴 다른 문서 정보를 가져가데 되는 상황입니다.

$oDocument 을 모두 다른 변수로 변경해 주셔야 합니다. 예를 들면 $item 등 코어 특히 문서모듈에서 생성되어 여러 자료에서 열어보게 되는 변수가 아닌 변수로 사용해야 합니다.

반복문 안에도 $oDocument 가 많이 등장하니 똑같이 모두 바꾸어주어야 반복문 안에서 정보가 제대로 확인이 되겠죠?

반복문 안의 $oDocument 도 같은 변수명으로 똑같이 다 바꾸어 주어야 합니다.

비개발자가 라이믹스의 간단한 것을 만들고 수정할 수 있는 능력을 갖추는데 필요한 독학 과정

꿀팁관리소장 — Sun, 06 Jun 2021 11:01:00 +0900

라이믹스로 사이트를 만들고 운영을 하다보면 운영자가 꼭 고치고 싶은 곳들이 생겨납니다. 아니 처음에 만들때 부터 고치고 싶은 곳들이 당연히 너무도 많고 실제 고쳐서 사용을 합니다.

그런데 코알못이라 지식이 없어서 고칠수도 어딜 열어서 봐야 할지도 모른다고 합니다. 그럼 어떻게 해야 할까요?

답은 너무 허무하지만 고쳐보도록 시도해야 합니다.

아무것도 하지 않으면 망가지지도 않지만 너무나 당연하게 아무일도 일어나지도 않습니다.

그럼 아무것도 모르는데 어떻게 시도하라는 거냐? 라고 물으시겠지만 지금부터 설명을 해드리고 왜 제가 한 말이 납득이 갈 수 있도록 해보겠습니다. 어쩌면 철저하게 저의 개인적인 경험이라 모든 분에게 적용이 안될 수도 있지만 제가 바로 비개발자로서 사이트를 운영하면서 불편한 것 그리고 개선시키고 싶은것 편의를 제공하고 싶은 것 혹은 디자인을 내 생각대로 바꾸고 싶은 것을 하는 운영자이기에 사실에 근거한 이야기 일 것입니다.

저희가 운영하는 라이믹스(웹사이트 빌더)가 내어주는 결과물이 어떤 것인지에 대해 이해를 하고 접근을 해야 합니다. 거의 99% 의 사이트 형태가 브라우저에 사이트를 출력하여 방문자와 상호작용을 하는 그런 형태의 사이트 입니다.결론은 브라우저가 해석하는 그리고 브라우저를 컨트롤할 수 있는 언어가 필수적으로 알아야 하고 운영자가 당장 고치거나 수정하고 싶은 부분들이 대부분 여기에서 부터 출발합니다.

1.라이믹스의 구조를 살펴보시고 본인이 직접 어떤 구조로 작동하고 있고 어떤 것들을 가지고 있으며 그 개별적인 것들이 어떤 역할을 하는지 이해해 보세요.

라이믹스로 사이트를 직접 만드셨다는 것은 직접 라이믹스를 설치하셨다는 것이고 큰 덩어리의 구조는 이미 알고 계실 겁니다. 이제 라이믹스의 폴더,파일의 구조를 살펴보시고 코어가 무엇이며 모듈은 무엇이고 모듈의 스킨은 왜 필요하며 애드온은 또 무엇이며 위젯은 무엇인가에 대해서 파악해 보세요.

아주 어려운 기술을 알아가는 과정이 아닙니다. 이런 것 조차 하기 싫다면 그냥 아무일도 일어나지 않도록 아무것도 하지 않는게 좋습니다.

2.라이믹스 구조를 대략 파악하셨다면 스킨이 무엇인지에 대해 파악하셨을 겁니다. 이제 사이트에서 내가 표현하고 싶은 부분들을 고쳐 보세요.

스킨은 말 그대로 사람의 피부 즉 맨 바깥쪽 겉을 의미합니다. 최종적으로 보여지는 부분을 담당하는 부분이라 내 사이트에서 보여지는 글자,이미지,디자인이 스킨에 작성된 코드에 의해 작동이 됩니다.

처음에 브라우저를 컨트롤 할 수 있는 언어를 다루는 부분에서 출발한다고 한 것이 이부분입니다. 스킨과 레이아웃 설치 위치가 다르지만 비슷한 역할을 합니다.

라이믹스 구조를 잘 익히셨다면 레이아웃폴더에 어떤 파일이 있고 각 모듈의 스킨에 어떠한 파일이 있는지는 보셨을 겁니다.

이부분을 시도하기 시작하시려면 우선 html과 css 를 다룰줄 알아야 합니다.

무언가를 알아야 어떤 부분을 고칠수 있다 라는 부분에서 그 무언가를 처음부터 끝까지 모든 것을 다 학습한 후 시도하라는 것이 절대 아닙니다.

그렇게 하려면 아마 시작도 못하고 계속 시도하지 않는 명분만 만들 뿐입니다. 당장 필요한 수준의 것을 학습하시면 됩니다.

html이 무언지 css가 무언지 알아보는데 그리고 직접 고치고 싶은 부분에 적용될 것들을 배우는데 몇시간 하루 정도도 안걸리는 아주 쉬운 언어입니다.

그리고 다른 사이트에서는 어떻게 한거지? 라고 공부해보고 알아보려면 개발자도구 사용법을 먼저 익히세요. 브라우저에서는 개발자도구라는 기능을 제공해서 브라우저에 보여지는 부분의 기술적요소를 볼수 있게 해줍니다.

라이믹스를 처음 설치하고 아무것도 모르는 단계에서 처음 하고 싶고 그리고 도전하면 할 수 있을 것 같은 것이 바로 이런 낮은 수준의 보여지는 것의 수정입니다.

레이아웃이 스킨과 비슷한 것이라고 말씀을 드렸는데요.

저희 라이믹스 꿀팁 사이트의 사이트 타이틀 부분이 레이아웃에서 출력해 주고 있는데요.

라고 작성되어 있기 때문에 브라우저에서 지금 저희가 보이는 볼 수 있는 것 입니다. 그리고 클릭 했을때 이동이 되는 이유도 지금 작성된 코드에 의해서 작동이 되는 거구요.

이게 바로 html 입니다. 이건 라이믹스를 설치하셨다면 아시는 분이 대부분이고 모르시는 분도 있을 겁니다. 모르시는 분들에게 설명하려고 이글을 적은거니 모르셔도 걱정하실 필요는 없습니다.

이렇게 필요한 부분을 고쳐보세요. 레이아웃, 게시판 스킨, 모듈 스킨 등 html,css 정도로 고칠 수 있는 부분을 직접 고쳐서 사용해보세요.

직접 이걸 하고 계시다면 이미 한단계 성장을 한 것입니다. 그렇다면 이제 이것 보다 조금더 어려운 새로운 것을 고치실 수 있는 준비를 하시고 고치는데 성공을 하시면 또 한단계 성장을 하는 것입니다.

저는 이것을 허들을 넘는 것 그리고 벽을 넘는 것으로 느끼고 있는데 초기에는 이 벽이 부담스럽고 답답하고 그렇습니다. 그런데 이 벽을 넘는 것을 계속 하다보면 성취감이 생기고 그 많은 벽을 넘는 과정에서 전혀 알지 못했던 지식들이 저희 라이브러리에 쌓이게 됩니다.

html, css 로 고치다 보면 조금더 고급스럽거나 혹은 어려운 수정작업을 해보고 싶은 경우가 있고 알아보다 보면 그게 자바스크립트라는 브라우저를 다양하게 컨트롤 할 수 있는 언어라른 것을 알게 됩니다.

자바스크립트가 뭔지 대충 한번 읽어보시고 흔하게 사용되는 함수등을 한번 훓어 보시기 바랍니다. 사용자에게 경고창을 띄우거나 동의를 받는 과정을 거치거나 하고 싶을때가 분명이 생길 겁니다. 이럴때 자바스크립트를 사용해서 성공해 보세요. 성공하시면 허들을 또 넘게 되는 겁니다.

자바스크립트를 사용하다보면 jQuery 가 함께 사용된다는 사실을 자연스럽게 알게 됩니다. 편리한 기능을 많이 제공합니다. 내가 구현하려는 것의 jQuery로 해서 구현이 가능한 것이 있다면 그때 jQuery를 사용하면서 배우면 되니다.

그런데 자바스크립트 jQuery html css 지금 알아야할 언어가 계속 나오는데 이걸 어디서 배우고 언제 다 배워서 언제 직접 사용해서 고치고 그럽니까?

네. 책을 사서 혹은 웹에서 해당 강좌를 다 보고 시도하라는게 아닙니다. 낮은 단계에서 시도하는 것들 대부분은 구글검색을 해보시면 내가 해야할 것의 예제까지 아주 자세하게 설명된 것들이 아주 많이 검색결과로 나오니 거기서 보고 내가 필요한 것으로 조금씩 바꿔서 시도를 하시면 됩니다.

그런데 여기서 한가지 말씀 드리고 싶은 것은 지금 언급되는 언어들을 처음부터 강좌나 책으로 학습해 가는 것을 병행하는 것을 추천해 드립니다.(공부하기 귀찮고 시간을 많이 투자해야 하니 실전하기 쉽진 않지만..)

제가 수년간 언어에 대해 공부를 하지 않은 상태에서 제가 검색이나 다른 소스를 참조해서 시도해보고 성공한 결과로 역으로 그 언어를 이해한 것 보다 미리 그 언어가 어떻게 동작하는지 이해를 하고 작업을 하면 이해나 구현하는데 걸리는 시간이 훨씬 빠릅니다. 당연한 결과죠.

3.직접 수정하시면서 막히는 부분만 개발자 분들께 질문을 해서 답을 얻어 보세요.

처음부터 끝까지 다 남이 해주면 본인에게 남는 것은 없습니다. 그런데 스스로 하면서 해결한 부분 그리고 해결하지 못한 마지막 부분에서 도저히 해결하지 못한 마지막 부분을 다른 분의 도움을 받아 해결을 한다면 자기가 무엇을 이해하지 못해 그것이 안되었고 받은 답변이 이해가 됩니다.

역으로 이야기 한다면 무조건 질문하는 습관을 버리셔야 합니다. 무얼 하고 싶을때 마다 질문해서 답을 얻고 답변이 없으면 하지 못하고 반복한다면 아무리 오랜 시간이 지나도 스스로 할 수 있는 건 하나도 없게 됩니다.

4.스킨,레이아웃에서 자주 사용되는 라이믹스 함수를 눈에 익히고 어떤 의미인지 이해하고 사용해 보세요.

라이믹스 템플릿(스킨 등)에서 사용되는 언어는 html,js 외 php도 사용이 됩니다. 라이믹스 스킨 등을 수정하는 과정에서 본인도 모르게 php를 사용하고 있는데 그걸 php를 배우지 않았기 때문에 모르는 것 일 뿐 입니다. 상관 없습니다. 지금까지 미리 그 언어를 학습하고 시도한게 아니 듯 php도 마찬가지가 될 것입니다.

사이트 운영자가 하고 싶은 것 중 어렵다고 느끼면서 가장 하고 싶어하는 것 중 첫번째로 하고 싶어하는 것들이 바로 어떤 조건에서는 이렇게 보여주고 또 어떤 대상에게는 보여주지 않고 등 이런 것 들입니다.

이런 기술은 사실 php단에서 컨트롤이 되어야 하는 것들입니다. 백엔드라고 해야 할까요. html,js(자바스크립트) 단에서 무언가 보여주고 가리고 하는 것은 브라우저에서 다시 보이게 할 수 있어서 사실 아무것도 모르는 사람들에게만 가리는 것이라 php문법을 사용해야 합니다.

라이믹스는 php 언어 기반의 CMS 입니다. 그래서 라이믹스 내부 함수도 php라고 봐도 될 정도이고 여러 자료에서 그리고 템플릿(스킨 등)에서도 규칙을 지켜서 php를 사용할 수 있습니다.

게시판 스킨을 열어서 코드를 보고 눈에 익히다 보면

$oDocument->get('member_srl') 이런 것이 등장하는 것을 보실 수 있습니다. 이런게 라이믹스 내부 함수 입니다.

이 문서의 작성자 회원번호를 가져와라 라는 명령이 되는 것입니다.

최종적으로 저것을 출력하라고 할지, 아니면 저 회원번호를 근거로 무언가를 할지 그건 코드를 짜기 나름입니다.

관리자이니까 여기를 접근해서 이것을 할수 있어!

라는 코드를 사용할 수도 있습니다.

여기서 이미 php가 사용이 되었고 php 조건문을 이용해서 조건에 맞는 경우 선택적으로 무언가 할 수 있는 코드를 배우게 되는 것 입니다.

이걸 조금만 눈에 익히시면 게시판 목록을 담당하는 스킨 파일을 열어서 추천수가 얼마 이상인 게시글의 목록 제목 옆에는 무언가 나타나게 하고 하는 등의 작업도 직접 하실 수 있습니다.

물론 게시글 목록 부분에서 게시글 정보를 가지고 오는 함수는 또 달라지 어떻게 바뀌는지 눈에 익히셔야 합니다.

이런 것도 마찬가지로 내가 필요한 것 찾아서 익히는 것 외 라이믹스 함수들을 공부를 병행하시는게 좋겠죠.

라이믹스 템플릿에서 php 사용하는 용법을 익히신 후 php로 각종 기능을 구현해 보세요.

{@ }

이런 부분이 php 가 사용되는 것 입니다.

5.이제 애드온의 아주 간단한 부분을 고쳐서 사용해보세요.

프로그램 언어라는 것이 규칙에 의해 작성되지 않으면 에러가 나고 예약된 결과를 내어주지 않기 때문에 역으로 이야기 하면 결과를 미리 알고 코드를 읽어 보면 코드를 어떻게 작성해야 하는구나 라는 것을 이해하게 되어 반대로 학습이 가능합니다.

가장 접근하기 쉬운 애드온 부터 고쳐보세요.

예를 들어 애드온에서 기준수 이상 동작하는 것이 하드코딩 되어 있어 3 이상 작동하는 것이 맘에 안든다. 이걸 5이상 작동하는 것으로 고치고 싶다.

애드온을 열어서 3을 5로 바꾸시고 원하시는 결과를 만들어 보세요.

여기서 끝내면 아무것도 얻어지는게 없습니다.

3,5 를 바꾼부분을 둘러싼 코드를 이해하셔야 합니다. 이해하셨다면 허들 하나를 넘으시게 된 것입니다.

이 지식이 나중에 조금더 성장하면 애드온 php 코드가 아닌 설정에서 마음대로 입력을 받아 작동되록 고칠 수 있는 기본 지식이 되는 것 입니다.

이렇게 간단한 부분을 고치는 것에서 조금씩 야금야금 더 많은 것을 고쳐보고 하면서 내가 할 수 있는 영역을 넓혀가 보세요.

이렇게 계속 애드온에 관해서 익히는 과정을 이어가다보면 라이믹스의 쿼리에 관해 알아보기 시작할때가 옵니다. 라이믹스의 db에서 값을 조회해서 그 값을 기준으로 허락을 할지 아니면 차단을 할지 등의 기능에 자주 사용되고 위젯,모듈에서도 사용되는 것으로 이것을 이해하는 고급적인 컨트롤이 가능해 집니다.

6.이제 카피캣이 되셔서 새로운 애드온을 만들어 보세요.

카피캣이 언어를 배우지 않은 상태에서 결과를 만들어내고 결과를 만들어내면서 언어를 배우게 되는 편법적이지만 조금은 빠르게 사이트 수정등을 하면서 배울 수 있는 방법입니다.

어느 순간 애드온의 구조와 애드온에서 사용되는 라이믹스 함수와 쿼리 등을 알게 되면 새로운 애드온을 만들 수 있겠다라는 시점이 생깁니다. 그때 만들어 보세요.

아무것도 하지 않으면 아무일도 일어나지 않습니다.

새로운 것을 만드는게 별개 아닙니다. 처음에는 다른 분이 만들어 놓은 애드온에서 내가 원하는 것의 기준이나 대상으로 바꾸어 작동되게 바꿔서 만든 것도 새로 만든 것과 비슷합니다. 미리 만들어 놓은 것을 상당히 많이 이용했다는 것 뿐이죠.

점점 내가 만든 부분이 늘어나는 것을 만들 수 있다면 내가 원하는 기능을 가진 애드온을 쉽게 만들어 낼 수 있게 됩니다.

이쯤 되면 php에 관해서 검색을 통해서 계속 검색을 해가면서 무언가 수정하고 하셨을 겁니다. php에 관해서 제대로 처음부터 배워볼 단계가 된 것이니 php를 제대로 학습해보세요.

7.애드온 외 위젯도 만들어보세요.

애드온을 만들고 하는 것이 익숙해 지시면 위젯을 만들어보세요. 간단한 것부터 만들고 실력이 늘지 않는다면 간단한 것만 만들면 됩니다.

쿼리를 학습했고 php에 관해 조금 알 것 같고 하면 라이믹스 db에서 무언가 조회해서 랭킹을 출력한다거나 혹은 글목록을 출력한다거나 하는 등의 위젯을 만들 수 있습니다.

그리고 이런 위젯을 만들다 보면 외부 api와 연동해서 api에서 전달받은 Data(joson 등)를 가공해서 라이믹스에 출력해주고 싶은 생각이 듭니다.

시도 하시면 됩니다.

이런식으로 계단식으로 혹은 새로운 벽을 넘어가는 과정을 계속 하시면 그 과정에서 굉장히 많은 지식과 경험 그리고 결과물을 만들어 낼 수 있습니다. 모든 것의 학습을 다 마친 후 부터 그러니까 지금으로 부터 1년 2년 3년 후 부터 무언가 적용하고 할 수 있는게 아닙니다.

지금 당장 할수 있는 아주 낮은 단계의 수정부터 하기 시작하시면 됩니다.

저도 사이트 개설 후 처음에는 이런 것을 시도하면서 답답함도 많이 느끼고 어렵다고 생각하기도 하고 했습니다. 그런데 제가 하나씩 해결해 가면서 배우는게 하나씩 있었고 어느정도 시간이 흐른 뒤 그리고 제법 많은 것을 할 수 있는 단계에 오니 새로운 벽을 만나는 것이 어쩌면 약간은 흥미롭겁나 무언가 또 내가 알아낼 수 있구나 라는 생각이 듭니다.

실패 합니다. 자주 실패하고 만들었던 결과물이 맘에 들지 않아 폐기 하기도 하고요. 하지만 그 과정에서 성공했던 부분까지는 새롭게 얻은 것이니 실패가 아닙니다. 다음에 다시 시도해서 실패했던 부분을 다시 성공하면 됩니다. 다음에 도전하면 된다구요? 되더라구요. 준비가 덜 된 상태에서 시도한것이고 조금 시간이 흐른 후 부족했던 부분을 학습 한 후 시도하면 성공할 수 밖에 없겠죠.

언어를 모르는 비개발자가 사이트 운영을 위해서 개발능력을 키우는 가장 빠른 길은 사이트를 원하는 대로 고치는 것을 바로 시작하는 것입니다.

한화면에 용량이 큰 이미지 대량으로 로딩될때 발생되는 문제 [lozad.js] lazy load로 해결한 사례

꿀팁관리소장 — Sat, 05 Jun 2021 17:56:06 +0900

최근 사이트에 부착해서 수익을 낼 수 있도록 개발한 결과물 중 api로 부터 받아온 상품정보 100개를 출력해 주어 해당 상품의 구매로 수익이 발생할 수 있는 것을 사이트에 적용을 했습니다. 그런데 딱 한가지 문제가 맘에 걸리는 부분이 있었는데 100개나 되는 이미지가 섬네일 형태의 작은 이미지가 아닌 본문에 사용될 정도의 큰 이미지라는 점 입니다.

인터넷 환경이 아주 여락한 곳의 사용자의 경우 한꺼번에 100개나 되는 제법 용량이 되는 이미지를 내려 받다 보니 소화가 되지 못해 이미지를 내려받지 못하고 종료되어 버립니다. 엑박이 뜨는 거죠.

그런데 이 경우는 아주 제한적인 사용자에게 나타나는 문제라 꼭 해결해야 한다기 보다는 가급적 해결해야할 문제 정도가 될텐데 그보다 조금 더 걸리는 것은 보지도 않을 아래 많은 이미지를 모두 내려받는 부분이 방문자의 데이터 소진이 다소 미안하다는 생각이 들었습니다.

그래서 많이 알려진 lazy load 기법을 사용해보려고 검색을 하다가 발견한

https://github.com/ApoorvSaxena/lozad.js

위 라이브러리를 사용해서 뷰포트에 보이는 이미지만 내려 받는 lazy load를 구현해서 원하는대로 아주 완벅하게 처리가 되었습니다.

한꺼번에 모든 이미지를 요청하지 않아서 엑박이 뜨는 일도 없고 실제 보지 않는 이미지도 미리 내려받지 않아 데이터 낭비도 없어졌구요.

위 링크에서 자료를 다운받아 필요한 lozad.js 파일만 업로드해서 사용을 하던가 아니면 CDN에 올려진 파일을 불러서 사용할 수 있습니다.

위와 같이 이미지를 불러오는 코드가 있다면

이렇게 CDN에서 js 파일을 불러오거나 혹은 서버에 올려진 파일을 직접 로딩해줍니다.

<load target="lozad.js" /> 업로드 경로에 따라 달라지겠죠.

그리고 위 img 소스에 class를 추가하고 src 를 data-src 로 변경해야 합니다.

이런식으로요.

기존에 class가 있다면 그 옆에 한칸 띄우고 추가해 주면 되겠죠.

출력하는 이미지의 사이즈가 css에서 미리 고정되어 있는 것이라면 따로 img에 css를 적용해주지 않아도 되지만 그렇지 않은경우는 살짝 추가해줘야 할 것 입니다. 저는 고정된 사이즈로 출력하는 형태라 미리 css에 가로,세로가 지정된 경우라 따로 해주지 않았습니다.

img { max-width: 100%; display: block;} 이런식으로 이미지에 적용해보세요. 이미지에 css를 아무것도 적용하지 않고 테스트는 해보지 않았습니다.

그리고 이미지 출력되는 곳보다 아래에

스크립트를 추가해서 lozad()가 실행될 수 있도록 해줍니다.

~~~

이런 모습이 되는 것입니다.

이렇게 하면 화면에 보이는 영역의 이미지만 불러오게 되어서 쾌적하고 불편없이 많은 양의 이미지를 출력할 수 있습니다.

브라우저에게 캐시 만료시간을 알려줘서 반복 요청에 대응하기

꿀팁관리소장 — Thu, 27 May 2021 15:38:24 +0900

이번에 가상화폐 시세표 위젯을 구현하면서 브라우저에게 지정해 주는 header 값 중 캐시값 설정으로 같은 브라우저에서 반복 요청에 대한 비효율을 어느정도 해소할 수 있는 브라우저 캐시에 관해 조금 알게 되었습니다.

이건 서버에서 오래 걸려 생성되는 데이터(연산이 복잡하거나 외부에서 가져와야 해서 오래걸리는)를 저장해서 모든 요청자에게 제공하는 서버의 캐시와 다른 개념입니다.

브라우저에서 한번 가져간 페이지의 경우 해당 브라우저에서 데이터를 유지하게 함으로써 똑같은 요청시 저장된 것을 사용하게 하는 것 입니다.

흔하게 사용할 수 있는 것을 찾아보니 제가 예전에 방문자의 ip를 체크해서 해당 ip를 구글 태그매니저에 알려주는 것을 자체서버로 구성한 것이 생각이 났습니다.

아주 간단한 함수로 브라우저의 ip를 확인한 후 반환해 주는 것인데 이걸 매 페이지가 새로고침 될 때마다 해줄 필요가 없겠구나 라는 생각이 들었네요. 어차피 같은 브라우저라면 계속 같은 아이피를 사용하게 될테니까요. 대단히 정밀하게 ip를 빠짐없이 정확히 기록해야 하는 것도 아니기에 여기에 적용해 보기로 했습니다.

https://rxtip.kr/make_money/4392

header('Cache-Control: max-age=600');
header('Expires: ' . gmdate('D, d M Y H:i:s', time() + 600) . ' GMT');

두줄이 추가가 되었습니다. 10분간 브라우저에서 가진 값을 사용하게 브라우저에게 알려주게 했습니다.

두줄이 같은 내용이긴 한데 Cache-Control: max-age 는 기간을 알려주는 것이고

밑에 Expires 는 예약된 시간을 알려주는 것이라고 합니다.

Cache-Control: max-age 가 있으면 이게 사용되게 된다고 하네요.

페이지가 새로고침 될 때마다 캐시가 만료되지 않았다면 서버는 ip 확인 함수를 실행하지 않게 되겠죠.

굉장한 리소스가 사용되는 작업은 아니긴 하지만 불필요하게 매번 할 필요가 없을 것 같아 적용했습니다.

스크롤 위치에 따라 헤더 사라지고 나타나는 기능 구현

꿀팁관리소장 — Wed, 26 May 2021 09:31:09 +0900

저희 라이믹스 꿀팁에 헤더메뉴 부분이 스크롤을 조금 내리면 사라지게 해 놓았는데요. 이게 궁금하다고 @adlib 님께서 요청을 하셔서 팁으로 작성을 해 봅니다.

rx-flextagram 레이아웃의 경우

PC에서는 저 위쪽이 헤더메뉴이고 모바일에서는 하단에 메뉴가 헤더메뉴 입니다.

모바일에서는 아래에 위치하죠.

우선 저 헤더메뉴의 클래스명을 확인해 보아야 합니다. 개발자도구에서 쉽게 확인이 가능하죠.

.app-header 로 확인이 되네요.

그럼 사용하시는 Top Up 스크롤 버튼 소스가 있다면 해당 소스에서 Top 버튼이 나오게 하는 소스에 헤더를 가리는 소스를 추가해 주는 것으로 간단하게 Top 버튼이 나오면 헤더가 가려지게 됩니다.

jquery 에서 .fadeOut(100); 은 지정한 곳을 없애주는 기능입니다. 괄호에 숫자 100은 부드럽게 사라지는 시간을 지정하는 것이 적당히 변경해 가면서 사용가능합니다.

*****.fadeOut(100);

이렇게 하면 ***** 가 사라지게 되는 것 입니다.

jquery에서 내가 지정하고 싶은 곳을 class로 선택을 하는 방법은 $('.class_name') 입니다. 클래스가 아닌 엘리먼트 ID로 지정하고 싶다면 $('#id_name') 으로 하면 됩니다.

이번에 할 곳은 class로 지정할 것이니

$('.app-header')가 작동하게 할 위치이고 거기에 작동하게 할 동작은 fadeOut() 과 fadeIn() 입니다.

top 버튼이 나오게 하는 소스에

$('.app-header')..fadeOut(100); 을 추가로 넣어주고

반대로 top 버튼이 사라지는 소스에는

$('.app-header')..fadeIn(100); 넣어주면 되는 아주 간단한 팁입니다.

제가 사용하는 스크롤 Top Up 소스에 추가한 것을 보시면 아주 간단합니다.

<script type="text/javascript">
 //<![CDATA[
 (function($){
 $(document).ready(function(){
 var scrollToTop = function() {
 // Get link
 var link = $('#scrollUp'); // 제가 사용하는 Top Up 선택자를 link 변수로 선언
 var header = $('.app-header'); // 지금 적용하려는 헤더메뉴를  header 변수로 선언
 link.hide();
 var windowW = window.innerWidth
 || document.documentElement.clientWidth
 || document.body.clientWidth;
 
 $(window).scroll(function() {
 // If the user scrolled a bit (150 pixels) show the link in large resolutions
 if (($(this).scrollTop() > 150)) {
 link.fadeIn(100);
 header.fadeOut(100); // 스크롤이 지정된 픽셀 아래로 내려오면 헤더가 사라짐
 } else {
 link.fadeOut(100);
 header.fadeIn(100); // 스크롤이 지정된 범위를 벗어나면 다시 헤더가 나타남
 }
 });
 };
 scrollToTop();
 $("#scrollUp").click(function () {
 $("html, body").animate({ scrollTop: 0 }, 0);
 });
 });
 })(jQuery);
 //]]>
 </script>

위와 같이 jquery 를 이용하면 아주 간단하게 화면의 출력되는 것을 쉽게 조작하는게 가능하니 필요한게 있을때 검색을 하면 쉽게 방법을 찾을 수 있습니다.

지금 예시로 보여드린 부분은 rx-flextagram 의 메인 헤더메뉴에 해당하는 예시이고 만약 게시글 열람에 나타나는 또다른 헤더부분을 적용하고 싶다면 비슷하게 또 처리를 해야 합니다.

포인트 히스토리 모듈 서드파티 에서 포인트 적립시 구분할 수 있도록해서 개발하기

꿀팁관리소장 — Sat, 22 May 2021 14:02:49 +0900

라이믹스에서는 회원들의 포인트 적립과 사용 내역을 확인할 수 있는 자료로 포인트히스토리 모듈을 사용할 수 있습니다. 이 포인트히스토리 모듈에서는 코어에서 지급과 차감되는 내역은 메시지를 구분해서 어떤 사유로 포인트가 적립 또는 차감되었는지 알수 있게 처리 되어있습니다.

그런데 알려지지 않은 다른 모듈에 의해 포인트 변경이 발생할 경우 포인트를 변경시킨 모듈에서 메시지를 설정해서 포인트히스트로리에서 그 메시지를 기록 할 수 있도록 기능이 제공됩니다.

제가 지금 이 글을 쓰고 있는 이유는 제가 최근 포인트히스토리의 db에 기록된 데이터를 기반으로 한 위젯을 개발을 했는데 해당 위젯을 개발하면서 핵심이 되는 내용을 공유해서 비슷한 방식으로 개발을 하실 수 있는 힌트가 될 수 있길 바래서 입니다.

다시 본래 이야기로 돌아와서..

포인트 히스토리 모듈에서 서드파티 개발자에게

Context::set('__point_message__', '포인트 메세지 내용');

포인트 증감이 있는 곳에서 포인트를 세팅하기 바로 직전에 위와 같이 작성해 주면 포인트히스토리의 db에 기록이 될때 해당 메시지가 기록된다고 합니다.

녹색으로 칠한 부분의 필드에 서드파티에서 직접 메시지를

Context::set('__point_message__', '포인트 메세지 내용'); 로 설정하면 설정한 대로 기록이 된다는 것 입니다.

그런데 제가 이번에 개발하려고 했던 위젯은 위 기록에서 유료모듈인 회원가입확장모듈의 회원가입 초대장 배포로 인해 적립한 포인트의 기록으로 랭킹을 보여주는 위젯을 개발하려고 했습니다.

포인트 히스토리 모듈에서 초대장배포해서 회원이 신규로 가입할때 적립된 포인트만 뽑아서 순위를 매길수 있어야겠죠?

보통은 모듈 자체에서 log를 기록하면 이렇게 포인트히스토리의 log에 의존하지 않고 자체 db를 활용할 수 있습니다. 그렇지 않은 경우나 특별히 포인트히스토리 모듈의 log를 이용할 경우 제가 지금 적고 있는 이 방법이 유효한거죠.

유료모듈인 회원가입확장 모듈에서는

Context::set('__point_message__', "{$obj->nick_name}님께서 초대장으로 가입");

이런식으로 초대장 가입으로 인한 포인트 증가라고 세팅을 해주고 있었습니다. 개발 당시 제가 요청한 부분이라서요.

그런데 초대장으로 라는 단어 포함으로 쿼리해서 포인트를 합산하기에는 성능이 조금 떨어지기에 db를 좀더 살펴보았습니다.

message_type 라는 필드가 눈에 들어오네요. 매 데이터 마다 구분이 될 수 있는 필드였습니다.

그리고 포인트히스토리 모듈의 코드를 열어보니

Context::set('__point_message_type__', '타입구분식별자);

도 함께 세팅할 수 있게 되어 있는 것을 발견하고

Context::set('__point_message_type__', 'signupextend');

를 추가해서 메시지,메시지타입 2가지 필드에 구분될 수 있도록 해주어 초대장배포로 인해 적립된 포인트만 따로 구분해서 쿼리할 수 있게 되었습니다.

이렇게 해서 보여드린 초대 포인트 적립 랭킹 위젯을 쉽게 개발 할 수 있게 되었습니다.

Context::set('__point_message_type__') 은 알려지지 않아서 잘 모르는 분들이 많을 것 같아 공유해 보았습니다.

메뉴 새글표시 모듈 사용할때 Flex 시리즈 레이아웃 사용시 tooltip 충돌 문제 해결법

꿀팁관리소장 — Sun, 16 May 2021 19:59:13 +0900

메뉴 새글 표시 모듈 많이들 사용하시죠? 이 모듈에서 메뉴에 새글을 표시해줄때 Flex 시리즈에서 사용하는 툴팁이 메뉴에서 작동할 경우 충돌이 발생합니다.

이유는 메뉴가 가지는 title 속성 값을 툴팁의 출력문구로 사용하게 되어있기 때문인데요.

좀더 자세하 뜯어 보면

title="{$val1['link']}"|cond="$val1['icon']"

이런식으로 메뉴에서 가지는 link 값을 툴팁에서도 사용하려고 합니다. 메뉴 이름을 툴팁으로 표시하려고 한 것이니 제대로 작성된 코드 입니다. 그런데 문제가 발생하는 이유는 메뉴 새글 표시 모듈에서 저기에 새글 img 태그 소스를 붙여버리기 때문에 발생하는 문제입니다.

그럼 해결책이 없나요? 있습니다.

title="{strip_tags($val1['link'])}"|cond="$val1['icon']"

strip_tags() 함수로 <img src ~~ 태그를 제거해 주면 간단히 해결 됩니다.

오늘 또 Flex 시리즈 레이아웃 하나를 또 사용하면서 그동안 툴팁을 안쓰는 것으로 회피하다가 오늘 원인을 찾아 제거했습니다. 이렇게 하면 새글표시, 레이아웃 툴팁 모두 사용 가능합니다.

라이믹스 다크모드 자동 상태에서 브라우저 다크모드 감지시 php단에서 빠르게 모드 전환하기(쿠키사용)

꿀팁관리소장 — Thu, 13 May 2021 13:38:39 +0900

브라우저 단에서 prefers-color-scheme: dark 다크모드를 감지한 후 Body의 class에 지정된 네임을 추가하는 것을 프론트단에서 하게 되면 현재 라이믹스 에서는 약간의 시간 소요로 인해 라이트모드 CSS -> 다크모드 CSS 변경과정이 감지가 되어 깜빡 거리는 등의 어색함을 발견하게 됩니다.

** 라이믹스 2.0.12 에서는 이 팁이 필요없이 코어에서 깜빡임 없이 전환이 잘 되도록 보완이 되었습니다. **

브라우저 상태를 감지한 것이 아닌 아예 방문자가 다크,라이트 모드를 선택하면 이런 현상이 없이 아주 빠르게 원하는 Class로 보여져서 깜빡이거나 변화를 느끼지 않고 쾌적하게 다크모드 이용이 가능한데요.

방문자가 직접 선택하지 않은 즉, Auto 상태에서 백엔드 차원의 PHP에서 조작을 할 수 있다면 라이믹스 내부에서 처리하는 것과 동일하게 브라우저의 다크모드를 의존해서 CSS를 변경할 수 있습니다.

이 팁의 auto 상태 확인을 위해 현재 이 글을 쓰고 있는 현재 시점에서는 라이믹스 코어 패치가 필요합니다. 다음 버전에는 적용될 패치 입니다.

https://github.com/rhymix/rhymix/commit/5160022a30c17958e47163b9d9228a9873baf3b6

(RXP Flex 레이아웃이거나 혹은 그 레이아웃을 참조해 다크모드를 구현했다면 패치는 필요치 않습니다.)

라이믹스 내부 다크모드에서 모드 선택시 쿠키를 생성하는 것과 동일하게 브라우저의 다크모드 감지시에도 쿠키를 생성하는 방법을 사용할 것입니다. 이전 애드센스를 위해 브라우저 다크모드를 감지해서 쿠키를 생성하는 코드 ( https://rxtip.kr/rx_tip/6910 ) 를 작성하셨던 분은 스크립트는 추가로 작성하지 않으셔도 됩니다.

레이아웃 하단에 브라우저 다크모드를 감지해서 쿠키를 생성하는 스크립트를 작성해 주세요.

<script>
 jQuery(function($){
     var $color_scheme = $.cookie('color_scheme');
     function get_color_scheme() {
       return (window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light";
     }
     function update_color_scheme() {
       $.cookie('color_scheme', get_color_scheme(), { path: '/' });
     }
     if ((typeof $color_scheme === "undefined") || (get_color_scheme() != $color_scheme))
       update_color_scheme();
     if (window.matchMedia)
       window.matchMedia("(prefers-color-scheme: dark)").addListener( update_color_scheme );
 });
 </script>

위 스크립트가 브라우저의 다크모드를 감지해서 color_scheme 이라는 쿠키에 'dark', 'light'를 감지한 값에 값을 넣어주게 됩니다.

그럼 이 쿠키를 가지고 php단에서 body의 class를 조작하면 스크립트에서 조작하는 것보다 훨씬 빠르게 조작해서 쾌적한 사용이 가능해집니다.

스크립트 단에서 했던 코드

window.matchMedia("(prefers-color-scheme: dark)").addListener(function(e) {
   if (e.matches) {
       $('body').removeClass('color_scheme_light').addClass('color_scheme_dark');
   } else {
       $('body').removeClass('color_scheme_dark').addClass('color_scheme_light');
   }
});

~~위 코드를 php 코드로 대체할 것이고 위 스크립트는 삭제하게 됩니다~~.

** 잘못된 정보가 있어 수정합니다. 위 코드를 삭제하지 마시고 유지하시기 바랍니다. 위 코드가 새로고침할때 마다 작동하는 줄 알고 삭제를 했는데 새로고침 없이도 기기의 다크모드를 바로 감지 할수 있는 동작을 하고 있어 기기가 자동으로 다크모드로 전환될때 사이트의 다크모드가 새로고침 없이도 바로 class를 다크모드 class로 전환할 수 있도록 해줍니다. 이로 인해 사이트의 색상이 즉시 반영됩니다. **

레이아웃의 위쪽에 php로 Body의 클래스를 조작해 주는 코드를 넣어주면 됩니다.

{@
 if($_COOKIE['color_scheme'] == 'dark' && \Rhymix\Framework\UA::getColorScheme() === 'auto' && !preg_match('/color_scheme_dark/', Context::getBodyClass())): 
 Context::addBodyClass('color_scheme_dark');
 endif;
 if($_COOKIE['color_scheme'] == 'light' && \Rhymix\Framework\UA::getColorScheme() === 'auto' && !preg_match('/color_scheme_light/', Context::getBodyClass())): 
 Context::addBodyClass('color_scheme_light');
 endif
 }

쿠키를 사용해야 하지만 덕분에 라이믹스 내부 다크모드와 동일한 수준의 빠른 작동의 결과를 보여주어서 굉장히 만족스럽습니다.

일단 현재로서는 별다른 부작용이 없어 보입니다.

이렇게 구현해 놓으면 장점은 사용자가 다크모드를 매번 선택하는 것이 귀찮아 브라우저 다크모드와 연동해서 사용하기 원하는 사용자들에게 깜빡이는 현상 없이 다크모드를 제공할 수 있습니다.

브라우저와 자동으로 연동되는 다크모드 자동기능을 쉽게 사용할 수 있게 하는 팁은 https://rxtip.kr/rx_tip/6922 에 작성해 놓았습니다.

지금 이 팁을 적용해 놓으면 브라우저와 연동하는 다크모드 사용에 불편함이 사라져서 좋습니다.

** 중요 **

현재 이 안내가 있는 시점에는 php에서 body class 를 추가하는 코드가 정상동작하는 것은 RXP Flex 레이아웃의 함수의 영향이므로 RXP Flex 레이아웃을 사용하지 않거나 참조하지 않은 경우 Class가 토글되지 않고 추가되는 문제가 있을 수 있습니다.

위 문제 관련 라이믹스에서 신규 기능을 제공하는 패치가 진행되어

https://github.com/rhymix/rhymix/commit/bd075ee409099a20d405a5fa6b92f2fe637781bc

위 패치가 진행되면 기존 클래스를 제거할 수 있어 제거 후 추가하는 작업으로 정상적인 class 토글이 가능해집니다. 추후 해당 함수를 사용하는 코드로 변경하겠습니다. (21.6.21 라이믹스 2.0.12 에서 패치되어 해당 버전 이상의 라이믹스에서는 아래 코드를 사용하시면 됩니다.)

Context::removeBodyClass('color_scheme_light'); // 새로 만들어진 함수

Context::addBodyClass('color_scheme_dark');

위와 같이 클래스 제거 후 추가하는 코드로 바꾸면 됩니다.

if($_COOKIE['color_scheme'] == 'dark' && \Rhymix\Framework\UA::getColorScheme() === 'auto' && !in_array('color_scheme_dark', Context::getBodyClassList())):
Context::removeBodyClass('color_scheme_light');
Context::addBodyClass('color_scheme_dark');
endif;

if($_COOKIE['color_scheme'] == 'light' && \Rhymix\Framework\UA::getColorScheme() === 'auto' && !in_array('color_scheme_light', Context::getBodyClassList())):
Context::removeBodyClass('color_scheme_dark');
Context::addBodyClass('color_scheme_light');
endif;

}

위와 같이 바뀔 예정입니다.

라이믹스 다크모드 쿠키 삭제 버튼 제공으로 브라우저 자동연동 으로 전환하기

꿀팁관리소장 — Thu, 13 May 2021 11:36:01 +0900

라이믹스 2.0 다크모드 기능이 괜찮아서 다크모드 최적화 작업을 하고 있습니다. 오늘은 다크모드가 적용된 곳에 사용자가 선택한 다크모드의 쿠키를 쉽게 삭제해서 시스템의 다크모드에 연동되거나 혹은 다크모드가 작동하지 않도록 하는 것의 간단한 팁을 기술해 보겠습니다.

토글 버튼이 있어서 그냥 원하는 다크,라이트 모드 전환만 되면 되는거 아니야? 라고 질문하실 수 있지만 여기서 끝나면 사용자가 한번 어떤 모드라도 선택을 한 순간 그 모드가 고정이 됩니다. 당연히 쿠키로 고정을 시켜야 취향에 따라 다음 방문에도 동일한 모드를 제공할 수 있습니다.

그런데 이 상태에서 아침, 저녁 바꾸는게 귀찮아 그냥 기기에 일몰,일출 시간에 맞춰서 시스템 자체가 다크모드가 되는 것에 연동되게 하고 싶다면 방문자가 스스로 쿠키를 삭제해야 합니다. 쿠키 삭제가 저희에게는 어렵지 않지만 일반인은 어려울 수 있고 그런 방법을 통해 기기의 다크모드와 자동으로 연동되는 기능을 사용할 수 있는 방법이 어떤 쿠키를 찾아 삭제해야 하는지 알 수 없죠.(조금 아는 분은 쿠키 전체를 삭제하겠지만요...)

단, 이 팁은 레이아웃에서 다크모드 기능을 구현할때 브라우저 자체의 다크모드를 감지해서 사이트의 Body Class에 클래스를 추가하는 기능으로 연동하는 기능이 구현되어 있어야 쿠키를 삭제했을때 자동으로 작동을 합니다. 이 기능을 구현하지 않은 레이아웃의 경우는 라이믹스의 다크모드 쿠키를 삭제하면 브라우저의 다크모드와 연동되지 않습니다. 다크모드 였다면 그것이 해제되는 것과 같은 효과만 보게 됩니다.

사용하는 레이아웃이 RXP FELX 레이아웃이 아니면서 이 레이아웃을 참조해서 구현한게 아니라면 현재 시점에서는

https://github.com/rhymix/rhymix/commit/5160022a30c17958e47163b9d9228a9873baf3b6

위 패치를 하셔야 합니다.

그리고 레이아웃의 적당한 곳에 스위치를 달아줍니다.

<li cond="\Rhymix\Framework\UA::getColorScheme() === 'auto'"><a>야간모드 자동 사용중</a></li>
 <li cond="\Rhymix\Framework\UA::getColorScheme() !== 'auto'"><a class="del_night_mode" style="cursor:pointer">야간모드 자동 사용하기</a></li>
 <script>
 jQuery(function($) {
 $(".del_night_mode").click(function(){ 
 $.removeCookie('rx_color_scheme', { path: '/' });
 alert('이제 브라우저 야간모드에 따라 자동으로 사이트 야간모드가 작동합니다.');
 location.reload();
 })
 });
 </script>

현재 다크모드를 둘중 하나라도 선택한 상태라면 "야간모드 자동 사용하기" 라는 문구로 출력이 되고 해당 문구를 클릭하면 쿠키를 삭제하고 안내문구가 출력이 됩니다.

이렇게 되면 이전에 선택했던 다크모드의 쿠키가 삭제되고 auto 상태로 전환이 되게 됩니다.

auto 상태가 되면 다시 버튼은 "야간모드 자동 사용중" 이라고 표시가 됩니다.

라이믹스 다크모드에 맞춰서 애드센스 어두운배경 광고 출력하기

꿀팁관리소장 — Wed, 12 May 2021 19:00:13 +0900

라이믹스 2.0의 다크모드 기능을 사용하게 되면서 사이트에 출력되는 광고 중 인피드 광고와 일치하는 광고가 다크모드에서 너무 밝게 보이는 문제가 거슬릴 수도 있습니다.

오늘 그래서 라이믹스의 다크모드를 감지하고 또 시스템의 다크모드를 감지해서 두 값을 기준으로 애드센스 배경이 다른 광고를 각각 출력하는 것을 구현해 보았습니다.

미리 준비해둔 어두운 배경의 광고단위(인피드, 일치하는 광고)를 다크모드에서 출력되도록 한 모습입니다.

라이믹스에서 현재 선택된 모드는 쉽게 확인할 수 있는데 시스템의 값은 프론트단에서 확인 후 쿠키로 저장해서 쿠키값으로 확인하는 과정이 필요해 합니다.

https://stackoverflow.com/questions/52388490/php-how-to-detect-that-users-computer-browser-is-in-dark-mode

위 링크의 스크립트를 사용했습니다.

우선 레이아웃에 시스템의 현재 모드를 확인해서 쿠키로 저장하는 스크립트를 삽입해야 합니다.

저희 경우는 사용하는 레이아웃의 파일 중 _init.html 파일의 하단에 넣었습니다.

<script>
 jQuery(function($){
     var $color_scheme = $.cookie('color_scheme');
     function get_color_scheme() {
       return (window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light";
     }
     function update_color_scheme() {
       $.cookie('color_scheme', get_color_scheme(), { path: '/' });
       body_element.addClass('color_scheme_' + color_scheme);
     }
     if ((typeof $color_scheme === "undefined") || (get_color_scheme() != $color_scheme))
       update_color_scheme();
     if (window.matchMedia)
       window.matchMedia("(prefers-color-scheme: dark)").addListener( update_color_scheme );
 });
 </script>

혹시 $.cookie 에러가 난다면 레이아웃에서 jquery.cookie.js 를 로드하지 않아서 이니 CDN을 이용해서 로드해 주세요.

이제 이 쿠키값을 이용할 곳 레이아웃이나 게시판 스킨에 아래와 같은 코드를 넣어줍니다.

{@
 $color_scheme = isset($_COOKIE["color_scheme"]) ? $_COOKIE["color_scheme"] : false;
 if ($color_scheme === false):
 $color_scheme = 'light';
 endif;
 }

저 값을 이용할 곳 즉 광고 코드를 다르게 출력할 곳이 게시판 쪽이라면 게시판 스킨에도 넣으셔야 합니다. 공통으로 사용하는 파일에 넣는게 좋겠죠. 저는 스케치북 스킨을 사용중이라 _setting.html 파일에도 넣었습니다.

그리고 이제 광고코드 같은 것을 라이트모드 상태인지 다크모드 상태인지 확인해서 분기해서 출력할 경우 아래와 같은 코드로 사용하면 됩니다.

<!--@if(\Rhymix\Framework\UA::getColorScheme()=='dark' || ($color_scheme=='dark' && \Rhymix\Framework\UA::getColorScheme()!='light'))-->
 어두운 배경에서 출력될 것들
 <!--@else-->
 밝은 배경에서 출력될 것들
 <!--@end-->

참고로 제가 시스템의 다크모드까지 감지해서 적용할 수 있는건 제가 사용하는 레이아웃이 시스템의 다크모드까지 감지해서 다크모드 class로 바꿔주는 기능이 있어 사용자가 선택하지 않으면 시스템 모드에 따라가도록 구현되어 있기 때문입니다. 이러한 기능이 없다면 시스템 모드를 확인하는 과정은 빼셔야 합니다.

이제 다크모드를 이용하는 방문자들이 광고 때문에 눈이 부시거나 하는 일이 좀 줄어들겠네요.

RXP FLEX 레이아웃의 다크모드 기능 다른 레이아웃에 적용하는 방법

꿀팁관리소장 — Wed, 12 May 2021 10:53:52 +0900

라이믹스 2.0에는 다크모드를 구현하는데 필요한 기본 기능을 라이믹스 코어에서 지원을 합니다. 그런데 레이아웃에서 이 기능을 이용해서 코드가 작성되어야 하고 다크모드,라이트모드 전환을 위한 코드도 들어가야 하는데요. RXP FLEX 레이아웃이 코드가 잘 짜여져 있어서 이 레이아웃을 참조해서 다른 레이아웃에도 응용할 수 있을 것 입니다.

한가지 먼저 알려드릴 부분은 이 팁에서 사용하는 RXP FLEX의 다크모드를 위한 함수는 현재 라이믹스 코어에서 오류가 있는 부분을 수정하기 위한 함수로서 이 글을 쓰고 있는 현재 시점 라이믹스 코어(개발자버전)에서는 수정이 되어 이후 이 이 함수 의존 없이도 다크모드 사용시 불편없이 사용이 가능하다는 것을 알려드립니다. 이후 개선된 코어를 적용하시거나 미리 적용하시게 되면 이 함수를 작동하는 부분을 제외하고 구현하셔도 될 것 입니다.

** 시스템 설정 - 사이트설정에서 가장 하단의 "사이트 색상 조합" 의 설정을 기기상태 자동 감지로 하셔야 정상 작동합니다.

그렇지 않고 밝은색 혹은 어두운색으로 고정해버리면 다크모드를 자동 그리고 사용자 선택으로 운영할 수 없습니다.

위 상태로 설정하고 작업을 해주세요.

~~https://github.com/rx-public/rxp_flex/~~

위 url에서 레이아웃의 코드를 보고 다운 받을 수 있습니다.

~~https://github.com/rx-public/rxp_flex/blob/main/_config.php~~

위 파일을 이용할 것인데 다른 레이아웃에서 필요없는 변수부분이나 로그인 관련 함수는 전혀 필요 없으니 제거를 하시고 사용하셔도 됩니다. 제가 사용한 파일은 첨부해 드리겠습니다.

https://github.com/YJSoft/rxp_flex

*원본 저장소가 삭제되어 포크 저장소에서 다운받을 수 있습니다.

레이아웃 설정에 다크모드,라이트모드,자동 을 지정할 수 있는 옵션 설정을 할 수 있도록 추가해 줍니다.

사용하시는 레이아웃 폴더 하위 conf/info.xml 파일에 추가를 해주셔야 합니다.

<var name="color_scheme" type="select">
                 <title xml:lang="ko">컬러 모드</title>
                 <description>컬러 모드를 라이트 모드/다크 모드로 설정하면 사용자가 임의로 변경할 수 없도록 테마가 고정됩니다. (사용자 지정의 경우 최초 접속 시 라이트 모드로 표현됩니다.)</description>
 
                 <options value="auto">
                     <title xml:lang="ko">자동 및 사용자 선택 (기본 값)</title>
                 </options>
                 <options value="light">
                     <title xml:lang="ko">라이트 모드</title>
                 </options>
                 <options value="dark">
                     <title xml:lang="ko">다크 모드</title>
                 </options>
 </var>

기존 옵션 설정이 작성되어 있는 부분에 추가를 해주세요.

<extra_vars>

</extra_vars>

의 안쪽에 넣어주시면 되고 안에 <group> 으로 나누어져 있다면 <group> 안쪽에 추가를 해주면 됩니다.

_config.php 파일은 레이아웃의 폴더에 업로드 해주세요.

업로드 한 후 layout.html 파일에서 해당 파일을 load 해줍니다.

<include target="_config.php" />

그리고 그 아래에

{@
     RxpFlexTheme::init($layout_info);
     // 브라우저 테마 컬러 지정
     $layoutConfig = RxpFlexTheme::getConfig($layout_info);
     Context::addMetaTag("theme-color", $layoutConfig['primary_color']);
     RxpFlexTheme::colorScheme();
 
     $heaer_darkmode_text = "다크 모드로 전환";
 
     if(RxpFlexTheme::isDarkMode()):
         $heaer_darkmode_text = "라이트 모드로 전환";
     endif;
 }

위와 같은 코드를 넣어주는데요.

제 예상은 아마 코어에서 오류가 수정된 이후에는 별도 업로드한 php 파일에서 다크모드 함수를 지워도 되며 함수를 지웠다면 위 코드 중 함수를 실행하는 코드 RxpFlexTheme::colorScheme(); 를 지워야 합니다.(이부분은 나중에 하셔도 되고 그냥 이대로 쓰셔도 됩니다.)

php 파일 전체를 지우게 되면 레이아웃 설정 정보를 가져오는 부분을 php 파일의 함수에 의존하는 부분도 살짝 고쳐야 합니다.

다시 지금 상태에서 다크모드를 적용하는 것을 이어가 보겠습니다.

레이아웃 하단에 아래와 같은 스크립트를 넣어 줍니다.

<script>
     <!--@if(\Rhymix\Framework\UA::getColorScheme() === 'auto')-->
     window.matchMedia("(prefers-color-scheme: dark)").addListener(function(e) {
         if (e.matches) {
             $('body').removeClass('color_scheme_light').addClass('color_scheme_dark');
         } else {
             $('body').removeClass('color_scheme_dark').addClass('color_scheme_light');
         }
     });
     <!--@endif-->
     function onClickDarkThemeToggle(e) {
         const isDarkTheme = getColorScheme() === 'dark';
         if (isDarkTheme === true) {
             setColorScheme('light');
 $('.isDark').show();
 $('.islight').hide();
         } else {
             setColorScheme('dark');
 $('.islight').show();
 $('.isDark').hide();
         }
         return false;
     }
 </script>
 
 <!--@if(\Rhymix\Framework\UA::getColorScheme() === 'auto')-->
 <script>
 const prefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: Dark)').matches
 console.log(prefersDark);
         if (prefersDark) {
 $('.islight').show();
 $('.isDark').hide();
         } else {
 $('.isDark').show();
 $('.islight').hide();
         }
 </script>
 <!--@else-->
 <script>
 <!--@if(RxpFlexTheme::isDarkMode())-->
 $('.islight').show();
 <!--@else-->
 $('.isDark').show();
 <!--@endif-->
 </script>
 <!--@endif-->

다크모드 / 라이트모드 전환할 수 있는 토글 스위치를 적당한 위치에 달아줍니다.

<li cond="$layoutConfig['color_scheme'] === 'auto'">
 <a cond="$layoutConfig['color_scheme'] === 'auto'" onclick="onClickDarkThemeToggle()" style="cursor: pointer;">
 <span class="islight" style="display:none;"><i class="fas fa-lightbulb"></i> Light Mode</span>
 <span class="isDark" style="display:none;"><i class="fas fa-moon"></i> Dark Mode</span>
 </a>
 </li>

이렇게 하시고 토글 버튼으로 다크모드를 눌렀을때 body에 클래스 color_scheme_dark , 라이트모드를 눌렀을때 color_scheme_light가 실시간으로 바뀌는지 확인하시고 토글 버튼도 잘 바뀌는지 확인하시면 다크모드 기능을 잘 완성이 된 것입니다.

위 body에 클래스 전환되는것은 브라우저의 개발자도구로 확인해 보시면 됩니다.

이후 레이아웃 또는 게시판 스킨 등의 css에서 다크모드가 지정되었을때 즉 body 가 color_scheme_dark 의 class를 가질때 디자인(주로 color와 background-color)를 추가해 주면 됩니다.

우선 기본적으로

body.color_scheme_dark

{

color: #fdfdfd;

background-color: #2d2d2d;

}

위와 같이 해주시면 특별한 class로 디자인이 지정되지 않은 부분들이 위 속성에 의해 밝은 글자색,어두운 배경으로 바뀝니다.

색상은 맘에 드시는 것으로 골라보세요.

이후 다크모드에서 밝은 부분을 어두운 부분으로 바꿔 주시면 됩니다.

이때는 기존에 작성된 class에 .color_scheme_dark 를 앞에 추가해 주어 다크모드시에 적용되도록 해주시면 됩니다.

.color_scheme_dark .기존class 이런식으로요.

다크모드로 했더니 .arrow_box:after 의 border-right-color 지정된 색상이 너무 밝아 다크모드에서 따로 어두운색으로 지정하고자 한다면

.color_scheme_dark .arrow_box:after {
border-right-color : #17181c;
}

위와 같이 추가해 주면 되구요.

어두운 색상의 차이를 조금 구분해서 그룹으로 똑같이 지정하고 싶은 것들은 연속적으로 지정해 주면됩니다.

.color_scheme_dark 기존class1, .color_scheme_dark 기존class2, .color_scheme_dark 기존class3 ............

{

color: #fdfdfd;

background-color: #333;

}

.color_scheme_dark 기존class4, .color_scheme_dark 기존class5, .color_scheme_dark 기존class6 ............

{

color: #fdfdfd;

background-color: #333;

}

적용하는 것은 어렵지 않으나 경우에 따라서 고칠게 많아서 노가다를 좀 해야 하는 것이 어려울 수 있겠네요.

개인적으로 border 컬러는 그냥 통으로 지정했습니다.

body.color_scheme_dark * {
border-color: #444 !important;
}

한꺼번에 모두 적용해 버리는거라 부작용이 있는 경우는 별도 조치가 필요할 수도 있지만 일거리가 줄기에.....

라이믹스 다크모드 기능이 편리하고 작동하는 것도 자연스럽고 맘에 들어서 적용하시면 만족도가 제법 높을 것 같습니다.

*CSS 적용하는 것은 제가 생각나는대로 한 것이라 더 효율적이거나 좋은 방법이 있을 수 있습니다.

라이믹스 회원(팝업)메뉴에 아이콘 추가해주기

꿀팁관리소장 — Tue, 11 May 2021 10:38:17 +0900

라이믹스의 최신버전에 회원메뉴에 메뉴별로 디자인을 할 수 있도록 class를 자동으로 추가해주는 기능이 추가되어 해당 클래스로 메뉴별로 디자인을 할 수 있게 되었습니다.

요렇게 메뉴별로 메뉴앞에 아이콘을 보여주는 팁을 작성해 보겠습니다.

calss가 부여가 되면 css로 디자인 하기가 쉬워집니다.

메뉴별로 li로 구성되어있습니다. 각 메뉴별로 li에 class가 부여된 것을 확인하고 싶다면 개발자도구에서 확인하시면 어떤 class가 부여되었는지 확인이 가능한데요. 메뉴의 act가 그대로 class로 할당이 되었습니다.

쪽지함 보기의 경우 dispCommunicationMessages 의 class를 가지고 있는 것을 확인했습니다.

아이콘의 자리를 확보하기 위한 css를 추가해 줍니다.

*개인적으로는 그냥 layout.html 에

<style>

</style>

을 만들어서 여기에 추가했습니다. 추가하는 위치에 따라 이미지 경로가 달라집니다.

#rhymix_popup_menu li, #popup_menu_area li {
     padding: 0 0 0 20px !important;
 position: relative;
 }

위와 같이 좌측에 20px 정도 여유 공간을 확보해주었습니ㅏ.

그리고 모든 메뉴의 공통적용 css를 추가합니다.

#rhymix_popup_menu li:before, #popup_menu_area li:before {
     content: '';
     position: absolute;
     background-repeat: no-repeat;
     width: 16px;
     height: 16px;
     left: 5px;
 top:6px;
 background-size: 16px;
 }

그리고 이제 쪽지함 보기에 해당하는 css를 추가해 줍니다.

쪽지함 보기에 적용할 아이콘 이미지를 구해야 합니다. 이미지가 아닌 폰트어썸 같은 것으로 대체할 수 있지만 이 팁에서는 이미지로 처리하는 것으로 작성합니다.

이전에 소개해드린 http://www.myiconfinder.com/ 사이트 같은 곳에서 아이콘을 다운 받아 준비합니다.

32*32 사이즈로 준비하셔도 충분합니다.

아이콘을 레이아웃의 img 폴더에 업로드 해줍니다. 폴더가 없다면 만들어주셔도 되고 폴더를 만들지 않고 그냥 레이아웃 상위 폴더에 업로드해도 상관은 없습니다. 경로만 맞게 지정해주면 됩니다.

아이콘을 message.png 로 준비해서 업로드 했습니다.

#rhymix_popup_menu li.dispCommunicationMessages:before, #popup_menu_area li.dispCommunicationMessages:before {
     background-image: url(/layouts/rxp_flex/assets/images/message.png);
 }

css에 위와 같이 쪽지함 보기에 해당하는 아이콘을 표시하기 위한 css를 추가해 주는데 아이콘 이미지 경로는 업로드한 위치에 따라 달라질 수 있고 저처럼 하지 않고 css 파일에 위 css를 추가한다면 이 또한 경로가 달라져야 합니다.(css 파일 위치부터 찾아가는 경로로 하셔야 합니다.)

이렇게 나머지 메뉴들도 모두 하나씩 처리해 주시면 됩니다.

RXP FLEX 레이아웃의 다크모드 기능 게시판에 적용하기

꿀팁관리소장 — Sun, 09 May 2021 18:52:17 +0900

저희 라이믹스 꿀팁의 레이아웃을 변경했다고 몇일 전 소식을 전해 드렸는데요. RXP FLEX 레이아웃 입니다. 원작의 버그들이 수정되고 기능이 개선되어 아주 사용하기 편리하고 빠르고 해서 좋네요.

https://github.com/rx-public/rxp_flex

특히 다크모드, 라이트모드 전환이 아주 자연스럽고 아주 깔끔하게 작동을 해서 게시판 스킨에도 CSS만 간단히 추가해서 다크모드가 지원되도록 해 보았습니다.

사용하시는 스킨에 따라 추가해야 할 것들이 달라지겠지만 원리는 아주 간단하네요. 실제로 해보니까 너무 간단해요 ㅋㅋ

게시판 스킨에 다크모드가 되었을때 바꾸고 싶은 요소에 .color_scheme_dark 를 추가해 주고 배경을 어두운색 글자색을 밝은색으로 해주고 나머지 어두운 배경에서 조금 바꾸고 싶은 것들을 바꿔 주면 됩니다.

쉽게 설명하면

원래 글자색상이 검정색이었던 요소 .bd_zine li.notice 라고 가정을 한다면 (개발자도구로 보시면 나옵니다.)

게시판 스킨의 css에

.color_scheme_dark .bd_zine li.notice { color:#fff;}

이렇게 추가를 해주면 다크모드 전환되면 글자색이 흰색으로 바뀝니다. 배경색도 함께 검정으로 바꿔야 하는 요소라면 backgorund-color:#000 을 함께 넣어주고 분리해서 적용해야 할 것들은 따로 따로 해주면 됩니다.

시도하기 전에는 복잡할 것이라 생각했는데 실제 해보니 너무 간단하네요.

라이믹스 다크모드 기능 그리고 RXP FLEX 레이아웃이 사용하는 다크모드,라이트모드 전환하는 방식 자체가

body 에 클래스를 color_scheme_dark 와 라이트모드일때 클래스 를 토글 해서 넣어주는 방식이라 다크모드일때만 다른 색상을 가지도록 게시판 스킨에 일부 원하는 곳에 css만 적용해 주면 되네요.

바꾸는데도 한 10-20분이면 되는 것 같습니다. 물론 앞으로 사용하면서 발견되는 부분도 있겠지만 그런 부분도 쉽게 추가해주면 되니 문제도 안될 것 같구요.

RXP FLEX 레이아웃 너무 좋네요.

카카오지도 마커 위치로 카카오내비 길안내 연동하기

꿀팁관리소장 — Sat, 08 May 2021 10:25:56 +0900

이미 라이믹스에서 주소를 입력받아 카카오지도에 마커를 표시해 주는 팁을 작성해 드렸습니다.

https://rxtip.kr/rx_tip/5201

위 팁에 추가로 해당 마커의 위치를 도착지로 하여 카카오내비로 연동되는 기능을 추가해 보려고 합니다.

지도 위에 카카오내비 길찾기 라는 버튼을 달아주고 해당 버튼을 눌렀을때 카카오내비 앱이 열리면서 자동으로 마커의 위치로 길안내가 시작됩니다.

라이믹스에 주소로 위치를 카카오지도를 연동해서 출력해주는 것을 구현해야 하니 위 링크해드린 게시글을 보고 완성을 해주세요.

이미 카카오지도를 출력하기 위해 넣어둔 스크립트의 맨 하단에 아래 함수를 추가해 주세요. (기존 작성한 스크립트의 안쪽 하단에 추가)

- 이 함수만 따로 스크립트로 만들어 카카오내비 연동을 하면 작동을 하지 않습니다. 기존 스크립트에 추가해야 하는 것으로 작성되어 있습니다.

function navi(){
 geocoder.addressSearch('{$oDocument->getExtraEidValue('address')[1];}', function(result, status) {
 
     // 정상적으로 검색이 완료됐으면 
      if (status === kakao.maps.services.Status.OK) {
      var coords1 = new kakao.maps.LatLng(result[0].y, result[0].x);
 Kakao.Navi.start({
   name: "{$oDocument->getExtraEidValueHTML('place_name');}",
   x: coords1.La,
   y:  coords1.Ma,
   coordType: 'wgs84'
 });
 }
 });
 }

{$oDocument->getExtraEidValue('address')[1];}

이 들어간 이유는 이전 팁에서 주소입력을 address의 id로 사용자정의로 생성했기 때문이니다. 주소로 한번더 좌표를 받아오기 위해서 사용했습니다.

{$oDocument->getExtraEidValueHTML('place_name');}

위 내용은 이전 팁에서 사용자정의에 마커에 표시될 이름으로 place_name 의 id를 사용해서 생성했기 때문에 연결이 되는 내용입니다.

위 함수를 호출하게 되면 지도 중심좌표를 목적지로 해서 카카오내비 길안내와 연결이 됩니다.

이제 위 함수를 호출할 버튼을 지도를 삽입했던 위치 지도 바로 위에 만들어 줍니다.

<div cond="$oDocument->getExtraEidValue('address')[1]">
<a cond="Mobile::isMobileCheckByAgent()" href="#" onclick="navi(); return false;">카카오내비 길찾기</a>
</div>

div에 조건은 이전 팁에서 주소를 입력받은 사용자정의 id로 입력이 있을때만 노출되도록 하는 조건을 동일하게 사용했습니다. 이 버튼의 위치에 따라서 적절히 사용하시면 될 것 같습니다.

버튼 a 태그에 모바일에서만 작동되도록 조건이 걸려있습니다.

위 링크 버튼을 클릭하면 스크립트에 삽입해 놓았던 함수가 호출이 되면서 카카오내비가 열리고 길안내가 시작됩니다.

라이믹스 통합게시판 글모으기 공지글 포함을 했을 경우 해당글이 통합 게시판에 공지로 올라가는 문제

꿀팁관리소장 — Fri, 07 May 2021 12:49:41 +0900

오늘 게시판을 신설하고 해당 게시판의 글을 메인페이지에 구성한 통합게시판에 포함시키게 했습니다. 신설 게시판에 작성된 공지글이 메인에 노출되길 바래서 당연히 메인의 통합게시판에 통합게시판 설정에서 "공지글 포함" 을 선택했습니다.

이렇게 해야 공지로 올린 글이 통합 게시판에도 보이게 됩니다.

그런데 한가지 애로사항이 생깁니다.

메인에 잘 나오긴 하지만 메인 통합게시판의 공지에 까지 올라가버리는 문제가 생깁니다. 매우 중요한 글이라 메인의 공지에 항상 나와도 상관 없는 경우는 이상한 점을 발견조차 못할 수도 있으나 글의 성격이 저기에 왜 올라가지? 라는 생각이 드는 글의 경우 문제를 발견하게 될 것 같습니다.

이게 스킨에서 영향을 줄 것 같진 않습니다.

그래서 조치를 해 준게 게시판 목록을 출력해 주는 스킨에 목록에서 원하는 특정글을 제외해주는 조치를 했습니다.

저의 경우는 스케치북의 _list_m.html 파일을 반응형으로 사용하고 있어서 이 파일을 수정했습니다.

상단의 공지 출력하는 부분에서

<ol class="{$mi->zine_info_icon} bd_lst bd_zine zine zine1 bd_m_lst img_load{$mi->tmb_effect}">
   <li cond="!$document_list && !$notice_list" class="no_doc">{$lang->no_documents}</li>
   
   {@ unset($notice_list[6442]);}
   <li cond="$notice_list" loop="$notice_list=>$no,$document" class="notice clear">

위 굵게 표시한 것을 추가해서 원하는 문서번호 6442를 제외하는 코드를 넣었습니다. ~~여러글을 제외할 경우 , 콤마로 구분해서 여러개를 넣으면 될 것 같네요. 여러게라는 건 $notice_list[6442] 이런 것이 여러개 라는 것 입니다.~~

여러개 글을 제외하려면 unset();으로 여러개 요소를 한번에 제거가 되지 않네요. 1개만 제거가 가능한 함수라 반복문으로 작성하거나 그냥 여러번 실행하면되니다.

unset($notice_list[6442]);

unset($notice_list[6443]);

}

근데 한가지 특이한 점이 발견되었는데요. 여기는 제가 아직 학습이 부족해서 이유는 잘 모르겠습니다.

저렇게 하면 통합게시판이 아닌 원래 게시판에서도 공지에서 내려와 있을 것으로 생각하고 해당 게시판에 가 보았더니 공지에 그대로 유지가 되고 있네요. 이부분은 제가 나중에 어떤 부분에서 이런 작동을 하는지 알게 되면 따로 공유하거나 이 글에 수정을 하거나 하겠습니다.

만약 통합게시판 외 원게시판에도 내려가는 일이 생긴다면 통합게시판을 구분하는 조건을 걸 생각이었는데 그렇지 않아서 그냥 두었습니다.

신규 회원 가입 사실만 메일로 전달 받고 싶을때

꿀팁관리소장 — Thu, 06 May 2021 16:37:02 +0900

별도의 추가 자료를 설치하지 않고 기존에 사용하고 있는 자료에 회원가입시 운영자에게 메일발송만 하는 코드를 추가해서 운영자가 새로운 회원이 가입될 시점에 메일로 알림을 받을 수 있습니다.

사용할만한 자료로는 회원가입 ip 기록모듈 또는 회원 가입경로 기록 모듈입니다.

보통 이런 자료는

function triggerInsertMember() {

}

신규회원을 db에 저장하기 직전에 수행하는 함수가 존재합니다. 여기에 해당 일을 마치고 메일까지 보내는일을 시키면 됩니다.

요렇게 간단하게 메일로 [회원번호] 신규회원이 가입했습니다. 라고 메일이 오게 됩니다.

$mail_title ='신규 회원가입 알림';
 $content =' 신규회원이 가입했습니다.';
 $nick_name ='사이트명을 넣어주시면 좋습니다.';
 $tomailing_email = '수신할이메일주소';
 $mail_content = sprintf('<p>[%s]%s</p>',$member_srl, $content);
 $oMail = new \Rhymix\Framework\Mail();
 $oMail->setSubject($mail_title);
 $oMail->setBody($mail_content);
 $oMail->addTo($tomailing_email, $nick_name);
 $oMail->send();

위에 말씀드린 함수 안에 끝 부분에 위 코드를 추가해서 메일보내는 작업을 추기해 주면 됩니다.

하루에도 가입이 계속 있는 곳은 오히려 메일이 도움이 안되지만 뜸하게 가입이 있는 곳은 나름 운영자가 가입 사실을 알고 싶기 때문에 요렇게 해주면 쉽게 알 수 있습니다.

라이믹스 꿀팁이 회원가입을 받게 되면서 생각나서 팁을 작성해 봅니다.

통합게시판 게시글 목록에 게시판별 아이콘 표시해 주기

꿀팁관리소장 — Thu, 06 May 2021 15:49:09 +0900

통합게시판을 운영할때 원 게시판명을 출력해주는 것은 팁을 작성해 드린게 있습니다.

https://rxtip.kr/rx_tip/2828

위 게시글을 보시면 라이믹스의 통합게시판 기능이나 타임라인 모듈을 이용해서 통합게시판을 구성했을때 글 목록에 어떤 게시판의 글인지 표시를 해줄수 있습니다.

해당 게시판명 앞에 아이콘을 게시판마다 다르게 표시해 주고 싶은데 모든 곳에 게시판의 모듈번호로 분기 조건문을 사용해서 구현하는게 다소 불편할 수 있고 재사용을 감안한다면 게시판별 아이콘을 지정해 주는것이 좋을 것 같아 구현해 봤습니다.

저희는 사이트 메인이 통합게시판으로 구성되어 있고 각 게시판에서 작성된 글이 메인에 모아지는데 여기서 게시판명과 아이콘을 보여주고 있습니다.

게시판 스킨의 파일 중 공통사용되는 파일에 작성해 두면 좋은데 저는 스케치북 스킨이라 _setting.html 에 설정값을 생성해 주는 부분에 추가해 주었습니다.

다른 스킨의 경우 _header.html 이나 비슷한 파일 또는 정 안되면 목록을 담당하는 파일에 작성을 해도 됩니다.

레이아웃에 작성을 해도 모든 곳에서 사용이 가능할 것 같긴한데 제가 이건 시도해 보지 않았으니 해보실 분은 해보시고 피드백을...

폰트어썸을 기준을 설명을 드리면

위 말씀드린 파일에 각 게시판 모듈번호에 폰트어썸 아이콘을 매칭시켜주는 코드를 작성합니다.

{@
 $module_icon=[];
 $module_icon['145'] = 'fas fa-hat-wizard';
 $module_icon['133'] = 'fas fa-volume-up';
 $module_icon['137'] = 'fa-question-circle';
 $module_icon['139'] = 'far fa-star';
 $module_icon['141'] = 'fas fa-gift';
 $module_icon['143'] = 'fas fa-shopping-basket';
 }

}

감싸져 있는 부분은 기존에 감싸져 있는 곳에 추가를 해도 되고 아니면 새롭게 위 코드로 감싸서 전체코드를 작성하셔도 됩니다.

$module_icon['145'] <--- 145는 게시판 모듈 번호입니다.

모듈번호를 알고 싶으시면 관리자페이지 - 게시판 설정을 진입하시면 게시판 목록이 나올겁니다.

원하는 게시판 수정을 누르시면 url에서 게시판 번호를 확인하실 수 있어요.

폰트어썸 아이콘에 보시면 사용하고자 하는 아이콘사용하는 전체 코드 중 fas fa-hat-wizard 이런 부분만 가져와서 매칭시켜주시면 됩니다.

그 다음 게시판 목록을 담당하는 곳 게시판명과 아이콘을 출력하고 싶은 곳에

<i class="{$module_icon[$document->get('module_srl')]}"></i>

이렇게 사용하시면 게시판과 일치하는 폰트어썸 아이콘이 출력이 됩니다. 물론 통합게시판 혹은 타임라인 게시판이라는 조건은 거셔야겠죠??

타임라인 을 사용한 경우면 $timeline_info 을 라이믹스 통합게시판 기능을 사용했다면 $module_info->include_modules 를 cond 또는 if 조건으로 사용하시면 통합게시판에서만 저 코드가 작동하게 할 수 있습니다.

스티커 모듈 스티커 사이즈 140px 고정인거 가변으로 고치기

꿀팁관리소장 — Tue, 04 May 2021 14:23:46 +0900

XE, 라이믹스에서 사용 가능한 스티커콘 모듈인 스티커모듈이 있습니다. 댓글에서 스티커를 사용해서 댓글을 달아줄 수 있게 해주는 모듈입니다.

그런데 이 모듈을 사용하다 보면 스티커 사이즈가 140px 사이즈로 고정되서 출력이 되는데 이게 작은 사이즈의 스티커를 사용하는 경우는 약간 확대되어 보이는 문제가 있을 수 있고 작은 사이즈 그대로 출력하고 싶을 수 있습니다.

현재 위 스티커가 100px 짜리 입니다.

모듈에서 100px 까지 업로드가 가능합니다. 100px 보다는 큰 것을 그리고 140px를 권장하고 있죠.

스티커를 구하다 보면 100px 짜리도 맘에 드는게 있고 한데 이게 출력될때는 140px로 채워져서 출력되니 약간 흐릿한 느낌이 좋지 않을 수 있을 것 같습니다.

이미지를 보여주는 방식이 background 이미지로 보여주는 방식이고 사이즈가 지정되어 있어서 그런데요.

<img src~> 방식으로 바꾸면 될 것 같아 바꿔 보았습니다.

sticker.controller.php 파일의 220번라인 부근을 보면

function stickerCommentCallback($matches){
 $output = $this->_getStickerComment($matches[4]);
 $part = "";
 if(!empty($output->data)){
 $data = $output->data;
 $file_name = substr($data->file_name, 0, strrpos($data->file_name, "."));
 //!!!S
 if(!$_COOKIE['txtmode']){
 $part = '<!--BeforeComment('.$matches[1].','.$matches[2].')--><div class="comment_'.$matches[1].'_'.$matches[2].' xe_content"><a href="/?mid=sticker&sticker_srl='.$data->sticker_srl.'" title="'.$data->title.'" style="display:block;background-image:url('.$data->url.');background-size:cover;background-position:50% 50%;width:140px !important;height:140px !important;border-radius:3px;" alt="'.$file_name.'"></a></div><!--AfterComment('.$matches[1].','.$matches[2].')-->';
 } else {
 $part = '<!--BeforeComment('.$matches[1].','.$matches[2].')--><div class="txtmode comment_'.$matches[1].'_'.$matches[2].' xe_content"><p style="margin:1em;">데이터 절약 모드 작동중<BR><a href="/?mid=sticker&sticker_srl='.$data->sticker_srl.'" target="_blank" style="color:#777;">('.$data->title.')</a></p></div><!--AfterComment('.$matches[1].','.$matches[2].')-->';
 }
 //!!!E
 
 } else {
 $delete_msg = $this->_getStickerDeleteMsg();
 $part = '<!--BeforeComment('.$matches[1].','.$matches[2].')--><div class="comment_'.$matches[1].'_'.$matches[2].' xe_content">'.$delete_msg.'</div><!--AfterComment('.$matches[1].','.$matches[2].')-->';
 }
 return $part;
 }

이런 함수가 있습니다.

함수 안에서 스티커를 출력해주는 코드

<a href="/?mid=sticker&sticker_srl='.$data->sticker_srl.'" title="'.$data->title.'" style="display:block;background-image:url('.$data->url.');background-size:cover;background-position:50% 50%;width:140px !important;height:140px !important;border-radius:3px;" alt="'.$file_name.'"></a>

위의 내용을

<a href="/?mid=sticker&sticker_srl='.$data->sticker_srl.'" title="'.$data->title.'"><img src="'.$data->url.'" style="border-radius:3px;max-witdh:140px;" alt="'.$file_name.'"></a>

이렇게 바꾸면 이미지를 직접 불러오면사 사이즈 그대로 보여줄 수 있습니다. 다만 최대 사이즈 max-with:140px; 를 지정해 주어서 제한을 해주면 좋을 것 같습니다.

단, 이렇게 사이즈를 고정하지 않으면 하나의 글에 여러 사이즈의 스티커가 작성될때 각 스티커 사이즈의 크기별로 다르게 출력되니 이점이 싫으신 분은 이 팁이 유용하지 않으며 이팁을 사용하면서도 사이즈를 고정하고자 할때는 width 속성을 지정하시면 됩니다.

또 다른 대안으로는 소스를 원본 그대로 유지하면서 140px !important; 를 작은 스티커 기준으로 100px !important; 로 변경하는 방법도 있습니다. 모두 깨지지 않는 이미지 사이즈인 작은 이미지로 통일되는 것 입니다.

스케치북5 스킨 검색어 하이라이트 효과 주기

꿀팁관리소장 — Sun, 02 May 2021 23:32:24 +0900

오늘 다른 곳에 적용하려고 특정 글자 색상을 바꾸는 것을 알아보다가 답변으로 얻은 소스로 스케치북5 스킨의 게시판 검색 결과의 제목의 검색어에 색상과 굵기 효과를 주는 것으로 적용해 보았습니다.

요렇게 "게시판"으로 검색을 했을때 해당 검색어에 색상과 굵기 효과를 주는 팁입니다. 제목에만 효과를 주는 간단한 효과의 팁입니다.

사용하시는 스킨의 목록을 출력하는 파일을 수정해 주시면 됩니다. 저는 모바일형을 PC와 모바일 모두 사용할 수 있게 수정해서 사용중이라 _list_m.html 을 수정했습니다.

파일의 맨 하단에

<script>
jQuery(function($){
$(document).ready(function(){
var target =$(".rt_area").find(">h3>a");
$(target).each(function() {
$(this).html($(this).html().replace(/{Context::get('search_keyword')}/g, '<span class="highlight">{Context::get('search_keyword')}</span>'));
});
});
});
</script>

위와 같은 스크립트를 넣었습니다.

Context::get('search_keyword') 검색이 있을 경우만 스크립트가 작동되도록 조건이 걸려있습니다.

var target =$(".rt_area").find(">h3>a");

이부분은 목록에서 제목이 위치하는 경로를 잘 찾으셔야 합니다.

저희가 var target =$(".rt_area").find(">h3>a"); 를 사용한 이유는 위 캡쳐로 보시면 이해가 되실 겁니다. 개발자도구로 보시면 확인할 수 있습니다.

그리고 class="highlight" 로 지정했기 때문에

css 파일(board.css)에 주고 싶은 효과를 추가합니다.

.highlight {color:#f28585;font-weight:bold;}

저는 위와 같이 효과를 주었습니다.

여태 몰랐던 라이믹스의 $document, $oDocument 게시글 정보

꿀팁관리소장 — Thu, 29 Apr 2021 17:08:55 +0900

$document, $oDocument 에 담겨있는 게시글 정보 중 XE에서는 없었던 것으로 기억되는 2가지가 있어서 소개해 드리고자 합니다.

라이믹스에 언제 생긴지 모르겠지만 오래전 부터 있었는데 모르고 지내왔네요.

[module_title] => 자료실
[mid] => download

module_title, mid 두가지 정보입니다.

이게 어디서 써먹냐면 통합게시판 또는 타임라인모듈 게시판에서 원글의 게시판타이틀에 해당하는 브라우저 타이틀을 가지고 오거나 할때 XE에서는 게시글의 module번호로 해서 모듈정보에서 가져왔었습니다.

$modules_info[$document->get('module_srl')]->browser_title

이런식으로 모듈에서 정보를 가져왔는데

문서정보에 module_title 이 있으니 이걸 바로 쓰면 됩니다.

타임라인 모듈의 게시글 목록에서 원글 게시판명을 출력할때

{$document->get('module_title')} 이런식으로요.

mid도 마찬가지겠죠.

라이믹스 사용자분들이 XE시절부터 공유되는 방법외 추가적으로 바로 가져다 쓸 수 있는 방법에 관한 공유는 없었던 것 같네요. 저만 몰랐던건가요....

레이아웃에서 위젯 페이지 하단에 광고같은 것을 배치하면 디자인이 깨지는 경우

꿀팁관리소장 — Mon, 26 Apr 2021 12:04:45 +0900

레이아웃 콘텐츠 하단에 광고나 기타 무언가를 배치했을때 최고관리자가 아닌 경우 디자인이 깨지거나 아예 컨텐츠영역까지 덮어버리는 등 배치에 문제가 생기는 경우 경험해 보셨나요??

레이아웃에서 컨텐츠 부분이 출력될때 위젯의 내용의 출력이 되고 최고 관리자의 경우는 위젯페이지를 수정할 수 있는 박스가 나옵니다.

이 박스가 먼저 나오면 괜찮고 이 박스가 없는 최고관리자 이외의 접속자는 왜 문제가 생길까요?

살펴보니까 저 최고관리자에게만 나오는 박스의 css를 보니 해답이 보이더군요.

.btnArea {
clear: both;
margin: 10px 0;
padding: 0;
text-align: right;
zoom: 1;
}

clear:both; 가 들어가서 괜찮은 것을 보고 눈치를 챘습니다.

위젯의 경우 위젯을 생성하면 무조건 float 값을 가지게 되어 있어서 저렇게 코어에서 저 박스를 만들때 영향을 받지 않도록 clear:both 로 float을 초기화 해 준 것 입니다.

그런데 괜찮은 레이아웃이 많던데요??

이걸 레이아웃 차원에서 처리해주었기 때문이더라구요.

레이아웃에서 컨텐츠가 출력되는 바로 아래에서 초기화해줄 무언가를 넣어주면 됩니다.

{content}

레이아웃에서 {content} 를 찾아서 바로 아래에 위와 같이 초기화 해주도록 조치를 해주면 되는 것이죠.

레이아웃이 제작될때 이점을 고려해서 추가해주면 좋겠네요.

댓글 주소 클립보드에 복사하는 기능 추가하기

꿀팁관리소장 — Sun, 25 Apr 2021 11:14:17 +0900

게시글 주소를 클립보드에 복사하는 기능을 추가하는 팁을 작성해 드렸는데요. 해당 기능을 위해서 클립보드 라이브러리를 이용할 수 있게 되어 다른 것들도 클립보드에 추가로 복사를 할 수가 있습니다.

그래서 이번에는 댓글주소를 복사하는 기능을 추가해 보겠습니다.

누군가에게 특정 댓글의 정보를 제공해 주고 싶을때 글 주소만 알려주면 해당 댓글을 찾아가기가 어렵습니다. 그래서 댓글 주소를 정확히 알려주면 주소를 입력하면 해당 댓글 위치까지 찾아가게 되어 바로 댓글을 열람할 수 있습니다.

#commnet_댓글번호 라는 형식의 주소는 앵커의 역할을 하여 해당 댓글을 찾아갑니다. 보통 스킨에서 댓글마다 comment_댓글번호로 id를 가지게 했기에 가능한 것 입니다.

스케치북5 스킨에 댓글을 출력하는 곳 마우스를 올리면 나타나는 곳에 댓글주소복사라고 직관적인 명칭으로 댓글 주소를 복사할 수 있느 버튼을 만들었습니다.

게시글 주소복사 기능을 먼저 만들고 이 기능을 만드셔야 하니 이전 게시글을 먼저 확인해 주세요.

https://rxtip.kr/rx_tip/4862

위 게시글의 팁을 적용하셨다면 이미 <load target="js/clipboard.min.js" /> 라는 코드를 게시판 열람하는 파일의 상단에 입력하셔서 위 js 파일이 잘 로딩되고 있을 겁니다.(게시글 주소 복사 기능을 이미 구현하셨다면 위 코드는 따로 넣지 않아도 된다는 말입니다.)

이제 댓글부분에 기능을 추가할 것이니 스케치북5 스킨기준 _comment.html 파일을 열어 기능을 추가합니다.

이번에도 스크립트를 넣어줘야 하는데 _comment.html 파일의 맨 하단에 아래 스크립트를 넣어주세요.

<script>
 var clipboard = new Clipboard('.copy_cmt_addr1');
  clipboard.on('success', function(e) {
 alert('댓글 주소가 클립보드에 복사되었습니다.');
 });
  
 clipboard.on('error', function(e) {
 prompt("이 댓글의 주소입니다. Ctrl+C를 눌러 클립보드로 복사하세요", e.text);
 });
 </script>

여기서 중요한 것은 이미 게시글복사 기능을 구현하셨다면 그때 사용한 class와 다른 class를 사용해야 한다는 점 입니다. .copy_cmt_addr1 로 1을 붙여서 다른 것으로 바꾼 것입니다.

그리고 "댓글복사하기" 링크를 추가해 줍니다.

스케치북 기준

<div class="fdb_nav img_tx">

위와 같은 부분이 있는데 저 바로 아래에 넣었습니다.

<a class="copy_cmt_addr1" href="#" data-clipboard-text="{getFullUrl('','mid',$mid,'document_srl',$oDocument->get('document_srl'))}#comment_{$comment->comment_srl}" onclick="return false;"><i class="fa fa-link" aria-hidden="true"></i>댓글주소복사</a>

여기서도 중요한 것은 class가 스크립트에서 약속한 것과 동일하게 하는 것 입니다.

요렇게 댓글주소복사 링크를 추가해 주면 클릭하면 자동으로 댓글주소가 복사가 됩니다.

제목에 색상이나 굵기 자주 사용한다면 공유 관련 고쳐야 할 부분

꿀팁관리소장 — Sat, 24 Apr 2021 20:56:31 +0900

보통 제목에 굵기나 색상등을 사용하는 경우가 흔치 않아 문제에 관한 제보가 별로 없는 듯 한데요. 현재 스케치북5 스킨만 해도 이러한 태그사용이 문제가 되는 부분이 있습니다.

밴드의 경우는 모바일에서 태그가 제목에 사용된 경우 문제가 될 수 있습니다.

흔히 공유를 할 경우 미리 공유에 이용될 게시글 제목,URL 등을 변수에 담아 놓고 각 공유에서 해당 부분을 이용하게 됩니다.

그런데 제목에 태그가 들어가 있다면 그 태그가 그대로 제목에 전달되기 때문에 문제를 일으킵니다.

따라서 공유등에 사용할 제목을 담아 놓을때 미리 태그를 제거해 두어야 합니다.

대표적으로 스케치북5 스킨 _read.html 상단에 있는 코드 중

$sns_title=$oDocument->getTitleText();

를

$sns_title=strip_tags($oDocument->getTitleText());

이 처럼 태그를 제거해 줄 수 있도록 해주어야 합니다. 이렇게 안한다면 이 변수를 이용하는 모든 공유하는 부분에서 태그를 제거해야 합니다.

유료 스킨에서도 스케치북5 스킨의 코드를 그대로 이용한 경우도 많습니다.

위 변수를 이용하지 않고 직접 제목 부분을 태그를 제거하지 않은채 이용하고 있다면 거기도 고쳐야 합니다. 저의 경우는 카카오톡 공유 부분을 최신버전으로 바꾸면서 따로 구현해서 위 변수를 이용하지 않아 동일하게 고쳐야 했습니다.

라이믹스 커뮤니티의 화폐로 사용할 수 이벤트스티커 모듈의 활용

꿀팁관리소장 — Fri, 23 Apr 2021 11:05:57 +0900

라이믹스로 커뮤니티의 회원들에게 활동에 대한 보상을 포인트와 경험치로 해줄 수 있습니다. 그런데 경험치를 함께 사용할 경우 포인트에 의존하는 경험치 구조상 특별한 활동에 포인트를 높게 주어 화폐로서 사용하는 포인트를 많이 주기 어려워 집니다.

이는 경험치를 제대로 활용하는 곳 일 수록 그렇습니다. 경험치로 아무것도 하지 않고 그냥 적립만 한다면 문제가 안됩니다. 얼마를 주어도 그 가치가 어차피 없기 때문에 별 상관이 없지만 경험치가 매우 중요한 곳의 경우는 경험치는 매우 제한적으로 활동에 밀접한 행동에 반복적인 지급이 되지 않도록 해야 합니다.

그런데 포인트와 경험치가 연동되기 때문에 이런 특별 보너스에 해당하는 것을 포인트로 지급해 버리면 경험치가 함께 지급되어 문제가 될 수 있습니다.

이런 보너스 활동에 적극 참여하라고 유도를 하고 싶지만 반복적인 경험치 획득이 함께 이루어져 화폐만 지급하고 싶은 것이 달성되지 못해 어려움이 생길 수 있습니다.

이런 경우 화폐로 쓸 수 있는 포인트를 우회적으로 얻을 수 있는 수단을 만들어 주면 좋은데 그게 지금 소개하는 이벤트스티커 모듈의 스티커 지급으로 좋은 효과를 낼 수 있습니다.

스티커를 좋은 활동과 연계하여 지급하는 것은 별도로 구현해야 합니다. 배포되고 있는 이벤트스티커 모듈에는 단순히 스티커를 클릭하여 스티커를 획득하는 것의 기능밖에 없습니다.

저희는 신입회원에게 따뜻한 환영인사의 댓글이 많이 달릴 수 있도록 가입인사 글에 댓글을 작성하면 포인트 30포인트를 지급하여 30포인트, 경험치 30을 지급합니다.

그리고 추가적으로 스티커 5장을 지급합니다.

스티커 1장당 10포인트로 환전할 수 있도록 설정하여 50포인트를 추가로 획득할 수 있는 것 입니다. 스티커 지급은 경험치와 연동이 안되기 때문에 댓글을 남기는 활동이지만 스티커 지급에 의한 경험치 보상은 이루어지지 않아 원하는 목적을 달성 할 수 있습니다.

애드온으로 가입인사 글에 댓글을 달면 스티커 5장이 지급되도록 구현했습니다.

회원들이 궁금해 하는 질문에 답변을 했을때 누군가 그 답변이 좋은 답변이라고 추천을 해 주게 되면 설정된 추천당 포인트와 경험치가 지급이 되고 추가로 이때도 스티커가 지급이 됩니다.

경험치와 연동되지 않는 스티커가 추천을 받을때 마다 지급이 됩니다. 댓글을 작성한 사람에게는 추천이 될 때 마다 좋은 답변으로 채택되어 스티커가 지급되었다는 사실이 쪽지로 전달되게 됩니다.

이로서 다른 회원의 질문에 좋은 답변을 하고 싶다는 동기가 더욱 강화되고 좋은 활동에 경험치가 아닌 화폐를 추가 지급 할수 있게 됩니다.

이 또한 애드온으로 구현했습니다.

이 지급받은 스티커는 회원들이 스티커환전소에 가서 100%확율로 모두 포인트로 교환할 수 있고 혹은 배팅을 해서 더 많은 포인트로 환전할 게임을 할 수 있습니다.

스티커의 장점은 이런 흥미를 느낄 수 있는 게임머니로서 역할을 한다는 것 입니다.

저희는 경험치를 도입하고 전월 경험치누적으로 활동메달을 지급하게 하면서 경험치를 정말 실제로 글을 쓰고 댓글을 쓰고 추천을 받고 하는 활동에만 경험치를 지급하는 것으로 정밀하게 세팅해서 위와 같은 활동에 추가적으로 포인트를 더 많이 주는 방식은 적합하지 않고 이런식으로 별도로 화폐의 역할인 포인트만 증가시켜줄 수 있는 방법이 더욱 더 진가를 발휘하게 되었습니다.

단, 사이트에서 포인트의 사용처가 없어서 화폐로서의 역할을 못한다면 아무 의미가 없습니다.

누구에게 남긴 대댓글인지 원댓글 작성자 닉네임 표시해 주기

꿀팁관리소장 — Thu, 22 Apr 2021 14:39:28 +0900

스케치북5의 대댓글 n차식 depth 표현은 사실 가독성이 무척 떨어지기 때문에 그것으로 어떤 댓글에 대한 답의 대댓글인지 알 수가 없습니다. 대화가 조금만 길어지면 오히려 더 햇깔리게 됩니다.

커뮤니티를 오래 운영해 본 결과 depth 식 디자인은 오히려 출력할 수 있는 가로폭만 제한을 하고 어떤 댓글에대한 답의 대댓글인지 인식하기 더 어려운 상황을 만든다는 결론으로 운영중인 커뮤니티에서는 depth는 1차만 유지하고 없애서 운영중입니다.

여기 라이믹스 꿀팁도 오늘 그렇게 바꿔버렸습니다.

대신 한가지 보완해 주면 좋은게 누구에게 남긴 대댓글인지 알 수 있게 원 댓글 작성자의 닉네임을 표시해 주면 좋은데 그 방법은 아주 간단한 코드로 가능합니다.

스케치북5 스킨 기준으로는 _comment.html 파일에 댓글을 출력하는 반복문이 있습니다. 해당 반복문 안에서 적당한 위치를 찾아서 코드를 넣어주면 됩니다.

<!--@if($comment->parent_srl)-->
 {@
 $oComment = &getModel('comment');
 $comment_parent = $oComment->getComment($comment->parent_srl);
 }
 <div>
 <strong>To.{$comment_parent->getNickName()}</strong>
 </div>
 <!--@end-->

댓글을 출력할때 부모댓글이 있다면 이라는 조건으로 있으면 부모댓글의 작성자 닉네임을 출력하라는 코드 입니다.

스케치북 빵조각 '메뉴 아이콘' 적용해 보았습니다.

꿀팁관리소장 — Wed, 21 Apr 2021 14:46:28 +0900

라이믹스2 에서 새로 생긴 기능 메뉴 아이콘 기능은 간단하게 소식으로 전해드린 적이 있습니다.

https://rxtip.kr/rx_story/4083

위 소식을 전해드릴때 메뉴에 아이콘을 표시하기 위해 기존에는 메뉴 설명 부분에 아이콘의 특정할 수 있는 문구를 넣고 레이아웃 등에서 메뉴 설명 부분을 읽어와서 출력해주는 것을 별도로 메뉴 아이콘 항목이 신설되어 메뉴설명과 아이콘을 분리해서 사용이 가능하다고 전해드렸습니다.

메뉴를 출력하는 코드에서 'icon' 값을 출력하도록 코드를 짜면 해당 메뉴에 설정한 아이콘이 나오게 되는거죠.

저희 라이믹스 꿀팁은 새로 생긴 메뉴 아이콘에 새롭게 아이콘을 넣고 메뉴마다 아이콘을 가지게 해서 출력하게 했습니다.

그런데 오늘은 이 메뉴에 있는 아이콘과 똑같은 아이콘이 스케치북 스킨의 빵조각의 메뉴에도 걸리도록 똑같이 만들었습니다.

기존에 경로 중간에 출력하던 > 는 없애 버리고 각 메뉴가 가지는 아이콘을 메뉴 앞에 출력하도록 했습니다.

<a href="{getSiteUrl()}"><strong>Home</strong></a>
 <block loop="$메뉴변수->list=>$key1,$val1" cond="$val1['selected']">
 <!--@if(!$val1['list'])--><a href="{$val1['href']}"><em><ion-icon cond="$val1['icon']" name="{$val1['icon']}"></ion-icon> {$val1['text']}</em><!--@else--><ion-icon cond="$val1['icon']" name="{$val1['icon']}"></ion-icon> {$val1['text']}<!--@end--></a>
 <block loop="$val1['list']=>$key2,$val2" cond="$val2['selected']">
 <a href="{$val2['href']}"><!--@if(!$val2['list'])--><em><ion-icon cond="$val2['icon']" name="{$val2['icon']}"></ion-icon> {$val2['text']}</em><!--@else--><ion-icon cond="$val2['icon']" name="{$val2['icon']}"></ion-icon> {$val2['text']}<!--@end--></a>
 <block loop="$val2['list']=>$key3,$val3" cond="$val3['selected']">
 <a href="{$val3['href']}"><!--@if(!$val3['list'])--><em><ion-icon cond="$val3['icon']" name="{$val3['icon']}"></ion-icon> {$val3['text']}</em><!--@else--><ion-icon cond="$val3['icon']" name="{$val3['icon']}"></ion-icon> {$val3['text']}<!--@end--></a>
 </block>
 </block>
 </block>

<ion-icon cond="$val1['icon']" name="{$val1['icon']}"></ion-icon>

<ion-icon cond="$val2['icon']" name="{$val2['icon']}"></ion-icon>

<ion-icon cond="$val3['icon']" name="{$val3['icon']}"></ion-icon>

각 차수에 맞는 아이콘을 불러올 수 있도록 레이아웃과 동일하게 코드를 추가해 주어서 아이콘이 표시되도록 했습니다.

** 저희 라이믹스 꿀팁은 ion-icon 이라는 아이콘 폰트를 쓰고 있으니 하나의 예시일 뿐 저희랑 똑같이 구성해도 아이콘이 출력되지 않습니다. 그리고 관리자페이지 메뉴 아이콘 입력에 정확한 아이콘 폰트명을 입력해야 합니다.

라이믹스 주소입력으로 카카오지도 위치 출력해주기

꿀팁관리소장 — Sat, 17 Apr 2021 12:32:57 +0900

라이믹스로 커뮤니티를 만들고 회원이 글을 쓰게 했을때 만약 위치정보가 필요해서 글 작성자에게 지도를 넣으라고 하면 굉장히 어려운 작업이 됩니다. 물론 에디터컴퍼넌트에 지도도구라는 것이 있긴 하지만 사실 일반적인 글을 쓰고 파일을 첨부하는 정도의 일만 해본 일반인은 굉장히 부담스럽고 쉽게 하지 못하는 작업이 됩니다.

실제로 지도도구를 사용할 있게 하고 회원들에게 지도를 넣어달라고 해서 운영을 해보면 지도가 들어가는 게시글은 굉장히 낮은 비율이고 대부분 지도를 넣지 못하게 됩니다.

이렇게 할 바에는 차라리 어차피 입력 받은 주소를 이용해서 자동으로 지도와 위치 마커를 표시해주는게 운영자나 사용자 모두에게 큰 이득이 될 것입니다.

카카오 api 자바스크립트키 준비

우선 카카오지도를 사용할 것이니 카카오 자바스크립트키가 있어야 합니다.

https://developers.kakao.com/

위 카카오 개발자센터에 애플리케이션등록(쉽게 말하면 사이트등록)을 하면 자바스크립트키가 만들어지니 이 자바스크립트키를 먼저 확보해 주세요.

이부분 자세한 설명은 다루지 않겠습니다.

사용자정의 생성

지도를 표시할 게시판에 사용자정의(확장변수)로 주소,상호명 을 만들어 줍니다.

주소 입력에 사용될 사용자정의에는 address 라는 id를 사용했습니다.

필수항목을 예로 하셔야 주소를 꼭 입력받을 수 있습니다.

상호명에 사용될 사용자정의 id는 place_name 으로사용했습니다.

필수항목을 예로 하셔야 상호를 지도에 표시하는 기능을 구현할 수 있습니다.

사용하는 게시판 스킨의 게시글 열람을 담당하는 파일 _read.html 과 같은 파일을 열어서 스크립트를 추가해 줍니다.

스크립트 삽입

스크립트는 하단에 넣어주시면 됩니다.

<block cond="$oDocument->getExtraEidValue('address')[1]">
<script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=카카오자바스크립트키&libraries=services,clusterer,drawing"></script>
<script>
var mapContainer = document.getElementById('map'), // 지도를 표시할 div
mapOption = {
center: new kakao.maps.LatLng(33.450701, 126.570667), // 지도의 중심좌표
level: 3 // 지도의 확대 레벨
};

// 지도를 생성합니다
var map = new kakao.maps.Map(mapContainer, mapOption);

var mapTypeControl = new daum.maps.MapTypeControl();
map.addControl(mapTypeControl, daum.maps.ControlPosition.TOPRIGHT);
var zoomControl = new daum.maps.ZoomControl();
map.addControl(zoomControl, daum.maps.ControlPosition.RIGHT);

// 주소-좌표 변환 객체를 생성합니다
var geocoder = new kakao.maps.services.Geocoder();

// 주소로 좌표를 검색합니다
geocoder.addressSearch('{$oDocument->getExtraEidValue('address')[1];}', function(result, status) {

// 정상적으로 검색이 완료됐으면
if (status === kakao.maps.services.Status.OK) {

var coords = new kakao.maps.LatLng(result[0].y, result[0].x);

// 결과값으로 받은 위치를 마커로 표시합니다
var marker = new kakao.maps.Marker({
map: map,
position: coords
});

// 인포윈도우로 장소에 대한 설명을 표시합니다
var infowindow = new kakao.maps.InfoWindow({
content: '<div style="width:150px;text-align:center;padding:6px 0;">{$oDocument->getExtraEidValueHTML('place_name');}</div>'
});
infowindow.open(map, marker);

// 지도의 중심을 결과값으로 받은 위치로 이동시킵니다
map.setCenter(coords);
}
});
</script>
</block>

cond="$oDocument->getExtraEidValue('address')[1]" 의 조건을 건 이유는 주소입력이 있는 경우만 작동하도록 조건을 걸었습니다.

$oDocument->getExtraEidValue('address')[1] 는 주소입력이 배열로 되는데 2번째에 들어가는 주소를 가져오게 하는 것 입니다. 지도를 표시하려면 우편번호와 같은 첫번째 요소는 없어야 하며 배열의 두번째에 위치한 주소가 필요합니다.

*카카오자바스크립트키 라고 쓰여진 곳은 발급받은 자바스크립트키를 넣어주셔야 합니다.

지도출력 코드 넣기

그리고 지도가 출력이 되길 원하는 위치

보통은 본문 하단에 위치하길 원할 것 같긴 합니다.

{$oDocument->getContent(false)}

이런 코드가 본문을 출력하는 코드이니 위 코드 아래에 원하는 위치에 지도를 표시할 코드를 넣어주시면 됩니다.

<div id="map" style="width:100%;height:350px;" cond="$oDocument->getExtraEidValue('address')[1]"></div>

위 코드가 지도를 출력해 주는 코드 입니다.

*카카오내비 길안내 연동 기능의 팁이 추가로 작성되었습니다.

https://rxtip.kr/rx_tip/6510

기본적인 설명은 카카오api 메뉴얼에 있습니다.

https://apis.map.kakao.com/web/sample/addr2coord/

애드온으로 제작했습니다.

https://rxtip.kr/download/6692

본문 게시글 주소 복사 버튼 여러곳에 추가해 주기

꿀팁관리소장 — Sat, 10 Apr 2021 12:47:47 +0900

작성된 게시글의 URL을 쉽게 클립보드에 복사할 수 있는 팁을 공유했는데요. 오늘은 제가 사용하는 스케치북 스킨에 공유버튼과 navi 버튼에 똑같은 기능의 URL 복사 버튼을 추가해 봤습니다.

게시글 주소 url 복사기능 추가하는 팁

https://rxtip.kr/rx_tip/4862

기존에 공유한 팁 게시글에서는 주소복사 버튼을 배치하거나 하는 것의 설명은 없었습니다. 각자 원하는 위치에 버튼을 추가하면 되니 따로 설명을 하지 않았구요.

오늘 추가한 아래쪽 navi 박스 안에 추가한 것은 따로 설명을 해 보겠습니다.

모바일에서도 navi 박스 안에 똑같이 URL 복사 버튼이 표시가 됩니다.

물론 위 링크해드린 url에서 설명한대로 js파일을 업로드하고 스크립트를 설명대로 추가한 상태여야 합니다. 지금 설명은 버튼을 추가하는 것의 설명만 있습니다.

스케치북 스킨의 _read_navi.html 파일을 열어보시고 원하는 곳에 아래의 코드를 추가해 줍니다.

<a class="copy_cmt_addr" href="#" onclick="return false;" data-clipboard-text="{$oDocument->getPermanentUrl()}" title="게시글 주소 복사"><i class="fa fa-link" aria-hidden="true"></i></a>

class(copy_cmt_addr) 는 실제 적용하신 class명으로 바꾸셔야 할 수 있습니다.

위 스크린샷은 PC의 작은 아이콘 공유버튼 쪽에 추가를 해준 모습니다.

위 부분은 _read.html 에 있으니 이 파일을 열어서 추가를 해 주어야 합니다.

icon의 경우는 제가 첨부해 드린 파일을 사용하셔도 되고 다른 아이콘 파일을 구하셔도 됩니다.

업로드 위치는 modules/board/skins/sketchbook/img 경로에 업로드를 해주시고

파일명은 link_icon.png 로 업로드 합니다.

잘 찾아보시면 아래와 같은 코드를 찾으실 수 있고 지금 하나만 남겨놓은 링크가 제가 추가한 부분입니다.

<div cond="$mi->to_sns=='3'" class="to_sns big" style="text-align:{$mi->to_sns_big}" data-url="{$sns_link}" data-permanenturl="{$oDocument->getPermanentUrl()}" data-title="{$sns_title}">

<a class="Link copy_cmt_addr" href="#" onclick="return false;" data-clipboard-text="{$oDocument->getPermanentUrl()}" title="Link Copy"><b class="ico_sns link">LinkCopy</b></a>

</div>

그리고 board.css에 css를 추가해 줘야 합니다.

기존에 공유버튼들 적용되는 css의 다음줄에 추가해 주시면 관리하기 편합니다.

.bd .ico_sns16.link{background-size: 16px 16px;border-radius:3px;background-image:url(../img/link_icon.png);opacity:.8}

요런 css를 추가해주세요.

요건 모바일에서 조금더 큰 버튼으로 출력되는 곳에 추가해 준 것입니다.

_read_sns.html 의 파일에 추가를 해주셔야 합니다.

파일을 열어보시면 다른 공유버튼들 소스가 있는데 맨 마지막에 한줄 추가해 주시면 됩니다.

<a class="{$mi->to_sns_small} copy_cmt_addr" href="#" onclick="return false;" data-clipboard-text="{$oDocument->getPermanentUrl()}" title="Link Copy"><i class="ico_sns16 link"></i><strong> LinkCopy</strong></a>

그리고 board.css 에 css를 추가해 줍니다.

.bd .ico_sns.link{background-size: 32px 32px;border-radius:3px;background-image:url(../img/link_icon.png)}

게시글의 url 공유가 자주 일어나고 하는 성격의 사이트나 블로그라면 눈에 띄는 곳에 링크복사 버튼이 많이 있다면 도움이 더 될 것 같습니다.

잘 따라하셔서 성공하시길!

input 입력창 크기가 작거나 이상한가요? css box-sizing

꿀팁관리소장 — Fri, 09 Apr 2021 19:12:08 +0900

제가 사용하는 레이아웃의 경우 레이아웃 외 다른 자료들에서 input 입력창의 크기나 혹은 box 크기가 정상적이지 않은 경우가 발생합니다.

이유는 레이아웃에서 지정된 box-sizing 때문인데요.

이렇게 다른 자료의 박스가 세로가 유난히 작습니다.

레이아웃에

* {

box-sizing: border-box;

}

위와 같이 모든 곳에 box-sizing: border-box; 가 적용되도록 지정되어 있어서 다른 모든 곳이 저것이 적용되어 버립니다.

각 자료별로 박스의 가로,세로 크기를 입력할때 저 기준이 아닌 것들이 있을 수 있는데 레이아웃에서 모든 요소에 적용되도록 해버리니 의도된 박스크기가 아닌 크기의 박스가 출력되어 버리는 것 입니다.

레이아웃의 box-sizing: border-box; 를 적용하고 싶은 곳을 개별적으로 지정해서 모든 요소에 지정되지 않도록 해야 하는데 이걸 다시 수정하기가 좀 어려워서 약간의 트릭으로 레이아웃과 관련이 적은 컨텐츠가 출력되는 부부분을 정확히 구분해서 해당 영역(div)에는 box-sizing: border-box; 가 예외가 되도록 처리해 주어 회피했습니다.

컨텐츠가 출력되는 곳에 저는 div를 임의로 추가해서 감싼 것이 있어서 거기에 class를 추가해주고 해당 class를 제외할 수 있도록 해봤습니다.

*:not(.content-area *) {
box-sizing: border-box;
}

위와 같이 해 주니 content-area 쪽에는 box-sizing: border-box; 가 적용되지 않아 다른 자료들이 원래 가졌던 기준 그대로 가로,세로폭이 출력이 되게 되었습니다.

게시판 설정, 회원가입 등등... 너무 많은 곳들의 box 사이즈가 원래대로 회복 되었습니다.

본문 게시글 주소 클립보드 복사 기능 만들기

꿀팁관리소장 — Tue, 06 Apr 2021 10:28:43 +0900

라이믹스로 사이트를 운영하고 사이트 내에서 게시글이 작성되고 한다면 게시글들이 외부에 링크가 걸리길 기대하는게 운영자의 바램일 수 있을 겁니다.

보다 쉽게 해당 게시글의 주소를 복사해 갈 수 있도록 버튼이나 링크를 클릭시 바로 클립보드에 복사되는 기능을 추가해 두면 도움이 될 것 같습니다.

스케치북 스킨의 본문 제목쪽 게시글 주소 표시해 주는 부분에 주소복사 기능이 동작하도록 고쳐 보았습니다.

모바일에서는 이렇게 보이네요.

1.첨부된 clipboad.min.js를 게시판 스킨의 /js 폴더에 업로드를 합니다. js 폴더가 없다면 생성하시거나 다른 폴더에 업로드 해도 됩니다.

2.게시판 스킨의 _read.html 과 같은 본문을 열람할때 호출되는 파일의 게시글주소를 표시해 주는 부분에 클릭시 클립보드에 복사되도록 코드를 수정 또는 추가해 줍니다.

언급된 _read.html 파일의 상단에 clipboad.min.js 를 로드해 주는 코드를 추가해 줍니다.

<load target="js/clipboard.min.js" />

그리고 파일의 맨 하단에 스크립트를 넣어줍니다.

<script>
 var clipboard = new Clipboard('.copy_cmt_addr');
  
 clipboard.on('success', function(e) {
 alert('게시글 주소가 클립보드에 복사되었습니다.\n\n'+e.text);
 });
  
 clipboard.on('error', function(e) {
 prompt("이 글의 주소입니다. Ctrl+C를 눌러 클립보드로 복사하세요", e.text);
 });
 </script>

.copy_cmt_addr 클래스는 클릭시 복사가 되는 요소에 넣는 클래스명 입니다. 변경 가능합니다.

이후 원하는 곳에 복사할 수 있는 버튼 또는 링크를 만들어 주시면 됩니다.

<a class="copy_cmt_addr" href="#" data-clipboard-text="{$oDocument->getPermanentUrl()}"  onclick="return false;">주소복사</a>

스크립트에서 약속한 copy_cmt_addr 클래스를 추가해 줍니다. 원래 있던 버튼 등에 이미 class가 있어도 상관 없이 원래 있던 클래스명 옆에 한칸 띄워서 추가해 주면 됩니다.

data-clipboard-text="{$oDocument->getPermanentUrl()}" 이부분의 "안의 내용"이 클립보드로 복사가 됩니다. {$oDocument->getPermanentUrl()} 는 라이믹스에서 본문의 정규주소를 출력해주는 코드 입니다.

저희 라이믹스 꿀팁은 스케치북스킨의 본문 게시글 제목 우측하단에 주소 표시 하게 설정하여 해당 부분을 단순 주소링크 출력에서 주소의 링크는 삭제하고 복사하는 기능으로 변경한 것입니다.

각자 원하는 곳에 원하는 것으로 적절히 적용하면 됩니다.

그리고 이 팁은 코드를 배포하거나 할때 코드번호를 클릭하면 해당 코드번호가 복사되도록 하는 등 다양하게 활용 할 수 있습니다.

clipboard.js 는 https://clipboardjs.com/ 에서 배포하고 있습니다.

커뮤니티 운영시 회원가입 및 등업을 유도하기 (그룹으로 서비스 제한)

꿀팁관리소장 — Thu, 01 Apr 2021 17:16:57 +0900

이번 게시글은 기술적인 코드를 기술하는게 아닌 운영 노하우에 관한 팁 중 하나를 기술하려고 합니다. 커뮤니티를 운영하다 보면 자주 방문은 하지만 가입은 하지 않는 방문자 또는 비회원에게 차별화된 서비스 제공의 차이로 가입하여 준회원 신분은 획득 했지만 실제 가입인사 등을 통해 정회원으로 전환하지 않는 회원들이 있을 수 있습니다.

이런 경우 가입 또는 가입인사를 작성하게 하여 등업을 시도하게 유도하는 유인책이 필요한 경우가 있습니다.

이때 아주 중요한 핵심은 웹문서나 웹페이지 자체의 접근을 막아서 차별화를 해서는 안됩니다. 신규 방문자를 불러오는 유일한 수단이 사이트 내에서 생선되는 문서들 이기 때문입니다.

그러면 어떤 차별화를 할 수 있을까요?

가장 쉬운 방법이 편의 또는 좀더 쉽게 좋은 글을 볼 수 있는 그런 서비스를 비회원,준회원에게 제공을 하지 않는 것입니다. 그런데 여기서 중요한 것은 그런 서비스 자체를 보이지 않게 처리하면 효과가 없습니다. 그런 서비스가 존재 한다는 것은 인지하게 해주고 그것을 시도 했을때 현재 신분이 이용할 수 없는 신분이라는 것을 알려줄 필요가 있죠.

저희는 위와 같이 각 게시판에서는 인기글,베스트글을 필터링해서 볼 수 있는 기능을 제공하고 있습니다. 그런데 저기 버튼에 특정 그룹에 속하지 않는 회원이 이용을 시도했을때 알림이 뜨도록 해서 현재의 신분으로는 이용이 가능하지 않다고 알려주게 했습니다.

그리고 궁금한 내용을 다루는 게시판의 경우 검색으로 해당 궁금증을 가진 분들이 접속하기 때문에 사이트에서 신규 유입을 가장 많이 발생시키는 게시판인데 여기에도 좋은답변이 있는 게시글만 필터링 해서 검색할 수 있는 기능이 있습니다. 여기도 똑같이 현재 신분으로는 이용할 수 없다고 알려주고 있습니다.

저 기능이 원래 없는 사이트들이 대부분이기도 하고 저거 없다고 크게 불편하지는 않습니다. 하지만 저것 때문에라도 뭔가 행동을 하는 사람이 생기기도 하지요.

*단, 이런 제한하는 것들이 의미가 있으려면 사이트에서 보고 싶어하는 컨텐츠가 필수적으로 많이 있다는 전제가 있습니다.

라이믹스 2.0 회원 서명 높이를 조절 하고 싶다면

꿀팁관리소장 — Sat, 13 Mar 2021 11:59:57 +0900

라이믹스 2.0에서는 서명을 가져올때 서명부분의 최대높이 등이 지정되어 있습니다. max-height:100px 로 고정되어 있는데요.

만약 이 부분을 사이트에 따라서 변경하고 싶다면 서명이 보이는 부분의 css 요소에 !important; 를 사용해서 변경을 하면 됩니다.

스케치북 스킨의 경우 서명을 가져오는 부분의 예를 들면

.get_sign div {
max-height: 300px !important;
}

최대높이 제한을 300px로 변경할 수 있습니다. overflow 부분도 변경을 원한다면 변경하면 되겠죠.

라이믹스 회원설정에서 회원가입 허가 허용 일때만 회원가입 버튼 노출하기

꿀팁관리소장 — Sun, 07 Mar 2021 10:58:28 +0900

사이트의 성격에 따라서 혹은 일시적으로 회원가입을 허용하지 않는 상태로 설정할 경우가 있습니다.

저희 라이믹스 꿀팁의 경우 사이트 성격 자체가 회원을 받는 곳이 아니라 항상 회원가입 허가의 설정이 "아니오" 로 설정이 되어있습니다.

그런데 이 설정과 관계없이 레이아웃에서 회원가입 링크 버튼이 항상 노출되어 모르는 분들이 눌러보고 회원가입이 가능하지 않다는 메세지를 보게 될 텐데요.

처음부터 저 설정과 연동되도록 해주는게 좋을 것 같습니다.

회원가입 링크 코드가 있는 곳 위쪽에

{@ $enable_join=getModel('member')->getMemberConfig()->enable_join;}

회원설정의 상태를 확인할 수 있도록 코드를 넣어줍니다.

그리고 회원가입 버튼의 링크에 조건을 걸어 설정에 따라 노출되도록 해 줍니다.

<a>회원가입</a>

또는

조건은 원하는 엘리먼트 단위로 걸 수 있으니 감추거나 보이고 싶은 단위에 걸어주면 됩니다.

zip다운로드 애드온 라이믹스 2.0 에서 오동작 하는 문제 해결

꿀팁관리소장 — Fri, 26 Feb 2021 12:18:41 +0900

첨부가 여러개가 된 문서에서 모든 첨부를 한번에 zip 파일로 다운로드 할 수 있게 해주는 zip다운로드 애드온이 라이믹스 2.0 에서 작동이 안된다는 제보가 있어서 고쳐보았습니다.

zipdownload.addon.php 파일을 열어보시면 50번째 라인을

$download_url = sprintf('?document_srl=%s&act=%s&mid=%s', $oDocument->document_srl, 'zip', Context::get('mid'));

위와 같이 고쳐서 mid를 참조할 수 있도록 해 주면 정상 동작이 됩니다.

https://xe1.xpressengine.com/index.php?mid=download&package_id=22753934

위 자료의 라이믹스 2.0 에서의 문제 해결입니다.

게시글 본문에서 특정 버튼 클릭시 사용자 정의 값 바꾸는 기능

꿀팁관리소장 — Fri, 19 Feb 2021 13:29:53 +0900

위와 같은 작업을 하기 위한 질문이 있어서 제가 구현한 방법을 글로 작성해 봅니다.

게시판 스킨 read.html 에 버튼을 만들고 스킨에서 해당 클릭을 감지해서 사용자정의 값을 바꾸는 작업을 하게 하거나 게시판 스킨에 버튼을 만들고 애드온에서 사용자정의 값을 바꾸는 작업을 하게 하거나 할 수 있을 겁니다. 두가지 모두 해 봤습니다.

애드온에서 처리해 주는 방식으로는

스킨에 버튼에
<a href="{getUrl('','click_check', 'ok', 'document_srl', $oDocument->document_srl , 'member_srl', $logged_info->member_srl)}">버튼</a>

이렇게 만들었습니다. 저는 클릭한 사람 회원번호가 필요해서 위와 같이 했구요.

click_check 를 건네 받기 위해 위 변수 값 ok 를 할당 했구요.

애드온에서는 저렇게 페이지가 이동되어 게시글이 다시 읽혀질때

조건을 Context::get('click_check') != 'ok' 리턴 되도록 짜서 ok 값을 가질때 아래 사용자정의 값 변경 진행.

$args->value = '종료'; // 이건 원하시는 값으로
$args->lang_code = Context::get('lang_type');
$args->eid = 'state'; // 이것도 만드신 값으로
$args->module_srl = $oDocument->get('module_srl');
$args->document_srl = $oDocument->document_srl;
$args->var_idx = 2; // 이건 사용자정의 값 순서는 확인해서 사용하셔야...
executeQuery('document.updateDocumentExtraVar', $args);

이렇게 클릭되면 사용자정의가 입력되도록 했습니다.

애드온에서 받아서 처리하지 않고 그냥 스킨에 넣어도 작동을 잘 할겁니다.
템플릿에서도 조건문 php 모두 사용 가능하니까 똑같이 해도 잘 작동할 것 같습니다.

애드온에서 말고 스킨에 직접 넣어준다면

{@
$args->value = '종료'; // 이건 원하시는 값으로
$args->lang_code = Context::get('lang_type');
$args->eid = 'state'; // 이것도 만드신 값으로
$args->module_srl = $oDocument->get('module_srl');
$args->document_srl = $oDocument->document_srl;
$args->var_idx = 2; // 이건 사용자정의 값 순서는 확인해서 사용하셔야...
executeQuery('document.updateDocumentExtraVar', $args);
}

이정도 될 것 같네요.

* 위 예시는 기본값을 가지는 사용자정의에서 버튼으로 값을 변경하는 예시 이므로 기본값을 가지지 않은 사용자정의에서는

사용자정의 값을 불러와서 비어 있다면

executeQuery('document.insertDocumentExtraVar', $args);

를 사용하고 값이 있다면

executeQuery('document.updateDocumentExtraVar', $args);

를 사용하도록 코드를 조금 더 추가해야 할 것 입니다.

로그인기록 모듈 관리자페이지에서 로그인 기록 볼때 데이터 이상 출력 수정

꿀팁관리소장 — Wed, 10 Feb 2021 13:58:34 +0900

최근 애드센스 무효트래픽 발생으로 인해서 회원의 로그인 ip 확인이 꼭 필요해 져서 로그인기록 모듈의 관리자가 열람할 수 있는 회원 로그인기록을 출력해서 보니 데이터가 엉뚱하게 출력되고 있는 것을 확인했습니다.

이게 라이믹스에서만 발생하는 문제인지 모르겠는데 일단 최근 발견했고 제가 발견한 라이믹스 버전은 1.9 버전입니다.

이미지의 글자가 잘 안보이실텐데 클릭해서 보면 보일 겁니다.

지금 ip가 안보이는 컬럼이 있고 또 날짜를 보면 이상합니다. 뭔가 이상하죠?? 최근 로그인 날짜가 들어가 있어야 할 자리에 2012년 이라니요..

지금 보니 뭔가 컬럼의 참조가 잘못된거 같아서 쿼리를 찾아보았습니다.

관리자페이지 에서 회원들 로그인 기록을 볼때 사용하는 쿼리파일은

/modules/loginlog/queries/getLoginlogListWithinMember.xml

위 파일입니다.

열어보니

회원테이블과 조인되어 회원테이블의 데이터와 비교해서 각 테이블의 모든 컬럼을 참조하게 되어있는데...

혹시나 해서 아래 조건에 맞는 컬럼만 따로 등록해보았습니다.

이렇게 말이죠.

그랬더니 이렇게 제대로 된 컬럼에서 데이터를 가져와서 출력을 해주는 것으로 정상화 되었습니다.

저도 프로그래밍을 하는 사람이 아니다 보니 그냥 의심되는 부분을 고쳐보니 이렇게 원하는 데이터가 출력이 잘 되어서 이렇게 일단 공유를 합니다.

그룹별로 따로 출력할때 필요한 파일

/modules/loginlog/queries/getLoginlogListWithinMemberGroup.xml

위 파일도 비슷하게 고쳐야 할 것 같습니다.

Flex 레이아웃 로그인 오류 메시지 안뜨는 문제 해결

꿀팁관리소장 — Sun, 31 Jan 2021 11:23:19 +0900

로그인시 오류가 발생한다면 메시지를 띄워 주어야 지금 무엇을 잘못하고 있는지 알고 확인해 볼 수 있는데 Flex 레이아웃에서 오류 메시지가 뜨지 않는 문제가 있습니다.

로그인 폼에 보면 이 오류를 전송하는 코드가 있는데 다른 레이아웃에서 사용한 것이 수정되지 않아 발생되는 문제입니다.

components/header-right 폴더에 보면

header-login-form 파일에 보시면

위 내용 중 value 값을

고쳐주시면 됩니다.

Flex 레이아웃에서 메뉴 새글 표시때 "> 노출되는 문제 해결 법

꿀팁관리소장 — Sat, 30 Jan 2021 22:22:00 +0900

Flex 레이아웃과 새글표시 모듈의 충돌로 인해 새글표시 대상이 메뉴명 말고 다른 곳에 영향을 줘서 "> 와 같은 것이 추가로 노출되며 메뉴의 css까지 영향을 줍니다.

모바일에서는 무조건 발생하고 PC에는 메뉴에 아이콘을 사용하면 발생합니다.

메뉴를 출력하는 코드에 보면 title="{$val1['link']}" 의 부분이 있습니다. 이 소스를 삭제하면 해결이 됩니다.

header-nav.html

header-menu.html

두 파일에서 찾으셔서 삭제하시면 됩니다.

필터모드 애드온 선택된 필터 게시판 목록 상단에 표시해 주기

꿀팁관리소장 — Mon, 25 Jan 2021 15:03:34 +0900

필터모드 애드온으로 인기글,개념글,베스트 등을 원하는대로 필터링하여 제공할 수 있게 되었습니다.

관련 팁을 몇개 적었는데 추가로 오늘은 현재 게시판 목록에 필터가 적용되었는지 명확하게 표시해 줄수 있도록 해 보았습니다.

게시판 목록에 필터가 적용되었으면 해당 필터명이 출력됩니다. 현재 위 예시는 인기글을 눌러서 인기글 목록을 보고 있습니다.

게시판 목록을 담당하는 파일의 적당한(상단) 위치에

<div cond="$filter_mode_activated && !isCrawler()">[현재 🔥인기글🏆베스트 목록으로 선택되어 보고 계십니다.]

</div>

위와 같은 각 필터에 맞는 조건을 걸어서 출력되도록 하면 됩니다.

1가지가 아닌 2가지의 필터를 동시에 제공할때는 방금 선택한 필터모드가 어떤 것인지 금방 까먹기 때문에 이렇게 직관적으로 보여주면 좋을 것 같아 구현해 봤습니다.

필터모드 애드온(유료) 인기글 정렬 옵션 게시판 스킨에 추가해 주기

꿀팁관리소장 — Sat, 23 Jan 2021 13:35:29 +0900

타임라인 모듈에 연동하여 미리 지정한 조건에 만족한 글들을 필터링 해서 보여줄 수 있는 애드온이 유료로 판매되고 있습니다.

https://webstack.me/store/4804

타임라인 모듈로 일일이 개별 게시판에 대응하는 인기,베스트 게시판을 따로 별도로 만들 필요 없이 해당 게시판에서 바로 정렬해서 보여줍니다.

이 인기글 혹은 베스트 글을 보여주기 위한 url을 버튼이나 정렬 옵션에서 사용하게 해줘야 방문자들이 누르거나 선택해서 사용할 수 있을 겁니다.

애드온에서 변수들을 제공하니 적절한 변수를 사용하면 인기글이 제공되는 게시판에서만 해당 버튼이나 정렬옵션에 나오게 할 수 있습니다.

인기글(베스트) 버튼을 따로 만들어 목록을 출력하는 곳에 적당한 곳에 넣어주면 쉽게 보고 사용하겠죠.

위와 같이 애드온에 의해서 인기 또는 베스트 글을 제공할 수 있는 게시판에서만 저렇게 인기글 목록 이라는 버튼이 나오게 됩니다.

제가 만든 것 기준으로 알려드리면

위와 같이 작성하면 됩니다.

filter_mode', 'popular' 의 경우는 저희는 인기글을 사용했기 때문이기에 best 또는 custom을 사용한다면 바꿔야 겠죠??

그리고 한가지 더 게시판에서 원래 제공하는 "정렬옵션"에 이 인기글을 추가해 줄 수 있을 것입니다.

이렇게 정렬옵션에 인기글 출력하는 url을 추가해 주면 쓰임새가 더 있겠죠??

정렬옵션을 인기글을 선택하면 인기글만 필터링되어서 목록이 보여지고 정렬옵션이 인기글로 선택되었다고 보여집니다.

저희 스킨 기준이니 다른 스킨은 참조를 하셔서 적용하셔야 합니다.

{@
   if($sort_index == 'regdate'): $_sort_text = $lang->date;
   elseif($sort_index == 'update_order'): $_sort_text = $lang->last_update;
   elseif($sort_index == 'readed_count'): $_sort_text = $lang->readed_count;
   elseif($sort_index == 'voted_count'): $_sort_text = $lang->voted_count;
   elseif($sort_index == 'blamed_count'): $_sort_text = $lang->blamed_count;
   elseif($filter_mode == 'popular'): $_sort_text = '인기글';
   endif;
}

<button class="bt bt_sort closed" type="button">
정렬 기준({$_sort_text})정렬 기준
<i class="fas fa-angle-down"></i>
</button>
<ul class="black_bubble">
<li><a href="{getUrl('sort_index','')}">기본</a></li>
<li cond="$list_config['regdate']"><a href="{getUrl('sort_index','regdate','order_type',$order_type,'filter_mode', '')}">{$lang->date}</a></li>
<li cond="$list_config['last_post']"><a href="{getUrl('sort_index','update_order','order_type',$order_type,'filter_mode','')}">{$lang->last_update}</a></li>
<li cond="$list_config['readed_count']"><a href="{getUrl('sort_index','readed_count','order_type',$order_type,'filter_mode','')}">{$lang->readed_count}</a></li>
<li cond="$list_config['voted_count']"><a href="{getUrl('sort_index','voted_count','order_type',$order_type,'filter_mode','')}">{$lang->voted_count}</a></li>
<li cond="$list_config['blamed_count']"><a href="{getUrl('sort_index','blamed_count','order_type',$order_type,'filter_mode','')}">{$lang->blamed_count}</a></li>
<li cond="$filter_mode_enabled"><a href="{getUrl('sort_index','','filter_mode', 'popular', 'page', 1)}">인기글</a></li>

파란색 부분은 기존 코드에 추가된 부분입니다. 인기글 변수가 작동하지 않도록 기존 정렬옵션에는 모두 ,'filter_mode','' 를 추가해 주었습니다.

그리고 여기도 마찬가지로 'filter_mode', 'popular' 는 인기글 기준이니 다른것을 사용하는 경우 적절히 바꿔주세요.

*추가

혹시 베스트,인기글 버튼 두개를 모두 제공하고 싶다면

메뉴 새글표시 모듈(menunew) 새글표시 사라지는 문제 해결

꿀팁관리소장 — Wed, 13 Jan 2021 10:42:24 +0900

코노리님께서 난달아님의 원작모듈을 새롭게 수정한 메뉴 새글표시 모듈을 배포해서 많이 사용하고 있습니다. 그런데 이 새로운 메뉴새글표시 모듈의 경우 새글 표시가 사라지는 문제가 여전하게 있습니다.

메뉴에 관련된 모듈에서 설정등의 변경이 있을 경우 모든 메뉴를 새롭게 불러와서 새글표시 여부를 다시 표시해줘야 하는데 방식이 바뀌면서 레이아웃에 연결된 메뉴들만 새롭게 초기화? 하는 방식으로 바뀌면서 메뉴에 연결되지 않은 메뉴들에서 새글표시가 사라지고 다시 생기지 않는 문제가 발생합니다.

레이아웃 설정에서 선택되지 않고 연결되지 않는 메뉴들이 있어? 라고 할 수 있지만 사이트에서 바로가기 등을 클릭하고 이동된 페이지에서 메뉴가 출력되는 형태는 흔히 사용될 수 있습니다. 예를 들면 게시판 수량이 엄청 많은 사이트의 경우 해당 게시판의 수 많은 메뉴를 레이아웃의 메인에 걸지 못하고 별도 페이지로 제공하게 됩니다. 이 경우 메뉴를 초기화 해 줘야 하는 대상에서 이 페이지의 메뉴는 제외가 되는 문제가 발생합니다.

또 다른 케이스는 회원에게 제공하는 즐겨찾는 메뉴에 제공하는 메뉴를 사이트 메인에 노출된 메뉴가 아닌 전체 게시판 목록을 제공하기 위해 별도의 다른 메뉴로 제공할 수 도 있습니다. 이 경우도 이 메뉴은 새롭게 갱신되지 못합니다.

그래서 저는 게시판 설정 등을 했을때 모든 메뉴를 다시 불러와주는 코드를 사용한 원작 모듈의 코드로 교체 했습니다.

menunew 모듈명을 가진 최근 배포되고 있는 모듈의 menunew.controller.php 의 맨 하단에 아래와 같은 함수가 있습니다.

/**
* @brief procNew 코드 추가
**/
function triggerModuleHandlerProc($oModule)
{
   $layout_srl = Mobile::isFromMobilePhone() ? $oModule->module_info->mlayout_srl : $oModule->module_info->layout_srl;

   if($layout_srl == -1)
   {
       $viewType = Mobile::isFromMobilePhone() ? 'M' : 'P';
       $layout_srl = getAdminModel('layout')->getSiteDefaultLayout($viewType, $oModule->module_info->site_srl);
   }

   if($layout_srl && !$oModule->getLayoutFile())
   {
       if($layout_info = getModel('layout')->getLayout($layout_srl))
       {
           if($layout_info->menu_count)
           {
               foreach($layout_info->menu as $menu_id => $menu)
               {
                   $this->procMenuInclude($menu->menu_srl);
               }
           }
       }
   }

   return new BaseObject();
}

위 함수를 원작의 함수로 통째로 교체했습니다.

function triggerModuleHandlerProc(&$oModule) {
   $target_act = array(
                       'procHomepageInsertMenuItem',
                       'procHomepageDeleteMenuItem',
                       'procHomepageMenuItemMove',
                       'procMenuAdminInsertItem',
                       'procMenuAdminUpdateItem',
                       'procMenuAdminDeleteItem',
                       'procMenuAdminMoveItem',
                       'procMenuAdminCopyItem',
                       'procMenuAdminMakeXmlFile',
                       'procMenuAdminButtonUpload',
                       'procMenuAdminUpdateAuth',
                       'getMenuAdminSiteMap',
                       'procBoardAdminInsertBoard',
                       'procPointrushAdminInsertPointrush'
                       );

   if (in_array($oModule->act, $target_act)) {
       $file_list = FileHandler::readDir($this->menu_cache_path);
       if (empty($file_list)) return new BaseObject(-1, 'error');

foreach($file_list as $file) {
if (strpos($file, 'xml')) continue;

           $token = explode('.', $file);
           $menu_srl = $token[0];
           $this->procMenuInclude($menu_srl);
       }
   }

return new BaseObject();

}

위와 같은 함수로 변경했습니다. 이 코드의 특징은 어떤 액션에서 메뉴를 새로 불러올지 특정하고 있어서 원하는 액션을 추가해 줄 수 있습니다.

마지막 'procPointrushAdminInsertPointrush' 은 제가 사용하는 포인트러쉬 모듈의 설정을 저장할때 새글표시가 사라져서 제가 추가한 부분입니다.

위젯에 타임라인 인기글,베스트글 처럼 추천수, 조회수 기준 필터링 추가

꿀팁관리소장 — Wed, 06 Jan 2021 13:36:00 +0900

최근 판매되기 시작한 타임라인 플러스 모듈에 관해 언급해 드린 적이 있습니다. 이 타임라인 플러스 모듈의 장점 중 하나인 조건을 OR 로 사용할 수 있다는 점인데요.

https://rxtip.kr/rx_story/3214

이건 인기글 선정시 조회 100번 된 게시글 혹은 추천 10개 받은 게시글 둘다 인기글로 뽑을 수 있는 OR 조건이 작동한다는 것 입니다.

그런데 메인 위젯에서 이러한 인기글,베스트글 중 최신글을 뽑으려 한다면 위젯에서 보통 이 OR, AND 조건을 지원하지 않기 때문에 아쉬운대로 조회수, 또는 추천수 높은 수 우선 정렬하는 방식으로 대체 했습니다.

그런데 오늘 위젯도 타임라인 플러스 모듈의 게시판에서 처럼 조회수,추천수 2가지 기준을 OR 또는 AND 로 작동하게 고쳐 보았습니다.

추천이 없는데도 올라온 글은 기준 조회수보다 높은 조회를 보였기 때문입니다. 저희는 OR를 선택

타임라인 모듈의 설정을 가져와서 그대로 타임라인 모듈의 쿼리를 사용하는 방식으로 하면 좋겠지만 위젯에서 쿼리를 별도로 추가하는 방식으로 간단히 추천,조회 항목만 적용한 간단한 팁입니다.

저희는 comely 위젯을 고쳤습니다. 다른 위젯도 같은 방식으로 고치시면 되니 따라서 고쳐보세요.

우선 위젯 코드를 작성할때 이 타임라인 처럼 적용할 건지에 관한 설정을 추가로 만들어 주어야 합니다.

위젯의 conf 폴더에 보면 info.xml 이 있습니다.

아래의 내용을 추가해 주세요.

<var id="timeline_select">
 <type>select</type>
 <name xml:lang="ko">타임라인용 쿼리 선택</name>
 <description xml:lang="ko">타임라인 조건을 선택할 수 있습니다.</description>
 <options>
 <value>N</value>
 <name xml:lang="ko">사용 안함</name>
 </options>
 <options>
 <value>O</value>
 <name xml:lang="ko">OR</name>
 </options>
 <options>
 <value>A</value>
 <name xml:lang="ko">AND</name>
 </options>
 </var>
 <var id="s_readed_count" type="text">
 <name xml:lang="ko">조회수 이상</name>
 <description xml:lang="ko">설정된 조회수 이상의 게시글을 불러옵니다.</description>
 </var>
 <var id="s_voted_count" type="text">
 <name xml:lang="ko">추천수 이상</name>
 <description xml:lang="ko">설정된 추천수 이상의 게시글을 불러옵니다.</description>
 </var>

타임라인 이라는 용어는 타임라인 처럼 이라고 이해하면 더 쉽겠습니다.

기본 사용 안함이고 사용하고 싶은 OR, AND 조건을 선택하게 되어 있습니다. 기존에 삽입된 위젯코드에는 이 항목을 추가해줘야 동작하겠죠?

그리고 위젯의 php 에서 쿼리 부분을 저 선택에 맞춰 쿼리를 다르게 하면 되는데요. 이를 위해 OR용 쿼리파일과 AND의 쿼리파일을 새롭게 만들어 쿼리(queries) 폴더에 업로드 합니다.

파란색은 위치가 변경된 것이고 붉은색은 추가가 된 것입니다. 물론 사용하는 위젯에 따라 쿼리의 내용이 약간 다를 수 있으니 이점은 참고해서..

위 파일을 getNewestDocumentsOr.xml 파일로 저장한 다음 위젯의 쿼리(queries)폴더에 업로드 합니다. (따로 첨부해 드리겠습니다.)

이 파일은 getNewestDocumentsAnd.xml 파일로 저장해서 쿼리 폴더에 업로드 합니다.

이제 위젯의 php 파일에 쿼리부분을 수정해 줍니다.

       if($args->timeline_select == 'O')
       {
       $obj->s_readed_count = $args->s_readed_count;
       $obj->s_voted_count = $args->s_voted_count;
       $output = executeQueryArray('widgets.comely_widget.getNewestDocumentsOr', $obj);
       }
       else if($args->timeline_select == 'A')
       {
       $obj->s_readed_count = $args->s_readed_count;
       $obj->s_voted_count = $args->s_voted_count;
       $output = executeQueryArray('widgets.comely_widget.getNewestDocumentsAnd', $obj);
       }
       else
       {
       $output = executeQueryArray('widgets.comely_widget.getNewestDocuments', $obj); // 원래 쿼리
       }

원래 쿼리 를 위와 같이 조건을 걸어 원하는 옵션에 맞게 쿼리를 할수 있도록 코드를 바꿔 줍니다. 원래 쿼리 외 부분이 전부 추가된 부분입니다.

여기도 마찬가지로 다른 위젯이라면 쿼리 경로와 변수를 적절히 바꿔주세요.

('widgets.comely_widget.getNewestDocuments', $obj)

comely_widget. -> 위젯폴더명

widget.getNewestDocuments' -> 쿼리파일명

$obj -> 다른 변수로 사용되었을 수 있습니다.

이렇게 바꾸고 나면 이제 원하는 추천 조회 OR 또는 AND 조건에 맞는 게시글을 뽑아서 보여 줄 수 있습니다.

기존 코드에는 새로 생긴 변수가 없을때니 적용하고 싶으면 추가해 주면 됩니다. 아니면 위젯 코드를 새로 생성해서 새로운 부분만 골라서 넣으면 되구요.

이렇게 OR 50 10 으로 넣으면 위젯코드에는

timeline_select="O" s_readed_count="50" s_voted_count="10"

요런부분이 추가되어 코드가 만들어지게 되는 겁니다.

그럼 잘 따라하셔서 성공하시길 기원합니다!

ps. timline_select <-- 오타이나 동작에는 크게 상관 없습니다. 일괄적으로 오타가 나있으니... 거슬리는 분은 바꾸세요 ㅋ timeline_select

바꾸면 위젯코드 새로 생성해서 변수 바뀐거로 적용하셔야 합니다. (이 글에서 오타는 16시 51분에 모두 수정했습니다.)

* karius님께서 제보해주셔서 확인되었습니다. 쿼리 파일 getNewestDocumentsOr.xml 의 코드가 잘못되어 있어 수정한 파일로 교체 해서 업로드 했습니다. 이전에 받으셨다면 교체해야 합니다. (2021.1.11 14:20)

라이믹스 출석부 위젯 프로필이미지 대신 활동메달 아이콘 같은 아이콘 출력하기

꿀팁관리소장 — Sun, 03 Jan 2021 01:05:44 +0900

최근에 배포된 메달시스템 기능 경험치 모듈로 커뮤니티와 같은 곳에서 열심히 활동한 회원의 경우 활동메달을 보유하게 됩니다. 사이트 전역에서 닉네임이 출력될때 옆에 활동메달이 표시됩니다.

메달이 표시되는건 애드온에 의해서 출력이 되는데 각종 스킨에서 member_회원번호 의 class를 닉네임 부분에 포함시켰기 때문입니다.

제가 사용하는 출석부 위젯의 출석 명단에는 이부분이 적용되어 있지않고 프로필이미지를 출력하고 있는데 너무 작은 프로필 이미지는 쓸모도 없고 사이트에서 통일된 모습으로 다른 곳과 동일하게 활동메달과 같은 아이콘을 출력해 주는게 보기 좋아서 고쳐 보았습니다.

이런식으로 고쳤습니다.

출석 순위는 원래 1위 이런 텍스트로 되어 있었습니다.

위 위젯은 아래의 링크의 자료 입니다.

https://xetown.com/tips/765990

위젯의 php 파일에서 우선 수정을 합니다.

pr_take_roll.class.php

대략 230번 즈음 라인에서

$tmp = '<span class="rank">' . number_format($key + 1) . '</span>';

//$tmp .= '<span class="profile_img"><img src="' . $val->profile_src . '"></span>';
$tmp .= '<span class="nick_name member_' . $val->member_srl . '">' . $val->nick_name . '</span>';

저는 숫자만 표시하고 숫자에 박스를 그려주기 위해 "위" 글자는 제거했습니다.

프로필 이미지 부분은 // 로 주석해 주고 아랫줄을 member_회원번호의 class를 가지도록 고쳐줍니다.

그리고 이제 css를 고쳐줍니다. 저희는 밝은 색상을 사용해서 white.css 에서 고쳤습니다.

대략 37번 라인 쯤 프로필 이미지때문에 필요했던 부분을 제거해야 합니다.

/*.take_roll_show_list ul li span img{
   height: 18px;
   width: 18px;
   padding: 1px;
border-radius: 50%;
border: 1px solid #909599;
}*/

이렇게 주석을 해줬습니다.

43번 라인 즈음 순위 부분 꾸며주는 부분에을

.take_roll_show_list ul li span.rank {
float: left;
width: 16px;
height: 16px;
line-height: 16px;
padding: 0;
border: 1px solid #ccc;
color: #333;
font-size: 10px;
text-align: center;
letter-spacing: -.1em;
}

이렇게 해서 순위 숫자에 박스가 그려지도록 했습니다.

이정도 하면 다 된것인데 혹시 출석일수 와 같은 것이 비슷한 선상에 나오길 원한다면

63번 라인 쯤에서 아래를 찾아서

.take_roll_show_list ul li span.point {
   color:#F44336;
   vertical-align: top;
}
.take_roll_show_list ul li span.conti {
   color:#689F38;
   vertical-align: top;
}

vertical-align: top; 을 넣어주면 비슷한 라인으로 맞춰집니다.

메달시스템 모듈 활동메달 회원정보의 닉네임 옆에도 보유 메달 보여주기

꿀팁관리소장 — Tue, 29 Dec 2020 16:41:57 +0900

제목에는 회원정보 열람하는 곳의 닉네임에 보유한 메달을 보여주기라고 적었지만 사실 모든 닉네임을 출력하는 곳에 적용 가능한 팁입니다. 라이믹스에서는 닉네임앞에 그룹,레벨 또는 활동메달 등을 본인과 매칭해서 보여줄때 작성되는 코드 규칙이 있습니다.

class에 member_회원번호 가 들어가면 해당 회원번호를 가진 회원의 것을 노출하도록 애드온 들이 만들어집니다.

회원번호의 변수값은 각 사용되는 자료에서 다 달라지니 지금 이 설명은 회원정보 열람 페이지에서 사용되는 사례 입니다. 멤버모듈의 스킨에서 이부분을 담당하겠죠?

파란색으로 표시해 드린 부분입니다. 원래 기존에 배포되거나 판매되는 멤버모듈 스킨에는 닉네임 출력하는 코드에 이 규칙이 적용되지 않은 경우가 많습니다. 이미 되어 있다면 이 팁은 보지 않으셔도 됩니다.

사용하는 멤버모듈의 스킨 파일 중 member_info.html 을 열어서 확인해 보셔야 합니다.

사용하는 스킨에 따로 구조가 조금씩 다르니 보고 해당되는 부분만 고치시면 됩니다.

<th scope="row" style="width:150px"><em cond="$item->required || $item->mustRequired">*</em> {$item->title}</th>
<td class="text" cond="$item->value">{$item->value}</td>
<td class="text" cond="!$item->value">…</td>

이렇게 되어있다고 본다면 파란색 부분이 닉네임 등 값을 출력하는 변수의 출력코드입니다.

그런데 저희는 닉네임에만 class를 추가하고 싶으니 조건만 걸어 부여하면 되겠습니다.

<th scope="row" style="width:150px"><em cond="$item->required || $item->mustRequired">*</em> {$item->title}</th>
<td class="text" cond="$item->value"><span class="member_{$memberInfo['member_srl']}">{$item->value}</span>{$item->value}</td>
<td class="text" cond="!$item->value">…</td>

이렇게 닉네임 부분만 조건을 걸어서 <span> 태그로 감싸고 원하는 class를 부여했습니다.

회원정보에 다음달 예상메달 보여주기 팁은 아래글에 작성되어 있습니다.

https://rxtip.kr/rx_tip/2724

라이믹스 회원가입 약관 노출이 안되는 상태가 발생합니다.

꿀팁관리소장 — Sun, 27 Dec 2020 16:49:26 +0900

제가 회원가입을 받는 커뮤니티 2군데서 경험한 것인데요. 회원가입에 약관 사용을 설정을 해 놓은 경우 알수 없는 시점에 회원약관이 노출되지 않아 동의 할 수 없어 회원가입이 진행되지 못하는 상태에 놓이게 됩니다.

원인으로 가장 유력한 것은 회원가입 스킨 signup_form.html 파일에 약관 노출하는 곳에 cond="$member_config->agreement" 의 조건이 걸려 있으면 발생하는 것으로 보입니다.

cond 구문이 아닌 if 구문으로 사용되었을 수 있어요.

저 조건을 제거하면 바로 약관이 노출되어 동의 체크 할 수 있어 회원가입이 정상적으로 진행 될 수 있습니다.

XE에서부터 흔하게 쓰던 조건이라 많은 스킨에 저 조건으로 감싸져 있을 겁니다. 제거하는 것을 권장합니다.

확인하지 못한 어느 순간 부터 회원가입을 못하는 상태로 지속 될 수 있습니다.

라이믹스 2.0 에서 통합게시판 기능(여러 게시판 글 모으기) 을 사용한 게시판인지 아닌지 구분하는 방법

꿀팁관리소장 — Sat, 19 Dec 2020 15:32:44 +0900

여기 라이믹스 꿀팁의 홈에 전체글을 모아오는 통합게시판 기능을 타임라인모듈에서 라이믹스 2.0 코어 기능으로 전환하면서 원글 게시판 타이틀을 출력하는 기능등을 구현하려면 해당 게시판이 통합게시판 기능이 설정되어 있는지 확인해야 합니다.

타임라인 모듈에서 $timeline_info 의 유무로 조건을 걸어서 스킨 등에서 통합게시판에서만 동작하도록 조건을 걸었습니다.

코어에서 제공하는 기능을 사용했는지 확인하려면

$module_info->include_modules 를 사용하면 되네요.

cond 혹은 if 조건문에 위 값을 가지는지 여부로 통합게시판을 구분하면 되겠습니다.

라이믹스 2.0 에서 제공하는 단순 통합게시판 이용시 원글 게시판 제목(브라우저 타이틀) 가져오기

꿀팁관리소장 — Sat, 19 Dec 2020 13:56:36 +0900

통합게시판을 운영하면 게시글 목록에서 해당글의 원래 게시판명을 출력해줘야 어떤 게시판의 글인지 알기가 쉽습니다. 기존에는 타임라인 모듈을 사용하면 원글의 게시판 타이틀을 가져오는 방법이 제공되었는데요. 코어에서 제공하는 단순 통합게시판 기능을 사용할 경우 코어 자체에서 해당글의 게시판 브라우저 타이틀을 가져오는 코드를 작성해야 합니다.

저희가 이번에 라이믹스 2.0으로 업데이트 하고 코어에서 제공하는 통합게시판으로 변경하면서 원글의 게시판 타이틀을 가져오게 구현해 봤습니다.

게시판 목록을 담당하는 파일에서 게시글 목록을 반복해서 출력하는 부분(공지,일반글)의 게시판의 브라우저타이틀을 출력하고 싶은 곳에

{$document->get('module_title')}

문서열람 하는 곳에서는

{$oDocument->get('module_title')}

위 코드로 브라우저 타이틀을 출력해 줄 수 있습니다.

*확인해 본바로는 타임라인 모듈에서는 해당 변수에 대한 처리가 되지 않는 것으로 확인됩니다. 라이믹스의 통합게시판에서 사용가능합니다.

라이믹스 2.0 업데이트로 사용에 문제가 생긴 서드파티 모듈 등의 자료 해결 방법

꿀팁관리소장 — Sat, 19 Dec 2020 11:17:03 +0900

라이믹스 2.0에서 동작이 안되거나 오류가 발생하는 자료들이 많이 있을 겁니다. 이런 문제의 해결방법을 취합하는 목적으로 이 게시글을 작성하고 업데이트 해 가려고 합니다. 물론 해결법은 제가 제시하지 않은 것들이지만 흩어져 있는 문제점 제보와 해결법을 한곳에 모으는 것으로도 많은 도움이 될 것 같아 취합해 봅니다.

소셜XE 모듈에서 로그인이 되지 않고 잘못된 요청이라는 메시지가 발생하는 문제

소셜XE 모듈 conf/module.xml

<action name="procSocialxeCallback" type="controller" standalone="false" method="GET|POST" />
에서 standalone="false" 부분을 standalone="true" 로 변경

스티커 모듈 설정 저장이 안되는 문제

스티커 모듈 tpl/config.html 파일 8번째 라인

에 action="./"을 추가해주시면 설정 저장이 잘 됩니다.

스티커 모듈 디자인설정에서 레이아웃, 스킨설정 저장 안되는 문제

/tpl/design.html 파일의 8번줄

action="./"을 추가

스티커모듈 댓글 스티커 목록 첫번째 스티커 이미지 엑박

스티커 리스트 로드하는 부분(loadSticker)에서 if문으로 값이 없는 스티커를 로드하지 않도록 감쌉니다.
for(i in sticker){
if (sticker[i].sticker_srl) {
...
}
}

에디터 자동완성 모듈 URL 카드 기능 안되는 문제

코어를 예전 코드를 추가하는 방법이 있지만 이건 임시적인 해결책이므로

당장 급하신 분들만 해당 코어 부분을 수정하기 바랍니다.

https://github.com/rhymix/rhymix/issues/1509#issuecomment-748924051

1 ~2 월 중에 패치 예정이라는 판매자 답변이 있었습니다.

제휴 마케팅 링크 변환 모듈 링크 클릭시 잘못된 요청 메시지 뜨는 문제

module.xml중 아래 부분 standalone을 true로 변경하면 해결이 됩니다.
<action name="procUpdateClickcount" type="controller" standalone="false" />

--> 모듈 패치되서 업데이트 되었습니다.

로그인 기록 모듈 아이디 로그인 시 패스워드 틀렸을 때 백지현상

https://github.com/rx-public/loginlog/issues/4

loginlog.controller.php 117줄에 require _XE_PATH_ . 'modules/loginlog/libs/Browser.php'; 부분을 주석 처리하거나 삭제

메달시스템 모듈 다음달 예상메달 본인에게 보여주기

꿀팁관리소장 — Fri, 18 Dec 2020 15:36:01 +0900

먼저 라이믹스 사이트에 전월 활동지수를 기준으로 메달을 지급할 수 있는 모듈이 공개된 소식을 전해드렸습니다.

https://rxtip.kr/rx_story/2714

매월 새로운 매달을 받기 위해 나름 활동의 동기를 부여해 줄 수 있는 모듈입니다.

이번 달 활동 지수는 다음달 받게 되는 메달을 결정하기 때문에 내가 지금 얼마나 열심히해서 다음달에 어떤 메달을 받을지 궁금한 회원들이 있을 겁니다. 이것을 본인에게만 공개를 해 줬을때 득과 실이 있겠지만 개인적으로는 득이 조금 더 클 것 같아 구현했습니다.

이렇게 다음 달 백금메달 받을 정도의 순위에 있다고 알려줄 수 있으니 더 좋은 메달인 다이아몬드를 받고 싶다면 더 노력해야 한다는 것을 바로 알 수 있는 것이죠.

회원정보를 보여주는 member 모듈에 사용하는 스킨 member_info.html 파일이 저 화면을 출력하는 담당을 합니다. 이 파일에 다음달 예상 메달 부분을 추가해 줍니다.

파일을 열어서 상단에 이번달 현재 지금 조회하는 순간 까지 활동지수 랭킹순위를 불러오는 코드를 넣어 줍니다.

<!--@if($memberInfo['member_srl'] == $logged_info->member_srl || $logged_info->is_admin == 'Y')-->
 {@
 $config=getModel('experience')->getConfig();
 $Month = date('Ym');
 $args = new stdClass();
 $args->regdate = $Month;
 $args->exception_member = $config->exception_member;
 $args->list_count = $config->medal_bronze;
 $MonthOutput = executeQuery('experience.getMonthRank', $args);
 
 $rank_list=array();
 $rankCount=0;
 }
 <!--@foreach($MonthOutput ->data as $key=>$val)-->
 {@
     array_push($rank_list, (string)$val->member_srl);
     $rankCount++;
 }
 <!--@end-->
 {@ 
 $total_list = $rank_list;
 $diamond = $rank_list;
 $platinum = $rank_list;
 $gold = $rank_list;
 $silver = $rank_list;
 $bronze = $rank_list;
 $diamond_num = $config->medal_diamond;
 $plat_num = $config->medal_platinum;
 $gold_num = $config->medal_gold;
 $silver_num = $config->medal_silver;
 $bronze_num = $config->medal_bronze;
 $diamond = array_splice($diamond, 0,$diamond_num);
 $platinum = array_splice($platinum, $diamond_num,$plat_num - $diamond_num);
 $gold = array_splice($gold, $plat_num,$gold_num - $plat_num);
 $silver = array_splice($silver, $gold_num,$silver_num - $gold_num);
 $bronze = array_splice($bronze, $silver_num,$bronze_num - $silver_num);
 $total_list = array_splice($total_list, 0,$bronze_num);
 }
 <!--@end-->

그리고 회원정보를 출력해주는 적당 한 곳에 메달 정보를 출력하는 코드를 넣어줍니다.

<tr cond="$memberInfo['member_srl'] == $logged_info->member_srl || $logged_info->is_admin == 'Y'">
 <th>다음달 예상 메달</th>
 <td><!--@if($diamond && in_array((string)$memberInfo['member_srl'] ,$diamond))--><img src="/modules/experience/tpl/modules/experience/medal/default/diamond.png" style="vertical-align: middle;" title="다이아몬드 메달"> : 다이아몬드 메달<!--@end-->
 <!--@if($platinum && in_array((string)$memberInfo['member_srl'] ,$platinum))--><img src="/modules/experience/tpl/modules/experience/medal/default/platinum.png" style="vertical-align: middle;" title="백금메달"> : 백금메달<!--@end-->
 <!--@if($gold && in_array((string)$memberInfo['member_srl'] ,$gold))--><img src="/modules/experience/tpl/modules/experience/medal/default/gold.png" style="vertical-align: middle;" title="금메달"> : 금메달<!--@end-->
 <!--@if($silver && in_array((string)$memberInfo['member_srl'] ,$silver))--><img src="/modules/experience/tpl/modules/experience/medal/default/silver.png" style="vertical-align: middle;" title="은메달"> : 은메달<!--@end-->
 <!--@if($bronze && in_array((string)$memberInfo['member_srl'] ,$bronze))--><img src="/modules/experience/tpl/modules/experience/medal/default/bronze.png" style="vertical-align: middle;" title="동메달"> : 동메달<!--@end-->
 <!--@if($total_list && !in_array((string)$memberInfo['member_srl'], $total_list))-->메달을 받지 못하실 수 있습니다.<!--@end--></td>
 </tr>

요렇게 해주면 모듈에 설정해 놓은 메달 기준에 맞게 다음달 예상 메달을 보여주게 됩니다.

라이믹스에서 회원의 가입당시 ip와 최근 로그인 ip를 최고관리권한자가 회원정보에서 열람하기

꿀팁관리소장 — Wed, 25 Nov 2020 12:21:00 +0900

오늘 우연히 라이믹스 회원테이블에서 회원마다 가지는 정보 중 가입 ip와 최근 로그인 ip가 추가되어 있다는 것을 알게 되었습니다. 이 정보는 최고관리권한자가 회원의 정보를 수정하는 관리자 페이지에서 보여집니다.

이 정보를 최고관리자가 조금 더 쉽게 볼 수 있도록 회원정보를 출력해 주는 스킨파일에 최고관리 권한을 가진 권한자에게 보이도록 해주면 좋을 것 같아 처리해 봤습니다.

사용하는 멤버 스킨에서는 가입일자,최근로그인 일시 를 출력하는 방식이 조금씩 다르고 어떠한 경우에는 아예 없는 경우도 있으니 이건 상황에 맞게 해 주셔야 할 것 같습니다.

제가 사용하는 스킨에는 가입일자,최근로그인 까지는 이미 코드가 구현이 되어 있어 옆자리에 ip 정보가 보이도록 했습니다.

멤버모듈 스킨 member_info.html에 해당 정보를 추가해 주었습니다.

<block cond="$logged_info->is_admin == 'Y' && $memberInfo['ipaddress']"> ($memberInfo['ipaddress'])</block> //가입당시 ip
 <block cond="$logged_info->is_admin == 'Y'">({$memberInfo['last_login_ipaddress']})</block> // 최근 로그인 ip

<tr>
<th>{$lang->signup_date}</th>
<td>{zdate($memberInfo['regdate'],"Y.m.d. H:i")}<block cond="$logged_info->is_admin == 'Y' && $memberInfo['ipaddress']"> ({$memberInfo['ipaddress']})</block></td>
</tr>
<tr>
<th>{$lang->last_login}</th>
<td>{zdate($memberInfo['last_login'],"Y.m.d. H:i")}<block cond="$logged_info->is_admin == 'Y'"> ({$memberInfo['last_login_ipaddress']})</block></td>
</tr>

붉은색으로 처리한 부분이 새롭게 추가된 정보를 활용하려고 추가한 코드입니다.

가입당시 ip는 오래전에 가입한 회원들은 가지고 있지 않은 정보라 조건에 해당 정보가 있는지 체크하는 조건이 추가되었습니다.

나의 메뉴 위젯 스킨에 게시판 추가할때 검색해서 넣을 수 있게 하기

꿀팁관리소장 — Fri, 06 Nov 2020 21:16:51 +0900

라이믹스나 XE로 사이트를 만들고 메뉴를 아주 많이 만들어서 제공을 하다보면 회원들은 자신이 즐겨찾는 게시판(메뉴)를 등록해서 사용하고 싶어하게 마련입니다.

그래서 공개된 위젯이 사이트에 위젯을 설치해서 회원이 각자 즐겨찾는 메뉴를 등록해서 사용할 수 있도록 해주는 나의메뉴 위젯 입니다.

https://xetown.com/tips/784922

그런데 스킨들이 굉장히 많은 게시판(메뉴) 중에 선택하는 것은 고려되지 않은 경우가 많습니다. 게시판이 굉장히 많다면 골라야할 메뉴가 너무 많아서 어디에 있는지 찾기가 어려워 질 수 있습니다.

이를 대비해서 오늘 나열된 목록을 검색해서 검색어와 일치하는 것만 필터링해서 보여주는 것을 나의메뉴 위젯 스킨에 적용해 봤습니다.

제가 사용하는 위젯 스킨에는 붉은색으로 표시하는 검색 부분이 없었는데 제가 만들었습니다.

타이핑한 글자와 매칭이 되는 목록만 보여줍니다. 이제 내가 추가하고 싶은 게시판이 어디에 있는지 찾으러 갈 필요가 없어졌습니다.

위젯의 스킨에서 저 목록이 나오는 부분을 잘 찾으셔야 합니다.

그리고 찾으신 부분에 검색창을 달아줍니다.

id="filterText 부분은 굉장히 중요합니다. 스크립트에서 저 id 부분의 검색어를 목록에서 찾기를 시도합니다.

그리고 게시판(메뉴) 목록이 나열되는 소스를 찾아보세요.

</li>

</ul>

보통 이런 구조로 되어 있습니다.

</li>

</ul>

class="filterUL" 를 추가해 주세요. 기존에 이미 class가 있다면 있는 클래스명에 한캍 띄워서 filterUL 만 추가해주세요.

해당스킨의 맨 아래쪽에 스크립트를 추가해 주세요.

요렇게 하면 이제 아무리 많은 메뉴목록이 있더라도 검색으로 바로 찾아서 나의 메뉴를 쉽게 추가할 수 있습니다.

디자인은 스킨마다 다 다르니 조금씩 손보아야 합니다.

라이믹스 글쓰기 댓글쓰기 취소에 확인 과정을 거치게 해주세요.

꿀팁관리소장 — Wed, 16 Sep 2020 23:49:56 +0900

최근 안드로이드 크롬 계열 브라우저에서 글 작성시 엔터를 타이핑하면 줄바꿈과 함께 키보드가 내려가는 버그가 있는 듯 합니다. 빠른 타이핑으로 엔터 후 다음 글자를 치시는 분들이 키보드가 내려가버려서 의도치 않게 취소 버튼을 터치하게 되는 경우가 이제 자주 생긴 듯 합니다.

크롬 버그를 저희가 잡을 수는 없고

최소한 취소가 한번에 되지 않고 확인 과정을 거치게 해서 글을 날리는 일이 없도록 조치는 해줄 수 있을 것 같습니다.

기존 취소버튼에 확인 confirm 창이 뜨도록 하려면 스크립트 하나와 취소버튼에 스크립트 함수가 작동되도록 추가해 주면 됩니다.

저희 기존에 취소버튼 소스입니다.

<a href="javascript:history.back()" class="btCancel">{$lang->cmd_cancel}</a>

위 소스를 컨펌과정이 포함되도록 고칠 것 입니다.

스크립트는 글쓰기,댓글쓰기 파일의 하단에 넣어줍니다.

function goBack(){
if(confirm("정말 취소하시겠습니까?")){
window.history.back(1);
}
}

</script>

그리고 취소 버튼 소스를

<a href="#" onclick="goBack();return false;" class="btCancel">{$lang->cmd_cancel}</a>

위와 같이 스크립트 함수가 작동되도록 고쳐줍니다.

이렇게 해주면 글,댓글 취소버튼이 실수로 스쳐도 다시 확인창을 한번 더 거치게 되므로 의도치 않게 글을 날리는 것은 막아줄 수 있습니다.

라이믹스 또는 XE 사이트 글 작성자의 각종 정보 표시(가입일,최근로그인,레벨,포인트)

꿀팁관리소장 — Sat, 15 Aug 2020 00:01:19 +0900

라이믹스나 XE로 회원제 사이트를 운영하다보면 글 작성자의 회원정보에 가지고 있는 정보 또는 보유 레벨 포인트 등을 표시해 주고 싶을 때가 있스니다.

회원정보로 가지고 있는 것은 모두 출력해 줄 수 있고 포인트와 레벨은 포인트 모듈에서 정보를 가지고 올 수 있습니다.

이미 작성했던 팁 관리자가 회원에게 특별한 메모를 해준 경우 해당 정보를 가져오는 것도 회원정보에 기록이 되기 때문입니다.

https://rxtip.kr/rx_tip/778

{@$DmemberInfo = getModel('member')->getMemberInfoByMemberSrl($oDocument->get('member_srl'));}

회원정보를 $DmemberInfo 변수에 모두 담아줄 수 있습니다. 게시글 작성자의 회원번호로 해당 회원의 정보를 가져오는 것 입니다.

{@$oPointModel = getModel('point');$point = $oPointModel->getPoint($oDocument->get('member_srl'));}

$oModuleModel = getModel('module');

$config = $oModuleModel->getModuleConfig('point');

$level = $oPointModel->getLevel($point, $config->level_step);
$nextpoint = $config->level_step[$level+1];
$prepoint = $config->level_step[$level];
$percent = round(($point-$prepoint)/($nextpoint-$prepoint)*100, 0);
}

게시글 작성자의 회원번호로 해당 회원의 포인트 정보를 가져올 수 있습니다.

그리고 다음레벨에 대한 현재 보유 포인트의 비율을 $percent 에 구할 수 있습니다.

이제 회원정보에서 필요한 것들을 출력해 줄 수 있습니다.

가입일 : {zdate($DmemberInfo->regdate, "y-m-d")}

최종 접속일 : {zdate($DmemberInfo->last_login, "y-m-d")}

레벨 : {$level}

다음 레벨에 대한 현재 포인트 비율 : {$percent}%

$DmemberInfo 에 담긴 회원정보는 이외에도 더 많이 있습니다. 필요에 따라 추가로 뽑아서 출력할 수 있습니다.

->member_srl 로그인 사용자 고유번호
->user_id 로그인 사용자 아이디
->email_address 로그인 사용자 이메일 주소
->email_id 로그인 사용자 이메일 아이디
->email_host 로그인 사용자 이메일 호스트
->user_name 로그인 사용자 이름
->nick_name 로그인 사용자 닉네임
->homepage 로그인 사용자 홈페이지
->blog 로그인 사용자 블로그
->birthday 로그인 사용자 생년월일 (YYYYMMDD)
->profile_image 로그인 사용자 프로필 이미지
->image_name 로그인 사용자 이름 이미지 경로
->image_mark 로그인 사용자 그룹 이미지 경로
->signature 로그인 사용자 서명
->group_list 로그인 사용자 가입 그룹 목록
->is_admin 로그인 사용자가 관리자인지 확인
->is_site_admin 로그인 사용자가 가상 사이트 관리자인지 확인

라이믹스 사이트에 게시글 작성 소식을 이메일(뉴스레터)로 받아 볼 수 있게

꿀팁관리소장 — Tue, 11 Aug 2020 19:34:11 +0900

저희처럼 블로그형식의 사이트라면 비정기적으로 게시글이 작성된다면 이 새로운 글이 작성 되었음을 원하는 사람에게 전달 할 수 있다면 유용할 것입니다. 회원제 커뮤니티의 경우는 매일 방문해서 계속 올라오는 컨텐츠들을 보기 위해 습관적으로 수시로 방문하겠지만 그런 성격이 아닌 경우는 이런 뉴스레터 기능이 필요 할 수 있습니다.

사이트를 라이믹스나 XE로 운영하고 있다면 모듈과 위젯으로 아주 간단하게 구현할 수 있습니다. 지금 저희 라이믹스 꿀팁 사이트 각 게시판 목록의 상단에 메일구독이 모듈과 위젯으로 구현한 것입니다.

라이믹스로 사이트를 운영한다면 메일 발송 자체를 전문 서비스인 우리메일 서비스를 이용하는게 좋다는 글을 작성했습니다.

https://rxtip.kr/rx_study/644

뉴스레터 기능을 구현하기 위해서

1.사이트의 메일 발송을 우리메일로 사용합니다.

https://woorimail.com/

우리메일 사이트에 가입을 하고 회원가입을 한 후 인증키 발급 메뉴를 통해 사이트 도메인을 등록하고 인증키를 복사해서 모듈 설정에 인증키 입력하는 곳에 입력해야 합니다. 인증키는 즉시 생성되지만 실제 동작은 승인 후에 가능합니다. 승인되는데 1일 정도 소유되는데 1일 정도 지나도 승인이 되지 않으면 1:1 문의에 문의 해 주세요.

월 1만통까지는 무료이고 추가로 더 사용하고 싶다면 유료로 이용 가능합니다.

2.우리모듈 에서 배포하는 우리알림 모듈,뉴스레터 위젯을 설치합니다..

3.모듈 설정 후 위젯코드를 게시판 상단쪽에 추가해 줘서 각 게시판 상단에 이메일 입력 후 메일링 신청 할 수 있도록 합니다.

우리알림 모듈

https://github.com/ForPeople/WooriAlim

다운 받은 후 압축을 풀면 실제 업로드해야할 폴더명과 다릅니다. 폴더명을 ggmailing 으로 바꿔서 업로드 해주세요.

/modules/ggmailing

뉴스레터 위젯

https://github.com/ForPeople/GGNewsletter

다운 받은 후 압축을 풀면 실제 업로드해야할 폴더명과 다릅니다. 폴더명을 ggnewsletter 으로 바꿔서 업로드 해주세요.

/widgets/ggnewsletter

모듈을 업로드 했다면 관리자페이지에서 모듈 업데이트,DB설치 를 누르고 모듈 설정에 가서 기본 설정을 해야 합니다.

관리자페이지 우리알림 모듈 설정에 접속 해보면

상단에 인증키 입력하는 곳이 있고 뉴스레터를 사용하려면 아래쪽에 추가적으로 설정이 필요합니다.

뉴스레터 게시판이 동작되도록 할 게시판의 MID(모듈ID)를 입력해 줍니다. 저기에 등록하지 않은 게시판은 위젯코드를 생성해서 상단에 넣어줘서 이메일 입력을 받아도 새글이 작성되어도 메일이 나가지 않습니다.

그 아래 게시판메일링/뉴스레터 사용함 을 선택하고 저장을 해주면 모듈 설정은 다 한 것입니다.

뉴스레터 위젯을 업로드했다면 관리자페이지에서 설치된위젯 -> GG 뉴스레터 위젯 -> 코드생성

을 통해 모든 게시판 마다 코드 하나씩을 만들어서 게시판 스킨의 상단에 넣어야 합니다.

위젯 캐시는 설정하면 안됩니다. 다른 사람이 입력한 이메일 주소가 입력되어 보여지기 때문에 캐시는 설정하지 마세요.

게시판 마다 아래와 같은 위젯코드가 만들어 질겁니다.

5개의 게시판에 뉴스레터 신청을 받을 것이라면 위와 같은 코드에서 module_srl="134" 이부만 다른 코드가 5개가 필요하게 되는 것 입니다.

이 코드를 각 게시판의 mid 마다 조건을 걸어서 각 게시판에 맞는 코드가 작동하도록 게시판 스킨에 넣어주면 됩니다.

저희는 게시판 목록 상단에 적당한 위치에 넣어주었습니다.

저기에 이메일을 넣고 등록 버튼(저희는 메일 구독)을 누르면 메시지와 함께 메일이 모듈의 db에 등록이 됩니다.

관리자페이지의 우리알림 모듈 -> [게시판 메일링/댓글알림/뉴스레터 관리] 에 접속해 보시면 뉴스레터를 신청한 이메일과 함께 정보가 등록되어 있습니다.

이후 해당 게시판에 새글이 작성되면 이메일로 새글의 소식이 전송됩니다.

라이믹스 게시판 목록에서 일정 조회수 이상 게시글 표시 해주기

꿀팁관리소장 — Thu, 06 Aug 2020 19:05:26 +0900

라이믹스나 XE로 사이트를 운영하는 운영자라면 기본적인 XE들의 함수와 조건문 정도를 템플릿에서 사용한다면 여러가지를 방문자들에게 조건에 맞춰 특별하게 보여주거나 표시를 해줄 수 있습니다.

지금 라이믹스 꿀팁 이 사이트에 게시판 목록에 불꽃 이 달려있는 게시글 들이 있습니다.

운영자가 정한 기준의 조회수 보다 높은 조회를 가진 나름의 인기있는 글을 표시를 해주어 여러가지 목적에 사용할 수있습니다.

조회수가 아닌 다른 함수를 쓴다면 조건을 바꿔서 사용할 수 있겠죠.

목록의 템플릿에서 사용할 수 있는 게시글의 조회수를 가져오는 함수는

$document->get('readed_count') 입니다.

이것을 조건으로 사용한다면

표시하고 싶은 내용들

이렇게 하면 됩니다. 게시글의 조회수가 19보다 크다면 이라는 조건으로 사용되게 됩니다.

목록의 제목을 출력하는 곹 바로 뒤에 특별한 이미지를 불러오게 위 코드를 그대로 사용해도 되고 아니면 제목을 출력하는 바로 뒤에 CSS로 이미지를 백그라운드로 띄우게 할 수도 있습니다.

<img src="이미지주소">

이미지를 단순하게 불러오는 정도는 이렇게 처리하면 되니 매우 간단합니다. 이미지의 위치는 img src 소스에 style="" 을 추가해서 처리해도 되구요.

그럼 여기 라이믹스 꿀팁에 적용한 게시판 스킨에 CSS로 처리한 것을 적어보겠습니다. 각자 사용하는 스킨에 응용해야 합니다.

저희는 스케치북 스킨의 모바일 목록을 PC와 모바일에서 모두 함께 반응형으로 사용하도록 고쳐서 쓰고 있습니다.

_list_m.html 을 사용하는 건데요. 여기에 불꽃 아이콘을 추가해 줄 것입니다.

class="fire" 를 사용해서 조회수 20부터는 class="fire" 를 가지도록 했습니다.

<a href="{getUrl('document_srl',$document->document_srl,'listStyle',$listStyle, 'cpage','')}" class="fire">{$document->getTitle($mi->subject_cut_size)}
<b>{$document->getCommentCount()}</b></a>

참고로 원래 스킨에는 a 태그가 없는데 제가 필요로 의해 추가한 것이니 이점은 감안해서 봐주세요.

혹은 a 태그도 있고 기존에 사용하는 class 까지 가진 경우도 있습니다.

그럴경우는 class="기존클래스 fire"

이런식으로 fire 클래스 하나를 더 가지도록 추가해주면 됩니다. 이경우는 class="기존클래스 fire" 이렇게 되는 것 입니다. 물론 조회수가 20인 경우의 게시글에서 되겠죠.

한칸 공백을 조건문 안에서 처리를 해주셔야 합니다.

저희는 위 경우이니 위의 예시로 다시 설명을 이어갑니다.

저 fire class에 백그라운드 이미지로 불꽃을 가지게 css에서 추가를 해주면 됩니다.

미리 불꽃 아이콘으 스킨의 이미지폴더에 업로드를 해주셔야 겠죠.

저 태그 바로 위쪽에 rt_area 가 있고 그 안에 저 a 태그가 위치하고 있습니다.

.rt_area a.fire::after {
content: '';
position: absolute;
background-image: url(../img/fire.png);
background-repeat: no-repeat;
width: 16px;
height: 16px;
margin-top:2px;
margin-left: 5px;
}

.rt_area a.fire {
margin-right: 25px;
}

CSS에 저렇게 작성해 주면 불꽃 아이콘이 백그라운드 이미지로 불러와져서 글 제목 끝나는 부분에 불꽃이 나오게 됩니다.

::after 를 사용해서 .rt_area a.fire 뒤쪽에 지정한 것들이 적용되는 것입니다. 글 제목 출력하는 a 태그 바로 뒤에 적용되죠.

앞쪽에 적용할때는 ::before 를 사용하면 됩니다.

백그라운드로 이미지를 추가하려 기존의 a 태그 뒤쪽에 불꽃이 보이게 됩니다. 그런데 백그라운의 구조상 바로 뒤에 댓글수나 새글,업데이트 아이콘 등이 위치한다면 거기와 겹치게 됩니다.

그래서 a 태그의 영역을 조금 더 넓혀주어서 다른 부분은 밀려 나도록 해주면 됩니다.

.rt_area a.fire {
margin-right: 25px;
}

위 부분이 그래서 들어간 부분입니다.

스케치북 스킨 카카오톡 공유 최신 SDK로 고치고 PC에서도 공유 사용하기

꿀팁관리소장 — Mon, 03 Aug 2020 22:25:40 +0900

라이믹스나 XE를 스케치북5 스킨을 사용하면 아마 카카오톡 공유버튼을 누르면 카톡창은 뜨지만 실제 공유를 진행해 보면 버전이 낮아 안된다는 메시지가 뜨게 될 것입니다. 이 창이 뜨지 않고 실제 공유가 된다면 최신 SDK에 대응이 된 스크립트를 사용하고 있는 것 입니다.

여기서 다룰 것 은 위 문제 를 포함한

1.카카오 링크 공유를 최신으로 변경하여 동작하게 하기

2.PC에서도 카카톡 공유 버튼을 노출하여 사용 가능하게 하기

위 두가지 정도 입니다.

1.카카오 링크 공유를 최신 스크립트로 적용하기

기존에 board.js 안에 카카오톡 링크 부분은 사용하지 못합니다. 이건 무시하게 됩니다.

스크립트를 스킨 파일에 넣을 것 입니다.

최신 스크립트 형식은

<script defer="">
 window.addEventListener('DOMContentLoaded', function() {
 Kakao.init('{$mi->kakao_key}');
 });
 function sendLink() {
 Kakao.Link.sendDefault({
 objectType: 'feed',
 content: {
 title: "{strip_tags($oDocument->getTitle())}",
 description: '{$oDocument->getSummary()}',
 imageUrl: '{$oDocument->getThumbnail(750, 465, 'crop')}',
 link: {
 mobileWebUrl: '{$oDocument->getPermanentUrl()}',
 webUrl: '{$oDocument->getPermanentUrl()}'
 }
 },
 social: {
 likeCount: {$oDocument->get('voted_count')},
 commentCount: {$oDocument->getCommentCount()},
 viewCount: {$oDocument->get('readed_count')}
 },
 buttons: [
 {
 title: '{$lang->cmd_view}',
 link: {
 mobileWebUrl: '{$oDocument->getPermanentUrl()}',
 webUrl: '{$oDocument->getPermanentUrl()}'
 }
 }
 ]
 });
 }
 </script>

Kakao.init('{$mi->kakao_key}'); 이부분은 게시판 설정에 카카오개발자사이트에 등록된 자바스크립트키를 가져오게 구성한 것입니다.

그냥 게시판 설정에 넣지 않으려면 Kakao.init('자바스크립트키'); 로 넣으셔도 됩니다.

위 코드는 _read.html 파일의 아래쪽에 넣어주세요. 공유 버튼 보다 아래쪽으로. 그냥 맨 아래 넣어주세요.

각 게시판에 카카오키가 입력되어 있다면 스크립트가 동작하게 하고 싶다면 위 코드를

<block cond="$mi->kakao_key">

코드를 이 안에

</block>

위와 같이 조건을 걸어 안에 넣어주세요.

그리고 _read.html 파일의 맨 상단에

<load target="//developers.kakao.com/sdk/js/kakao.min.js" cond="$mi->kakao_key" /> 를 넣어 줍니다.

각 게시판마다 카카오톡 공유 사용을 다르게 설정하고 싶다면 cond="$mi->kakao_key" 를 넣어주어서 게시판 설정에 자바스크립트 키가 있을때만 불러오도록 하시고 공유 스크립트에 키를 아예 넣었다면 cond="$mi->kakao_key" 을 빼 주세요.

이제 스크립트는 준비가 되었습니다. 기존의 카카오톡 공유버튼 링크 소스에

id="kakao-link-btn" 를 꼭 추가해 줘야 합니다. 그래야 공유 버튼을 누르면 위 스크립트가 동작하게 되어있습니다.

스케치북5 스킨에서는 공유버튼을 스킨 설정에 따라 스타일이 다르게 위치도 다르게 할 수 있습니다. 따라서 사용하는 공유버튼의 소스코드는 각자 다르니 찾아서 수정해야 합니다.

우선 모바일에서 사용되고 버튼이 큰 스타일이 적용되는 소스는 _reald.html 파일의 358 라인 정도에 보면

<div cond="$mi->to_sns=='3'" class="to_sns big" style="text-align:{$mi->to_sns_big}" data-url="{$sns_link}" data-permanenturl="{$oDocument->getPermanentUrl()}" data-title="{$sns_title}">
   <a class="facebook bubble" href="#" data-type="facebook" title="To Facebook"><b class="ico_sns facebook">Facebook</b></a>
   <a class="twitter bubble" href="#" data-type="twitter" title="To Twitter"><b class="ico_sns twitter">Twitter</b></a>
   
   <a class="kakaostory" href="storylink://posting?post={$oDocument->getPermanentUrl()}&appid=m.kakao.com&appver=1.0&apiver=1.0&appname={$mi->title}"><b class="ico_sns kakaostory">KakaoStory</b></a>
   <a class="band" href="bandapp://create/post?text={$sns_title}%0A{$sns_link}"><b class="ico_sns band">Band</b></a>
   <a class="kakao" href="#" data-type="kakao"><b class="ico_sns kakao">Kakao</b></a>
   <a class="line" href="line://msg/text/?{$sns_title}%0D%0A{$sns_link}"><b class="ico_sns line">Line</b></a>
   
   <a class="kakaostory bubble" href="#" data-type="kakaostory" title="To KakaoStory"><b class="ico_sns kakaostory">KakaoStory</b></a>
   <a class="band bubble" href="#" data-type="band" title="To Band"><b class="ico_sns band">Band</b></a>
   
</div>

위 굵게 되어 있는 부분이 기존의 카카오톡 공유 버튼 소스 입니다. 현재 모바일에서만 나오게 조건이 걸려있으니 혹시 PC에서도 동작하게 바꾸려고 하신다면 아예 저 조건 밖으로 빼서 PC에서도 보일 수 있도록 하면서 위에 설명한 id="kakao-link-btn" 를 추가해 주세요.

<a id="kakao-link-btn" class="kakao" href="javascript:sendLink()"><b class="ico_sns kakao">Kakao</b></a>
   
   <a class="kakaostory" href="storylink://posting?post={$oDocument->getPermanentUrl()}&appid=m.kakao.com&appver=1.0&apiver=1.0&appname={$mi->title}"><b class="ico_sns kakaostory">KakaoStory</b></a>
   <a class="band" href="bandapp://create/post?text={$sns_title}%0A{$sns_link}"><b class="ico_sns band">Band</b></a>

<a class="line" href="line://msg/text/?{$sns_title}%0D%0A{$sns_link}"><b class="ico_sns line">Line</b></a>
   
   <a class="kakaostory bubble" href="#" data-type="kakaostory" title="To KakaoStory"><b class="ico_sns kakaostory">KakaoStory</b></a>
   <a class="band bubble" href="#" data-type="band" title="To Band"><b class="ico_sns band">Band</b></a>
   
</div>

위와 같이 바꾸는데 data-type="kakao" 는 이제 필요없으니 뺐습니다.

이렇게 하면 공유버튼 큰 사이즈로 설정해서 사용한다면 모바일,PC 모두 공유가 이제 잘 될 겁니다.

공유버튼 작은 스타일로 사용하는 경우는 공유버튼 소스가 _reaad_sns.html 파일로 별도로 있습니다. 여기에는 아예 카카오톡 공유(카카오 링크)가 빠져 있습니다. 여기에 추가를 해줍니다.

<div class="rd_nav img_tx to_sns fl" data-url="{$sns_link}" data-permanenturl="{$oDocument->getPermanentUrl()}" data-title="{$sns_title}">
   <a class="{$mi->to_sns_small}" href="#" data-type="facebook" title="To Facebook"><i class="ico_sns16 facebook"></i><strong> Facebook</strong></a>
   <a class="{$mi->to_sns_small}" href="#" data-type="twitter" title="To Twitter"><i class="ico_sns16 twitter"></i><strong> Twitter</strong></a>
   <a id="kakao-link-btn" class="{$mi->to_sns_small}" href="javascript:sendLink()" cond="$mi->kakao_key"><i class="ico_sns16 kakao"></i><strong> Kakao</strong></a>
   <a class="{$mi->to_sns_small}" href="#" data-type="kakaostory" title="To KakaoStory"><i class="ico_sns16 kakaostory"></i><strong> KakaoStory</strong></a>
   <a class="{$mi->to_sns_small}" href="#" data-type="band" title="To Band"><i class="ico_sns16 band"></i><strong> Band</strong></a>
</div>

cond="$mi->kakao_key" 는 게시판 설정에 자바스크립트키가 있을때 공유버튼이 나오도록 하기 위해 넣은거니 키를 스크립트에 직접 넣은 경우라면 cond="$mi->kakao_key" 를 빼주셔야 버튼이 노출이 됩니다.

이렇게 하고 게시판 설정에 카카오 자바스크립트 키를 넣으면 공유버튼이 생겨납니다. 그런데 아마 버튼이 다른게 나올겁니다. 원래 나오지 않던 버튼이라 css에 해당 버튼에 대한 내용이 없습니다.

board.css 파일에 58번 라인 즘에

.bd .ico_sns16.kakao{background-position:0 -80px} 를 추가해주세요.

아이콘의 높이가 잘 맞지 않으면 -80px 값을 조절하면 됩니다.

이렇게 하면 PC에서 작은 아이콘 스타일의 공유에서도 카카오톡 공유를 사용할 수 있습니다.

라이믹스나 XE에서 크롤러 봇에게 보이지 않게 처리 하는 방법

꿀팁관리소장 — Sat, 01 Aug 2020 12:17:26 +0900

라이믹스나 XE에서는 자체적으로 봇(크롤러)을 리스트업 해서 관리합니다. 라이믹스에서 지정한 모든 봇에 대해 특정한 부분을 보여주거나 혹은 반대로 보여주지 않을때 크롤러 함수를 사용할 수 있습니다.

isCrawler() 함수가 크롤러 봇 함수입니다.

레이아웃이나 게시판 스킨과 같은 템플릿에서 조건을 걸을때 위 크롤러 함술르 사용하면 됩니다. 물론 php에서도 사용할 수 있습니다.

<!--@if(isCrawler())-->
 적용하고 싶은 코드
 <!--@end-->

위와 같이 크롤러에게만 보여주고 싶은 경우

<!--@if(!isCrawler())-->
 적용하고 싶은 코드
 <!--@end-->

크롤러가 아닌 대상에게만 보여주고 싶은 코드 (크롤러는 제한하는)는 위와 같이 조건을 걸면 됩니다.

라이믹스에서 아이폰,안드로이드 접속 구분해서 코드 적용하기 - 유저에이전트

꿀팁관리소장 — Sat, 01 Aug 2020 12:05:59 +0900

라이믹스와 XE로 사이트를 운영하다보면 아이폰 방문자에게는 보여주면 불필요하고 반대로 안드로이드 스마트폰 방문자에게는 보여주면 불필요한 경우도 있습니다.

혹은 아이폰 유저에게만 꼭 보여줘야 하는 것 안드로이드 유저에게만 보여줘야 하는 것이 있을 수도 있죠.

이런 처리는 간단하게 방문자 브라우저의 유저 에이전트를 확인해서 처리해 줄 수 있습니다.

처리하고 싶은 레이아웃이나 게시판 스킨의 상단에

{@ $useragent=getenv("HTTP_USER_AGENT");}

요렇게 넣어 주시면 $useragent 에 접속중인 기기으니 유저에이전트 값이 담기게 됩니다. 이 값에 아이폰,안드로이드 문구가 있는지 확인해서 필요한 부분에 조건을 걸어 주면 됩니다.

<!--@if(preg_match('/iphone|iPhone/',$useragent))-->
 적용하고 싶은 코드
 <!--@end-->

아이폰에만 적용되고 싶을때 위와 같이 조건을 걸어주면 됩니다.

<!--@if(preg_match('/android|Android/',$useragent))-->
 적용하고 싶은 코드
 <!--@end-->

안드로이드폰에만 보이게 하고 싶은 경우 위와 같이 조건을 걸면 됩니다.

이 유저에이전트 활용은 다양한 곳에 사용할 수 있습니다. ipad 만 따로 뭔가 보여주거나 혹은 네이버 봇에게는 보여주지 않거나 혹은 보여주거나 등의 활용이 가능합니다.

사이트 메인으로 지정되어 있는 모듈(페이지) 구분하기

꿀팁관리소장 — Thu, 30 Jul 2020 14:07:48 +0900

라이믹스 혹은 XE로 사이트를 만들어 운영하다보면 사이트의 홈으로 지정된 메인페이지(메인모듈)에서만 동작하게 조건을 걸어 코드를 작성할 일이 많습니다.

너무 많은 출력을 제한하거나 메인에서만 보이거나 혹은 반대로 메인에서는 보이지 않아야 하는 것들이 많기 때문입니다.

각 모듈별로 제한을 할 수 있는 MID로 조건을 걸 수 있습니다.

$mid=='모듈명' 이렇게 해서 걸어주지만 이게 사실 홈으로 지정한 모듈이 바뀌게 되면 조건을 걸어 둔 코드를 모두 다 찾아서 바꿔야 하니 조금 불편합니다.

그래서 홈으로 지정된 모듈을 자동으로 가져온다면 바뀌어도 신경쓸 필요가 없습니다.

레이아웃,게시판 스킨 등의 상단에 이 값을 가져와 저장해 두면 필요한 곳에 다 활용 할 수 있습니다.

{@ $_is_indexmodule = ($site_module_info->module_srl === $module_info->module_srl);}

요렇게 작성해 두면 $_is_indexmodule 현재 머무르는 모듈이 홈으로 지정된 모듈이라면 $_is_indexmodule 값을 가지게 됩니다.

조건을 걸고 싶은 코드에 if,cond 조건을 사용해서 사용하면 됩니다.

$_is_indexmodule 혹은 !$_is_indexmodule

코드

</div>

코드

위 코드는 XEDITION 레이아웃에 들어가 있는 코드로 다른 레이아웃에는 없어 이걸 차용하면 편리합니다.

중복 글/댓글 방지 애드온

꿀팁관리소장 — Mon, 27 Jul 2020 12:32:25 +0900

라이믹스나 XE로 회원이 참여하는 사이트를 운영하다보면 글,댓글을 작성하는 사람의 네트워크 환경이나 여러 환경에 의해 글,댓글 등록 요청시 시간이 지연되거나 하여 등록버튼을 여러번 눌러 같은 글,댓글이 여러번 등록되는 일이 벌어지기도 합니다.

짧은 시간의 연속 적인 등록 요청은 코에서도 막아주지만 조금 긴 시간의 간격으로 등록 버튼이 반복해서 눌리면 중복된 내용이 등록 될 수 있습니다.

이를 막아줄 수 있는 애드온이 중복 글/댓글 방지 애드온 입니다.

https://github.com/kijin/xe-noduplicate

애드온을 설치하고 설정을 원하는 시간등을 알맞게 설정을 하면 해당 조건에 중복 요청은 허용되지 않게 할 수 있습니다.

깃허브에서 다운 받을때는 보통 XE-애드온 이런식으로 폴더명이 생성됩니다. XE- 는 제거해서 애드온이나 모듈의 이름에 해당하는 폴더명으로 바꾼 후 업로드해서 사용하세요.

라이믹스 XE에서 관리자가 회원설명(메모) 입력해 놓은 회원 식별하기

꿀팁관리소장 — Sun, 26 Jul 2020 16:28:51 +0900

관리자가 회원관리(수정)에서 회원마다 관리를 위해 특별한 메모를 해 줄수 있고 이것을 회원정보 보기에서 관리자가 쉽게 확인 할 수 있는 팁을 작성해 놓은 것이 있습니다.

https://rxtip.kr/rx_tip/258

위 팁을 보다 좀더 관리적인 측면에서 유용하게 사용하는 한가지 팁을 더 드립니다.

주로 저기 회원설명(메모) 부분에 무언가 입력을 해 놓았다면 추후에 같은 일이 반복되는지 등을 관리하기 위해 설명을 달아 놓았을 겁니다.

관리하려는 회원인지 아닌지 쉽게 구분할 수 있다면 좀더 편리할 것입니다.

회원이 작성한 글을 보여주는 페이지에서 특정한 위치에 메모가 입력된 회원인지 아닌지를 구분해 준다면 관리자 입장에서 한번더 모니터링 해야 하는 회원의 글인지 쉽게 알 수 있을 겁니다.

_read.html 혹은 read.html 이 대부분 작성한 글을 보여주는 파일입니다.

여기 상단에 작성자의 회원정보를 가지고 오는 코드를 추가해 줍니다. 이 코드는 해당 회원이 가진 모든 정보를 가지고 오니 여러모로 쓸모가 있으니 한번 작성해 두고 여러가지를 뽑아서 활용할 수 있으니 활용도가 매우 높은 정보입니다.

{@ $DmemberInfo = getModel('member')->getMemberInfoByMemberSrl($oDocument->get('member_srl'));}

$DmemberInfo 변수에 작성자의 회원정보 전체가 담기게 되는데 네이밍은 식별하기 쉽게 해주시면 됩니다. 저는 문서라는 의미로 D 라는 문자를 사용했습니다.

이제 저기서 가지고 오는 많은 정보 중 지금 팁에서는 회원의 관리자설명 을 가지고 와서 안에 내용이 있는지 여부를 확인하고 그에 따라 표시를 해주려고 합니다.

저는 글 작성자 닉네임 옆에 회원정보에 관리자 설명이 있는지 확인 후 있다면 표시를 해주는 코드를 추가해 주었습니다.

<i class="fa fa-check" aria-hidden="true" style="color:#FF0000;margin-right:5px;"></i>

저 코드는 닉네임을 출력해주는 {$oDocument->getNickName()} 이런 코드 바로 앞에 추가해 준 것입니다.

이렇게 메모가 있는 회원의 경우 관리자에게만 저 체크표시가 보이게 되니 관리자는 해당 회원을 예의주시 할 수 있게 됩니다.

라이믹스 회원정보 보기에서 홈페이지,블로그 주소에 링크 걸어주기

꿀팁관리소장 — Sun, 26 Jul 2020 15:16:29 +0900

회원정보에 홈페이지 주소와 블로그 주소를 회원들에게 입력하는 것을 허용하는 경우 이 url이 보여질때 클릭시 이동까지 되는 링크로 작동하는 것을 원하는 경우가 있습니다. 기본적으로 회원정보 스킨에서는 그냥 텍스트로 출력이 되는데요.

약간의 수정을 통해 링크를 걸어 줄 수 있습니다.

기본스킨의 예를 들어 수정법을 게시해 보면

member_info.html 파일에 보면 아래와 같은 내용이 있습니다.

<dl class="dl-horizontal">
 <block loop="$displayDatas => $item">
 <dt><em cond="$item->required || $item->mustRequired">*</em> {$item->title}</dt>
 <dd cond="$item->value">{$item->value}</dd>
 <dd cond="!$item->value" style="color:#ccc">…</dd>
 </block>
 <dt>{$lang->member_group}</dt>
 <dd>{implode(', ', $memberInfo['group_list'])}</dd>
 <dt>{$lang->signup_date}</dt>
 <dd>{zdate($memberInfo['regdate'],"Y-m-d")}</dd>
 <block cond="$memberInfo['member_srl'] == $logged_info->member_srl || $logged_info->is_admin == 'Y'">
 <dt>{$lang->last_login}</dt>
 <dd>{zdate($memberInfo['last_login'],"Y-m-d")}</dd>
 </block>
 </dl>

위 강조된 4번째 라인의 부분이 입력된 값을 출력해 줍니다.

홈페이지,블로그 항목만 조건을 걸어 링크를 걸어주겠습니다.

<dl class="dl-horizontal">
 <block loop="$displayDatas => $item">
 <dt><em cond="$item->required || $item->mustRequired">*</em> {$item->title}</dt>
 <!--@if(in_array(($item->name),array('homepage','blog')))-->
 <dd cond="$item->value"><a href="{$item->value}" target="_blank">{$item->value}</a></dd>
 <dd cond="!$item->value" style="color:#ccc">…</dd>
 <!--@else-->
 <dd cond="$item->value">{$item->value}</dd>
 <dd cond="!$item->value" style="color:#ccc">…</dd>
 <!--@end-->
 </block>
 <dt>{$lang->member_group}</dt>
 <dd>{implode(', ', $memberInfo['group_list'])}</dd>
 <dt>{$lang->signup_date}</dt>
 <dd>{zdate($memberInfo['regdate'],"Y-m-d")}</dd>
 <block cond="$memberInfo['member_srl'] == $logged_info->member_srl || $logged_info->is_admin == 'Y'">
 <dt>{$lang->last_login}</dt>
 <dd>{zdate($memberInfo['last_login'],"Y-m-d")}</dd>
 </block>
 </dl>

위와 같이 변경을 하면 홈페이지,블로그만 입력된 값으로 링크가 걸려 출력이 됩니다.

알림센터의 멘션(호출) 부분을 스타일링 해주고 링크를 넣어주기

꿀팁관리소장 — Sat, 25 Jul 2020 11:51:24 +0900

라이믹스와 XE에서는 알림센터로 회원이 각종 알림을 받을 수 있습니다. 그 중 닉네임 앞에 골뱅이를 붙여서 적으면 해당 회원에게 알림이 가는 멘션 기능을 사용할 수 있습니다. 그런데 이 기능을 처음 보는 회원은 무슨 기능인지 잘 모르기도 하고 해서 그 부분을 조금 스타일링을 해주거나 해서 눈에 띄게 해주고 클릭시 원하는 것을 보여주거나 하면 좋을 것 같아 구현했습니다.

@주인장님에게 호출을 할 경우

단, 조건이 조금 있습니다.

알림센터에서 단어의 끝이 님으로 끝나는 경우 닉네임으로 취급하지 않도록 알림센터에서 설정을 하고 회원가입을 받을때 닉네임의 끝자리는 님을 사용하지 않는 것으로 하고 구현하는 것을 전제로 합니다. 이 팁에는 님은 닉네임으로 포함하지 않고 존칭으로 간주합니다.

본문과 댓글 모두 다 적용할 수 있지만 본문 부분만 설명해 보겠습니다.

본문을 출력하는 파일에 해당 부분을 처리할 수 있도록 수정해 주는 방법입니다. _read.html 혹은 read.html 로 많이 사용합니다.

파일을 열어서 본문의 내용을 출력하는 부분을 찾습니다.

{$oDocument->getContent(false)}

보통 위와 같이 되어 있습니다. 위와 같이 되어 있는 것을 기준으로 합니다.

위 부분을 찾아서 아래와 같이 바꿔 줍니다.

1.멘션이 사용되었을때 해당 멘션 부분의 링크를 따로 연결하지 않고 클릭시 회원메뉴 팝업 레이어가 뜨게 하기

{@
 $content_ = $oDocument->getContent(false);
 $content = html_entity_decode(strip_tags($oDocument->getContent(false)));
 preg_match_all('/(?:^|\s)@([^\pC\pM\pP\pS\pZ]+)/u', $content, $matches);
 $mentions = array_unique($matches[1]);
 }
 <block loop="$mentions=>$key,$val">
 {@
 if (($pos = strpos($val, 님)) !== false && $pos > 0):$mention = substr($val, 0, $pos);
 else:$mention = $val;
 endif;
 $mention_result[] = $mention;
 }
 </block>
 {@ $mention_result = array_unique($mention_result);}
 <block loop="$mention_result=>$key,$val">
 {@
 $oMemberModel = &getModel('member');
 $member_srl = $oMemberModel->getMemberSrlByNickName($val);
 }
 {@ $content_ = preg_replace("/(@$val)([$\s<&,님])/u", "<a class='nick member_".$member_srl."' style='color:#07F; font-weight:500; display:inline-block; text-decoration:none; cursor: pointer;'>$1</a>$2", $content_); }
 </block>
 {$content_}

2.멘션이 사용된 부분에 섬띵모듈의 회원활동내역의 링크를 걸어주기

{@
 $content_ = $oDocument->getContent(false);
 $content = html_entity_decode(strip_tags($oDocument->getContent(false)));
 preg_match_all('/(?:^|\s)@([^\pC\pM\pP\pS\pZ]+)/u', $content, $matches);
 $mentions = array_unique($matches[1]);
 }
 <block loop="$mentions=>$key,$val">
 {@
 if (($pos = strpos($val, 님)) !== false && $pos > 0):$mention = substr($val, 0, $pos);
 else:$mention = $val;
 endif;
 $mention_result[] = $mention;
 }
 </block>
 {@ $mention_result = array_unique($mention_result);}
 <block loop="$mention_result=>$key,$val">
 {@ $content_ = preg_replace("/(@$val)([$\s<&,님])/u", "<a href='/@".$val."' style='color:#07F; font-weight:500; display:inline-block; text-decoration:none; cursor: pointer;'>$1</a>$2", $content_); }
 </block>
 {$content_}

여기 라이믹스 팁에는 1번의 케이스로 적용해 보았습니다.

로그인 한 회원이 클릭시에는 회원메뉴 전체가 뜹니다.

@주인장님 이라고 본문에 적었습니다.

라이믹스팁

라이믹스 게시글 댓글 신고 시 신고사유 반영할 수 있는 팝업창으로 뜨게 하기

똥남기는 모듈 게시글 삭제시 삭제된 게시글 처리시 썸네일까지 삭제해 주기.

라이믹스 읽지 않은 쪽지(새쪽지) 표시해 주기

랜덤게시글 모듈 게시글 이동을 php header location 으로 이동하게 하기

게시판 스킨에서 문서가 가지는 태그를 출력해주고 태그 목록으로 링크를 걸어줄때 url을 초기화

라이믹스 게시판 목록에서 문서의 태그 출력해 주기

라이믹스 form 태그에 지저분하게 붙는 속성 없애는 방법

스케치북 스킨 FAQ 원하는 항목으로 이동하며 A(답변) 펼치기 구현

zip 다운로드 애드온 라이믹스 2.0.17 업데이트 후 잘못된 요청 오류 수정법

라이믹스 설문조사 비회원참여를 막는 방법

라이믹스 설문조사 등록시 항목선택 갯수를 숫자로 입력하지 않았을 경우 발생하는 문제

rx-flextgram 테마의 댓글 추천 직후 추천수 잘못 표시되는 문제 해결

쿠키를 이용한 목록 스타일 변경 제공하기

설문조사 기능을 활성화 하기 위해 문서에 설문조사 포함시 설문조사 태그 포함하기

블라인드 모듈 최고관리권한 계정도 블라인드 되는 것 안되게 고치기

현재 읽고 있는 글의 목록 위치로 바로 가기 만들기

라이믹스 서명 html을 허용하지 않을 경우 엔터 태그 2개가 들어가는 문제 회피

회원정보에 스킨 수정없이 특별한 내용 추가해주기 (코노리님 포인트 레벨 표시 애드온 이용)

블라인드 모듈 블라이드 게시글 목록에서 섬네일이 나오는게 신경쓰일 경우

본문에 게시글 스크랩 버튼 추가하기 (스크랩 여부에 따라 스크랩하기 취소하기 토글기능)

통합게시판(타임라인 모듈) 의 게시글도 사이트운영관리 모듈의 설정에 따라 글 열람 제한하기

라이믹스 2.0.15 업데이트 후 글쓰기 확장변수 입력 항목 디자인이 틀어지는 문제

라이믹스 버전에 따라 다른 코드진행을 하기 위한 버전 비교 함수

라이믹스 댓글 이동시 fixed header에 댓글이 가리는 부분 스크립트로 해결해보기

라이믹스 글 작성 시 금칙어 적용이 확장변수에도 적용이 되어야 할 경우도 있습니다.

라이믹스 게시판 스킨 현재 읽고 있는 글 목록에 표시해 주기

자동첨부 애드온으로 첨부된 GIF 파일이 GIF CONVERT PRO 모듈로 MP4로 변환되지 못하는 문제 해결

라이믹스 CK에디터 툴바의 링크 버튼 제거해 주기

라이믹스 글 작성 시 사용된 a 링크를 제거해 주면 좋은점.

태그 연관글 애드온 띄어쓰기 된 태그의 경우 적용이 안되는 문제 해결

태그 연관글 애드온 태그가 없는 글에도 연관글이 출력이 되는 문제 회피 방법

페이지 목록에서 게시글 읽기 에 접근하여 목록으로 돌아갈때 페이지 변수를 없애는 경우

스티커 모듈 스티커 관리자가 검토 공개 등 변경사항 저장시 tag 입력 1글자 이상 입력해야 한다고 뜨는 문제

라이믹스 글 작성 시 a 태그 링크만 제거하고 텍스트만 남기기

GG뉴스레터 위젯 게시판 메일링 구독 비회원 신청 안되는 문제 해결

세진님 글 댓글 작성수 제한 애드온 제한 문구에 기간 표시해주기

글 읽기 화면 아래 글 목록 부분 표시되는 걸 선호 하시나요? flextagram 스킨의 수정

태그 연관글 애드온 다른 애드온 등에 현재문서 정보의 오류를 발생시키는 문제

비개발자가 라이믹스의 간단한 것을 만들고 수정할 수 있는 능력을 갖추는데 필요한 독학 과정

1.라이믹스의 구조를 살펴보시고 본인이 직접 어떤 구조로 작동하고 있고 어떤 것들을 가지고 있으며 그 개별적인 것들이 어떤 역할을 하는지 이해해 보세요.

2.라이믹스 구조를 대략 파악하셨다면 스킨이 무엇인지에 대해 파악하셨을 겁니다. 이제 사이트에서 내가 표현하고 싶은 부분들을 고쳐 보세요.

3.직접 수정하시면서 막히는 부분만 개발자 분들께 질문을 해서 답을 얻어 보세요.

4.스킨,레이아웃에서 자주 사용되는 라이믹스 함수를 눈에 익히고 어떤 의미인지 이해하고 사용해 보세요.

5.이제 애드온의 아주 간단한 부분을 고쳐서 사용해보세요.

6.이제 카피캣이 되셔서 새로운 애드온을 만들어 보세요.

7.애드온 외 위젯도 만들어보세요.

한화면에 용량이 큰 이미지 대량으로 로딩될때 발생되는 문제 [lozad.js] lazy load로 해결한 사례

브라우저에게 캐시 만료시간을 알려줘서 반복 요청에 대응하기

스크롤 위치에 따라 헤더 사라지고 나타나는 기능 구현

포인트 히스토리 모듈 서드파티 에서 포인트 적립시 구분할 수 있도록해서 개발하기

메뉴 새글표시 모듈 사용할때 Flex 시리즈 레이아웃 사용시 tooltip 충돌 문제 해결법

라이믹스 다크모드 자동 상태에서 브라우저 다크모드 감지시 php단에서 빠르게 모드 전환하기(쿠키사용)

라이믹스 다크모드 쿠키 삭제 버튼 제공으로 브라우저 자동연동 으로 전환하기

라이믹스 다크모드에 맞춰서 애드센스 어두운배경 광고 출력하기

RXP FLEX 레이아웃의 다크모드 기능 다른 레이아웃에 적용하는 방법

라이믹스 회원(팝업)메뉴에 아이콘 추가해주기

RXP FLEX 레이아웃의 다크모드 기능 게시판에 적용하기

카카오지도 마커 위치로 카카오내비 길안내 연동하기

라이믹스 통합게시판 글모으기 공지글 포함을 했을 경우 해당글이 통합 게시판에 공지로 올라가는 문제

신규 회원 가입 사실만 메일로 전달 받고 싶을때

통합게시판 게시글 목록에 게시판별 아이콘 표시해 주기

스티커 모듈 스티커 사이즈 140px 고정인거 가변으로 고치기

스케치북5 스킨 검색어 하이라이트 효과 주기

여태 몰랐던 라이믹스의 $document, $oDocument 게시글 정보

레이아웃에서 위젯 페이지 하단에 광고같은 것을 배치하면 디자인이 깨지는 경우

댓글 주소 클립보드에 복사하는 기능 추가하기

제목에 색상이나 굵기 자주 사용한다면 공유 관련 고쳐야 할 부분

라이믹스 커뮤니티의 화폐로 사용할 수 이벤트스티커 모듈의 활용

누구에게 남긴 대댓글인지 원댓글 작성자 닉네임 표시해 주기

스케치북 빵조각 '메뉴 아이콘' 적용해 보았습니다.

라이믹스 주소입력으로 카카오지도 위치 출력해주기

카카오 api 자바스크립트키 준비

사용자정의 생성

스크립트 삽입

지도출력 코드 넣기

본문 게시글 주소 복사 버튼 여러곳에 추가해 주기

input 입력창 크기가 작거나 이상한가요? css box-sizing

본문 게시글 주소 클립보드 복사 기능 만들기

커뮤니티 운영시 회원가입 및 등업을 유도하기 (그룹으로 서비스 제한)

라이믹스 서명 html을 허용하지 않을 경우 엔터
태그 2개가 들어가는 문제 회피