Loading the content...

공유자료실

  • Home
  • 공유자료실

[최신글] 이미지 갤러리 최신글 Wide로 적용하기

3,433 2015.04.26 16:24

첨부파일

짧은주소

본문


 

eyoom/theme/basic/skin_bs/latest/image_gallery
를 복사해서 아주 약간 수정했습니다.

사소한 내용이어서 수정한 사항만 알려드려도 될 터이지만
'image_gallery'와 병행하려면 별도의 스킨이 있어야 하기에 따로 올립니다.

스킨은 'eyoom/theme/basic/skin_bs/latest'에 넣습니다.


eyoom/theme/basic/layout/head_bs.html

<!--=== End Header ===-->
 
<!--{? defined('_INDEX_') || defined('_EYOOM_MYPAGE_')}-->
사이에...

<!--=== End Header ===-->
<!--{? !C.G5_IS_MOBILE}-->
<div>
    <!--------------- EBL Image Gallery Wide 최신글 영역 시작 --------------->
    <!--{latest->latest_eyoom('image_gallery_w','title=게시판 제목||bo_table=게시판 아이디||count=12||cut_subject=50||img_view=y||bo_direct=n||img_width=500||cols=12')}-->
    <!--------------- EBL Image Gallery Wide 최신글 영역 끝 --------------->
</div>
<!--{/}-->
<div class="clearfix"></div>
<!--{? defined('_INDEX_') || defined('_EYOOM_MYPAGE_')}-->
이렇게 입력해줍니다.
모바일에서는 보이지 않게 했습니다.

부족한 부분은 보완해서 사용하십시오.

1:1 비율의 이미지를 기준으로 했습니다.
다른 비율의 이미지를 사용할 경우에는...

eyoom/theme/basic/skin_bs/latest/image_gallery_w/style.css

.view .gallery-img2 {
    display: block;
    overflow: hidden;
    min-height: 139px;
    max-height: 139px;
}
높이를 적당히 수정하세요.

4:3 = 104px
3:2 = 93px
16:9 = 78px

- fm25 메일보내기 아이디로 검색 - 회원등급 : 새싹/Level 11 - 포인트 : 104,755
레벨 11
경험치 12,674

Progress Bar 77%

- 가입일 : 2015-02-07 19:40:40
- 서명 : 영원한 초보!!!
Home Page : internationale.kr
Eyoom Builder Test : liberta.kr
- 자기소개 : SIR의 존재감 없는 회원입니다~^^
댓글목록

fm25님의 댓글

가로 세로 비율이 다르더라도 썸네일은 동일하게 나타나게 해야 하는데...
이 부분을 해결할 수 있는 능력이 없네요.

bootstrap.css에 규정된 'img-responsive'가
세로로 긴 이미지의 경우에는 그리 큰 문제가 되지는 않는데... 가로로 긴 이미지가 문제네요.
반응형이기 때문에 당연한 것인지?

shadow님의 댓글

제 경험과는 반대되는 의견이시네요.
일단 반응형이란 세로를 기준으로 하지 않고 가로를 기준으로 하지 않는지요?
이미지 관련 css 내용 내에

width: 100%;

위 소스만 추가하면 가로문제는 발생치 않습니다.
문제는 세로지요.
퍼센트로 하던 실제 크기 조정을 위한 px로 하던 전체 크기로 조정하기 때문에 세로 이미지 크기에 따라 들쭉날쭉하게 됩니다.

제 개인적인 견해는 최신글에 사용할 이미지를 실제 이미지를 불러오는게 아니라 썸네일 크롭하여 불러올 수 있게 수정한다면 문제가 없을 것 같습니다.

이 부분에 대해 향후 기능 추가가 된다면 좋겠습니다.

fm25님의 댓글

결국 같은 얘기입니다~^^

가로는 아무리 길어도 100%로 보여지기 때문에
상대적으로 짧은 세로가 문제로 나타나는 것이니...

원인은 '가로로 긴 이미지' → 결과는 '세로로 들쭉날쭉'

shadow님의 댓글

결국은 최신 갤러리 추출에서 본 이미지가 아닌 비율이 일정한 썸네일을 추출한다면 이 문제는 해결이 될 듯 합니다.
현재 저는 편법으로 피시상과 모바일상 스킨을 달리 불러오도록해서 사용하고 있습니다.
모바일 이미지 높이 값을 더 작게 잡아주면 적어도 들쭉날쭉하진 않으니 말이죠

비즈팔님의 댓글

찬찬히 좀 보고 활용해 봐야겠네요.^^
수고 하셨습니다.

joosam님의 댓글

아 역시 빠르시다 고맙습다 잘사용해 보겠습니다

joosam님의 댓글


바로 적용해 보았습니다... 서브페이지가 아웃라인이 조금 깨집니다~ (사이드를 없애서 그런지는 모르겠습니다) 이것 저것 해보고 다시 글 남기겠습니다 ^^ 이것도 메인에만 노출되게 하는 방법은 아래 글과 같은 방법이겠죠?

