> For the complete documentation index, see [llms.txt](https://docs.ledu.kr/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.ledu.kr/meta/init.md).

# 메타 픽셀 설치하기

<figure><img src="/files/8sL6jNOt01x0SMk4Zaft" alt=""><figcaption></figcaption></figure>

## 메타 픽셀이 무엇인가요?

메타 픽셀은 로워드 브릿지 강의 호스팅에 방문한 사용자의 행동을 기록해서 광고에 활용할 수 있도록 도와주는 추적 도구입니다. 쉽게, 누가 우리 사이트에서 무엇을 했는지 메타에 알려주는 역할을 합니다.

메타 픽셀이 있으면 광고를 보고 누가 들어왔고, 그 사람이 어떤 행동을 했는지 추적이 가능합니다.

#### 구글 애널리틱스랑 뭐가 다른가요?

구글 애널리틱스와 메타 픽셀은 기능적으로 다릅니다.

| 구분    | 메타 픽셀        | 구글 애널리틱스   |
| ----- | ------------ | ---------- |
| 목적    | 광고 최적화       | 통계 분석      |
| 주 사용처 | 페이스북, 인스타 광고 | 전체 방문 분석   |
| 핵심    | 누가 전환했는가?    | 어떻게 이용했는가? |

### 메타 픽셀 설정 방법

[메타 광고 관리자](https://adsmanager.facebook.com/)에 로그인하신 뒤, 아래 사진의 비즈니스 포트폴리오 만들기를 통해 광고 계정을 생성해야합니다.

<figure><img src="/files/gREqRGliEeJAhtnKpX9V" alt=""><figcaption></figcaption></figure>

해당 버튼을 클릭하면 아래 사진과 같은 팝업이 나타나게 되는데, 해당 팝업에서 빈 칸 없이 모든 내용을 채워주세요.\
채워진 내용을 기반으로 담당자 설정등을 진행하실 수 있습니다.

<figure><img src="/files/nZ40eht2lJJCjo4Tw44e" alt=""><figcaption></figcaption></figure>

광고 계정 설정이 완료되었다면, 아래 사진과 같은 화면으로 접근하여 메타 픽셀 설정을 진행해야 합니다.\
좌측 관리자 메뉴 내에서 이벤트 관리자 메뉴를 클릭하여 이동해 주세요.

<figure><img src="/files/UORo7Qx4AouWX4lNPLeP" alt=""><figcaption></figcaption></figure>

이벤트 관리자로 접근하면 데이터 연결 버튼이 나타나는데,\
해당 버튼을 클릭하여 신규 데이터를 연결해 주세요.\
데이터 연결을 클릭하면 새 데이터 소스 연결 팝업에서 웹을 클릭해 주세요.

<figure><img src="/files/dECgp9asaMlZCURtzIUd" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/3SR5JCcfs5kPHa6ImHXu" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/ZlOf5hFBsmQdKFUFJaoF" alt=""><figcaption></figcaption></figure>

만들기 버튼을 클릭하고 나면 아래와 같은 화면이 나타납니다.\
이제 픽셀을 사이트에 설치해야 합니다. 'Meta 픽셀 설정' 버튼을 클릭해줍니다.

클릭하면 '코드 직접 설치'를 클릭하여 접근해 주세요.

<figure><img src="/files/pczESlMCncaeiZUSpTR8" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/uSnOmxUWJ6HymmZpEQxm" alt=""><figcaption></figcaption></figure>

아래 사진과 같은 화면이 나타납니다.\
코드를 복사해서 로워드 브릿지 강의 호스팅에 연결하기 위해 코드 복사 버튼을 클릭해주세요.

{% hint style="info" %}
코드 복사를 클릭할 경우 자동으로 클립보드에 저장됩니다. Ctrl + V 하면 붙여넣을 수 있습니다.
{% endhint %}

<figure><img src="/files/7MDUXr5sanJcUi3yuwpH" alt=""><figcaption></figcaption></figure>

복사했다면, 로워드 브릿지 강의 호스팅 관리자로 들어가서\
기본 관리 > 외부 코드 설정 페이지로 이동해 주세요.

외부 코드 설정에서 추가하기 버튼을 클릭해 주세요.

<figure><img src="/files/JB5q9jTr3n0hKOJRveT1" alt=""><figcaption></figcaption></figure>

클릭하면 아래와 같은 상태로 나타나는데, 코드 타입을 \<script> 삽입 형으로 설정한 뒤 복사한 코드를 그대로 붙여넣어 주세요.

<figure><img src="/files/fkruJEzE7iS5mrhU9fhh" alt=""><figcaption></figcaption></figure>

붙어 넣을때 아래와 같은 값이 붙여넣어질텐데, 살짝 수정이 필요합니다.

```
<!-- Meta Pixel Code -->
<script>
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js');
fbq('init', '2311164926059777');
fbq('track', 'PageView');
</script>
<noscript><img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=2311164926059777&ev=PageView&noscript=1"
/></noscript>
<!-- End Meta Pixel Code -->
```

\<script>와 \</script>를 지워주세요.\
그럼 아래와 같이 최종적으로 입력됩니다.

```
<!-- Meta Pixel Code -->
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js');
fbq('init', '2311164926059777');
fbq('track', 'PageView');
<noscript><img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=2311164926059777&ev=PageView&noscript=1"
/></noscript>
<!-- End Meta Pixel Code -->
```

이 상태에서 \<noscript> ...... \</noscript>를 복사하고 지워주세요.\
지운 상태로 저장해 주시면 됩니다.

지운 것은 바로 외부 코드를 하나 더 추가해준 뒤,\
아래와 같이 noscript 삽입 형으로 선택해 주세요.

<figure><img src="/files/Y3g09k49U97JgLdka5V3" alt=""><figcaption></figcaption></figure>

똑같이 \<noscript>와 \</noscript>를 지워준 뒤 아래 코드와 같이 저장하면 끝입니다.

```
<img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=2311164926059777&ev=PageView&noscript=1"
/>
```

시간이 지나면 실제 픽셀 이벤트가 발생하면 자동으로 집계됩니다다.
