abc.com의 도메인을 쓰고 있는데, en.abc.com 처럼 기본 도메인 앞에 특정한 문자를 추가해 서브도메인을 사용하고 싶은 경우 카페24에서 쉽게 설정할 수 있다. 동일한 사이트에 한글/영문버전으로 나눠서 사용하는 경우 서브도메인을 많이 사용한다. 아래의 설명은 카페24 기준으로 설정 방법을 설명하지만, 가비아나 다른 서비스도 설정 방법은 비슷하다. 서브도메인이란? 도메인 네임 시스템(DNS) 계층에서 서브도메인(subdomain) 또는 하위 도메인은 다른 주도메인의 일부인 도메인이다. 예를 들어 example.com이라는 웹사이트의 일부로서 온라인 스토어를 제공하게 된다면 서브도메인 shop.example.com을 사용할 수 있다. (출저 : 위키백과) 카페24 서브도메인 설정 방법 1. 카페2..

SmartEditor2 (스마트에디터2)란? WYSIWYG 모드 및 HTML 편집 모드와 TEXT 모드를 제공하고, 자유로운 폰트 크기 설정 기능, 줄 간격 설정 기능, 단어 찾기/바꾸기 기능 등 편집에 필요한 다양한 기능을 제공하는 네이버에서 만든 에디터 http://naver.github.io/smarteditor2/user_guide/ SmartEditor2 사용자 가이드 · GitBook No results matching "" naver.github.io 스마트에디터의 기본글꼴은 돋움 9pt로 초기 설정되어있다. 스마트에디터 글꼴 목록에 글꼴 추가하는 방법 1) 스마트에디터를 불러오는 스크립트 내의 옵션 htParams 안에 한줄 추가한다. aAdditionalFontList : [["Noto ..

Owl Carousel는 jquery 기반으로 반응형, 터치 기능을 제공하는 이미지 슬라이더이다. https://owlcarousel2.github.io/OwlCarousel2/ Home | Owl Carousel | 2.3.4 Modules and Plugins Owl Carousel supports plugin modular structure. Therefore, you can detach plugins that you won't use on your project or create new ones that fit your needs owlcarousel2.github.io 그런데 Owl Carousel 옵션에 margin:0, items:1 을 넣어 이미지 하나씩 나오도록 설정하여 사용하였는데, 오..

ajax란? AJAX란 비동기 자바스크립트와 XML (Asynchronous JavaScript And XML)을 말한다. 간단히 말하면, 서버와 통신하기 위해 XMLHttpRequest 객체를 사용하는 것을 말한다. JSON, XML, HTML 그리고 일반 텍스트 형식 등을 포함한 다양한 포맷을 주고 받을 수 있다. AJAX의 강력한 특징은 페이지 전체를 리프레쉬 하지 않고서도 수행 되는 "비동기성"이다. 이러한 비동기성을 통해 사용자의 Event가 있으면 전체 페이지가 아닌 일부분만을 업데이트 할 수 있게 해준다. 출저 : MDN Web docs 정리하자면 ajax의 가장 큰 특징 두가지는 페이지 새로고침 없이 서버에 요청하고, 서버로부터 데이터를 받고 작업을 수행한다는 것이다. 아마 웹이나 앱개발을..

최근 모니터를 바꾸고 난 뒤, 포토샵에서 이미지를 열면 이미지가 이상하게 탁해보이는 증상이 생겼다. 이미지 파일을 이미지 뷰어로 보았을 때는 원래 색상대로 잘 나오는데, 포토샵으로 이미지를 열었을 때, 또는 포토샵으로 수정한 뒤 저장했을 때 색감이 이상하게 바뀌었다. 이 문제는 모니터 색상 설정과 포토샵 색상설정이 일치하지 않아 발생하였다. 따라서 제어판 설정과 포토샵 설정을 모두 바꿔줘야한다. 모니터 색상과 포토샵 색상이 일치하지 않을 때 해결 방법 제어판 색관리 설정 변경 1. 제어판 > 색 관리에 들어가서 '이 장치에 내 설정 사용'에 체크한다. 2. '이 장치에 연결된 프로필' 아래의 [추가] 버튼을 클릭한다. 3. 목록에서 sRGB IEC61966-2.1을 찾아 선택한 뒤, 확인을 클릭한다. 3..

