분류 전체보기

[jQuery] 스크립트로 배경 이미지 변경하기 (background-image)

보통은 jQuery로 css를 조정하는 경우, css 파일과 동일하게 속성값을 지정하면 되지만, jQuery 스크립트로 배경 이미지를 변경하고 싶은 경우에는 background가 아닌 background-image로 작성해주어야 작동이 된다. 작동X $("#section").css({"background":"url(img.png)"}); 작동O $("#section").css("background-image", "url(img.png)"); 다른 속성값과 사용할 땐 아래처럼 콤마로 구분하여 사용 가능 $("#section").css({ "background":"url(img.png)", "background-repeat" : "no-repeat", "background-position":"center c..

사업자번호 유효성/폐업여부 확인 (자바스크립트, 공공데이터포털 API)

1. 자바스크립트로 확인하기 (단순 유효성 검사) 사업자 등록번호는 123-45-67890 이런식으로 10 자리 구조이다. 이때 각 구성 요소의 의미는 아래와 같다. 123 (3자리): 국세청 / 세무서별 코드 45 (2자리) : 개인 법인 구분코드 6789(마지막4자리) : 과세/면세/법인 사업자 등록/지정일자 일련번호 0(마지막 1자리) : 검증번호 여기서 마지막 1자리로 유효한 사업자 등록번호인지 확인이 가능하다. 예를 들어 사업자번호가 123-45-67891 인 경우, 1. 마지막 자리 1을 제외한 사업자번호 앞 9자리 인증키 9자리의 각 자리수를 각각 곱하여 전부 더해준다. (인증키값 = 1 3 7 1 3 7 1 3 5) S = (1 * 1) + (2 * 3) + (3 * 7) + (4 * 1)..

[php] csv 파일 다운 한글 깨짐 해결 방법

온라인상에서 csv파일로 데이터를 다운받게하면 종종 한글이 깨져보일 때가 있다. 메모장으로 열어서 EUC-KR로 변경한 뒤 저장한다음 엑셀로 여는 방법도 있지만, 일일히 변경해서 열려면 번거롭다. 한글이 깨져보이지 않고 csv 파일을 다운 받을 수 있도록 아래 코드들을 추가하여 해결이 가능하다. 1) charset을 UTF-8로 설정한다. header('Content-type: text/csv; charset=utf-8'); 2) header아래쪽에 echo "\xEF\xBB\xBF"; 한줄(엔티안이라고 부른다고 한다)을 추가한다. echo "\xEF\xBB\xBF"; * 참고로 \xEF\xBB\xBF 이 문자는 UTF-8을 16진수로 표기한 것인데, 특정 문구를 넣어서 문서가 제대로된 캐릭터셋 값을 가..

웹폰트 소스, 시스템 폰트 TTF -> WOFF/WOFF2/OTF 웹폰트로 변환하기

구글폰트나 한글의 경우 눈누난나 사이트 이용하며 웹폰트를 쉽게 사용할 수 있지만 공개되어있지 않은 폰트의 경우 직접 웹폰트를 만들어주어야한다. TTF 파일이 있다면 웹폰트(woff, woff2, otf 확장자)로 확장자를 변경해주고, 파일들을 인클루드 해주면 쉽게 웹폰트 사용이 가능하다. 단, 웹폰트로 사용해도 저작권/라이센스 문제가 없는지 확인 후 사용해야한다. 웹폰트(WOFF, WOFF2, OTF)로 변환하기 1) 폰트 확장자를 변경해주는 https://cloudconvert.com/ 사이트에 접속한다. CloudConvert Compress Merge Capture Website Create Archive Extract Archive Convert +200 Formats Supported Cloud..

[티스토리] 티스토리 도메인으로 접속 시 개인 도메인으로 강제 이동시키기

티스토리 기본 도메인이 아닌, 따로 도메인을 구매하였다면 티스토리 관리페이지 [관리 > 블로그 > 개인 도메인 설정 영역]에서 개인 도메인을 설정하게 된다. 하지만 개인 도메인을 설정하였더라도 어딘가 남아 있던 링크를 타고 xxx.tistory.com로 접속하게 되면 접속할 수 있게 되고, 혹시나 구글 애드센스를 개인 도메인으로 신청한 경우에는 xxx.tistory.com으로 접속하면 광고가 뜨지 않게된다 (이러면 아무리 방문자 수가 많아도 아무 소용이 없게 된다.) 이를 방지하고자, xxx.tistory.com으로 접속하여도 강제로 구매한 2차 도메인으로 이동하도록 변경해주는 것이 좋은데, 간단하게 스크립트만 삽입해주면 된다. 도메인 강제 이동 스크립트 삽입하기 [꾸미기 > 스킨 편집] 에 들어가 사이..

