팁과노하우

2024.10.22 19:01

메뉴에 새글이 있을경우 N 아이콘 표시

https://rebuilder.co.kr/qna/855

삼다수님의 질문답변을 보고 만들었습니다.



리빌더의 새글 아이콘은 

get_new_ico("게시판 테이블 아이디", "카테고리 아이") 함수를 통해 

조건에 맞는 게시판에 새글이 있을 경우

<span class="gnb_new_ico">n</span>

위와 같은 HTML 코드를 반환 합니다.


그누보드5의 경우(혹은 리빌더의 또는 대다수의 경우) 메뉴관리에서 URL 전체의 링크로 저장되기 때문에 위 함수를 바로 사용하시기에는 작동할 수 없습니다.

게시판 테이블 아이디를 따로 불러올 수 없기 때문입니다.


그래서 생각한 방법이 현재 주소에서 게시판 아이디를 추출해서, 그 아이디를 메뉴를 출력하는 부분에서 get_new_ico 함수를 호출하면 되겠다 생각했습니다.



첨부파일로 올려드리는 extend 파일을 extend 폴더에 넣으세요. (파일이름은 바꾸셔도 무방합니다.)

해당 extend 파일에 작성되어 있는 코드는 URL을 받아서 URL에서 적절한 게시판 테이블 아이디를 반환해줍니다. (extract_bbs_name)

(짧은주소 사용 여부에 따른 로직이 다르게 코드를 짜긴 했지만, 미사용의 경우 테스트하지 못했습니다.)


extend 파일을 업로드 하였다면 사용하시는 헤더스킨 혹은 메뉴를 출력하는 곳으로 이동합니다. (본글에서는 basic 헤더 기준으로 설명합니다.)

header.php 파일중 아래 구문을 찾아주세요.


foreach( (array) $row['sub'] as $row2 ){

바로 아래에 두줄의 코드를 삽입 해주세요.

$menu_bo_table = extract_bbs_name($row2['me_link']);
$newIcon = $menu_bo_table ? get_new_ico($menu_bo_table, "") : "";



그럼 아래와 같은 모습입니다.


$k = 0;
foreach( (array) $row['sub'] as $row2 ){
    $menu_bo_table = extract_bbs_name($row2['me_link']);
    $newIcon = $menu_bo_table ? get_new_ico($menu_bo_table, "") : "";
    if( empty($row2) ) continue;



아래와 같이 소메뉴를 출력하는 구문을 바꿔주세요.


기존

<li><a href="<?php echo $row2['me_link']; ?>" target="_<?php echo $row2['me_target']; ?>"><?php echo $row2['me_name'] ?></a></li>



수정후
<li><a href="<?php echo $row2['me_link']; ?>" target="_<?php echo $row2['me_target']; ?>"><?php echo $row2['me_name'] ?><?php echo $newIcon;?></a></li>


그럼 사진과 같이 새글이 있는 곳에 n 글자가 보이게 됩니다.


62829e37f35b17c752bf918c2342233c_1729591208_9479.png


n에 대한 스타일링은 적절한 스타일시트 파일 (theme/rb.basic/rb.layout_hd/basic/style.css) 에 스타일을 정의 해주세요.


.gnb_new_ico { 스타일 정의 }








제가 글쓰는 솜씨가 없습니다...

혹시 궁금하신 점 있으시면, 언제든 댓글 달아주세요.


  • 공유링크 복사
    미니홈 쪽지 구독하기
    구독하고 알림받기

    댓글목록

    profile_image
    리빌더미니홈 1:1 대화하기 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물  오래 전

    좋은 방법인것 같습니다.
    공유 감사합니다.

    extract_bbs_name() 함수를 보지는 못했는데
    bo_table=테이블명 일때도 가능하면 범용적으로 쓰일 수 있을것같습니다.

    2024-10-22 19:07

    profile_image
    HUMHAE미니홈 1:1 대화하기 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물  오래 전

    extend 파일을 만들면서 새로 만든 함수입니다.
    현재는 환경설정의 짧은주소 사용 여부에 따라 bo_table=테이블, https://주소/테이블 에서
    테이블을 추출하는데 생각해보니 짧은주소사용 여부를 따지지 않고 그냥 바로 주소를 통해서 정규식으로 추출해와도 좋을 것 같습니다.

    기회가 된다면 추출한 테이블이 실제로 DB에 존재하는 게시판인지를 검사하도록도 해봐야겠습니다 ㅎㅎ

    2024-10-22 19:15

    profile_image
    profile_image
    profile_image
    no_profile 삼다수미니홈 1:1 대화하기 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물  오래 전

    좋은 자료 감사합니다.

        $menu_bo_table = extract_bbs_name($row2['me_link']);
        $newIcon = $menu_bo_table ? get_new_ico($menu_bo_table, "") : "";

    넣으면 헤더 부분 css 깨진 상태로 나오면서 본문과 하단 부분은 나타나지 않아요.

    http://theme/rb.basic/rb.layout_hd/basic/header.php

    2024-10-23 12:17

    profile_image
    HUMHAE미니홈 1:1 대화하기 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물  오래 전

    https://rebuilder.co.kr/tip/103

    이 게시글로 적용 해보시겠어요?

    2024-10-23 13:35

    profile_image
    no_profile 삼다수미니홈 1:1 대화하기 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물  오래 전

    네 그렇게 적용 하였는데
    증상이 나옵니다.

                    <nav id="cbp-hrmenu" class="cbp-hrmenu pc">
                        <ul>
                        <?php
                        $menu_datas = get_menu_db(0, true);
                        $gnb_zindex = 999; // gnb_1dli z-index 값 설정용
                        $i = 0;
                        foreach( $menu_datas as $row ){
                            if( empty($row) ) continue;
                        ?>
                        <li>
                            <a href="<?php echo $row['me_link']; ?>" target="_<?php echo $row['me_target']; ?>" class="font-B"><?php echo $row['me_name'] ?></a>
                            <?php
                            $k = 0;
    foreach( (array) $row['sub'] as $row2 ){
    $menu_bo_table = extract_bbs_name($row2['me_link']);
    $newIcon = $menu_bo_table ? get_new_ico($menu_bo_table, "") : "";
    if( empty($row2) ) continue;



                                if($k == 0)
                                    echo '<div class="cbp-hrsub"><div class="cbp-hrsub-inner"><div><!--<h4 class="font-B">그룹</h4>--><ul>'.PHP_EOL;
                            ?>
                                <li><a href="<?php echo $row2['me_link']; ?>" target="_<?php echo $row2['me_target']; ?>"><?php echo $row2['me_name'] ?><?php echo get_bbs_new_ico($row2['me_link']);?></a></li>
                            <?php
                            $k++;
                            }  //end foreach $row2

                            if($k > 0)
                                echo '</ul></div></div></div>'.PHP_EOL;
                            ?>
                        </li>
                        <?php
                        $i++;
                        }  //end foreach $row
                        ?>
                       
                        <?php if ($i == 0) {  ?>
                        <li><a href="javascript:void(0);">메뉴 준비 중입니다.</a></li>
                        <?php } ?>
                        </ul>
                    </nav>

    2024-10-23 14:27

    profile_image
    HUMHAE미니홈 1:1 대화하기 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물  오래 전

    업데이트된 extend 넣으셨으면,

    $menu_bo_table = extract_bbs_name($row2['me_link']);
    $newIcon = $menu_bo_table ? get_new_ico($menu_bo_table, "") : "";

    이 코드는 안넣으셔도 됩니다!

    2024-10-23 15:21

구매 신청
  • 신용카드 결제는 별도상담을 통해 가능합니다.
    구매문의 : cs@false9.co.kr / 010-6466-3355
    신청 이후 담당자가 개별연락 드리고 있습니다.
    입금자명과 실제 입금자가 동일한 경우 자동처리 됩니다.
  • 결제예정 금액 : 0 (VAT별도)
    하나은행(KOEXKRSE) : 258-910104-00407 / 김은정(인덱스)

  •  
  • 신청 및 FCM 가이드
      안드로이드 웹앱 및 푸시알림을 사용하기위한 A-Z!
      잘 따라오시면 어렵지 않습니다.

      1. FCM (Firebase Cloud Messaging) 세팅하기

      1-1. 시작하기
      https://console.firebase.google.com?hl=ko 으로 접속하여 [시작하기] 를 클릭합니다. FCM은 구글계정이 있으면 무료로 사용 가능 합니다.




      1-2. 프로젝트 생성하기
      [프로젝트 시작하기] 를 클릭합니다.




      프로젝트의 이름을 설정합니다.
      앱이름(사이트명, 상호명)을 영문으로 입력하는것이 가장 좋습니다.
      입력하셨다면 [계속] 을 클릭해주세요.




      애널리틱스 사용설정을 활성화 해주시고(선택사항)
      [계속] 을 클릭해주세요.




      애널리틱스 위치를 [대한민국] 또는 거주국가를 선택하시고 약관 동의 후 [프로젝트 만들기] 를 클릭해주세요.




      프로젝트 생성이 완료 되었습니다. [계속] 을 클릭하시면 FCM메인페이지로 이동 합니다.




      1-3. 앱 생성하기
      이전 단계에서 프로젝트를 생성했습니다.
      이제 프로젝트안에 안드로이드 앱을 생성해보겠습니다.

      FCM 메인 중앙에 주황색 동그란 버튼이 3개 있습니다.
      가운데에 있는 (안드로이드 로고) 버튼을 클릭해주세요.




      버튼을 클릭하셨다면 앱등록 창이 오픈 됩니다.
      안드로이드 패키지 이름 및 앱 닉네임을 입력하세요.

      패키지 이름은 반드시 com.webview.앱영문명 으로 입력하셔야 합니다.
      com.webview. 를 반드시 넣어주셔야 합니다.
      입력 예) com.webview.rebuilder

      앱 닉네임은 사이트명이나 상호명, 앱이름 등을 입력해주시면 됩니다.
      디버그 서명은 입력하지 않아도 됩니다.

      입력을 마치셨다면 [앱등록] 을 클릭해주세요.
      다음페이지로 넘어간다면, 입력하신 패키지명 (com.webview.앱영문명) 을 메모장에 메모해주세요.





      [google-services.json 다운로드] 버튼을 클릭하셔서 파일을 다운받아 주세요.
      다운을 받으셨다면 [다음] 을 클릭해주세요.




      Groovy(build.gradle) 선택하신 후 [다음] 을 클릭해주세요.




      앱 생성이 완료 되었습니다.
      [콘솔로 이동] 을 클릭하시면 메인으로 이동 됩니다.




      1-4. 비공개 키파일 생성하기
      거의 다왔습니다. 조금만 더 힘내세요.
      저도 이거 작성하느라 무쟈게 힘들었습니다. 리빌더화이팅.

      화면 상단에 아까 입력하신 이름으로 앱이 생성된게 보이신다면,
      좌측 상단에 [프로젝트 개요] 메뉴 옆에 톱니바퀴 아이콘을 클릭하여
      [프로젝트 설정] 으로 이동해주세요.




      프로젝트 설정으로 오셨다면 상단 탭메뉴에서 [서비스 계정] 을 클릭하세요.





      화면 아래쪽에 있는 [새 비공개 키 생성] 을 클릭하세요.

      키파일은 버튼 클릭시 자동으로 다운로드 됩니다.
      중요한 파일이므로 파일을 타인에게 공개하거나 해서는 안됩니다.





      친절하게 중요한 파일임을 알려줍니다.
      [키 생성] 을 클릭하면 json 파일이 다운로드 됩니다.




      다운로드된 파일은 rebuilder-demo-a4cc0-firebase-adminsdk-au83h-41e4b5df03.json 과 같은식으로 저장됩니다.
      이름이 너무 긴 관계로 임의파일명으로 변경해주세요.
      가이드에서는 key.json 으로 설명하겠습니다.

      이제 준비는 모두 끝났습니다!
      바탕화면에 1-3에서 다운로드 했던 google-services.json 파일과,
      방금 이름을 변경했던 key.json 파일이 있다면 잘 하셨습니다. (파일아이콘은 무시해주세요. 다를 수 있습니다.)




      2. 리빌더 앱관리 설정하기

      2-1. 파일 업로드하기
      위 단계에서 이름을 변경했던 key.json 파일을 사용하시는 웹서버(웹호스팅)에 FTP 프로그램으로 접속하여 업로드 해주세요.
      업로드 위치는 /data/push/key.json 입니다.

      2-2. 앱관리 설정하기
      관리자모드 > 빌더설정 > 앱관리 메뉴로 이동해주세요.
      [앱관리] 메뉴가 없다면 리빌더 공식홈페이지 > 유료기능 다운로드 에서 [안드로이드 하이브리드 웹앱 + Push 알림] 기능을 다운로드 후 설치해주세요.
      바로가기 > https://rebuilder.co.kr/membership/30

      설치가 되셨다면 관리자모드 > 빌더설정 > 앱관리 메뉴로 이동해주세요.

      스크롤을 내리시면 [FCM 설정] 섹션이 있습니다.
      FCM 패키지명, FCM 프로젝트 ID, FCM 비공개키파일 항목을 모두 입력 하시고
      [확인] 을 클릭해주시면 설정은 마무리 됩니다.




      [FCM 패키지명]
      1-3 에서 설정했던 com.webview.앱영문명 을 입력하시면 됩니다.

      [FCM 프로젝트 ID]
      1-4 에서 이동했던 [프로젝트 설정] 페이지로 이동하시면 내 프로젝트 섹션에서 확인하실 수 있습니다. (스샷참조)

      [FCM 비공개키파일]
      위에서 임의파일명으로 변경했던 파일명 key.json 을 입력하시면 됩니다.




      고생하셨습니다. 모든 설정이 완료 되었습니다.
      1-3 에서 다운로드 했던 google-services.json 파일은
      신청서에 첨부해주셔야 합니다.


      창을 닫아주시고, 신청을 계속해주세요!