Loading the content...
http://theme.eyoom.net/?theme=theone 테마에서 슬라이드배너 1,2는 빼고 마지막 배너만 사용하려고 합니다. (이미지로 올릴수 있는 배너)
슬라이드배너 없애기 주석에서 나오는 설명을 이해를 못하겠어요~~~
쉽게 설명해주실수 있는분 설명좀 부탁드려요
Progress Bar 95%
이윰빌더를 이용하시는 모든 회원님들이 서로 궁금한 부분을 질문 또는 답변을 하며 문제점을 서로 해소할 수 있는 공용 질답 게시판입니다.
| 제목 | |||||||
|---|---|---|---|---|---|---|---|
칠천피트
2016.01.20
2,132
0 |
|||||||
달달하고달콤한
2016.01.28
2,110
0 |
|||||||
마늘
2015.05.22
2,108
0 |
|||||||
김군
2015.03.16
2,085
0 |
|||||||
thanksbi…
2015.03.11
2,073
0 |
|||||||
홍인
2015.03.28
2,073
0 |
|||||||
|
VRBOXKOR…
2015.12.22
2,069
0 |
|||||||
비즈팔
2015.04.10
2,060
0 |
|||||||
소다
2015.05.18
2,043
0 |
|||||||
비즈팔
2015.05.04
2,024
0 |
|||||||
아윤대디
2015.11.20
2,022
0 |
|||||||
세라
2015.05.10
2,010
0 |
|||||||
ety8
2015.02.07
1,996
0 |
|||||||
너나잘해
2015.02.02
1,994
0 |
|||||||
|
oppa
2015.03.21
1,974
0 |
|||||||
댓글목록
shadow님의 댓글
질문의 의미가 잘 이해가 안갑니다만 "theone" 테마를 살펴보니 최상단에 슬라이더 배너가 있군요.
최상단 슬라이너 배너의 이미지를 단 1개만 사용하고 싶으시다는 의미신지요?
그누보드5/eyoom/theme/설치된 테마/main/index_bs.html 을 열어보시면 슬라이더 스킨 관련 추출 소스가 있는데 "count=값" 중 값을 1로 수정하면 되지 않을까 합니다.
질문하시는 요지에 맞는 답인지 모르겠습니다.
축하합니다. 첫댓글 포인트 95포인트를 획득하였습니다.
축하합니다. 행운의 포인트 95포인트를 획득하였습니다.
삼삼이님의 댓글
네..맞습니다..bisdog.kr 사이트 입니다... 펜과 노트로된 슬라이드배너 이미지만 사용하려고 합니다.
슬라이드배너중 3번째만 사용하려고 합니다.. "count=값" 이 안보입니다.
<?php if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가 ?>
<!--{* 슬라이드 베너 시작 - 안내 : 이미지를 이용한 슬라이드 배너입니다. *}-->
<div id="carousel-slide-banner" class="carousel slide slide-banner2">
<!--{* Indicators - item 개수와 맞춰주세요 - 안내 : 현재 2개로 구성 됐습니다. *}-->
<ol class="carousel-indicators">
<li data-target="#carousel-slide-banner" data-slide-to="0" class="active"></li>
<li data-target="#carousel-slide-banner" data-slide-to="1"></li>
<li data-target="#carousel-slide-banner" data-slide-to="2"></li>
</ol>
<!--{* Wrapper for slides - Indicators 개수와 맞춰주세요. - 안내 : 현재 3개로 구성 됐습니다. *}-->
<div class="carousel-inner" id="hte-home">
<div class="item type-01 active" style="background-color: #4ca3b4"><!--{* background-color에 배경색을 넣어주세요. *}-->
<div class="container">
<img src="../image/sample/cake.png" alt="케이크" /><!--{* 좌측 케이크 이미지 : style.css 454줄 에서 이미지의 사이즈조정 및 위치를 수정하실 수 있습니다. *}-->
<!--{* 코멘트 넣기 *}-->
<h3 class="font-lobster">Wellcome to dogbeauty<span class="hte-font-color font-lobster">academy</span></h3>
<h4 class="hidden-xs"><span class="hte-font-color">변석준애견미용학원</span>대구점 사이트 방문을 환영합니다.</h4>
<p class="hidden-xs">빛나는 내일을향해! 꿈의 성취를 위해! 여러분과 함께 만들어 가겠습니다</p>
<div class="slide-link"><a href="#hte-portfolio" class="font-lobster hte-font-color hte-bg-hover slide_htemenu">view<br/>our<br/>portfolio</a></div><!--{* 링크 버튼 : 직접입력 *}-->
</div>
</div>
<div class="item type-03">
<div class="item-bg"></div><!--{* 슬라이드 배경이미지 - 안내 : style.css 568줄에서 이미지 경로 설정*}-->
<div class="carousel-caption">
<h3 class="font-lobster"><span class="hte-font-color font-lobster">M</span>emory Is <span class="hte-font-color font-lobster">F</span>orever</h3>
<h4 class="hidden-xs">학원생들과 함께한 사진들 입니다</h4>
<div class="slide-link2"><a href="http://bisdog.kr/bbs/board.php?bo_table=gallery_02" "target="_blank" class="hte-font-color hte-border-color hte-bg-hover slide_htemenu">바로가기</a></div>
</div>
</div>
</div>
<!--{* Controls - 안내 : 좌우 콘트롤 버튼 *}-->
<a class="left carousel-control" href="#carousel-slide-banner" data-slide="prev">
<span class="fa fa-angle-left fa-2x"></span>
</a>
<a class="right carousel-control" href="#carousel-slide-banner" data-slide="next">
<span class="fa fa-angle-right fa-2x"></span>
</a>
</div>
<!--{* 슬라이드 베너 끝 *}-->
어디를 수정해야 할지 잘 모르겠습니다...
그리고 동영상 이미지도 줄이고 싶은데 잘 안되네여~~
style.css 에 아래 소스 첨부했더니 모바일에서도 반응형으로 잘 작동은 되던데 메인에서 동영상 이미지를 줄이면 센터가 안맞습니다.
질문이 많네요~~~
.youtubeWrap {
position: relative;
width: 100%;
padding-bottom: 56.25%;
}
.youtubeWrap iframe {
position: absolute;
width: 100%;
height: 100%;
display:block; margin:0 auto;
}
shadow님의 댓글
설명 드리기 복잡할 것 같아 아주 간단히 이렇게 해보세요.
수정 후또 item type-01을 주석처리하세요.수정 전
<!-- <div class="item type-01 active" style="background-color: #4ca3b4"><!--{* background-color에 배경색을 넣어주세요. *}--> <div class="container"> <img src="../image/sample/cake.png" alt="케이크" /><!--{* 좌측 케이크 이미지 : style.css 454줄 에서 이미지의 사이즈조정 및 위치를 수정하실 수 있습니다. *}--> <!--{* 코멘트 넣기 *}--> <h3 class="font-lobster">Wellcome to dogbeauty<span class="hte-font-color font-lobster">academy</span></h3> <h4 class="hidden-xs"><span class="hte-font-color">변석준애견미용학원</span>대구점 사이트 방문을 환영합니다.</h4> <p class="hidden-xs">빛나는 내일을향해! 꿈의 성취를 위해! 여러분과 함께 만들어 가겠습니다</p> <div class="slide-link"><a href="#hte-portfolio" class="font-lobster hte-font-color hte-bg-hover slide_htemenu">view<br/>our<br/>portfolio</a></div><!--{* 링크 버튼 : 직접입력 *}--> </div> </div> -->좌우 콘트롤 버튼도 사용할 의미가 없으니 주석처리해야겠죠.<!--{* Controls - 안내 : 좌우 콘트롤 버튼 *}--> <!-- <a class="left carousel-control" href="#carousel-slide-banner" data-slide="prev"> <span class="fa fa-angle-left fa-2x"></span> </a> <a class="right carousel-control" href="#carousel-slide-banner" data-slide="next"> <span class="fa fa-angle-right fa-2x"></span> </a> -->동영상 부분 또한 문제있는 부분을 링크로 걸어주시는게 요점을 파악하기 좋을 듯 합니다.
삼삼이님의 댓글
답변처럼 해봤는데 잘 안되네요...ㅠㅠ
스라이드배너 전체가 사라져 버립니다..
shadow님의 댓글
"삼삼이"님 홈페이지에서 크롬의 요소검사를 통해 테스트해보고 올린 글인데요.
소스를 올바르게 수정하셨는지 확인해보세요.
올려주신 전체 소스를 수정해서 올려드릴테니 한번 더 확인해보시기 바랍니다.
<?php if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가 ?> <!--{* 슬라이드 베너 시작 - 안내 : 이미지를 이용한 슬라이드 배너입니다. *}--> <div id="carousel-slide-banner" class="carousel slide slide-banner2"> <!--{* Indicators - item 개수와 맞춰주세요 - 안내 : 현재 2개로 구성 됐습니다. *}--> <!-- <ol class="carousel-indicators"> <li data-target="#carousel-slide-banner" data-slide-to="0" class="active"></li> <li data-target="#carousel-slide-banner" data-slide-to="1"></li> <li data-target="#carousel-slide-banner" data-slide-to="2"></li> </ol> --> <!--{* Wrapper for slides - Indicators 개수와 맞춰주세요. - 안내 : 현재 3개로 구성 됐습니다. *}--> <div class="carousel-inner" id="hte-home"> <!-- <div class="item type-01 active" style="background-color: #4ca3b4"><!--{* background-color에 배경색을 넣어주세요. *}--> <div class="container"> <img src="../image/sample/cake.png" alt="케이크" /><!--{* 좌측 케이크 이미지 : style.css 454줄 에서 이미지의 사이즈조정 및 위치를 수정하실 수 있습니다. *}--> <!--{* 코멘트 넣기 *}--> <h3 class="font-lobster">Wellcome to dogbeauty<span class="hte-font-color font-lobster">academy</span></h3> <h4 class="hidden-xs"><span class="hte-font-color">변석준애견미용학원</span>대구점 사이트 방문을 환영합니다.</h4> <p class="hidden-xs">빛나는 내일을향해! 꿈의 성취를 위해! 여러분과 함께 만들어 가겠습니다</p> <div class="slide-link"><a href="#hte-portfolio" class="font-lobster hte-font-color hte-bg-hover slide_htemenu">view<br/>our<br/>portfolio</a></div><!--{* 링크 버튼 : 직접입력 *}--> </div> </div> --> <div class="item type-03"> <div class="item-bg"></div><!--{* 슬라이드 배경이미지 - 안내 : style.css 568줄에서 이미지 경로 설정*}--> <div class="carousel-caption"> <h3 class="font-lobster"><span class="hte-font-color font-lobster">M</span>emory Is <span class="hte-font-color font-lobster">F</span>orever</h3> <h4 class="hidden-xs">학원생들과 함께한 사진들 입니다</h4> <div class="slide-link2"><a href="http://bisdog.kr/bbs/board.php?bo_table=gallery_02" "target="_blank" class="hte-font-color hte-border-color hte-bg-hover slide_htemenu">바로가기</a></div> </div> </div> </div> <!--{* Controls - 안내 : 좌우 콘트롤 버튼 *}--> <!-- <a class="left carousel-control" href="#carousel-slide-banner" data-slide="prev"> <span class="fa fa-angle-left fa-2x"></span> </a> <a class="right carousel-control" href="#carousel-slide-banner" data-slide="next"> <span class="fa fa-angle-right fa-2x"></span> </a> --> </div> <!--{* 슬라이드 베너 끝 *}-->삼삼이님의 댓글
올려주신 소스를 그대로 올려보라는 말씀이시죠 ? 그렇게해봤는데 슬라이드배너가 아예 사라져 버렸어요~~
축하합니다. 지뢰폭탄 포인트 64포인트를 획득하였습니다.
축하합니다. 행운의 포인트 71포인트를 획득하였습니다.
shadow님의 댓글
다시 수정해서 올려 놓겠습니다. 잠시만요
shadow님의 댓글
아래 소스로 수정하세요.
<?php if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가 ?> <!--{* 슬라이드 베너 시작 - 안내 : 이미지를 이용한 슬라이드 배너입니다. *}--> <div id="carousel-slide-banner" class="carousel slide slide-banner2"> <!--{* Indicators - item 개수와 맞춰주세요 - 안내 : 현재 2개로 구성 됐습니다. *}--> <!-- <ol class="carousel-indicators"> <li data-target="#carousel-slide-banner" data-slide-to="0" class="active"></li> <li data-target="#carousel-slide-banner" data-slide-to="1"></li> <li data-target="#carousel-slide-banner" data-slide-to="2"></li> </ol> --> <!--{* Wrapper for slides - Indicators 개수와 맞춰주세요. - 안내 : 현재 3개로 구성 됐습니다. *}--> <div class="carousel-inner" id="hte-home"> <!-- <div class="item type-01 active" style="background-color: #4ca3b4"><!--{* background-color에 배경색을 넣어주세요. *}--> <div class="container"> <img src="../image/sample/cake.png" alt="케이크" /><!--{* 좌측 케이크 이미지 : style.css 454줄 에서 이미지의 사이즈조정 및 위치를 수정하실 수 있습니다. *}--> <!--{* 코멘트 넣기 *}--> <h3 class="font-lobster">Wellcome to dogbeauty<span class="hte-font-color font-lobster">academy</span></h3> <h4 class="hidden-xs"><span class="hte-font-color">변석준애견미용학원</span>대구점 사이트 방문을 환영합니다.</h4> <p class="hidden-xs">빛나는 내일을향해! 꿈의 성취를 위해! 여러분과 함께 만들어 가겠습니다</p> <div class="slide-link"><a href="#hte-portfolio" class="font-lobster hte-font-color hte-bg-hover slide_htemenu">view<br/>our<br/>portfolio</a></div><!--{* 링크 버튼 : 직접입력 *}--> </div> </div> --> <div class="item type-03 active"> <div class="item-bg"></div><!--{* 슬라이드 배경이미지 - 안내 : style.css 568줄에서 이미지 경로 설정*}--> <div class="carousel-caption"> <h3 class="font-lobster"><span class="hte-font-color font-lobster">M</span>emory Is <span class="hte-font-color font-lobster">F</span>orever</h3> <h4 class="hidden-xs">학원생들과 함께한 사진들 입니다</h4> <div class="slide-link2"><a href="http://bisdog.kr/bbs/board.php?bo_table=gallery_02" "target="_blank" class="hte-font-color hte-border-color hte-bg-hover slide_htemenu">바로가기</a></div> </div> </div> </div> <!--{* Controls - 안내 : 좌우 콘트롤 버튼 *}--> <!-- <a class="left carousel-control" href="#carousel-slide-banner" data-slide="prev"> <span class="fa fa-angle-left fa-2x"></span> </a> <a class="right carousel-control" href="#carousel-slide-banner" data-slide="next"> <span class="fa fa-angle-right fa-2x"></span> </a> --> </div> <!--{* 슬라이드 베너 끝 *}--><div class="item type-03"> 에 active가 추가되어야 합니다.
<div class="item type-03 active"> 이렇게요.
삼삼이님의 댓글
앗~~~너무 감사합니다..
해결되었네여~~~
그리고 아까 동영상 부분이여
아래의 소스를 올리니까 반응형에서 이미지가 줄어들지 않더라구요
<div class="youtubeWrap">
<iframe width="750" height="390" src="https://www.youtube.com/embed/eQMyTkAdaxY?rel=0&controls=1&showinfo=0" frameborder="0" allowfullscreen></iframe>
</div>
그래서 style.css 에서
.youtubeWrap {
position: relative;
width: 100%;
padding-bottom: 56.25%;
}
.youtubeWrap iframe {
position: absolute;
width: 80%;
height: 80%;
display:block; margin:0 auto;
}
아래의 소스를 넣어주니 반응형에서 반응은 하는데 동영상 위치가 왼쪽으로 붙어서 나옵니다.
센터로 옮기는 방법좀 부탁드릴께요~~
부탁만 많이 해서 죄송합니다...
shadow님의 댓글
이렇게 수정해보세요.
.youtubeWrap { position: relative; width: 100%; padding-bottom: 56.25%; } .youtubeWrap iframe { width: 80%; display:block; margin:0 auto; }축하합니다. 행운의 포인트 80포인트를 획득하였습니다.
삼삼이님의 댓글
중앙으로는 갔는데 뭔가 문제가 생긴것 같아요...
그나저나 이렇게 시간을 많이 뺐어서 너무 죄송합니다.
축하합니다. 행운의 포인트 54포인트를 획득하였습니다.
shadow님의 댓글
쓸모없는 소스가 있네요.
.youtubeWrap { position: relative; width: 100%; }위 코드만 삽입하셔도 될 듯 합니다.
축하합니다. 지뢰폭탄 포인트 77포인트를 획득하였습니다.
축하합니다. 행운의 포인트 46포인트를 획득하였습니다.
삼삼이님의 댓글
동영상과 텍스트 사이의 거리가 무척 멀어졌습니다...
<!-- #about 시작 -->
<div id="hte-about" class="hte-about padding-top-60"><!--{* 안내 : 아이디를 적은 것은 원페이지 형식에서 메뉴를 클릭시 해당 링크롤 가기 위함입니다. 아이디 수정시 메뉴와 동일하게 수정 바랍니다. *}-->
<div class="container">
<h3 class="hte-title hte-border-color hte-border-bottom text-left"><span class="hte-font-color">A</span>BOUT US</h3>
<!--{* 소개 슬로건과 설명을 하는 부분 시작 *}-->
<div class="row">
<div class="col-md-12 text-center">
<div class="hte-about-content">
<h3><i class="fa fa-quote-left"></i> 프로트리머의 <span class="hte-font-color">꿈과 도전이</span> 있는 여러분 반갑습니다. <i class="fa fa-quote-right"></i></h3>
<div class="youtubeWrap">
<iframe width="750" height="390" src="https://www.youtube.com/embed/eQMyTkAdaxY?rel=0&controls=1&showinfo=0" frameborder="0" allowfullscreen></iframe>
</div>
<p><span class="hte-font-color">안정된 직업</span>과 <span class="hte-font-color">프로패셜한</span> 자신의 모습을 꿈꾸며 변석준애견미용학원 대구점을 찾아오셨나요?
<br/>본원을 선택한 것만으로도 프로트리머의 세계로 한걸음 다가선것입니다<br/><br/>기초부터 고급까지 철저한 1:1 맞춤식 교육 및 본원의 특색 있는 가위컷 지도로<br/>여러분들의 경쟁력 있는 미래를 보장합니다.</p>
</div>
</div>
shadow님의 댓글
padding-bottom: 56.25%; 이 소스 때문이니 삭제하셔요~~
삼삼이님의 댓글
와우~~~감사합니다^^
몇일동안 막혔던 일들이 한꺼번에 해결이 되었습니다.
도움만 받아서 너무 죄송하네요~~~
제가 도움 드릴일이 있었으면 좋겠습니다^^
다시한번 감사합니다 ^^
삼삼이님의 댓글
ㅜㅜ 지금보니 반응형에서 동영상이미지가 줄어들지 않네여~~~
shadow님의 댓글
살펴보겠습니다.^^;
축하합니다. 행운의 포인트 1포인트를 획득하였습니다.
shadow님의 댓글
제가 착각을 했네요.
요렇게 수정하시면 될 듯 합니다.
.youtubeWrap { position: relative; width: 100%; } .youtubeWrap iframe { width: 80%; display:block; margin:0 auto; }삼삼이님의 댓글
모바일에서 동영상이 세로로 나옵니다..
반응형으로 모니터를 줄이면서 보는것과 똑같이 나오네여~~~
shadow님의 댓글
사이트 자체 소스를 직접 수정해서 확인해볼 수가 없어서 확실치는 않습니다.
아래 소스를 이용해보세요.
.youtubeWrap { position: relative; width: 100%; } .youtubeWrap iframe { width: 80%; display:block; margin:0 auto; } @media (max-width:768px) { .youtubeWrap iframe { position: relative; width: 100%; height: auto; } }원래 부트스트랩은 responsive-video 클래스를 사용하면 자동으로 디바이스에 따라 반응형으로 크기가 변경됩니다.
수정 후
삼삼이님의 댓글
수정해봤는데 모바일에서는 정상적으로 잘 나오는데 pc에서 화면이 원래처럼 크게 나오네요~~~
저도 한번 이리저리 방법 찾아보겠습니다...너무 감사합니다^^