Help Center
카페24 소식
[상점/운영] 내 쇼핑몰에 멋진 화면효과를 넣어보자!
2010-01-28
안녕하세요. 카페24 운영도우미입니다.
다른 쇼핑몰을 보면 화려한 화면전환이나 이미지 마우스 오버 등에 화면 효과를 접해보신 경우가 있으시죠?
하지만 그 효과를 적용하기에는 디자인도 손봐야하고 소스도 고쳐야하고 적용이 쉽지 않습니다.
그럼 운영자분들의 고민을 해소하고자 카페24에서 몇 가지 기능을 추가하였습니다.
■ 사용방법
1. 쇼핑몰 어드민 > 상점/운영 > 상점운영관련설정 > 쇼핑몰 화면효과 설정을 클릭합니다.
2. 상품 이미지에 효과를 추가하거나 쇼핑몰 페이지 전환시 효과를 설정하실 수 있습니다.
[ 상품이미지 효과 ]
˙ 투명효과 사용
: 상품 리스트에서 상품이미지에 마우스를 올리면 상품 이미지가 흐릿하게 표현됩니다.
상세효과 설정을 통해 투명도 설정을 적용하실 수 있으며, 투명도가 낮을 수록 이미지가 더욱 흐려지게 표현됩니다.
˙ 흑백효과 사용
: 상품 리스트에서 상품이미지에 마우스를 올리면 상품 이미지가 흑백으로 표현됩니다.
˙ 테두리효과 사용
: 상품 리스트에서 상품이미지에 마우스를 올리면 상품 이미지에 테두리가 생성되어 표현됩니다.
테두리 색상 및 두께는 원하는 형태로 수정이 가능합니다.
※ 페이지 전환효과 설정 주의사항
˙ 페이지 전환효과를 사용하면, 쇼핑몰 전체적인 속도가 느려질 수 있으니 주의하시기 바랍니다.
˙ 페이지전환 시간은 페이지가 이동하는데 효과가 지속되는 시간으로 효과 시간이 길어질 수록 페이지 전환이 길게 느껴질 수 있습니다.
˙ 페이지 전환 효과는 쇼핑몰 전체에 적용되는 효과이며, 언제든지 수정이 가능합니다.
3. 디자인 > HTML 디자인설정 > 메인화면 또는 상품분류 화면에 이미지가 노출되는 모듈 HTML에 아래 {{$prd_effect}} 소스를 추가해주셔야 정상적으로 확인이 가능합니다.
[ 추가 소스 ]
<img src="http://{{$image_server}}/web/product/tiny/{{$image_tiny}}" width="{{$product_img_size.width}}" height="{{$product_img_size.height}}" {{$prd_effect}} style="border:1 solid {{$table_attr.td_fgcolor}}"></a>
예) 메인화면 - 4단 가로형 {prod_dis4_img} 모듈 > 상품목록{u2} 편집
4. 쇼핑몰에서 적용된 이미지 및 페이지 전환 효과를 통해 좀 더 동적인 화면 구성으로 고객유치가 가능합니다.
카페24 쇼핑몰호스팅은 쇼핑몰 운영을 보다 편리하고 쉽게 할 수 있도록
기능 업데이트를 지속적으로 진행하고 있습니다.
더 좋은 서비스가 되기 위해 노력하겠습니다.
끊임없는 애정과 관심 부탁드립니다.
궁금하신 사항은 언제든지 고객지원센터 1:1게시판으로 문의해주세요. [문의하기]
감사합니다.
카페24 드림
2010-01-28