Skip to content

우리끼리 가치할래?우리끼리 가치할래?

라이믹스기록
2022.07.25 13:14

스케치북 게시판 get_sign 속성 수정

조회 수 83 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 게시글 수정 내역 댓글로 가기 인쇄 첨부
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 게시글 수정 내역 댓글로 가기 인쇄 첨부
Extra Form
참고링크 https://xetown.com/questions/1277599

사용중인 라이믹스 fix 된 스케치북 게시판의 회원 프로필 서명을 불러오는 get_sing 에 관련된 속성을 조금 손을 보았다.

해당 구역은 본문 내용의  하단에 위치하여  해당 글을 작성한 회원의 프로필 서명이 표시되는 곳이다.

 

*지금은 이 부분을 수정 하여 이런 식으로  박스 안에 인용된 서식이 구현된다.

 

get_sign.jpg

 

이 요소를 수정하기 전에 문제가 해당 글을 작성 하는 회원의 프로필 이미지 가 회원 가입시 입력된 정보가 없을땐 이 부분이 비활성화 되어서 출력되지 않으며 또한 서식으로 지금은 구현된 문구가 없어서 뭔가 공간의 비 효율성? 이런게 보여졌다.

 

혹시 이 부분에 대한 구현을 어떤식으로 할까 궁리해 보고 일단 구글링을 해보니 xe 타운에서 리플 내용중 팁이있어서 적용시켜 봤다.

 

1. 해당 스킨의 _read.html 수정 

 

루트 /modules/board/skins/costom_rhymix-sketchbook-master/_read.html

 

_read.html 223 line ~ 

 

*원본 코드 : 

 

1
2
3
4
5
6
7
<!--// Sign -->
        <div cond="$mi->display_sign!='N' && ($oDocument->getProfileImage() || $oDocument->getSignature())" class="rd_sign clear">
            <h4><em class="fa fa-info-circle bd_info_icon"></em> Who's <em>{$oDocument->getNickName()}</em></h4>
            <img cond="$oDocument->getProfileImage()" class="img fl" src="{$oDocument->getProfileImage()}" alt="profile" />
            <span cond="!$oDocument->getProfileImage()" class="img fl profile no_img">?</span>
            <div cond="$oDocument->getSignature()" class="get_sign">{$oDocument->getSignature()}</div>
        </div>
cs

 

*수정 코드 :

 

1
2
3
4
5
6
7
8
9
10
<!--// Sign //회원 프로필  서명란 커스텀 -->
        <div cond="$mi->display_sign!='N'" class="rd_sign clear">
            <h4><em class="fa fa-info-circle bd_info_icon"></em> Who's <em>{$oDocument->getNickName()}</em></h4>
            <img cond="$oDocument->getProfileImage()" class="img fl" src="{$oDocument->getProfileImage()}" alt="profile" />
            <!--//추가코드 -->
            <span cond="!$oDocument->getProfileImage()" class="img fl profile no_img">?</span>
            <div cond="empty($oDocument->getSignature())" class="get_sign"><p>God has given us two hand s, one to receive With And the other to give With<br>신은 한손으로 받고 한손으론 주라고 두손을 주었다.
            <br>Give and Take - <b>마주잡은 우리끼리 , 커뮤니티 가치할래?</b></p></div>
            <div cond="$oDocument->getSignature()" class="get_sign">{$oDocument->getSignature()}</div>
        </div>
cs

 

해당 스킨의 _read.html의 해당 부분 요서에 위와같이 코드를 변경하여 준다 즉 프로필 서명이 등록되질 않은 회원일 경우 비활성화가 아닌 미리 준비된 ? 특성의 표시되고 프로필이 등록된 회원일 경우는 프로필 이미지를 불러오게 된 코드 구문으로 변경된 것이다.

 

그리고 빈 공간의 활용을 위해서 사이트의 성격을 나타내는 문구를 그 안에 작성해 구현한 것이다.

 

이후 한가지 추가할 작업은 해당 css 폴더 안에 black.css 안의 코드를 약간 추가할 것이다.코드의 용도는 저 부분이 원래 해당 스킨의 board.css 의 get_sign 의 속성에 영향으로 color :#888 텍스트 속성으로 우리 사이트 처럼 어두운 배경을 사용하는 화면에서는 가독성이 안좋아 보인다 이 부분의 텍스트 컬러를 밝게 변경하기 위해서 즉 어두운 배경을 사용할 경우는 해당 텍스트 속성이 밝은 컬러로 따로 퍼블리싱 되게끔 black.css 에 이 요소를 추가해 줄것이다.

 

*black.css 추가 코드 내용 

 

183
184
185
186
187
188
189
190
191
192
193
194
195
/* Link Board */
.bd .starRating,.bd .starRating span{background-image:url(../img/black/iconStarRating.png)}
 
/* Viewer */
#viewer .bd{background:#191919;border:1px solid #333}
 
