게시판 글자수 초과 시 ... 뜨게 하기 (ellipsis)

if over-charactor then output '...' (ellipsis)

어떤사람이 제목을 엄청나게 길게 써서 저렇게 글을 올리면 미관상에도 보기 안좋고, 보는 사람들도 기분이 안좋을 수도 있겠죠.

이번 시간은 저런 긴~제목에 대해서 일정 범위를 초과하면 (...) 처리시키는 법에 대해서 글을 쓰고자 합니다.

이 방법은 Ruby on rails 기준으로 작성하겠습니다만, HTML/CSS만 쓸 수 있다면 PHP 등 다른 웹프로그래밍에서도 쓰일 수 있습니다.


게시글 글자수 초과 시, ... 처리

  • app/assets/stylesheets/application.css 에서 다음을 입력해줍니다.
.etc {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

* 혹시 글자길이를 수정하고 싶으신 분은 2번 째 줄에 있는 'width' 부분을 수정해보세요!

  • 글자수 제한을 두고싶은 곳에 "<div class="board_title>내용</div>"를 넣습니다.

예시 (게시판 제목부분)

<div class="etc"><a href="/posts/show/<%= p.id %>"><%= p.title %></a></div>
  • 끝입니다.

엄청난 제목이 글자수 초과 시 '...' 로 처리됨. (최종 결과본)

results matching ""

    No results matching ""