fm25님의 댓글

<!--=== End Header ===-->
<!--{? defined('_INDEX_') && !C.G5_IS_MOBILE}-->
<div>
    <!--------------- EBL Image Gallery Wide 최신글 영역 시작 --------------->
    <!--{latest->latest_eyoom('image_gallery_w','title=게시판 제목||bo_table=게시판 아이디||count=12||cut_subject=50||img_view=y||bo_direct=n||img_width=500')}-->
    <!--------------- EBL Image Gallery Wide 최신글 영역 끝 --------------->
</div>
<!--{/}-->

<div class="clearfix"></div>

<!--{? defined('_INDEX_') || defined('_EYOOM_MYPAGE_')}-->
메인에서만 사용하고, 서브 페이지와 모바일에서는 보이지 않게...

joosam님의 댓글

fm25님 친절한 답변 언제나 고맙습니다~~

joosam님의 댓글

베이직 테마에 적용 했는데요... 역시 서브 페이지에서는 깨지는데요....
<!--=== End Header ===-->
<!--{? defined('_INDEX_')}-->
<div>
    <!--------------- EBL Image Slider Wide 최신글 영역 시작 --------------->
    <!--{latest->latest_eyoom('image_slider_w','title=게시판 제목||bo_table=board1||count=5||cut_subject=50||img_view=y||bo_direct=n||img_width=1920')}-->
    <!--------------- EBL Image Slider Wide 최신글 영역 끝 --------------->
</div>
<!--{:}-->
<div>
    <!--------------- EBL Image Gallery Wide 최신글 영역 시작 --------------->
    <!--{latest->latest_eyoom('image_gallery_w','title=게시판 제목||bo_table=board1||count=12||cut_subject=50||img_view=y||bo_direct=n||img_width=500')}-->
    <!--------------- EBL Image Gallery Wide 최신글 영역 끝 --------------->
</div>
<!--{/}-->
<!--{? defined('_INDEX_') || defined('_EYOOM_MYPAGE_')}-->
이렇게 적용했습니다만  서브페이지에 적용한 image_gallery_w 우측으로 카테고리 제목이 같이 올라가네요..

축하합니다. 행운의 포인트 57포인트를 획득하였습니다.

joosam님의 댓글

흠 그게 베이직 기본이라 수정은 거의 없었고요... 사이드 레이아웃만 메인에서 안보이기 설정했는데요 ^^: http://concertmail.cafe24.com/ 여기입니다. 거의 베이직 기본이거든요..

fm25님의 댓글

'Board Title' 부분이 갤러리 스킨에 가려지는 것을 몰랐네요.

<div class="clearfix"></div>
를 추가하여 가려지지 않게 했습니다.

그리고 해당 게시판에 이미지 포함된 글을 12개 이상 생성해보세요.
복사해서 게시글 수를 늘린 것은 제대로 인식이 되지 않는 듯 합니다.

joosam님의 댓글

늦은밤 고생하십니다~~ 아마도 빌더를 재설치해서 다시 해봐야 할듯 싶습니다~~

joosam님의 댓글

그누보드 부터 재 설치후 다시 적용하니 정상 적용됩니다... 언제나 고맙습니다~~

Total 51건 2 페이지
공유자료실 이용안내

공유자료실 게시판에서 다양한 자료를 공유하실 수 있습니다. 레이아웃, 게시판, 최신글, 플러그인 등 다양한 자료를 공유 해 주세요.


  1. 포인트 배포가 가능합니다. 포인트를 걸고 자료를 배포하시면 다운로드 발생 시 배포한 회원님께 80%의 포인트가 적립됩니다.
  2. 적립된 포인트는 이윰몰에서 상품결제 시 사용가능합니다.
  3. 저작권이 있는 자료는 무단으로 배포를 하실 수 없으니 주의하여 주시길 바랍니다.
  4. 배포된 해당 자료에 대한 문의는 해당 내용페이지에서만 질문하여 주세요.

배포되는 자료는 이윰넷에서 일일이 필터링 할 수 없으며 문제발생 시 책임을 지지 않습니다. 회원님들간 자발적인 정화와 참여를 부탁드립니다.

제목
l2zeo 아이디로 검색 2015.09.20 3,139
l2zeo 아이디로 검색 2015.09.18 2,121
l2zeo 아이디로 검색 2015.09.18 2,628
l2zeo 아이디로 검색 2015.09.17 4,140
수국 아이디로 검색 2015.09.16 3,441
shadow 아이디로 검색 2015.09.03 4,095
shadow 아이디로 검색 2015.09.02 4,913
shadow 아이디로 검색 2015.08.14 2,725
갓구운빵 아이디로 검색 2015.07.15 2,318
fm25 아이디로 검색 2015.06.12 2,157
fm25 아이디로 검색 2015.06.08 4,143
fm25 아이디로 검색 2015.05.29 4,589
fm25 아이디로 검색 2015.05.29 4,020
fm25 아이디로 검색 2015.05.29 3,912
이윰넷 아이디로 검색 2015.05.24 2,555