개발노예 코드와 일상

그누보드 게시판 유튜브 연결하기

동영상 업로드 게시판을 만드는데 유튜브링크를 올려서

링크의 동영상을 게시해달란 요청이있었다

작업내용은 크게 힘든편은 아니었는데

브라우저나 버전에 따라서 약간 귀찮은 부분이 있었다

그누보드 게시판을 기준으로 진행

1. -- 등록

그누보드 기본 링크 입력칸에 유튜브 주소를 입력한다.

www.youtube.com/watch?v=tz0xtif_ODM <-- 이런식으로 형식은 맞아야되는듯

2. 리스트 표출

제일 중점인 부분이다 .php와 javascript 둘다필요하다

$youtube = preg_replace('/^.((youtu.be/)|(v/)|(/u/\w/)|(embed/)|(watch?))??v?=?([^#&?]).*/', '$7', $video_op['wr_link1']);

php로 주소를 적당히 변환시켜준다 오류방지로

div id="player" style="width:100%; height:400px; " iframe width='100%' height='400px' src='https://youtube.com/embed/?rel=0&playsinline=1&autoplay=0' allow='accelerometer; gyroscope; picture-in-picture; encrypted-media' allowfullscreen style='position: absolute;'> /div

아이프레임이 틀어져버려서 앞뒤나 슬래쉬를 제거했다.... 쓰실때 div 잘 체크하시길

그후 아이프레임으로 출력

게시판이외에 따로 페이지생성시에

체크박스를 체크하는기능을 사용하고있었는데

이제 리스트 하단부에 선택수정과 삭제등등 옵션을추가하면서

내가 몇개를 체크했는지와 하단에서도 전체체크를 추가하면서 약간 스크립트를 추가했다

별건아닌데 체크한 숫자가 눈에보이니까 좀 편한거같기도하고 쓸데없는거같기도하고

$('[name="chk[]"]').on('click',function(){ var $this = $(this), $number = $(".number").val(); var tmp; if($this.is(':checked')){ $tmp = parseInt($number)+1; }else{ $tmp = parseInt($number)-1; if(tmp<0){ $tmp = 0; } } $('.number').val($tmp); }) // 모두선택 $('#chkall').on('click', function() { var $this = $(this), $that = $this.closest('table').find('tr[data-bunch]'), check = $('[name="db_id[]"]:enabled'); check.prop('checked', $this.is(':checked') ? true : false); if ($this.is(':checked')) { $that.addClass('checked'); //선택된갯수추가 $(".number").val($that.length); } else { $that.removeClass('checked'); $('[data-proto]').val(function() { return $(this).data('proto') }); //선택된갯수추가 $(".number").val('0'); } });

엥 스크립트가 한줄로들어가보리네

html 관련은 뭐 input 쪽 네임정도와 클래스만 보고 따로 추가하면 될거같다

그누보드 게시판 첨부파일을

메인이나 리스트에서 바로 다운로드하게 하고싶어서 링크를 바로연결햇을시

잘못된접근이라고 에러메세지가 출력된다

첨부파일다운시 세션을 구워서 그 세션값 체크를 하는것으로보여서

메인에서 게시물을 불러올때 세션도 구워줘야겠다

불러오는 for문 안에다가

$ss_name = "ss_view_{$bo_table}_{$list[ $i]['wr_id']}";

if (!get_session($ss_name)); set_session($ss_name, TRUE);

코드 추가!

그누보드 관련사항

그누보드로 만들어진 홈페이지에서 일대일게시판을 만들어달라는 내용이있다

관리자와 작성자만 볼수있는게시판이라는건데

기본적으로 게시판은 bbs 와 theme 두개의 폴더로 구성되어있다

모든게시판을 변경하거나 영향을 주기 싫으니 bbs 보단 theme에서 수정해야겠다

일단 테마 board로 들어가서 해당 스킨폴더에 list.php 파일을 추가한다

그리고 bbs/list.php 를 모두 복사해서 추가한 list.php 에 붙여넣기

그다음에 스킨폴더 list.skin.php 로 들어가서

php 상단부분에

include_once($board_skin_path.'/list.php');

로 추가한 파일을 불러와준다

그리고 include_once 윗부분에

변수를 추가해준다

예를들어서 $sql_search2 = " and mb_id = '{$member['mb_id']}' ";

이렇게 추가하고

스킨폴더에서 처음 추가해줬던 list.php로 들어가서

쿼리부분에다가 추가한 변수를 넣어주면 끝!

lib/thumbnail.lib.php 파일 $is_crop=false 를 true로 하면 여백안생김.

