"미디어위키에서 구글 애드센스 연동하기"의 두 판 사이의 차이

GameDic
이동: 둘러보기, 검색
(→‎사이드 바)
(→‎사이드 바)
 
75번째 줄: 75번째 줄:
 
사이드바에 광고를 배치하는 것은 기존 머리글과 바닥글에 광고를 삽입하는 것보다 까다롭습니다. SkinBuildSidebar은 Navigation portal and the ToolBox사이에 광고를 삽입할 수 있도록 해줍니다.그러나 몇 가지 주의 사항이 있습니다 :
 
사이드바에 광고를 배치하는 것은 기존 머리글과 바닥글에 광고를 삽입하는 것보다 까다롭습니다. SkinBuildSidebar은 Navigation portal and the ToolBox사이에 광고를 삽입할 수 있도록 해줍니다.그러나 몇 가지 주의 사항이 있습니다 :
  
−
첫번째는, 기본 벡터 스킨을 사용할때 광고가 본문위에 나타나게 됩니다. 이것은 좋은 기능이 될 수 있지만, 나는 광고를 숨길 수있는 옵션은 좋은 생각을 갖는 모르겠어요. 따라서 작은 자바 스크립트 스니펫 (snippet)을 추가함으로서 광고가 본문을 가리지 않게 합니다..
+
첫번째는, 기본 벡터 스킨을 사용할때 광고크기를 잘 선택해야 합니다. 옆에 표시된 광고는 120x600px 스카이스크래퍼 광고입니다.
  
 
둘째, 사이드 바에서 각 포털은 제목이 있습니다.광고가 포함 된 포털의 제목은 "Ads"입니다. 위키 영어가 아닌 경우, 당신은 아마 그것을 번역하는 것이 좋습니다. 위키에 광고 거기에 번역을 쓰기 이렇게하려면, 당신은 MediaWiki:Ads 페이지를 당신의 위키를 작성해야합니다.
 
둘째, 사이드 바에서 각 포털은 제목이 있습니다.광고가 포함 된 포털의 제목은 "Ads"입니다. 위키 영어가 아닌 경우, 당신은 아마 그것을 번역하는 것이 좋습니다. 위키에 광고 거기에 번역을 쓰기 이렇게하려면, 당신은 MediaWiki:Ads 페이지를 당신의 위키를 작성해야합니다.
  
−
셋째 사이드 바는 160x600px 사이즈의 와이드 스카이스크래퍼 광고에게는 너무 작습니다(권장크기는 120x600px 스카이스크래퍼 광고 가 적당합니다.) 구글 에드센스의 사이즈를 와이드 스카이스크래퍼 크기의 광고를 삽입하려면 줄여서 사이드바 크기를 증가하는 것은 스킨마다 적용해야 합니다.기본 벡터 스킨의 경우는 미디어위키를 편집하여 변경할 수 있습니다.
+
 
 +
<source lang='php'>
 +
$wgHooks['SkinBuildSidebar'][] = function($skin, &$bar) {
 +
        $out = <<< EOT
 +
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
 +
<!-- gamedic sidebar2 -->
 +
<ins class="adsbygoogle"
 +
    style="display:inline-block;width:120px;height:600px"
 +
    data-ad-client="ca-pub-69332184xxxxxxxxx"
 +
    data-ad-slot="4372734253"></ins>
 +
<script>
 +
(adsbygoogle = window.adsbygoogle || []).push({});
 +
</script>
 +
EOT;
 +
        $out .= "<script>$('#p-Ads').addClass('persistent');</script>";
 +
        $bar['Ads'] = $out;
 +
        return true;
 +
};
 +
</source>
 +
 
 +
 
 +
 
 +
만약 160x600 와이드 스카이스크래퍼 광고를 삽입하고 싶으시면 아래와 같이 스킨의 크기를 크게 변경한 후에 삽입해주세요.
 +
 
  
 
<source lang='php'>
 
<source lang='php'>

2015년 11월 24일 (화) 07:59 기준 최신판

미디어위키에서 구글 애드센스 연동하기

미디어위키에 광고를 보여주는 코드를 삽입하는 방법을 알려주는 글입니다. 스킨에 광고를 삽입하는 방법 대신에 hooks를 이용합니다. 이 방법은 2가지 장점이 있습니다.

  • 개별적으로 각각의 스킨을 수정할 필요가 없습니다. 이것은 사용자가 스킨을 변경하더라도 광고를 동일한 장소에 디스플레이 될것입니다.
  • 업그레이드 작업이 간단합니다. Hooks는 스킨과는 달리, 미디어 위키의 버전 업그레이드에 의해 수정되지 않은 LocalSettings.php에 있습니다.

아래의 예는 각 페이지의 머리글, 바닥글 및 사이드 바에 광고를 삽입하는 방법을 보여줍니다. 구글 애드 센스 광고 서비스 코드를 사용했지만, 그것은 쉽게 다른 광고 네트워크의 광고 서비스 코드에 의해 대체 될 수 있습니다.


