증상 카페24 쇼핑몰 상품 상세페이지에서 (필수, 선택 옵션이 없는 경우) 상품을 장바구니에 담기 버튼을 클릭했는데 장바구니에 담기지 않거나 (필수, 선택 옵션이 있는 경우) 옵션을 선택했는데도 "필수 옵션을 선택해주세요" 경고창이 뜨는 증상 해결방법 스킨 코드의 문제가 아니라 도메인 연결의 문제이다. 도메인을 포워딩 기능을 사용하여 홈페이지를 연결하는 경우 발생하는 문제이다. 포워딩 기능을 모두 해제하고, 네임서버를 카페24로 변경하면 된다. (예시) 가비아에서 도메인을 구입한 경우 1) 가비아 로그인 후 > 마이가비아 > 서비스관리 > 해당도메인 리스트에서 [관리툴] 클릭 2) 네임서버 옆에 [설정]을 눌러 카페24 네임서버로 변경해준다. 카페24 네임서버 1차: dns1.cafe24.com (175..

얼마전에 본체를 바꿨다. 기존에 듀얼 모니터를 사용했는데, 하나는 HDMI, 하나는 VGA로 연결해서 사용하고있었다. 그런데 새로 구입한 본체에 VGA 포트가 있어서 연결했는데 화면이 안나오는거다. 이상하다 싶어서 알아봤는데 그래픽카드쪽에 꽂아야한다고.... (소프트웨어는 잘알지만 하드웨어쪽은 정말 문외한 나....) 이엠텍 Emtek GTX1050 ti 4GB 포트 구성 일단, 이엠텍 Emtek GTX1050 ti 4GB 포트는 아래처럼 되어있다. 듀얼모니터를 사용한다면 HDMI, DVI포트를 사용하거나, 아니면 HDMI 분배기를 구입해야하는데, 분배기가 생각보다 가격이 비싸길래 상대적으로 저렴한 DVI 젠더를 구입하기로 하였다 (최소 거의 6~7만원대). 사용하고 있는 모니터에는 HDMI하고, VGA..

안녕하세요. 티스토리를 운영하시는 분들은 애드핏, 구글애드센스 등 다양하게 광고를 넣으실텐데요 쿠팡파트너스의 상품 배너를 넣는 방법을 알려드리도록 하겠습니다. 스킨마다 방법은 조금 차이가 있을 수 있습니다. 저는 Odyssey 스킨을 사용중입니다. 혹시 사이드바가 없다면 꾸미기 > 스킨편집에서 PC레이아웃 사이드바 형태를 "2단 우측 사이드바"로 변경해주세요. 사이드바에 쿠팡 상품 배너 넣기 1. 꾸미기 > 스킨편집을 클릭해 [html 편집]을 클릭합니다. 2. 그러면 HTML 코드들이 나오는데 Ctrl + F 를 눌러 box-category를 검색해줍니다. 검색하면 해당 부분이 노란색으로 표시 됩니다. 이 부분이 사이드바의 카테고리 영역인데요. 사이드바의 각각의 영역은 와 로 감싸져 있는 것을 확인하실..

strpos()와 strrpos() 함수는 strstr()과 유사한 방식으로 동작한다. 하지만 strpos()의 실행 속도가 더 빠르기 때문에 strstr()대신 strpos()의 사용을 권장한다고 한다. 문장이나 특정 변수에서 특정 문자가 있는지 체크하려면 strpos(), strrpos() 함수를 사용하면 된다. strpos([대상 문자열], [조건 문자열]) strpos([대상 문자열], [조건 문자열], [검색시작위치(숫자)]) strrpos([대상 문자열], [조건 문자열]) strrpos([대상 문자열], [조건 문자열], [검색시작위치(숫자)]) 둘의 차이는 strpos 함수는 영문자의 대소문자를 구별하여 검색한다. 영문자 대소문자를 구별하지 않고 검색하려면 strrpos()함수를 사용하면 ..

브랜드 홈페이지에서 로고를 무한으로 회전시켜서 임팩트 있는 UI를 만드는것이 최근 자주 보이는 것 같다. 무한 회전하는 이미지를 CSS로만 구현이 가능하다는 사실! 코드는 매우 간단하다. .img {animation: rotate_image 6s linear infinite;transform-origin: 50% 50%;} @keyframes rotate_image{ 100% { transform: rotate(360deg); } } animation: rotate_image 6s linear infinite; rotate_image 라는 이름을 가진 키프레임을 실행시켜라 6s : 6초에 한번씩 (animation-duration) linear : 동일한 속도로 (animation-timing-funct..

회원가입이나 폼 입력시에 해당 항목에 대한 상세한 설명이 필요한 경우, 상세하게 설명을 넣을수도 있지만 필요에 따라 볼 수 있게 툴팁으로 안내가 가능하다. 생일 옆에 느낌표 아이콘에 마우스를 대보면 해당 항목에 대한 상세 설명을 툴팁으로 띄워준다. 툴팁의 배경색상이나 폰트 컬러도 변경가능하다. jquery ui 파일 로드 일단 관련된 jquery ui파일을 로드한다. html 툴팁이 나오게할 아이콘 또는 요소를 넣는다. 툴팁 설명은 title=""안에 넣으면 된다. 여기서는 Font Awesome 을 활용하였는데, 꼭 Font Awesome이 아니더라도 input, img 등 다양하게 활용이 가능하다. 스크립트 삽입 위에 넣은 툴팁 아이콘 클래스명을 알맞게 넣어주고 tooltip() 스크립트를 넣어주면 ..

Adobe XD로 앱 화면을 60페이지 넘게 작업을 마치고... 이 많은 내용을 어떻게 하면 개발자에게 잘 전달할 수 있을까 고민을 많이 했다. XD에서 프로토타입을 바로 만들어볼 수도 있지만, 개발자나 기획자에게 유저플로우를 한번에 이해시키기에는 한눈에 도식화 할 필요가 있었다. 여기저기 알아보다가 알게된 툴이 있는데 아주 좋은 것 같다! Overflow 툴 소개 The world's first user flow diagramming tool tailored for designers. Build and present beatiful user flow diagrams that tell a story. 오버플로우는 세계 최초 디자이너에게 최적화된 유저플로우 도식화 툴이다. 스토리를 말해주는 아름다운 유저플..

티스토리 자체에도 코드를 넣을 수 있는 기능은 있지만 결과를 실시간으로 보여줄수가 없는데, jsfiddle은 코드결과도 공유 가능하고, html, script, css를 나누어서 한눈에 잘 보여줘서 아주 유용하게 활용이 가능하다. 티스토리 외에도 html 입력이 가능한 블로그 어디에서나 jsfiddle를 통해서 코드를 공유가 가능하다. JS피들이란? JSFiddle은 사용자가 만든, 협업형 HTML, CSS, 자바스크립트 코드 스니펫을 테스트하고 알리기 위한 온라인 커뮤니티이다. (출저:위키백과) 블로그에 jsfiddle 코드 공유 하는 방법 1. jsfiddle.net 사이트에 접속 해서 로그인을 한다. 2. 코드를 입력한다. jsfiddle 사이트에 처음 들어가면 아래와 같이 왼쪽 상단에 HTML, ..

예전에 한 때 홈페이지에 항상 퀵메뉴가 있던 시절이 있었는데, 없어지는 듯 하다가 요새 다시 보이는 듯 하다. 아무래도 쇼핑몰이나 고객의 요구에 빨리 응해야하는 사이트에서는 퀵메뉴가 필수불가결한 요소인 것 같다. 보통 오른쪽에 완전히 고정해두는 형태(position:absolute)로 넣을 수도 있지만 완전 고정해두면 좀 유연성이 없어보이고(?) 너무 큰 사이즈로 넣는다면 사이트의 다른 구성요소보다 더 이목이 집중되는 느낌... 요새는 아래처럼 작은메뉴를 만들어 스크롤 내릴때 마다 부드럽게 따라오는 형태로 많이 사용하는 것 같다. jquery를 활용하면 부드럽게 따라오는 메뉴를 만들 수 있다. 일단 결과물은 아래 HTML 퀵메뉴를 구성하고 클래스값(quickmenu)이나 아이디를 지정한다. 등급별혜택 1..

작업을 많이 하다보면 레지스트리나 불필요한 파일들이 조금씩 생겨나면서 컴퓨터 용량을 잡아먹는다. 컴퓨터 파일 정리 프로그램이 무척이나 다양한데 최근에 알게된 깔끔한 프로그램을 소개하려고한다. Wise Disk Cleaner 와이즈 디스크 클리너 추천하는 이유 - UI가 깔끔하고 한눈에 보기 쉬움. 따로 사용 방법이 필요 없음 - 광고가 없음 - 한국어버전 지원 일반정리 일반정리를 하면 Windows시스템, 웹브라우져 캐시, 쿠키 등을 정리해준다. 요새 틈만나면 정리를 해줘서 한번 할 때마다 확보되는 용량은 적은데, 처음에 이 프로그램을 실행했을 때는 몇 기가씩이나 확보가 되었다. 그만큼 용량확보를 잘해주는 편! 고급정리 디스트별로 정리를 할 수 있다. 주기적으로 청소해주면 쾌적한 하드를 사용이 가능하다...

간혹 스킨을 편집하다 보면 가격이 제대로 표기가 안되는 경우가 있다. 이 경우 스마트디자인 편집 창에 들어가서 product > detail.html 파일을 수정해주어야한다. {$product_price}을 찾아서 {$disp_product_price} 로 변경해주기만 하면 끝! detail.html 파일안에 여러군데에 {$product_price}가 있는데 모두 찾아서 바꿔주면 된다. 주의할 점은 앞 부분의 {$product_price_display|display}는 $disp_를 추가하지 않고 그대로 두어야 한다는 점! {$disp_product_price} [적용 결과] 세자리마다 콤마가 찍히고 화폐단위(원)이 같이 나오게 된다.

placeholder="아이디를 입력하세요">이런식으로 태그에 직접 속성을 지정해주면 간단하지만 간혹 직접 지정이 어려운 경우가 있다. ex) 카페24에서는 자체 모듈(변수)로 회원가입 인풋항목을 생성하기 때문에 인풋 태그 안에 placeholder를 직접 지정해줄수가 없다.또는 제이쿼리 스크립트에 따라 속성이 추가되거나 삭제되어야하는 경우 등  이런 경우 아래의 스크립트를 넣어 해결이 가능하다.$( document ).ready( function() { $("input#member_id").attr("placeholder", "아이디를 입력하세요");}); 그러면 직접 placeholder="아이디를 입력하세요"를 넣지 않고도 동일한 결과를 얻을 수 있다.  attr()의 다양한 활용 방법제이쿼리의..

티스토리 글 단에 [구독버튼]이 작게 기본 UI로 들어가지만 실질적으로 눈에 잘 띄지는 않아서 구독하기 버튼을 조금 더 잘 노출하고 싶다면 포스팅 중간중간 삽입해주는 것이 좋다. 글 중간에 구독 버튼 넣는 방법 1. 티스토리 설정에서 [꾸미기] > [메뉴바/구독설정]페이지에 들어가 구독 버튼이 설정되어있는지 확인해야한다. 구독버튼을 '표시합니다', 구독버튼을 '오른쪽상단'에 위치합니다로 설정한다. 2. 내 티스토리 블로그 빈 화면 아무데나 데고 오른쪽 마우스를 클릭해 [페이지 소스보기]를 클릭한다. 익스플로러의 경우에는 메뉴명이 [소스보기]이다. 3. 소스보기를 하면 티스토리 코드를 확인할 수 있는데, Ctrl + F를 누르고 btn_subscription 를 검색한다. 4. btn_subscriptio..

기본 sql 구문 $sql = " select * from 테이블명 where wr_is_comment = '0' and wr_id = '{$view['wr_id']}' "; $row = sql_query($sql); 이 기본 구문은 배열로 보여주기 때문에 보통 for 문과 함께 많이 사용한다. 아래와 같이 for문과 함께 사용하면 해당되는 값을 모두 불러온다. [for문과 함께 사용 예시] $sql = " select * from 테이블명 where wr_is_comment = '0' "; $result = sql_query($sql); for ($i=0; $row=sql_fetch_array($result); $i++) { echo $row['id']; } where 조건절에 해당하는 값이 딱 한개만..

어느 분야에서든 활용하실 수 있는 직접 만든 깔끔한 견적서 양식 공유합니다. 무단 재배포는하지 말아주세요. 파일다운로드 (엑셀, pdf) #물건납품견적서 #홈페이지제작견적서 #깔끔한견적서 #견적서양식