본문 바로가기
반응형

분류 전체보기

 (510)
구글 판매자센터 설정하기 설정하기 '성장' -> '프로그램 관리' -> 열린 화면에서 '쇼핑광고' '시작하기' 선택 좌측에 메뉴를 하나씩 체크해 나가면 되는데요. 1. 비즈니스 세부정보 추가 주소를 입력하고 저장합니다. 전화번호를 인증합니다. 사업자 번호 (형식: 111-11-11111)를 입력하고 '저장' -> '계속'을 누릅니다. 2. 사이트 소유권 주장 소유권은 사이트 공통헤드에 인증용 메타테그 삽입, 파일 업로드, 또는 사용 중인 구글애즈 등의 태그를 활용하는 방법이 있습니다. 사이트에 연결된 다른 구글 제품이 있는 경우 아래 '다른 방법 보기'를 선택하여 해당 제품을 선택하고 인증하기를 누릅니다. 만약, 사이트에 삽입된 다른 제품의 태그가 없거나 사용하고 있지 않은 경우 'HTML 파일 업로드'를 선택하여 인증용 메타 ..
구글 판매자센터 제품추가하기 구글 판매자센터는 광고에 사용할 상품을 등록하고 활용하는 온라인 창고와 같습니다. 상품을 등록하는 방법을 여러 가지가 있는데 각 방법에 대해 알아보겠습니다. HTML 삽입 미리보기할 수 없는 소스
Firebase Storage (Angular, React) 파이어베이스 스토리지는 이미지 등 Static 파일을 저장할 때 사용합니다. 파이어베이스 스토리지 사용하기 계정으로 로그인한 뒤 좌측 메뉴에서 'Build' -> 'Storage' 선택 후 열린 화면에서 'Get started'를 누릅니다. 편의를 위해 'test mode'를 선택하고 'next'를 누릅니다. 지역선택 후 'done'을 누르면 (이미 지역이 선택되어 있는 경우 자동을 선택됨) 아래와 같이 완성됩니다. 애플리케이션과 연동하기 앵귤러 스토리지를 사용하기 위해 먼저 앵귤러와 파이어베이스를 연결합니다. 1. 앵귤러에 파이어베이스 연결하기 Firebase - angular 연결하기 먼저, 앵귤러 프로젝트 콘솔에서 아래와 같이 @angular/fire 모듈을 설치합니다. ng add @angular..
기본 스타일 - 리셋 CSS의 각 요소는 미리 지정된 기본 스타일을 가지고 있습니다. 예를 들어 요소의 경우 기본적으로 마진을 가지기 때문에 화면에 아래와 같이 표시됩니다. 문제점 기본 스타일은 때에 따라서 필요한 경우도 있지만 스타일 작업 시 기본 스타일도 고려하려야 하기 때문에 스타일링 작업을 힘들게 하는 요소로 작용합니다. 또 브라우저마다 각 요소의 기본 스타일이 다르게 설정되어 있어 같은 웹사이트라도 브라우저마다 다르게 표시되어 사용자에게 부정적인 경험을 줄 수 있겠죠. 기본 스타일 제거하기 따라서, 스타일 작업에 앞서 기본 스타일을 제거하거나 일반화하는 작업이 필요한데요. 아래와 같은 방법 중 하나로 가능합니다. 1. CSS reset 말 그래도 CSS 스타일을 리셋하고 시작하는 방식으로 아래와 같은 코드를 사용합니..
자바스크립트 컴포넌트 - 고무고무 카드 바닐라 자바스크립트로 제작된 컴포넌트로 웹 사이트 메인 헤더로 활용가능합니다. 마우스를 카드 위로 가져가면 해당 카드가 확장되는 기능을 가지고 있습니다. 구현 먼저 HTML에 사용할 만큼 박스를 아래와 같이 지정합니다. 애플리케이션의 특성상 바탕색이나 배경이미지는 아래와 같이 인라인 스타일로 삽입하는 방식이 구현에 편리합니다. 아래와 같이 스타일을 지정합니다. 개인적으로 각 요소는 기본적으로 가지는 스타일 리셋을 하고 각각의 스타일을 지정하는 방식을 선호합니다. 플렉스 속성의 grow를 활용하면 쉽게 구현이 가능합니다. /* main.css */ * { margin: 0; padding: 0; box-sizing: border-box; } body { height: 100vh; background-col..
앵귤러 directive - RouterLinkActive (활성화된 링크 표시하기) 앵귤러 라우터는 활성화된 링크를 표시해 주는 기능을 제공하는데요. 구현하기 1. 앵귤러라우터 추가하기 앵귤러 라이브러리 - Angular Router 앵귤러는 싱글페이지 애플리케이션으로 URL경로가 바뀌지 않는데요. 하지만 앱의 구조상 페이지 분리가 필요할 때도 있습니다. 앵귤러 라우팅은 이러한 기능을 담당하는 모듈로 사용법을 알아 jin-co.tistory.com ★ 모듈이 분리된 경우 라우터를 사용하는 모든 모듈에 라이터모듈을 추가해야 합니다. 2. 활성화된 메뉴표시하기 앵귤러라우터의 RouterLinkActive는 해당링크가 활성화되었을 때 부여된 값을 해당 요소에 클래스로 추가합니다. 해당 클래스에 스타일 추가하면 간단하게 활성화된 메뉴를 시각적으로 표시가 가능하겠죠. routerLinkActiv..
구글 애널리틱스 (UA) 동적 리마케팅 설치 작동원리 애널리틱스에 수집된 제품정보는 연동된 애즈계정으로 유입되고 이를 동적리마케팅 광고에 활용 가능합니다. 사용설정 1. 리마케팅 사용 설정 화면 좌측하단에 '관리' -> 열린 화면의 속성 항목에 '추적정보' -> '데이터 수집' 순으로 선택 ※ 신호 데이터 활성화 (구글 로그인 정보를 사용자가 사용하는 다른 기기 간에 공유하는 기능)는 선택사항으로 사용을 원하는 경우 아래 파란색 배경 배너에 '시작하기'를 누르고 '계속' '활성화' 순으로 누릅니다. 본론으로 돌아와, 리마케팅 하단에 버튼을 눌러 '설정' 상태로 변경합니다 (광고보고서 기능은 자동으로 켜지며 리마케팅 없이 광고 보고서 기능 사용은 가능하나 리마케팅 사용 시 광고보고서 기능은 필수). 2. 맞춤 측정기준 생성 위 설정 후, '관리' -..
파이어베이스 (스토리지) - 앵귤러, 리액트 파이어베이스 스토리지는 이미지 등 Static 파일을 저장할 때 사용합니다. 파이어베이스 스토리지 사용하기 계정으로 로그인한 뒤 좌측 메뉴에서 'Build' -> 'Storage' 선택 후 열린 화면에서 'Get started'를 누릅니다. 편의를 위해 'test mode'를 선택하고 'next'를 누릅니다. 지역선택 후 'done'을 누르면 (이미 지역이 선택되어 있는 경우 자동을 선택됨) 아래와 같이 완성됩니다. 규칙지정 기본적으로 누구나 스토리지의 데이터에 접근, 수정, 삭제가 가능합니다. 세팅의 규칙에서 이러한 설정의 수정이 가능합니다. 예를 들어, 로그인한 유저만 파일업로드가 가능하고 사이즈와 타입의 제한이 있는 경우 아래와 같이 규칙을 수정합니다. match /{allPaths=**} { al..
728x90

티스토리툴바