sql 컬럼 내용 중 특정 문자 바꾸기

DB의 수많은 데이터 중에 특정 컬럼의 내용을 변경하고 싶은 경우 아래와 같이 명령문을 사용하면 된다. UPDATE 테이블명 SET 컬럼명 = REPLACE(컬럼명 ,'변경전 문자','변경후 문자') 예시 아래와 같이 하면, member 테이블에서 mb_hp 컬럼 중 '-'를 공백으로 처리하여 회원 핸드폰 번호의 -를 한번에 없앨 수 있다. UPDATE member SET mb_hp = REPLACE(mb_hp ,'-','')

[티스토리] 북클럽 Book Club 스킨 썸네일 이미지 비율 변경하기

티스토리 북클럽 Book Club 스킨을 적용하면 기본적으로 아래와 같이 썸네일이 가로로 긴 직사각형 형태로 되어있다. 보통은 썸네일을 정방형 형태로 만드는데 기본 세팅이 직사각형 형태에다 썸네일 양옆이 자동으로 잘려보여 썸네일을 정방형 형태로 보이도록 스킨을 편집해보려고한다. 썸네일 비율 변경 하는 방법 이 방법은 북클럽(Book Club) 스킨에만 해당되는 내용이며, 스킨에 따라 수정 방법이 다를 수 있다. 1. 티스토리 관리 페이지에서 스킨 편집을 누른다. 2. 스킨 편집 창에서 [html 편집 버튼]을 클릭한다. 3. HTML 수정 하기 1) HTML 영역에서 Ctrl + F를 눌러 post-item 을 입력 후 엔터를 두번하면 404번째줄 쯤에 해당 부분이 있는 것을 확인할 수 있다. 2) 40..

[오류] Swiper 오류 해결 Uncaught TypeError: Failed to execute 'getComputedStyle' on 'Window': parameter 1 is not of type 'Element'.

잘 쓰고 있던 swiper 스크립트에서 어느날 갑자기 이런 오류가 떴다. Uncaught TypeError: Failed to execute 'getComputedStyle' on 'Window': parameter 1 is not of type 'Element'. 구글링해봤더니 Window에 파라미터를 지정해야 해결이 가능한것 같은데, 그동안 잘 작동하던게 갑자기 오류가 뜬 경우라 스크립트를 수정하고싶지는 않았다. 혹시나하고 swiper-bundle.min.js 경로를 다른 것으로 변경해보았더니 해결되었다. 기존에 swiper-bundle.min.js 을 외부링크로 불러와서 사용했는데 업데이트가 되면서 일부 코드와 맞지 않았던게 있던 것 같다. 이럴 땐 다른 파일로 변경해보면 해결이 될 수 있겠다. 기..

[그누보드] 아이코드 SMS 문자보내기

글등록시, 회원가입 완료 시 등 여러 상황에서 활용 가능한 문자보내기 코드. 발신번호는 아이코드에서 미리 등록한 발신번호만 가능하고, 환경설정에서 문자 사용 체크되어있는지 꼭 확인 필요! (발신번호 사전등록하기 : http://www.icodekorea.com/callback_reg/number_register.php) $sms_contents = "문자내용"; // 핸드폰번호에서 숫자만 취한다 $receive_number = preg_replace("/[^0-9]/", "", $row['mb_hp']); // 수신자번호 $send_number = preg_replace("/[^0-9]/", "", $sms5['cf_phone']); // 발신자번호 if ($config['cf_sms_use'] == '..

UX/UI 디자이너라면 읽으면 좋을 책 추천 LIST

인터넷 서칭하면서 읽고 싶은 책들을 메모해두었는데 블로그에도 정리해서 올려본다. 올해 안에 다 읽어볼 수 있을지...ㅎㅎ 훅: 일상을 사로잡는 제품의 비밀 전 세계 UX 분야 스테디셀러! 일상을 사로잡고 습관이 되는 제품의 비밀! https://product.kyobobook.co.kr/detail/S000061354159 훅: 일상을 사로잡는 제품의 비밀 | 니르 이얄 - 교보문고 훅: 일상을 사로잡는 제품의 비밀 | 전 세계 UX 분야 스테디셀러! 일상을 사로잡고 습관이 되는 제품의 비밀!‘훅(Hooked)’이란 뭔가를 대단히 즐기고 거기에 빠져 있다는 의미다. 이 의미를 살려 product.kyobobook.co.kr 구글은 어떻게 디자인하는가 모든 사람을 끌어안는 제품을 디자인하라! 숨겨진 차별을..

[카페24] 네이버페이 버튼이 노출되지 않는 경우

네이버페이 승인 받아, 공통인증키 연동도 하였는데 네이버 페이 버튼이 상품페이지와 장바구니에 노출되지 않는 경우 다음의 과정을 체크해보는 것이 좋다. 1) 네이버페이 사용 관련 설정 [카페24 관리자페이지 > 판매채널 > 네이버 > 네이버페이 설정]에 접속하여 노출함/사용함에 체크가 되어있는지 다시 한번 확인한다. 네이버페이 구매 버튼 노출 : 노출함 주문연동 : 사용함 2) 분류별 설정 [상품 > 분류관리 > 상품 분류 관리]에 접속하여 분류별로 가장 하단의 네이버페이 서비스 '사용함'으로 되어있는지 확인한다. 사용안함으로 되어있다면 것은 모두 사용함으로 변경해주고, 하위 분류 동시 적용에 체크하면 하위 카테고리까지 모두 적용된다. 3) 상품별 설정 위의 과정까지는 보통 디폴트 값으로 '사용함'으로 되..