머리글

사이트 공지사항 밑이나 문서 헤더 위의 광고 코드를 배치할 SiteNoticeAfter hook를 사용합니다.

Header ad.jpeg


다음 코드를 LocalSettings.php에 추가합니다. 당신은 당신이 받은 광고코드와 일치하도록 EOT 라인 사이의 광고 코드를 수정해야합니다.일반적으로 728x90px 리더 보드를 사용하시면 됩니다. 

$wgHooks['SiteNoticeAfter'][] = function(&$siteNotice, $skin) {
        $siteNotice .= <<< EOT
<script async src="http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
    style="display:inline-block;width:728px;height:90x"
    data-ad-client="ca-pub-xxxxxxxxxxxxxxxx"
    data-ad-slot="6440411535"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
EOT;
        return true;
};



바닥글

SkinAfterContent Hook입니다. 문서 내용 후 배너를 표시 할 수 있습니다.

Footer ad.jpg

이전과 같이 EOT 다음에 광고코드를 삽입합니다. 대부분의 수평광고는 위치가 잘 맞는 편입니다. 어째든 한번더
를 이용해서 광고를 중앙에 위치할수 있도록 지정해줍니다. 
$wgHooks['SkinAfterContent'][] = function(&$data, $skin) {
        global $myAdCode;
        $data .= '<div style="text-align:center;">';
        $data .= <<< EOT
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
    style="display:inline-block;width:728px;height:90x"
    data-ad-client="ca-pub-xxxxxxxxxxxxxxxx"
    data-ad-slot="6440411535"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
EOT;
 
        $data .= '</div>';
        return true;
};



사이드 바

Sidebar ad.jpg

사이드바에 광고를 배치하는 것은 기존 머리글과 바닥글에 광고를 삽입하는 것보다 까다롭습니다. SkinBuildSidebar은 Navigation portal and the ToolBox사이에 광고를 삽입할 수 있도록 해줍니다.그러나 몇 가지 주의 사항이 있습니다 :

첫번째는, 기본 벡터 스킨을 사용할때 광고크기를 잘 선택해야 합니다. 옆에 표시된 광고는 120x600px 스카이스크래퍼 광고입니다.

둘째, 사이드 바에서 각 포털은 제목이 있습니다.광고가 포함 된 포털의 제목은 "Ads"입니다. 위키 영어가 아닌 경우, 당신은 아마 그것을 번역하는 것이 좋습니다. 위키에 광고 거기에 번역을 쓰기 이렇게하려면, 당신은 MediaWiki:Ads 페이지를 당신의 위키를 작성해야합니다. 


$wgHooks['SkinBuildSidebar'][] = function($skin, &$bar) {
        $out = <<< EOT
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- gamedic sidebar2 -->
<ins class="adsbygoogle"
     style="display:inline-block;width:120px;height:600px"
     data-ad-client="ca-pub-69332184xxxxxxxxx"
     data-ad-slot="4372734253"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
EOT;
        $out .= "<script>$('#p-Ads').addClass('persistent');</script>";
        $bar['Ads'] = $out;
        return true;
};


만약 160x600 와이드 스카이스크래퍼 광고를 삽입하고 싶으시면 아래와 같이 스킨의 크기를 크게 변경한 후에 삽입해주세요. 


/* increase Vector sidebar width to accommodate ads */
div#mw-panel { width: 12em; }
div#footer, #mw-head-base, div#content { margin-left: 12em; }
#left-navigation { margin-left: 12em; }

If your wiki is in RTL language, you need to use a modified snippet: 

/* increase Vector sidebar width to accommodate ads */
div#mw-panel { width: 12em; }
div#footer, #mw-head-base, div#content { margin-right: 12em; }
#left-navigation { margin-right: 12em; }

LocalSettings.php 아래에 배치 될 필요가 코드이다. 다시 말하지만, 당신은 EOT 라인 사이의 광고 코드를 교체해야합니다. 

$wgHooks['SkinBuildSidebar'][] = function($skin, &$bar) {
        $out = <<< EOT
<script async src="http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
    style="display:inline-block;width:160px;height:600x"
    data-ad-client="ca-pub-xxxxxxxxxxxxxxxx"
    data-ad-slot="6440411535"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
EOT;
        $out .= "<script>$('#p-Ads').addClass('persistent');</script>";
        $bar['Ads'] = $out;
        return true;
};

광고의 세 가지 유형 중 2가지를 이 GameDic에서 미리 볼 수 있습니다.

원문

https://www.guyrutenberg.com/2014/10/13/displaying-google-adsense-in-mediawiki/#comments
원본 주소 "http://gamedic.org/index.php?title=미디어위키에서_구글_애드센스_연동하기&oldid=71"