최근게시글 가로 정렬 문의드립니다.

안녕하세요. 문의가 있습니다.

최근게시글을 적용하면 세로 형태로 나열되어 보여집니다.
예) 이미지 / 제 목
      이미지 / 제 목
      이미지 / 제 목

가로 형태로 나열되어 보여질 수 있을까요?
예) 이미지   이미지   이미지
       제 목     제 목     제 목

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

    어떤 게시판 스킨을 사용 중인지 알려주시면 CSS 코드로 수정이 가능할지 연구해보겠습니다.

    KBoard 플러그인에서 최신글 레이아웃을 원하시는 대로 수정하시려면

    FTP로 접속해서 /wp-content/plugins/kboard/skin/사용중인스킨/latest.php 파일을 수정해보시겠어요?

     

    최신글 레이아웃을 원하시는 대로 수정하실 때

    HTML과 CSS 코드에 대해 어느 정도 알면 도움이 됩니다.

    고맙습니다.

  • 빠른 답변 감사합니다. 

    오늘 구매한 KBoard 원더풀 제품소개 스킨입니다. ^^
    예시 이미지처럼 가로로 나열이 가능할까요?


     

  • 안녕하세요.

    KBoard 원더풀 제품소개 스킨의 최신글 레이아웃을

    올려주신 이미지처럼 적용하시려면

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

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

    #kboard-wonderful-product-latest .kboard-wonderful-product-latest-thumbnail { padding-right: 0; width: 100%; }
    #kboard-wonderful-product-latest .kboard-wonderful-product-latest-info { width: 100%; }

     

    썸네일을 등록하지 않았을 때 표시되는 영역의 높이를 조절하시려면

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

    #kboard-wonderful-product-latest .kboard-wonderful-product-latest-thumbnail .kboard-no-image { height: 120px; }

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

     

    썸네일 이미지의 사이즈를 늘리시려면

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

    아래의 코드를 모두 찾아보세요.

    $content->getThumbnail(176, 132)

    위의 코드에서 숫자는 가로 세로 픽셀 크기입니다.

    적절히 늘려서 확인해보시겠어요?

    고맙습니다.

  • 빠른 답변 감사합니다!
    답변주신 사항으로 적용을 해서 이미지와 아래에 제목부분은 정렬이 잘 되었습니다.

    그런데 예시 이미지처럼 최근게시글 나열이 세로가 아닌 가로형태로 되려면 어떻게 해야할까요?
    답변 부탁드리겠습니다. ^^

     

  • 가로 형태로 한 줄에 4개씩 표시하시려면

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

    #kboard-wonderful-product-latest { overflow: hidden; }
    #kboard-wonderful-product-latest .kboard-wonderful-product-latest-item { float: left; margin-right: 1%; width: 24%; }

     

    한 줄에 5개씩 표시하시려면

    위의 코드 중 24% 부분을 19%로 변경해서 적용해보시겠어요?

    고맙습니다.

이미지 사진은 imgur에 업로드한 뒤 링크 걸어주세요.
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기