/*sing 컬러 속성 추가 */
.rd_sign,.get_sign p{color:#ddd}
 
/* Mobile Editor */
.bd #mUpload{border-color:#444;background:#191919}
.bd #mUpload .bg_f_f9{border-color:#444;box-shadow:none}
.btn-toolbar .btn,#editor{color:#333}
cs

 

위 처럼 

/*sing 컬러 속성 추가 */
.rd_sign,.get_sign p{color:#ddd}

를  추가해 주어 어두운 배경 에서 사용시는 #ddd 의 밝은 회색 텍스트 컬러를 적용하여 어두운 배경 사용시의 가독성을 높여 주었다.

 

어두운 배경_get_sign.jpg

어두운 배경을 사용시는 추가된 밝은 텍스트 속성이 사용되며 

밝은 배경 사용시 검은 컬러의 텍스트 속성을 같이 사용할수있다

 

밝은 배경의 get_sign.jpg

 

비교적  간단한 코드 구성을 추가하여 공간의 활용성과 회원 프로필 서명란의 공백에 변화를 주는 내용을 구성한 부분에 대한 기록을 남긴다.

 


Who's 김실장

profile

God has given us two hand s, one to receive With And the other to give With
신은 한 손으로 받고 한 손으론 주라고 두 손을 주었다.
Give and Take - 마주 잡은 우리끼리, 커뮤니티 같이할래?


사이트 관리

사이트관리내역

List of Articles
번호 분류 제목 글쓴이 날짜 조회 수
49 수정기록 소셜 로그인 카카오톡 수정기록 1 김실장 2022.06.18 42
48 수정기록 검은 바탕의 폰트컬러 변경 file 김실장 2022.06.18 23
47 수정기록 xe소셜로그인 오브잭트 충돌 해결 file 김실장 2022.06.18 37
46 수정기록 사용중인 스케치북5 레이아웃 위젯 설정 김실장 2022.06.18 33
45 수정기록 소셜 로그인 창 백그라운드 컬러 변경-1 1 file 김실장 2022.06.19 53
44 수정기록 소셜 로그인 창 백그라운드 컬러 변경-2 3 file 김실장 2022.06.19 56
43 수정기록 오류메세지 백그라운드 or 퐅크컬러석성 변경 file 김실장 2022.06.20 40
42 수정기록 인증메일 재발송 메세지 창 푸시 버튼 텍스트 변경 file 김실장 2022.06.20 40
41 수정기록 costom파일 생성 김실장 2022.06.20 32
40 수정기록 모바일 기본로그인 창 사이즈 변경 - 모바일 전체메뉴 보기 컬러 변경 file 김실장 2022.06.20 49
39 수정기록 인증메일 재전송 창 수정 3 file 김실장 2022.06.21 61
38 수정기록 댓글 쓰기창 문구 수정 김실장 2022.06.21 54
37 수정기록 변칙 모바일 레이아웃 해상도 수정 적용 file 김실장 2022.06.21 53
36 수정기록 UTF-8 인코딩의 BOM (Byte Order Mark) 문제로 레이아웃 깨짐 file 김실장 2022.06.22 43
35 수정기록 스케치북 5 게시판 카카오톡 공유 사용설정 김실장 2022.06.22 66
34 수정기록 스케치북 5 게시판의 위저드기능 사용안함 설정 file 김실장 2022.06.22 59
33 수정기록 소셜 XE 구글 fix 버전 설치 후 수정 목록 1 file 김실장 2022.06.23 70
32 수정기록 게시판 스킨 쓰기 설정 변경 김실장 2022.06.24 58
31 수정기록 사이트 레이아웃 기본 로그인창 소셜 로그인 기능 수정 계흭 기록 file 김실장 2022.06.24 63
30 수정기록 사이트 레이아웃 기본 로그인창 소셜 로그인 기능 수정 기록 file 김실장 2022.06.24 74
29 수정기록 내정보 탭의 로그인 기록창과 sns 관리 창 변경 file 김실장 2022.06.24 58
28 수정기록 페이스북 소셜 로그인 앱 오류수정 1 file 김실장 2022.06.24 64
27 수정기록 회원 정보 탭 수정 (sns관리탭, 회원 정보탭) file 김실장 2022.06.25 66
26 수정기록 클라우드 태그위젯 폰트 색상코드 변경 file 김실장 2022.06.25 64
25 수정기록 최신글 위젯 모바일 사용성 편집 file 김실장 2022.06.26 65
24 수정기록 위젯 페딩값 수정과 이미지 파일 수정 file 김실장 2022.06.26 64
23 수정기록 웹콘 소프트의 슬라이드 갤러리 Carousel 위젯 수정 file 김실장 2022.06.26 68
22 수정기록 니코(nico) 위젯 스타일 모바일형으로수정 file 김실장 2022.06.27 70
21 수정기록 스케치북5 레이아웃 카테고리 위젯문제 해결 file 김실장 2022.06.27 73
20 설정기록 스케치북 게시판 웹진형 설정 file 김실장 2022.06.27 91
19 라이믹스기록 스케치북5 레이아웃 사용못하는 사이드 위젯들을 커스텀하자 file 김실장 2022.06.28 138
18 수정기록 카카오 공유 링크 만들기 위한 말풍선 아이콘.png file 김실장 2022.06.28 93
17 수정기록 pc와 mobile위젯 편집 (카카오 공유링크) 1 file 김실장 2022.06.30 76
16 수정기록 스케치북5 게시판 sns 공유버턴 트윗터 오류 file 김실장 2022.07.01 81
15 수정기록 사이드바 / 최신글 /최신댓글 /태그 리스트 수정 1 file 김실장 2022.07.02 90
14 수정기록 스케치북 5 게시판 (제목 컬러설정)오류 1 file 김실장 2022.07.04 92
13 수정기록 카카오톡 sns 공유 이미지 불러오기 오류 file 김실장 2022.07.04 76
12 수정기록 블로그 상단 메뉴 바 컬러 변경 file 김실장 2022.07.07 71
11 라이믹스기록 XE 에서 rhymix 로 업그레이들 하였다. 5 file 김실장 2022.07.10 176
10 라이믹스기록 라이믹스 업그레이드 후 소셜xe 로그인 오류 1 김실장 2022.07.11 189
Board Pagination Prev 1 2 Next
/ 2

Recent Articles

Recent Comment

sketchbook5, 스케치북5

sketchbook5, 스케치북5