// 게시글리스트 썸네일 생성
function get_list_thumbnail($bo_table, $wr_id, $thumb_width, $thumb_height, $is_create=false, $is_crop=false, $crop_mode='center', $is_sharpen=false, $um_value='80/0.5/3')
{

$is_crop=true 로 변경하면 여백안생김
수정 캐시지우는건

관리자페이지 > 환경설정 > 썸네일파일 일괄삭제 (//주석처리되있을수도)

함수자체 변경이아니라 사용할때만 변경하려면

$thumb = get_list_thumbnail($board['bo_table'], $list[$i]['wr_id'], $board['bo_gallery_width'], $board['bo_gallery_height'], false, true);

여기서  false를 true로 변경해주면 됨

그누보드 소셜로그인 적용후 며칠후에 모바일에서 안된다는 연락왔다

뭐지 테스트할때 다 확인했는데..?

이럴때 정말 로그를 싹다 뒤져볼수도없고 답답하다

아무튼 

무슨일인가 하고 확인해봤더니

모바일에서 팝업이라던가 페이지가 로그인창으로 안넘어간다

url이나 www 나 다 추가해줫는데 이상하군

그래서 함수쪽으로 들어가봣더니

모바일에서 팝업안뜨게 false 처리가 되어있네? 뭐지

누가그런건지 원래이런건지

테스트할때는 뭐였지 혼란스럽다

함수 경로는 

public_html/extend/social_login.extend.php 33번째쯤?

//소셜 로그인 팝업을 사용하면 true
//define('G5_SOCIAL_USE_POPUP', ! is_mobile() );  // 모바일에서는 팝업사용 안함
define('G5_SOCIAL_USE_POPUP', true);        //팝업을 사용하지 않을 경우

true로 바꿔주니 완료.

초반 그누보드 소셜로그인 설정은

https://kylsr.tistory.com/24

인원수가증가하거나
입력값이 불특정하게 증감할수있을시
추가삭제버튼으로 배열로 넘기기도한다
상당히 귀찮은 작업이고 db도 배열로 넣고해야되서 귀찮..

일단은 javascript 로 클론처리해서 넣는데
가끔 클릭작동이나 배열안넘어갈때 동적 컨텐츠? 그 체크도 해주고 삭제할때도 인덱스 체크도해주고..
여튼 스크립트는 이런식이다

parent로 상위 골라서 마지막 부분에추가. 삭제버튼활성화
맨처음은 삭제버튼 비활성화

추가버튼은 맨첫번째에만 넣어뒀다 아래로 차곡차곡 추가되는방식

// 항목추가 버튼 클릭시
$(".add_btn").click(function(){
var clickedRow = $(this).parent();
var cls = clickedRow.attr("class");

// tr 복사해서 마지막에 추가
var newrow = clickedRow.clone();
newrow.find("li:eq(0)").remove();
newrow.find('input').val('');
newrow.find('.del_btn').removeClass('d-none');
newrow.find('.add_btn').addClass('d-none');
newrow.insertAfter($(".ap_con ."+cls+":last"));

});

// 삭제버튼 클릭시
$(document).on('click','.del_btn',function(){

var clickedRow = $(this).parent();
var cls = clickedRow.attr("class");

// 각 항목의 첫번째 row를 삭제한 경우 다음 row에 td 하나를 추가해 준다.
if( clickedRow.find("li:eq(0)").attr("rowspan") ){
    return false;
}

clickedRow.remove();

resizeRowspan(cls);

});

기본적인 홈페이지 콘텐츠중

메뉴 버튼 누를시 관련된 내용이 같은장소에서 내용만바뀌게 하는 것들이 종종있다.

다양한방법이있겠지만

내가 가장 자주쓰는 방법을 적어논다.

<ul>
  <li class="sw_li on" data-type="0"><a href="#" class="color_gray font_16" onclick="return false;">1</a></li>
  <li class="sw_li" data-type="1"><a href="#" class="color_gray font_16" onclick="return false;">2</a></li>
  <li class="sw_li" data-type="2"><a href="#" class="color_gray font_16" onclick="return false;">3</a></li>
  <li class="sw_li last" data-type="3"><a href="#" class="color_gray font_16" onclick="return false;">4</a></li>
</ul>

        <?php
        for($t=0;$t<4;$t++){
        ?>
        <div class="sw_con sw_con_<?php echo $t?>">
            <?php echo $t?>
        </div>    
        <?
        }
        ?>

  $(".sw_li").click(function(){
    $('.sw_li').removeClass('on');
    $(this).addClass('on');
    $(".sw_con").hide();
    var type =$(this).data('type');
    $(".sw_con_"+type).fadeIn();
    return false;
});

탭있고 ~ 컨텐츠부분은 for문 돌려서 내용 넣어줄꺼고 
스크립트는 type 속성으로 열고닫고~