부트스트랩 5.3 사용한 메이슨리 스킨 > 그누보드5 스킨

매출이 오르면 내리는 수수료! 지금 수수료센터에서 전자결제(PG)수수료 비교견적 신청해 보세요!

그누보드5 스킨

좋은 댓글과 좋아요는 제작자에게 큰힘이 됩니다.

부트스트랩 5.3 사용한 메이슨리 스킨 정보

게시판 부트스트랩 5.3 사용한 메이슨리 스킨

첨부파일

b5_masonry_ver_0.00001.zip (26.3K) 74회 다운로드 2023-09-11 10:27:29 포인트 차감20
테스트한 버전5.5.8.3.3
호환 가능 버전5.3 이상

본문

1. 리스트 버전  스킨 (https://sir.kr/g5_skin/56973 )
2. 유튜브 및 갤러리 게시판 겸용 스킨 ( https://sir.kr/g5_skin/57019 )
에 이어 
메이슨리 게시판 스킨을 올려 드립니다. 유튜브 및 갤러리 게시판 응용버전입니다. 

부트스트랩 이용 홈페이지 작업하다가 부트스트랩 공부용으로 사용하실 수 있는 분들을 위하여 공유합니다.
기본형태입니다. 
졸작입니다. ^^

추가한 내용은 썸네일 내용에 배경화면 스타일을 넣을 수 있도록 추가 하였습니다. 


샘플보기 : http://liveshowhost.net/bbs/board.php?bo_table=masonry_basic_003

 

1954485033_1694395511.8354.jpg

 

 

스타일 입력

 

1954485033_1694395567.351.jpg

 

 

※ 참고사항

Bootstrap and Masonry 참고 사이트
https://getbootstrap.kr/docs/5.3/examples/masonry/


스타일을 바꾸시고 싶은 분 또는 삭제를 원하시는 분은 
https://getbootstrap.kr/docs/5.3/components/card/#%EC%B9%B4%EB%93%9C-%EC%8A%A4%ED%83%80%EC%9D%BC
참고하시어 수정하시면 됩니다. 

write.skin.php 
163번째 줄

<div class="mb-3 row">
    <label for="wr_2" class="col-sm-2 form-label">배경 스타일</label>
    <div class="col-sm-10">
        <input type="radio" class="btn-check" name="wr_2" autocomplete="off" id="wr_2_1"<?php if($wr_2 == ""){ ?> checked<?php } ?>>
        <label class="btn btn-outline-secondary" for="wr_2_1">기본</label>
        <input type="radio" class="btn-check" value="text-bg-primary" name="wr_2" autocomplete="off" id="wr_2_2"<?php if($wr_2 == "text-bg-primary"){ ?> checked<?php } ?>>
        <label class="btn btn-primary" for="wr_2_2">Primary</label>
        <input type="radio" class="btn-check" value="text-bg-secondary" name="wr_2" autocomplete="off" id="wr_2_3"<?php if($wr_2 == "text-bg-secondary"){ ?> checked<?php } ?>>
        <label class="btn btn-secondary" for="wr_2_3">Secondary</label>
        <input type="radio" class="btn-check" value="text-bg-success" name="wr_2" autocomplete="off" id="wr_2_4"<?php if($wr_2 == "text-bg-success"){ ?> checked<?php } ?>>
        <label class="btn btn-success" for="wr_2_4">Success</label>
        <input type="radio" class="btn-check" value="text-bg-danger" name="wr_2" autocomplete="off" id="wr_2_5"<?php if($wr_2 == "text-bg-danger"){ ?> checked<?php } ?>>
        <label class="btn btn-danger" for="wr_2_5">Danger</label>
        <input type="radio" class="btn-check" value="text-bg-warning" name="wr_2" autocomplete="off" id="wr_2_6"<?php if($wr_2 == "text-bg-warning"){ ?> checked<?php } ?>>
        <label class="btn btn-warning" for="wr_2_6">Warning</label>
        <input type="radio" class="btn-check" value="text-bg-info" name="wr_2" autocomplete="off" id="wr_2_7"<?php if($wr_2 == "text-bg-info"){ ?> checked<?php } ?>>
        <label class="btn btn-info" for="wr_2_7">Info</label>
        <input type="radio" class="btn-check" value="text-bg-light" name="wr_2" autocomplete="off" id="wr_2_8"<?php if($wr_2 == "text-bg-light"){ ?> checked<?php } ?>>
        <label class="btn btn-light" for="wr_2_8">Light</label>
        <input type="radio" class="btn-check" value="text-bg-dark" name="wr_2" autocomplete="off" id="wr_2_9"<?php if($wr_2 == "text-bg-dark"){ ?> checked<?php } ?>>
        <label class="btn btn-dark" for="wr_2_9">Dark</label>
    </div>
</div>          
        

list.skin.php 14번째 줄,  143번째 줄을 각각 바꾸시면 됩니다. 
14번째을 넣은 이유는 style별로 기본 링크 글자 색이 검정색일 경우, 바탕색 때문에 글자 색이 안나오는 것을 방지 합니다. 

//스타일클래스 정의
$b_bg_white_style_class = array("text-bg-primary","text-bg-secondary","text-bg-success","text-bg-danger","text-bg-dark");  //글자색 흰색으로 나옴
$b_bg_black_style_class = array("text-bg-warning","text-bg-info","text-bg-light");  //글자색 검정색으로 나옴


143줄 은 각 클래스별로 구분

if($list[$i]['wr_2']){
    $board_style = ' '.$list[$i]['wr_2'];
    if(in_array( $list[$i]['wr_2']  , $b_bg_white_style_class)){ 
        $board_font_style ="class=\"mj-style-color-w\"";
    }elseif(in_array( $list[$i]['wr_2']  , $b_bg_black_style_class)){  
        $board_font_style ="class=\"mj-style-color-b\"";
    }else{
        $board_font_style ="class=\"mj-style-color-b\"";
    }            
}else{
    $board_style ="";
    $board_font_style ="class=\"mj-style-color-b\"";
} //스타일 end

 

 

 

추천
7

댓글 전체

전체 5 |RSS
그누보드5 스킨 내용 검색 게시판에서
  • 게시물이 없습니다.

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT