KBoard 오션 갤러리 스킨을 구매했는데

KBoard 오션 갤러리 스킨을 메인에 최신글 모아보기 적용하였는데

노출을 4개씩 3줄로 가능한가요?

그리고 노출을 했을때 가로가 1200px에 맞게 가능할까요?

좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
워드프레스 에러 기술지원 서비스 전문가에게 맡기세요
  • 안녕하세요~^^

    KBoard 오션 갤러리 스킨 최신글을

    한 줄에 4개씩 표시되게 하시려면

    워드프레스 관리자 -> 외모 -> 사용자 정의하기 -> CSS 입력 필드에

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

    #kboard-ocean-gallery-latest .kboard-ocean-gallery-latest-item { padding: 0 1% 1% 0; width: 24%; }
    #kboard-ocean-gallery-latest .kboard-ocean-gallery-latest-thumbnail { width: 100%; height: 100px; }
    #kboard-ocean-gallery-latest .kboard-ocean-gallery-latest-title { width: 100%; }

    위의 코드에서 height 쪽의 픽셀은 적절히 수정해보세요.

     

    가로 너비를 최대 1200px로 설정하시려면

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

    #kboard-ocean-gallery-latest { max-width: 1200px; }

     

    위의 코드 적용 후 이미지가 흐릿하게 표시된다면

    실제 불러오는 이미지 사이즈를 늘려보시겠어요?

     

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

    아래의 코드를 찾아서

    숫자 부분을 적절히 조절해보세요.

    $content->getThumbnail(109, 64)

    109 부분은 너비이며 64 부분은 높이입니다.

    고맙습니다.

  • 최신글이나 최신글 모아보기 쪽이라면

    아래의 코드를 활용해보세요.

    @media screen and (max-width: 600px) {
    	#kboard-ocean-gallery-latest .kboard-ocean-gallery-latest-item { padding: 0 1% 1% 0; width: 49%; }
    	#kboard-ocean-gallery-latest .kboard-ocean-gallery-latest-thumbnail { width: 100%; height: 100px; }
    	#kboard-ocean-gallery-latest .kboard-ocean-gallery-latest-thumbnail .kboard-no-image { width: 49%; height: 100px; }
    	#kboard-ocean-gallery-latest .kboard-ocean-gallery-latest-title { width: 100%; }
    }

    위의 코드에서 height 속성의 픽셀 크기는 적절히 조절해보세요.

    고맙습니다.

  • 그렇다면 pc랑 다르게 모바일은 2개씩 8줄로 가능할까요?

     

  • 안녕하세요.

    KBoard 오션 갤러리 스킨 모바일 게시글 목록 페이지에서

    게시글을 한 줄에 2개씩 표시되게 하시려면

    워드프레스 관리자 -> 외모 -> 사용자 정의하기 -> CSS 입력 필드에

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

    @media screen and (max-width: 600px) {
    	#kboard-ocean-gallery-list .kboard-list .kboard-gallery-item { width: 140px; }
    	#kboard-ocean-gallery-list .kboard-list .kboard-no-image { height: 105px; line-height: 105px; }
    	#kboard-ocean-gallery-list .kboard-list .kboard-gallery-thumbnail { width: 150px; }
    	#kboard-ocean-gallery-list .kboard-list .kboard-gallery-thumbnail img { width: 150px; height: 105px; }
    }

    위의 코드에서 픽셀 크기는 적절히 조절해보세요.

    고맙습니다.

  • 제가 말씀 드린건 모바일 메인의 최신글 모아보기였습니다 ^^

    https://imgur.com/6bLyyyw

  • 감사합니다! 잘 해결되었습니다

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