[카페24 오류] 비밀번호 변경/재설정 페이지가 계속 뜨는 경우

쇼핑몰에서 비밀번호 찾기 후, 비밀번호 재설정을 했는데 반영이 되지 않고 계속해서 로그인할 때마다 비밀번호 재설정 페이지가 뜨는 오류가 발생하였는데, 원래 코드로 다시 넣어도 동일한 현상이 반복되었다. 알고보니 layout.html 파일을 수정하면서 핵심 코드가 빠져있었던 것이였다. layout/basic/layout.html 파일에서 태그 다음에 아래 두줄이 들어가 있는지 확인하고, 없으면 추가해주어야한다. 스킨 편집할 때 핵심 코드 빠지지 않게 주의★

[클래스101 강의] 트렌드코리아 2023, 김난도 교수

트렌드코리아는 한 해의 트랜드를 미리 공부하기 위해 종종 책으로 접했는데, 클래스 101에서 강의로 나오게 되어 보게 되었다. 강의로 보니 이야기 듣듯이 편하게 볼 수 있어서 휘리릭 보기 좋았다. 강의 들으면서 기억해두기 위해 적은 것들 정리해 본다. 서울대 소비트렌트 분석센터의 2023 전망, 트렌트코리아 2023 더 높은 도약을 준비하는 검은 토끼의 해 2023 Trend Keyword 'RABBIT JUMP' [R]edistribution of the Average : 평균실종 정규분포가 아닌 집단이 많아져 평균이 의미가 없어짐. 1) 양극화 : 어정쩡한 소비를 하지 않고, 고가품과 초가성비 상품이 동시에 인기 2) 다극화, N극화 : 사람마다 취향이 다양화됨. 고객 한사람 한사람을 위한 제품이 생..

tip
[영카트] 주문상태 '배송' 7일 뒤 자동으로 '완료' 처리하기

영카트에 기본적으로 배송 완료 후, 포인트를 n일 후 지급하는 기능은 있는데, '배송' 상태 n일 후 자동으로 주문상태를 '완료' 처리되는 기능은 따로 없는 것 같아 배송 처리 후, 7일 뒤에 자동으로 주문상태를 '완료'로 변경하도록 하는 코드를 추가하였다. 관리자가 자주 방문하는 페이지 상단에 추가하면 된다. 나의 경우에는 자주 들어가는 adm/index.php 파일 상단에 추가해두었다. 배송처리후 7일 뒤가 아닌 다른 일수를 넣고 싶으면 86400 * 7 부분의 숫자 7을 변경하면 된다. $beforedays = date("Y-m-d H:i:s", ( time() - (86400 * 7))); // 86400초는 하루 $sql2 = " select * from {$g5['g5_shop_order_ta..

absoulte인 div 가운데 정렬하는 여러가지 방법

HTML 컨텐츠 예전 같으면 하나의 div를 position:absolute로 가운데 정렬하려면 아래와 같이 div의 절대 크기를 지정한 뒤 (width:900px), margin-left를 사용하여 박스 크기의 절반만큼 빼주는 방식을 사용하였다. 이게 가장 정확한 방법이긴 한데, 반응형으로 작업하다보니 일일히 박스 크기를 지정하는게 여간 수고스러운 일이 아니다. .contents { position: absolute; left: 50%; width: 900px; margin-left: -450px; } 절대적인 크기를 따로 지정하지 않고도 자동으로 가운데 정렬하는 방법은 아래와 같다. 가로로 가운데 정렬하기 방법1) .content { position: absolute; left: 0; right: 0..