Apache Cordova ve Admob Kullanımı

Apache Cordova ile oluşturulan mobil uygulamalarda Admob reklamlarını kullanabilmek için öncelikle projemize Admob eklentisini yüklememiz gerekiyor.

Bunun için örnek bir Apache Cordova projesi oluşturup Android ve iOS platformlarını projeme ekliyorum.

cordova create ACordovaAdmob com.yuumamobile.ACordovaAdmob ACordovaAdmob
cd ACordovaAdmob
cordova platform add ios

cordova platform add android

Son olarak Admob eklentisini projemize dahil etmek için aşağıdaki kodu komut ekranına giriyorum.

cordova plugin add cordova-plugin-admobpro

Ben projelerimde AdMob Plugin Pro eklentisini kullanıyorum. Kullanımının basit olması ve stabil çalışması bu eklentiyi tercih etmemde ki sebeplerin başında geliyor.

Projemize Admob eklentisini dahil ettik. Şimdi uygulamamızın içerisinde Admob reklamlarını eklemeye geçelim. Bunun için öncelikle Google Admob Servisi üzerinden bir uygulamaya ve bu uygulamaya tanımlı reklam birimlerine ihtiyacımız var. Örnek bir uygulama ekleyip Banner ve Geçiş reklam birimleri oluşturuyorum.

Reklam birimlerimizi oluşturduktan sonra bize kalan uygulamamızda hangi reklam birimini kullanacaksak o reklam birimininin kimliğini uygulamamızın içerisindeki gerekli yere yerleştirmek olacak. Bu örnekte hem Android için hemde iOS için ayrı ayrı göstereceğim.

Android için;

Android Studio ortamına, projemizin dizininde yer alan Android platformunun olduğu klasörü   ekleyerek hangi sayfamızda reklam göstermek istiyorsak o sayfamıza aşağıdaki kodları yerleştiriyoruz.

index.html sayfası

<!DOCTYPE html>
<html>
    <head>
        <meta name="format-detection" content="telephone=no">
        <meta name="msapplication-tap-highlight" content="no">
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
        <link rel="stylesheet" type="text/css" href="css/index.css">
        <title>Hello World</title>
        <script type="text/javascript" src="cordova.js"></script>
        <script type="text/javascript" charset="utf-8">
        document.addEventListener("deviceready", onDeviceReady, false);
        
        function onDeviceReady() {
            gecisReklamiGoster();
        }


        function bannerReklamiGoster(){
            if(AdMob) AdMob.createBanner( {
            adId: 'ca-app-pub-1120973806156714/8994654742',
            position: AdMob.AD_POSITION.TOP_BOTTOM,
            autoShow: true,
            isTesting: true } );

        }

        function gecisReklamiGoster(){
            if(AdMob) AdMob.prepareInterstitial( {
            adId:'ca-app-pub-1120973806156714/3742328069',
            autoShow:true,
            isTesting:true
            });

        }
        </script>
    </head>
    <body>
        <div class="app">
            <h1>Apache Cordova</h1>
            <div id="deviceready" class="blink">
            </div>
        </div>
    </body>
</html>

Banner reklamlarının yerleşim yerleri genelde sabittir ve değiştirilmez. Geçiş reklamları ise uygulamanın içeriğine göre konumlandırılır. Örneğin bir oyun yaptıksak bölüm sonlarında veya Game Over fonksiyonunda Geçiş reklamlarını çağırabiliriz.  Geçiş reklamlarının çok fazla çağrılması veya kullanılması kullanıcıya bıkkınlık verebilir. Bu yüzden kullanılacağı konumu ve sıklığı, uygulama içerisinde iyi düşünülmelidir.

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir