유니버설 애널리틱스는 2023년 7월 1일부터 표준 속성의 신규 데이터를 더 이상 처리하지 않습니다. 지금 Google 애널리틱스 4 속성을 설정하고 이 속성으로 전환하여 준비하세요. 구글 애널리틱스에 접속하면 상단에 이러한 공지글(?), 알람글(?)이 표시된다. 계속 무시를 해왔지만 뭔가 불안하다. 어느새 2023년 7월 1일이 마냥 멀게만 느껴지지 않기 때문이다. 구글 애널리틱스 4가 무엇인지 이제는 파악해야 하는게 아닐까 싶어 간단히 검색하여 정리했다. 1. 지금 쓰는 구글 애널리틱스가 유니버설 애널리틱스 (일명 UA) 우리가 보통 구글 애널리틱스라고 말하면 유니버설 애널리틱스를 가리키는 것이다. Universal Analytics, 줄여서 UA라고도 부른다. 구글 애널리틱스는 Google Anal..

가상선택자 before, after에 관한 오해 물론 나만 오해했을 수 있다. (뭐야? 나만 바보야?) 처음 before, after에 대한 설명을 읽었을 때는 제대로 이해한 줄 알았는데 css 속성을 설정하면서 이상하다는 생각이 들었다. 어떤 태그에 before를 붙이면 그 태그의 형제 관계로 앞쪽에 위치하는 줄 알았다. 아니었다. before가 붙은 태그의 자식 관계에 위치한다. 예를 들어, 아래와 같은 코드가 있다고 해보자. 결과는 아래와 같다. 가상선택자 before, after로 만든 "좌", "우"라는 글씨는 div 태그 내부에 표시되는 것을 확인할 수 있다. div 태그 내부에 있는 텍스트 "기준"의 앞쪽은 before, 뒤쪽은 after 이다. 내가 처음 이해했던대로 div 태그의 형제 관..

워드프레스에서 add_filter( )와 apply_filter( ) 차이 Filter Hook인 'auth_cookie_expiration'에 대해 검색하다 보니 검색결과로 'apply_filters( 'auth_cookie_expiration', int $length, int $user_id, bool $remember )'를 나왔다. 잉? apply_filter ? add_filter와 apply_filter 차이가 무엇인지 궁금해졌다. add_filter는 Filter Hook에 사용자 정의 함수를 거는(Hook)[연결하는] 것이고 apply_fitler는 Filter Hook에 이미 걸려 있는 함수를 호출하는 것이다. 참고 자료 add_filter( string $tag, callable $fu..

jQuery(document).ready(function($){ 이게 뭐지 하다가 알게된 noConflict() '트위터 부트스트랩으로 만드는 워드프레스 테마' 책으로 실습을 하던 중 '이게 뭐지?' 싶은 것을 발견했다. 처음에는 아무 생각 없이 책에 있는 코드를 그대로 받아 적었다. 궁금했지만 우선 넘어갔다. 계속 실습을 해나가는데 다른 코드를 추가 했더니 에러가 발생했다. 크롬 브라우저 개발자 도구의 Console 내용을 보니 아래와 같이 붉은 글씨로 에러 내용이 있었다. Uncaught TypeError: $ is not a function at ... $이 함수가 아니라니 뭔 소리지? 친절하게 어디 부분이 에러인지 나와 있으니 그 부분을 뚫어져라 쳐다봤다. 처음에는 무슨 오타가 나서 이런가 싶어 ..

이미지에 링크 여러개 걸기 - , 태그, usemap 속성 활용 보통은 태그를 태그로 둘러싸는 방법으로 이미지 하나에 링크 하나 설정한다. 이미지 하나 당 링크 하나가 되는 것이다. 커다란 이미지 내에 각 요소 별로 링크를 걸 수는 없을까? 있다. 가능하다. , 태그와 태그의 usemap 속성을 사용하면 된다. 마케팅용 이메일 작성 시 기다란 통으로된 이미지를 사용하곤 한다. 이때 유용하게 활용할 수 있다. 예를 들어, 위에 사진에서 붉은색 동그라미 영역을 클릭하면 광동 옥수수 수염차 설명페이지로 이동하고, 보라색 동그라미 영역을 클릭하면 스타벅스 홈페이지로 이동한다. (※ 위에 사진은 모바일에서 제대로 작동하지 않는다. 모바일에서도 태그를 사용하려면 자바스크립트로 보완해야 한다.) 이미지에 링크 여러개..

BOM(브라우저 객체 모델) window 객체의 open 메서드 open 메서드는 새 브라우저 창을 생성할 때 사용한다. 팝업창에 자주 사용된다. window . open ( " URL 경로 ", " 창 이름 ", " 속성 설정 " ) ; open 메서드의 속성 ① top② left③ width④ height⑤ scrollbars⑥ lcoation⑦ toolbars⑧ status 예시 코드 window.open("http://connecteddots.tistory.com", "pop", "top=20, left=100, width=500, height=500, scrollbars=no, location=no, toolbars=no"); 'pop'이란 이름으로 새로운 창을 띄운다. URL 경로는 'http..

자바스크립트 필기한 내용 1. 자바스크립트 객체 구성 : 속성(Property), 기능(Method) 2. document . write - document : 객체(Object)- write : 기능(Method) 3. 객체 종류 : 내장 객체, 브라우저 객체 모델(BOM), 문서 객체 모델(DOM) - 내장 객체란 자바스크립트 엔진에 내장되어 있는 객체를 의미한다.- BOM : Browser Object Model- DOM : Document Object Model 4. 객체는 계층 구조로 되어 있다. 예를 들어, window 객체 하위에 document, location 객체가 있다. 5. DOM이란 HTML 문서 구조를 말하며 이 최상위 객체이다. 의 하위 객체로 , 가 있다. HTML의 모든 요..

웹알못을 위한 HTML 기초와 태그 사이에 넣으면 된다고 참 쉽다던 글들이 어렴픗이 떠오른다. 이런 쉬운 설명에도 잘 모르겠으면 담당 부서 또는 담당자에게 코드를 건네라고 이메일 전달 기능도 있었지만 내게는 해당되지 않았다. 태그 내에 코드를 삽입하고서도 이것이 정말 제대로 한 것인지 혼란의 연속이었다. 혹시나 나와 같은 어려움을 겪는 사람에게 이 글이 도움이 되었으면 좋겠다. 디테일 말고 큰그림 위주로 설명하겠다. 우리가 보는 웹사이트, 웹페이지는 HTML(HyperText Markup Language) 코드로 만들어진다. HTML은 웹 페이지를 만드는 언어다. 인터넷을 하기 위해서 아무생각 없이 키던 인터넷 익스플로러, 크롬은 웹 브라우저다. 웹 브라우저의 역할은 HTML로 만들어진 문서를 해석하여 ..

워드프레스 폴더(디렉터리) 구조 워드프레스 플러그인 개발을 위해 워드프레스 폴더(디렉터리) 구조부터 살펴보았습니다. 워드프레스 설치 파일을 보면 폴더(디렉터리)는 3가지였습니다. wp-admin, wp-includes, wp-content 이렇게 3가지입니다. wp-admin은 관리자 페이지와 관련 있습니다. 워드프레스 관리자로 로그인 하기 위해 "도메인/wp-admin"을 입력하는 이유입니다. wp-includes는 데이터베이스와 정보를 주고 받는데 필요한 함수, 자바스크립트 파일 등이 담겨있습니다. wp-content는 콘텐츠, 테마와 플러그인 관련 파일이 담겨 있습니다. 워드프레스 플러그인은 'wp-content/plugin'에 있습니다. 이곳에 플러그인명으로 폴더(디렉터리)를 만들면서 플러그인 개..

MySQL 데이터베이스 생성, 조회, 삭제와 사용자 생성, 권한 설정 방법 데이터베이스 생성과 조회, 삭제 데이터베이스 생성 하려면 CREATE DATABASE문을 사용합니다. 데이터베이스명은 최대 64바이트입니다. 문자형식은 utf8, 콜레이션(데이터 정렬)은 utf8_general_ci로 하겠습니다. ▶ CREATE DATABASE 데이터베이스명 CHARACTER SET 문자형식 COLLATE 콜레이션명; "CREATE DATABASE studydb CHARACTER SET utf8 COLLATE utf8_general_ci;"라고 입력했습니다. 데이터베이스명을 "studydb"로 했습니다. 생성된 데이터베이스를 확인하려면 SHOW DATABASES문을 사용합니다. ▶ SHOW DATABASES; "..