[최신글] 이미지 갤러리 최신글 Wide로 적용하기
3,487
2015.04.26 16:24
첨부파일
-
7 2015-05-20 18:34:59
짧은주소
- - 짧은주소: http://v2.eyoom.net/bbs/?t=12T 주소복사
본문
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
9
레벨 11
경험치 12,674
Progress Bar 77%
- 가입일 : 2015-02-07 19:40:40
- 서명 : 영원한 초보!!!
Home Page : internationale.kr
Eyoom Builder Test : liberta.kr - 자기소개 : SIR의 존재감 없는 회원입니다~^^
Home Page : internationale.kr
Eyoom Builder Test : liberta.kr - 자기소개 : SIR의 존재감 없는 회원입니다~^^
Total 51건 3 페이지
공유자료실 이용안내
공유자료실 게시판에서 다양한 자료를 공유하실 수 있습니다. 레이아웃, 게시판, 최신글, 플러그인 등 다양한 자료를 공유 해 주세요.
- 포인트 배포가 가능합니다. 포인트를 걸고 자료를 배포하시면 다운로드 발생 시 배포한 회원님께 80%의 포인트가 적립됩니다.
- 적립된 포인트는 이윰몰에서 상품결제 시 사용가능합니다.
- 저작권이 있는 자료는 무단으로 배포를 하실 수 없으니 주의하여 주시길 바랍니다.
- 배포된 해당 자료에 대한 문의는 해당 내용페이지에서만 질문하여 주세요.
배포되는 자료는 이윰넷에서 일일이 필터링 할 수 없으며 문제발생 시 책임을 지지 않습니다. 회원님들간 자발적인 정화와 참여를 부탁드립니다.
댓글목록
fm25님의 댓글
가로 세로 비율이 다르더라도 썸네일은 동일하게 나타나게 해야 하는데...
이 부분을 해결할 수 있는 능력이 없네요.
bootstrap.css에 규정된 'img-responsive'가
세로로 긴 이미지의 경우에는 그리 큰 문제가 되지는 않는데... 가로로 긴 이미지가 문제네요.
반응형이기 때문에 당연한 것인지?
shadow님의 댓글
제 경험과는 반대되는 의견이시네요.
일단 반응형이란 세로를 기준으로 하지 않고 가로를 기준으로 하지 않는지요?
이미지 관련 css 내용 내에
위 소스만 추가하면 가로문제는 발생치 않습니다.
문제는 세로지요.
퍼센트로 하던 실제 크기 조정을 위한 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님의 댓글
그누보드 부터 재 설치후 다시 적용하니 정상 적용됩니다... 언제나 고맙습니다~~