모던 갤러리 스킨 색상 반전 등 문의

안녕하세요~ 항상 친절하신 답변 감사드려요~

https://xion.kr/?page_id=294 페이지 보시면 모던 갤러리 스킨 적용했는데 여기도 색상 반전시키려고 하는데 색상 반전 코드 어떻게 하면 될까요? 그리고, 작성자 아이콘이 굉장히 크게 나오는데 이 부분 어떻게 손보면 될지 도움부탁드립니다.

감사합니다...

좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
  • 안녕하세요~^^

    커뮤니티를 통해 모든 코드를 만들어 드리는 것은 현실적으로 어렵습니다.

    다만 코드 수정 시 막히시는 부분을 간단하게 도움을 드릴 수 있습니다.

    HTML과 CSS 코드에 대해서 알면 레이아웃을 편집하는데 도움이 됩니다.

    또, 어느 부분의 색상을 바꾸시려는지 알려주시면 저희가 좀 더 수월하게 답변을 드릴 수 있습니다.

     

    모던 갤러리 게시글 목록 페이지에서 아이콘 사이즈를 줄이시려면

    워드프레스 관리자 -> 외모(테마 디자인) -> 사용자 정의하기 -> CSS 입력 필드에

    아래의 코드를 추가해보시겠어요?

    #kboard-modern-gallery-list .kboard-list .kboard-list-item .kboard-item-description .kboard-item-avatar img { width: 20px; height: 20px; }

    위의 코드에서 너비과 높이 값은 적절히 수정해주세요.

     

    불러오는 실제 이미지의 크기도 줄이시려면

    FTP로 접속해서 /wp-content/plugins/kboard/skin/사용중인스킨/list.php 파일에

    아래의 코드를 찾아서

    <?php echo get_avatar($content->member_uid, 45, '', $content->member_display);?>

    아래의 코드처럼 교체해보시겠어요?

    <?php echo get_avatar($content->member_uid, 20, '', $content->member_display);?>

    위의 코드에서 숫자 부분은 가로 세로 크기입니다.

    적절히 수정해보세요.

    고맙습니다.

  • 네 감사합니다. 다른 스킨과 비교해가면서 색상 반전작업 하고 있습니다. 그런데

    알려주신대로 모던갤러리 list..php 에서 아바타 크기 45->20 으로 수정했는데 크롬에서는 적용이 되는데

    익스플로러에서는 https://xion.kr/?page_id=294 보시면 적용이 안되고 있습니다.

    처음 알려주신 사용자정의하기 CSS 코드 삽입도 해봤는데 적용이 안되구요.

    그리고... https://xion.kr/?page_id=294&uid=80&mod=document&pageid=1 페이지 보시면 왠만한건 다 색상 반전시켰는데

    목록보기, 이전, 다음, 글수정, 글삭제, 글쓰기 버튼은 연두색 에서 색상 변경이 안되고 있습니다.

    .kboard-modern-gallery-button-small, .kboard-modern-gallery-button-small:link, .kboard-modern-gallery-button-small:visited { background: transparent !important; }

    이렇게 했는데 적용이 안되서요... 도움부탁드립니다.

    아 마지막으로 싫어요, 인쇄하기 안보이는 코드도 도움부탁드립니다.. 다른 스킨하고 좀 다른것 같아서요..^^;

  • 안녕하세요.

    현재 크롬 브라우저에서도 아바타 크기가 45px로 표시되고 있습니다.

    코드 수정이 정상적으로 적용됐는지 다시 확인해보시겠어요?

    또, 버튼 색상을 바꾸는 코드는 코드 상 문제는 없어 보입니다.

    사용자 정의하기 쪽에 해당 코드가 있는지 확인해보시겠어요?

     

    모던 갤러리 스킨에서 싫어요 버튼과 인쇄 버튼을 안 보이게 하시려면

    워드프레스 관리자 -> 외모(테마 디자인) -> 사용자 정의하기 -> CSS 입력 필드에

    아래의 코드를 추가해보세요.

    #kboard-modern-gallery-document .kboard-document-action .left button:nth-child(2) { display: none; }
    #kboard-modern-gallery-document .kboard-document-action .right { display: none; }

    고맙습니다.

  • 	<?php if($content->member_uid):?>
    						<span title="<?php echo apply_filters('kboard_user_display', $content->member_display, $content->member_uid, $content->member_display, 'kboard', $boardBuilder)?>"><?php echo get_avatar($content->member_uid, 20, '', $content->member_display);?></span>
    					<?php else:?>

    모던갤러리 스킨 안에 list.php 파일 위와 같이 수정했고, 사용자정의하기 CSS 에도 알려주신 코드 입력했는데 익스플로러는 그대로인것 같습니다. 크롬은 바뀌었어요.^^;;;

     

  • 그리고, 아바타 표시가 원모양인데 원모양을 사각형이 둘러싸고 있어서 사각형부분 숨기려고

    #kboard-modern-gallery-list .kboard-list img { background-color: transparent;}

    가 적용이 안되는데 어떻게 해야 될까요?

    모던갤러리 style.css 보니까 버튼 색상이 important 걸려있어서 사용자정의추가CSS에 적용이 안되는것 같아서 바로 style.css를 아래와같이 수정했습니다. 그랬더니

    .kboard-modern-gallery-button-small,
    .kboard-modern-gallery-button-small:link,
    .kboard-modern-gallery-button-small:visited { position: relative; display: inline-block; *display: inline; zoom: 1; margin: 0 !important; padding: 0 10px !important; height: 28px; line-height: 28px; font-size: 12px !important; font-weight: normal; color: #999999 !important; background-image: none !important; background-color: transparent !important; border: 1px solid #f1f1f1; border-radius: 0 !important; text-decoration: none; cursor: pointer; vertical-align: middle; text-shadow: none !important; }

    https://xion.kr/?page_id=294&uid=80&mod=document&pageid=1 가셔서 글수정, 글삭제나 글쓰기 버튼에 마우스 대보시면 버튼이 위로 움직이는 동작이 생겼는데 어디가 잘못된걸까요?

  • 안녕하세요.

    아바타 표시를 원모양으로 표시하시려면

    아래의 CSS 코드를 추가해보시겠어요?

    #kboard-modern-gallery-list .kboard-list .kboard-list-item .kboard-item-description .kboard-item-avatar img { border-radius: 50%; }

     

    게시판 버튼에 마우스를 올렸을 때 움직이는 것처럼 보이는 이유는

    마우스를 올리기 전에는 테두리가 있지만

    마우스를 올렸을 땐 테두리를 적용하지 않아서 생기는 문제입니다.

    아래의 CSS 코드도 추가해보시겠어요?

    .kboard-modern-gallery-button-small { border: 1px solid #f1f1f1; }

    고맙습니다.

  • 감사합니다~ 아바타 크기, 사이즈, 원모양 모두 적용했는데 크롬에서는 정상작동하는데 PC 익스플로러하고 모바일에서는

    https://imgur.com/a/ZWlbn9T  처럼 보이는데 어떻게 해결하면 좋을까요? 

  • 스킨 파일을 수정하신 건지요?

    코드가 변경되면서 CSS 코드가 적용되지 않고 있는 듯합니다.

    기존 모던 갤러리 스킨은 아바타를 클릭하면 게시글 본문 페이지로 이동하도록 되어있습니다.

    수정하신 코드를 확인해보시겠어요?

    고맙습니다.

  • 버튼색상 때문에 style.css 수정했던 부분 원상복구했습니다.

    list.php 만 아래 3월  8일에 알려주신 코드로 수정되어있구요..

    	<?php if($content->member_uid):?>
    						<span title="<?php echo apply_filters('kboard_user_display', $content->member_display, $content->member_uid, $content->member_display, 'kboard', $boardBuilder)?>"><?php echo get_avatar($content->member_uid, 20, '', $content->member_display);?></span>
    					<?php else:?>

     

  • 모던 갤러리 스킨 list.php 파일에서

    별도로 코드를 수정하지 않으셨다면

    아래의 코드가 실제 아바타를 표시하고 아바타 클릭 시 게시글 본문 페이지로 이동하는 코드입니다.

    <a href="<?php echo $url->getDocumentURLWithUID($content->uid)?>" class="kboard-item-avatar">
    	<?php if($content->member_uid):?>
    		<span title="<?php echo apply_filters('kboard_user_display', $content->member_display, $content->member_uid, $content->member_display, 'kboard', $boardBuilder)?>"><?php echo get_avatar($content->member_uid, 45, '', $content->member_display);?></span>
    	<?php else:?>
    		<span title="<?php echo apply_filters('kboard_user_display', $content->member_display, $content->member_uid, $content->member_display, 'kboard', $boardBuilder)?>"><img src="<?php echo $skin_path?>/images/default-avatar.png" alt="<?php echo apply_filters('kboard_user_display', $content->member_display, $content->member_uid, $content->member_display, 'kboard', $boardBuilder)?>"></span>
    	<?php endif?>
    	<img src="<?php echo $skin_path?>/images/avatar-mask.png" alt="" class="kboard-item-avatar-mask">
    </a>

     

    올려주신 페이지에서 확인해보면

    아바타 이미지 쪽에는 링크가 걸려있지 않습니다.

    HTML 코드가 제대로 열고 닫혔는지 점검해보셔야 할 듯합니다.

    고맙습니다.

워드프레스 에러 기술지원 서비스 전문가에게 맡기세요