티스토리 글 하단 하트 클릭하는 부분에 "이 글이 도움되셨다면 하트를 눌러주세요" 안내 문구를 넣는 방법을 공유하고자한다. 이런 문구가 있다면 글에 도움을 받은 분들이 조금 더 적극적으로 하트를 누르지 않을까해서 안내 멘트를 넣게 되었다. 방법은 아주 간단하다. 스킨편집에 들어가서 HTML 파일에서 ctrl+f를 눌러 을 찾아 로 교체하고, 그 아래 코드를 추가해준다. 아래 코드로 교체한다. 이 글이 도움 되셨다면 하트를 눌러주세요. 위치 조정하기 스킨마다 CSS가 조금씩 달라서 혹시 위치가 잘 안맞는다면 top:-120px 부분의 숫자를 조정하면 된다. 음수의 숫자를 더 크게할수록 더 위로 올라가고, 작게 할수록 더 내려간다. .heart_tooltip {position:absolute;left:0;t..

프린트할 페이지 안에 아래와 같은 버튼을 넣으면 해당 페이지를 인쇄할 수 있는 창이 뜨게 된다. 하지만 이 인쇄창에는 머리글, 바닥글이 기본적으로 나오게되고 불필요한 정보들을 담고 있다. 사용자가 인쇄창 옵션에서 머리글과 바닥글에 해제해서 인쇄해도 되지만 따로 설정을 하지 않아도 머리글과 바닥글이 인쇄가 되지 않게 설정하도록 하려고한다. 방법 방법은 바로 css를 이용하는 것! 인쇄할 페이지 내에 아래의 코드를 넣어준다. 머리글과 바닥글은 페이지의 여백이 있어야 넣을 수가 있는데, 페이지의 여백을 아예 없애주어 머리글과 바닥글이 들어가지 못하도록 하는 원리이다. css코드 @media print { @page { margin: 0; } body { margin: 1.6cm; } } 결과 인쇄페이지의 머리..

bxSlider 다양한 옵션을 제공해주어 사용하기가 편해 웹에서 많이 사용되는 이미지슬라이더 bxslider https://bxslider.com/ jQuery Content Slider | Responsive jQuery Slider | bxSlider Coded with ♥ by bxslider.com bxSlider 깃허브를 확인해보니 responsive jQuery content slider 라고 써있다. 어느 기기에서나 조정이 되는 Fully responsive 라고... 기존 bxSlider bxSlider는 기본적으로 반응형을 제공하기는 하지만 화면을 줄이면 전체적으로 사이즈가 작아지는 것일 뿐, 보여지는 슬라이드 갯수를 반응형으로 조절해주지는 않는다. 화면이 작아지는데 슬라이드 갯수를 그대..

자바스크립트에서 유용하게 사용되는 onclick. 모든 브라우저에서 지원이 된다. 불가피하게 링크 태크 a 사용이 어려운 경우 onclick으로 링크 연결을 하는 경우가 종종 있는데, onclick으로도 이동할 페이지를 현재창/새창/상위프레임/팝업으로 다양하게 열 수 있다. 1. 현재창에서 열 때 onclick="location.href='링크주소'" 2. 새창으로 열 때 onclick="window.open('링크주소')" 3. 상위 프레임에서 열 때 onclick="parent.location.href='링크주소'" 4. 팝업창으로 열 때 onclick="window.open('링크주소','창이름','width=가로사이즈,height=세로사이즈,left=왼쪽위치,top=상단위치');" 팝업의 경우 옵..

슬라이더를 사용하거나 버튼에 들어갈 이런 화살표가 필요한 경우, 예전에는 이미지로 많이 넣었지만 요새는 디바이스 크기가 너무나도 다양해져서 해상도에 따라서 좀 깨져보이기도 한다. 어느 상황에서도 깨져보이지 않게 css로 그려보도록 했다. ::after 요소를 사용해서 border를 넣어 각도를 조절하면 쉽게 화살표를 만들 수 있다. 비슷하게 "CSS만으로 X 버튼 만드는 두가지 방법" 은 이 글 참고 CSS만으로 X 버튼 만드는 두가지 방법 닫기 버튼 만드는 경우 그냥 X 쓰기에는 세로로 긴 알파벳 모양이라 디자인적으로 좀 그렇고, 이미지로 사용하기에는 살짝 귀찮고했는데, CSS 만으로 X 버튼 만들기가 가능하다는 사실!! 첫번째 hongpage.kr CSS 코드 .arrow { position:..

문제상황 phpMyAdmin에서 칼럼을 수정하거나 삭제하려고할 때마다 #1067 -'ct_time'의 유효하지 못한 디폴트 값을 사용하셨습니다. 라고 오류가 발생한다. ct_time 컬럼 형식은 datetime이고 기본값이 0000-00-00 00:00:00 이었는데, 기존에 서버에 설치해서 사용할 때는 아무 문제 없다가 이번에 새로운 서버에 새롭게 영카트를 설치하면서 문제가 발생했다. 이 문제는 mysql 5.6 이후로 mysql 문법이 엄격해지면서 발생한다고 한다. mysql 5.5 이하 버전에서는 기본이 false 였지만, 5.6부터는 기본이 true 여서 발생하는 문제. 5.6의 문법에 맞게 입력하거나 아래의 방법으로 해결이 가능하다. 해결방법 SQL_MODE에서 "NO_ZERO_IN_DATE,N..

네이버 블로그로는 각종 리뷰, 일상적인 것들을 올리고 있었는데 내가 작업했던 코드들을 기록해놓을 만한 또 하나의 블로그가 필요해졌다. 네이버 아이디를 하나 더 만들어서 운영할까 하다가 코드의 경우 구글로 많이 검색하기도하고, 구글 애드센스와 친화적인 티스토리를 선택하게 되었다. (이왕이면 미미하게라도 수익이 나면 좋으니까) 구글 애드센스란? 구글 애드센스(Google AdSense)는 구글에서 제공하는 서비스로, 제작한 웹사이트, 앱 페이지나 블로그 글에 애드센스 광고를 붙이면 광고 수익의 일부를 받을 수 있는 서비스이다. 보통 해당 페이지와 가장 연관성 높은 광고가 나오게 된다. 애드센스 신청 과정 애드센스를 통해 홈페이지나 블로그로 수익을 얻을 수 있다는 장점이 있지만, 아무나 가능한 것은 아니다. ..

오랜만에 워드프레스 로그인을 하는데 다른건 잘 작동되는데 wp-admin 폴더만 접속하려고하면 403 forbidden 에러가 떴다. 스팸도 많고, 보안 이슈도 많은 워드프레스... 꼭 몇달에 한번씩 이렇게 문제가 생기네. 구글링해서 루트폴더에 있는 .htaccess를 삭제해보기도하고, 퍼미션을 변경해보기도하고, 플러그인 폴더명을 바꿔보기도는 등 여러가지 해결방법을 적용해보았는데도 /wp-admin 하위 파일만 접속이 안되는거다. 에러 내용 Forbidden You don't have permission to access /wp-admin/ on this server. 그러다 불현듯 wp-admin 폴더 안의 .htaccess 파일을 확인해보니 이 파일이 문제였었다. wp-admin 폴더에 아무도 접근하..

닫기 버튼 만드는 경우 그냥 X 쓰기에는 세로로 긴 알파벳 모양이라 디자인적으로 좀 그렇고, 이미지로 사용하기에는 살짝 귀찮고했는데, CSS 만으로 X 버튼 만들기가 가능하다는 사실!! 첫번째 방법 : content: "\00d7" 를 활용 :after 에 content: "\00d7"; 만 추가해주면 아주 간단하게 X 버튼이 가능하다. .close {display:inline-block;*display:inline;} .close:after {display: inline-block;content: "\00d7"; font-size:15pt;} 그러면 이렇게 딱 깔끔한 X 버튼을 만들 수 있다. 크기는 font-size로 조정하면 되고 크기를 키울 수록 굵기가 자동으로 굵어진다. 두번째 방법 : tran..

javascript로 ajax를 활용하여 값을 저장 불러올때 오류가 나는 경우, 아래와 같은 코드를 추가해주면 어디서 오류가 나는지 알 수 있다. success: function(result) { if (result) { alert("완료"); } else { alert("전송된 값 없음"); } }, error: function() { alert("에러 발생"); } [적용예시] $.ajax({ type:"POST", url:"/shop/ajax_uploader.php", data: { it_id : it_id, is_id : is_id }, contentType: "application/json", success: function(result) { if (result) { alert("완료"); } ..