Thread Starter
#0
Google Ad Manager, dijital reklam yönetimi için güçlü bir araçtır ve Angular projelerine entegrasyonu, reklam gelirlerini artırmak isteyen geliştiriciler için büyük bir fırsat sunmaktadır. Bu yazıda, Google Ad Manager’ı Angular projelerine nasıl entegre edebileceğinizi adım adım inceleyeceğiz.
İlk olarak, Angular uygulamanızda Google Ad Manager’ı kullanabilmek için gerekli olan kütüphaneleri yüklemeniz gerekiyor. Bunun için öncelikle
İkinci aşama, Google Ad Manager hesap bilgilerinizi kullanarak bir reklam birimi oluşturmak ve bu birimi Angular bileşenlerinizde kullanmaktır. Reklam birimi oluşturmak için Google Ad Manager arayüzüne gidin, yeni bir reklam birimi tanımlayın ve size verilen
Sonrasında, Angular bileşeninizde Google Ad Manager kütüphanesini entegre edin. Aşağıda basit bir örnek verilmiştir:
Bu örnekte,
Son olarak, reklam performansını izlemek için Google Ad Manager'ın sağladığı analiz araçlarını kullanmayı unutmayın. Bu araçlar, hangi reklamların daha iyi performans gösterdiğini ve kullanıcı etkileşimlerini analiz etmenize yardımcı olacaktır.
Bu adımlar, Angular projelerinizde Google Ad Manager’ı etkin bir şekilde kullanmanıza olanak tanır. Geliştiriciler, bu entegrasyonu yaparak hem kullanıcı deneyimini geliştirebilir hem de reklam gelirlerini artırabilirler.
İlk olarak, Angular uygulamanızda Google Ad Manager’ı kullanabilmek için gerekli olan kütüphaneleri yüklemeniz gerekiyor. Bunun için öncelikle
@googleads/googleads kütüphanesini npm ile projenize ekleyin:CODE
1npm install @googleads/googleadsİkinci aşama, Google Ad Manager hesap bilgilerinizi kullanarak bir reklam birimi oluşturmak ve bu birimi Angular bileşenlerinizde kullanmaktır. Reklam birimi oluşturmak için Google Ad Manager arayüzüne gidin, yeni bir reklam birimi tanımlayın ve size verilen
ad unit path değerini not edin. Örneğin: /1234567/homepage/banner.Sonrasında, Angular bileşeninizde Google Ad Manager kütüphanesini entegre edin. Aşağıda basit bir örnek verilmiştir:
CODE
12345678910111213141516import { Component, OnInit } from '@angular/core';
import { googletag } from 'googletag';
@Component({
selector: 'app-ad',
template: '<div id="ad-container"></div>',
})
export class AdComponent implements OnInit {
ngOnInit() {
googletag.cmd.push(() => {
googletag.defineSlot('/1234567/homepage/banner', [728, 90], 'ad-container').addService(googletag.pubads());
googletag.enableServices();
googletag.display('ad-container');
});
}
}Bu örnekte,
AdComponent bileşeni oluşturulmakta ve Google Ad Manager ile tanımlanan reklam birimi, bileşenin ngOnInit yaşam döngüsü aşamasında yüklenmektedir. Bu sayede, uygulamanız kullanıcıya reklam gösterirken, aynı zamanda performansı da korumaktadır.Son olarak, reklam performansını izlemek için Google Ad Manager'ın sağladığı analiz araçlarını kullanmayı unutmayın. Bu araçlar, hangi reklamların daha iyi performans gösterdiğini ve kullanıcı etkileşimlerini analiz etmenize yardımcı olacaktır.
Bu adımlar, Angular projelerinizde Google Ad Manager’ı etkin bir şekilde kullanmanıza olanak tanır. Geliştiriciler, bu entegrasyonu yaparak hem kullanıcı deneyimini geliştirebilir hem de reklam gelirlerini artırabilirler.