앱 개발 노트

Nesting – scss 문법 1

sass 와 scss 에서 가장 중요한 특징 중 하나가 네스팅(nesting)이다. 네스팅은 한국말로 ‘둥지를 틀다’라는 뜻이지만, Sass 에서는 하나의 정의 안에 또 다른 정의를 하는 것을 말한다. 언듯 이해하기가 힘들 수 있으니, 예를 들어보자. 아래처럼 css 를 쓰려면 하나의 { } 안에 하나의 요소만 정의할 수 있다. 하지만, scss 또는 sass 에서는 하나의 { } 안에 … Nesting – scss 문법 1 더보기

워드프레스 네이버 블로그 싱크 연동 플러그인 IdeaNaverSync 를 Custom Post Type 에 적용

워드프레스와 네이버 블로그를 연동해주는 플러그인으로 IdeaNaverSync 가 있다. 원래 NaverSync 라는 플러그인이 있었는데 더이상 작동하지 않고, IdeaNaverSync 가 활용가능한 유일한 플러그인인 것 같다. 코드를 뜯어보니 무척 짜임새 있게 잘 만들어져 있다. 그런데, 문제가 있다. Contents1 IdeaNaverSync 는 Custom Post Type 에서 작동하지 않는다.1.0.1 ⓐ 제 1단계 작업1.0.2 ⓑ 제 2단계 작업1.0.3 ⓒ 제 3단계 작업1.0.4 … 워드프레스 네이버 블로그 싱크 연동 플러그인 IdeaNaverSync 를 Custom Post Type 에 적용 더보기

sass vs scss 문법 차이

sass 와 scss 는 SASS 의 두가지 형태이다. 각각 파일 확장자가 sass 나 scss 로 끝난다. sass 나 scss 나 모두 똑같이 css 파일로 컴파일되지만, 문법에 있어 약간의 차이가 있다. 각자 장단점이 있지만, scss가 최신 문법으로 css 에 보다 가깝고 최근에는 더 보편적으로 쓰인다. 매우 단순하게 차이점을 정리하면, sass 는 인텐트에 기반한 문법이고 scss 는 … sass vs scss 문법 차이 더보기

Sass 는 무엇이며 어떻게 설치하나요? – Sass 설치방법

Contents1 SASS 는 무엇인가?2 SASS 설치방법 – Command Line 을 이용하기3 SASS 를 CSS 로 컴파일하기 – 커맨드라인4 SASS 를 css 로 컴파일하기 – 전용 프로그램 사용 SASS 는 무엇인가? Sass 는 preprocessor 이다. Preprocessor는 이미 존재하는 다른 랭귀지를 확장하여 그 작업을 더 간편하게 또는 빠르게 해주는 도구이다. Sass 는 css 작업을 위한 preprocessor인 셈이다. … Sass 는 무엇이며 어떻게 설치하나요? – Sass 설치방법 더보기

Owl Carousel 워드프레스 적용

슬라이드 프로그램 중에 제일 널리 사용되는 것이 아마도 Owl Carousel 인 듯 하다. 사용법도 간단하고, Api 문서도 잘 정리되어있고, 예제도 많이 퍼져있다. 그런데, 버전 업이 되면서 의미있는 변화가 있었고, 예전의 예제가 이제는 잘 적용되지 않는다. 새로운 예제들이 업로드 되려면 꽤 시간이 흘러야 할 것 같다. Owl Carousel 은 특별한 작업없이 바로 워드프레스로 가져다 쓸 수 … Owl Carousel 워드프레스 적용 더보기

php date timezone : PHP 타임존 설정

PHP date timezone 설정은 서버 수준에서 꼭 해주는 것이 좋다. php 서버에서 타임존 설정 php.ini 파일을 찾아 수정해주어야 하는데, 서버의 종류에 따라 php.ini 파일의 위치가 상이 하므로 다음 명령을 프롬프트 창에서 실행해주면 자신의 파일 위치를 찾을 수 있다. php –ini | grep php.ini 그런데, 위 명령이 항상 올바른 패스를 찾아주는 것은 아니다. php 7.0 은 … php date timezone : PHP 타임존 설정 더보기

워드프레스 디버깅 die 사용하기

처음 워드프레스를 시작했을 때, 디버깅이 무엇인지 조차 몰랐다. 그냥 워드프레스 소스파일에 나와있는 코드들을 if else while 그런 영어단어의 뜻과 = + – 같은 연산자들의 의미와 함께 유추해서 이해하려고 밤낮을 보냈다. 학원이란 곳을 좋아하지도 않을 뿐더러, 그 당시만해도 워드프레스는 한국에서는 생소해하던 시절이라 이를 가르치는 학원조차 없었다. 내가 다른 코딩을 배워본적도 없던 터라 참 막막했다. 암호 풀이 … 워드프레스 디버깅 die 사용하기 더보기

jquery validate – classes

jQuery Validate 가 기본적으로 지원하는 클라스의 종류입니다. required email url date dateISO number digits creditcard 이 코드를 확인해보면 기본 클라스가 어떻게 지정되었는지 알 수 있습니다. html 에서 다음과 같이 class 를 지정해주면 jquery validate 가 알아서 유효성 체크를 해줍니다. <input type=’text’ class=’required creditcard’ name=’credit-card’ />

워드프레스 태그 + 포스트타입 으로 검색하기

워드프레스는 태그별 카테고리별로 클릭하여 글목록을 출력할 수 있다. 그런데, 하나씩만으로는 부족한 경우를 경험하기도 한다. 예를 들면 포스트타입 안에서 태그별로 검색해야하는 상황말이다. 그래서 간단한 팁을 올려본다. example.com/tag/blue?post_type[]=custom example.com/tag/blue?post_type[]=post or example.com/tag/blue?post_type=custom example.com/tag/blue?post_type=post   위와 같은 주소형식을 링크로 구현하면 된다. 검색창을 하나 만들어서 드랍다운 선택 버튼에서 태그와 포스트타입을 선택하게 하고 검색을 누르면 해당 페이지로 이동하는 식으로 하면 쉽게 … 워드프레스 태그 + 포스트타입 으로 검색하기 더보기

워드프레스 사용자 설정 ( role and capabilities ) 초기화 하는 법

워드프레스 플러그인을 설치하고 지우다보면 원하지 않는 사용자 설정 ( role, capabilities ) 이 생겨난다. 그냥 사용해도 큰 문제가 없는 경우가 대부분이지만, 아무래도 보기에 좋지 않다. 워드프레스 사용자 설정 초기화 과정 사용자 설정 플러그인 사용 User Role Editor 를 설치한다. wp-config.php 파일 하단에 다음과 같이 하이라이트 된 define(‘URE_SHOW_ADMIN_ROLE’, 1); 부분을 삽입한다. define(‘WP_DEBUG’, true); define(‘FS_METHOD’, ‘direct’); // … 워드프레스 사용자 설정 ( role and capabilities ) 초기화 하는 법 더보기