오른쪽 오늘본상품 이미지 동그랗게 > 영카트5 스킨

영카트5 스킨

좋은 댓글과 좋아요는 제작자에게 큰힘이 됩니다.

오른쪽 오늘본상품 이미지 동그랗게 정보

기타 오른쪽 오늘본상품 이미지 동그랗게

첨부파일

boxtodayview.skin.php (4.3K) 351회 다운로드 2015-06-29 22:57:20

본문

영카트5로 쇼핑몰을 만들어보고 있는데, 필요하신분이 계실거 같아서 오늘본 상품이미지를 원으로 보여주는 스킨을 올립니다.

제가 css 이런거 기본개념이 부족해서 지저분하고 필요없는 부분도 있을건데 필요없는 부분이 있으면 제거하고 사용하시면 됩니다.


-- 적용방법--

1. 첨부한 boxtodayview.skin.php 파일을 다운받아서 skin/shop/basic 폴더에 올립니다.
2. 아래 코드를 복사해서 skin/shop/basic/style.css 19~34줄에 덮어 씌웁니다.
  (/* 오늘 본 상품 */ 부분)


/* 오늘 본 상품 */
#stv {z-index:1001;position:relative;float:right;width:100px}
#stv_list {position:absolute;right: -115px;/*오늘본 상품 오른쪽으로 빼기*/width:100px; border-bottom:0px solid #ddd;background:#fff}
#stv_list h2 {margin:0px auto;padding:10px 0 8px;background:#f9f9f9;border-bottom:0px dotted #aaa;border-top:0px solid #ddd;width:100%;font-weight:bold;font-size:13px;font-family:Malgun Gothic;color:#444;text-align:center;letter-spacing:-0.1em}
#stv_pg {display:block;margin:5px 0 0}
#stv_list p {padding:20px 0;text-align:center}
#stv_btn {text-align:center;zoom:1}
#stv_btn:after {display:block;visibility:hidden;clear:both;content:""}

/* 이전, 다음 */
#stv_btn button {float:left;margin:0;padding:8px 0 2px;width:47px;border:0;background:#fff;color:#A07171;font-weight:bold;text-align:center}
#stv_btn span  {float:left;padding:8px 0 0px;font-size:12px;color:#ccc;list-style:none}
#stv_ul {margin:0 0 10px ;padding:0;list-style:none}
.stv_item {display:none;padding:5px 9px;text-align:center;word-break:break-all}

/* 오늘 본 이미지 동그랗게 원으로*/
.stv_item img {margin:0px 0;border-radius: 150px; /* 이미지의 크기의 반만큼 반경을 잡아줌 */}

#stv_nb {margin:0;padding:0; list-style:none;border:1px solid #ddd;border-top:none}
#stv_nb li {margin:0px auto;padding:12px 0px 12px 0px;font-size:12px;font-family:돋움;color:#666;text-align:center; border-top:1px solid #ddd;width:100%;list-style:none}
#stv_nb a {display:block}



제가 오늘본 상품이 나오는 부분을 아래로 내리고 위에는 배너를 추가했는데요.
첨부해드리는 파일에는 배너부분은 없습니다. 이부분은 원하시는거로 꾸미시면 됩니다.

위 소스에서 상품이미지를 동그랗게 해주는 부분은
/* 오늘 본 이미지 동그랗게 원으로*/
.stv_item img {margin:0px 0;border-radius: 150px; /* 이미지의 크기의 반만큼 반경을 잡아줌 */}
이곳 입니다.

다른부분 필요없으시면 style.css에 이부분만 적용하시면 됩니다.


이미지 사이즈나 화면에 보여줄 갯수는
boxtodayview.skin.php 맨 상단에서 수정하세요.

<?php
$tv_idx = get_session("ss_tv_idx");

$tv_div['top'] = 0;
$tv_div['img_width'] = 85; //가로
$tv_div['img_height'] = 85; // 세로
$tv_div['img_length'] = 3; // 한번에 보여줄 이미지 수

85x85 사이즈에 3개이상 클릭시 이전/다음 링크버튼이 나타납니다.
추천
8

댓글 전체

제가 운영하는 쇼핑몰이 아니고요.
그냥 영카트 연습으로 만들어본거예요. 모델은 문제가 될수도 있어서 중국얼짱으로 검색한 인터넷 얼짱이예요. ^^
전체 118
영카트5 스킨 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT