amp-ad
Description
Bir reklamın görüntüleneceği kapsayıcı.
Required Scripts
<script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>
Supported Layouts
Bir reklamın görüntüleneceği kapsayıcı. amp-embed
, amp-ad
etiketinin bir diğer adıdır ve bu etiketin tüm işlevlerini farklı bir etiket adıyla alır. Anlam açısından daha doğru olduğunda amp-embed
etiketini kullanın. AMP dokümanları yalnızca HTTPS aracılığıyla sunulan reklamları/yerleştirmeleri destekler.
amp-ad / amp-embed
amp-ad
/amp-embed
spesifikasyonu zaman içinde önemli ölçüde gelişebilir. Geçerli yaklaşım, reklamları gösterebilmek için biçimin önyükleneceği şekilde tasarlanmıştır. Açıklama | Bir reklamın görüntüleneceği kapsayıcı. amp-embed , amp-ad etiketinin bir diğer adıdır ve bu etiketin tüm işlevlerini farklı bir etiket adıyla alır. Anlam açısından daha doğru olduğunda amp-embed etiketini kullanın. AMP dokümanları yalnızca HTTPS aracılığıyla sunulan reklamları/yerleştirmeleri destekler. |
Zorunlu Komut Dosyası | <script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script> Not: amp-ad, bu komut dosyası olmadan da çalışmaya devam edebilir ancak ileriye dönük uyumluluk için bunu önemle tavsiye ediyoruz |
Desteklenen Düzenler | fill, fixed, fixed-height, flex-item, intrinsic, nodisplay, responsive |
Örnekler | Örneklerle AMP amp-ad örneği sayfasına bakın. |
Davranış
Reklamlar, AMP dokümanlarındaki diğer tüm kaynaklar gibi <amp-ad>
adlı özel bir öğeyle yüklenir. Reklam ağları tarafından sağlanan JavaScript'in AMP dokümanı içinde çalıştırılmasına izin verilmez. Bunun yerine, AMP çalışma zamanı AMP dokümanından farklı bir kaynaktan (iframe korumalı alanı aracılığıyla) bir iframe yükler ve reklam ağının JS'sini o iframe korumalı alanı içinde yürütür.
<amp-ad>
, düzen türünün kuralına göre belirtilecek genişlik ve yükseklik değerlerinin bildirilmesini gerektirir. Hangi reklam ağının görüntüleneceğini seçen bir type
bağımsız değişkeni gerektirir. Etiketteki tüm data-*
özellikleri, sonunda reklamı oluşturan kodu otomatik olarak bağımsız değişken biçiminde geçirir. Belirli bir ağ türü için hangi data-
özelliklerinin gerekli olduğu değişiklik gösterir ve reklam ağıyla belgelenmelidir.
Örnek: Birkaç reklam görüntüleme
<amp-ad type="a9"
data-amzn_assoc_ad_mode="auto"
data-divid="amzn-assoc-ad-fe746097-f142-4f8d-8dfb-45ec747632e5"
data-recomtype="async"
data-adinstanceid="fe746097-f142-4f8d-8dfb-45ec747632e5"
width="300"
height="250"
data-aax_size="300x250"
data-aax_pubname="test123"
data-aax_src="302">
</amp-ad>
<amp-ad width="300"
height="250"
type="industrybrains"
data-width="300"
data-height="250"
data-cid="19626-3798936394">
</amp-ad>
<amp-embed type="taboola"
width="400"
height="300"
layout="responsive"
data-publisher="amp-demo"
data-mode="thumbnails-a"
data-placement="Ads Example"
data-article="auto">
</amp-embed>
Özellikler
tür (gerekli) | Reklam ağı için bir tanımlayıcı belirtir. type özelliği, reklam etiketi için kullanılacak şablonu seçer. |
src (isteğe bağlı) | Belirtilen reklam ağı için bir komut dosyası etiketi yüklemek üzere bu özelliği kullanın. Bu özellik, sayfaya tam olarak tek bir komut dosyası etiketinin eklenmesini gerektiren reklam ağları için kullanılabilir. src değeri, belirtilen reklam ağı için beyaz listeye alınmış bir öneke sahip olmalı ve değer, https protokolünü kullanmalıdır. |
data-foo-bar | Çoğu reklam ağı, HTML data- özelliklerini kullanarak ağa geçirilebilecek ek yapılandırma gerektirir. Parametre adlarında, standart veri özelliği çizgisi büyük/küçük harfe dönüştürülür. Örneğin, "data-foo-bar" adı, yapılandırma için reklama "fooBar" olarak gönderilir. Özelliklerin kullanılabileceği reklam ağı ile ilgili dokümanlara bakın. |
data-vars-foo-bar | data-vars- ile başlayan özellikler amp-analytics var öğeleri için ayrılmıştır. |
json (isteğe bağlı) | Bir yapılandırmayı reklama rastgele şekilde karmaşık bir JSON nesnesi olarak geçirmek için bu özelliği kullanın. Nesne, adlar herhangi bir şekilde bozulmadan, olduğu gibi reklama geçirilir. |
data-consent-notification-id (isteğe bağlı) | Değer sağlanırsa kullanıcının "AMP istemci kimliği" (çereze benzer) reklama geçirilinceye kadar amp-user-notification özelliğinin belirtilen HTML kimliği ile onaylanmasını gerektirir. Bu, kullanıcı bildirimi onaylayana kadar reklam oluşturmanın bekletileceği anlamına gelir. |
data-loading-strategy (isteğe bağlı) | Reklamın, geçerli görüntü alanından belirtilen görüntü alanı sayısı kadar uzakta olduğunda yüklenmeye başlamasını bildirir. data-loading-strategy özelliği olmadan, varsayılan olarak 3 değeri kullanılır. [0, 3] aralığında bir hareketli değer belirtebilirsiniz (Değer belirtilmezse değer 1,25 olarak ayarlanır). Daha yüksek bir görüntülenebilirlik derecesi elde etmek (ör. bir reklamın yüklendikten sonra görülme olasılığını artırmak) için daha küçük bir değer kullanın. Ancak bu durumda, daha az gösterim oluşturma (ör. daha az reklam yüklenmesi) riski de artar. Özellik belirtilir ancak değer boş bırakılırsa sistem, gösterim sayısını önemli ölçüde etkilemeden görüntülenebilirliği optimize eden bir hareketli reklam değeri atar. Değer olarak prefer-viewability-over-views seçeneğinin belirlenmesinin görüntülenebilirliği de otomatik olarak optimize edeceğini unutmayın. |
data-ad-container-id (isteğe bağlı) | Daraltma girişimi olması durumunda, reklama kapsayıcı bileşeni kimliğini bildirir. Kapsayıcı bileşeni, reklamın üst öğesi olan bir <amp-layout> bileşeni olmalıdır. data-ad-container-id belirtildiğinde ve böyle bir <amp-layout> kapsayıcı bileşeni bulunduğunda, AMP çalışma zamanı, dolgu yokken reklam bileşeni yerine kapsayıcı bileşenini daraltmayı dener. Bu özellik, bir reklam göstergesinin var olması durumunda faydalı olabilir. |
common attributes | Bu öğe, AMP bileşenlerine genişletilmiş ortak özellikleri içerir. |
Yer Tutucu
İsteğe bağlı olarak amp-ad
, placeholder
özelliğine sahip bir alt öğeyi destekler. Reklam ağı tarafından desteklenirse bu öğe, reklam görüntülenmeye hazır olana kadar gösterilir. Yer Tutucu ve Yedekler hakkında daha fazla bilgi edinin.
<amp-ad width=300 height=250
type="foo">
<div placeholder>Loading ...</div>
</amp-ad>
Reklam yok
Alan için kullanılabilir reklam yoksa AMP, (display: none
değerine ayarlanmış) amp-ad
öğesini daraltmaya çalışır. AMP, bu işlemin kullanıcının kaydırma konumunu etkilemeden gerçekleştirilebileceğini belirler. Reklam geçerli görüntü alanındaysa kullanıcının kaydırma konumunu etkileyeceği için daraltılmaz; ancak, reklam geçerli görüntü alanının dışındaysa daraltılır.
Daraltma girişimi başarısız olması durumunda. amp-ad
bileşeni, fallback
özelliğine sahip bir alt öğeyi destekler. Bir yedek öğe varsa özelleştirilmiş yedek öğe gösterilir. Aksi takdirde, AMP bir varsayılan yedeği uygular.
Yedek içeren örnek:
<amp-ad width=300 height=250 type="foo">
<div fallback>No ad for you</div>
</amp-ad>
Video reklamlar sunma
Video reklamlarla AMP'deki videolardan para kazanmanın 3 yolu vardır:
-
AMP, reklamlardan para kazanabilen BrightCove, DailyMotion gibi çeşitli video oynatıcıları destekler. Tam liste için medya bileşenlerine bakın.
-
Yerleşik bir IMA SDK ve HTML5 video oynatıcısıyla gelen amp-ima-video bileşenini kullanın
-
AMP'de desteklenmeyen bir video oynatıcı kullanıyorsanız özel oynatıcınızı, amp-iframe kullanarak sunabilirsiniz.
amp-iframe
yaklaşımını kullanırken:- Oynatıcıyı ilk görüntü alanına yüklüyorsanız bir poster olduğundan emin olun. Ayrıntılar.
- Video ve poster, HTTPS üzerinden sunulmalıdır.
Reklamları bir özel alandan yayınlama
AMP, kendi alanınız gibi bir özel alandan reklam yüklemek için kullanılan önyükleme iframe'inin yüklenmesini destekler.
Bunu etkinleştirmek için remote.html dosyasını web sunucunuza kopyalayın. Ardından, AMP dosyalarınıza aşağıdaki meta etiketi ekleyin:
<meta name="amp-3p-iframe-src" content="https://assets.your-domain.com/path/to/remote.html">
Meta etiketin content
özelliği, web sunucunuzdaki remote.html dosya kopyasının mutlak URL'sidir. Bu URL bir "https" şeması kullanmalıdır. AMP dosyalarınızla aynı kaynakta bulunamaz. Örneğin, www.example.com
adresinde AMP dosyaları barındırırsanız bu URL, www.example.com
adresinde olmamalı; bunun yerine, something-else.example.com
gibi bir adreste olmalıdır. iframe'ler için izin verilen kaynaklar hakkında daha fazla bilgi için "Iframe kaynak politikası" konusuna bakın.
Güvenlik
iframe'inizin yalnızca beklenen şeyleri yaptığından emin olmak için gelen verileri draw3p
işlevine geçirmeden önce doğrulayın. Bu durum, bilhassa özel JavaScript yerleştirmeye izin veren reklam ağları için geçerlidir.
Iframe'ler, yalnızca iframe içine almaları beklenen kaynakları iframe içine almalıdır. Kaynaklar şunlar olabilir:
- kendi kaynaklarınız
- AMP önbelleği için
https://cdn.ampproject.org
AMP önbelleği için "kaynak kökenin" (cdn.ampproject.org tarafından sunulan dokümanın kaynağı) kaynaklarınızdan biri olduğunu kontrol etmeniz de gerekir.
Kaynakların uygulanması draw3p
için 3. bağımsız değişkenle yapılabilir ve ayrıca, tam tarayıcı desteği için allow-from yönergesi kullanılarak yapılmalıdır.
Gelen reklam yapılandırmasını geliştirme
Bu tamamen isteğe bağlıdır: Bazen reklam isteğini reklam sunucusuna göndermeden önce reklam isteğinin geliştirilmesi istenir.
Reklam ağınız hızlı getirmeyi destekliyorsa lütfen Gerçek Zamanlı Yapılandırmayı (RTC) kullanın. (ör. DoubleClick ve AdSense entegrasyonları, hızlı getirme ve RTC'yi destekler)
Reklam ağınızda gecikmeli getirme kullanılıyorsa remote.html dosyasındaki draw3p
işlev çağrısına bir geri çağırma geçirebilirsiniz. Geri çağırma, gelen yapılandırmayı ilk bağımsız değişken ve daha sonra, bir başka geri çağırmayı ikinci bağımsız değişken olarak alır (aşağıdaki örnekte done
olarak gösterilmiştir). Reklam oluşturmanın devam etmesi için bu geri çağırma, güncellenmiş yapılandırma ile yapılmalıdır.
Örnek:
draw3p(function(config, done) {
config.targeting = Math.random() > 0.5 ? 'sport' : 'fashion';
// Don't actually call setTimeout here. This should only serve as an
// example that is OK to call the done callback asynchronously.
setTimeout(function() {
done(config);
}, 100)
}, ['allowed-ad-type'], ['your-domain.com']);
Stil
<amp-ad>
öğelerinin kendileri CSS position: fixed
değerine ayarlanmış kapsayıcılara sahip olamaz veya böyle kapsayıcıların içine yerleştirilemez (amp-lightbox
hariç).
Bunun nedeni, tam sayfa yer paylaşımlı reklamların kullanıcı deneyimi açısından yarattığı zorluklardır. Gelecekte, belirli kullanıcı deneyimi değişmez değerlerini sağlayan AMP kontrollü kapsayıcıların içinde benzer reklam biçimlerine izin verme seçeneği değerlendirilebilir.
Doğrulama
AMP doğrulayıcı spesifikasyonundaki amp-ad kurallarına bakın.
Desteklenen reklam ağları
- A8
- A9
- AccessTrade
- Adblade
- AdButler
- Adform
- AdFox
- Ad Generation
- Adhese
- Adincube
- ADITION
- Adman
- AdmanMedia
- Admixer
- AdOcean
- AdPicker
- AdPlugg
- Adpon
- AdReactor
- AdSense
- AdSensor
- AdsNative
- AdSpeed
- AdSpirit
- AdStir
- AdTech
- AdThrive
- AdUnity
- Ad Up Technology
- Adventive
- Adverline
- Adverticum
- Advertserve
- Adyoulike
- Affiliate-B
- AJA
- AMoAd
- AppNexus
- AppVador
- Atomx
- Baidu
- BeOpinion
- Bidtellect
- brainy
- Broadstreet Ads
- CA A.J.A. Infeed
- CA-ProFit-X
- Cedato
- Chargeads
- Colombia
- Connatix
- Content.ad
- Criteo
- CSA
- CxenseDisplay
- Dianomi
- Directadvert
- DistroScale
- Dot and Media
- DoubleClick
- eADV
- Epeex
- E-Planning
- Ezoic
- Felmat
- FlexOneELEPHANT
- FlexOneHARRIER
- Flite
- fluct
- FreeWheel
- Karma
- GenieeSSP
- Giraff
- GMOSSP
- GumGum
- Holder
- i-mobile
- Imonomy
- iBillboard
- Imedia
- Improve Digital
- Index Exchange
- Industrybrains
- InMobi
- Innity
- Kargo
- Kiosked
- Kixer
- Kuadio
- Ligatus
- LockerDome
- LOKA
- MADS
- MANTIS
- Media.net
- MediaImpact
- Mediavine
- Medyanet
- Meg
- MicroAd
- MixiMedia
- Mixpo
- Monetizer101
- mox
- myTarget
- myWidget
- Nativo
- Navegg
- Nend
- NETLETIX
- Noddus
- Nokta
- OneAD
- OnNetwork
- Open AdStream (OAS)
- OpenX
- Pixels
- plista
- polymorphicAds
- popin
- Pressboard
- PromoteIQ
- PubGuru
- PubMatic
- Pubmine
- PulsePoint
- Purch
- Rambler&Co
- RbInfoxSg
- Realclick
- recomAD
- Red for Publishers
- Relap
- Revcontent
- RevJet
- Rubicon Project
- RUNative
- SAS CI 360 Match
- Sekindo
- Sharethrough
- Sklik
- SlimCut Media
- Smart AdServer
- smartclip
- sogou Ad
- Sortable
- SOVRN
- Speakol
- SpotX
- SunMedia
- Swoop
- TcsEmotion
- Teads
- torimochi
- TripleLift
- Trugaze
- UZOU
- ValueCommerce
- video intelligence
- Videonow
- Viralize
- UAS
- ucfunnel
- Unruly
- VMFive
- Webediads
- Weborama
- Widespace
- Wisteria
- WPMedia
- Xlift
- Yahoo
- YahooJP
- Yandex
- Yengo
- Yieldbot
- Yieldmo
- Yieldone
- Yieldpro
- Zedo
- Zucks
Desteklenen yerleştirme türleri
Bu belgeyi defalarca okudunuz ama tüm sorularınıza tatmin edici bir yanıt bulamadınız mı? Belki başka kişiler de bu şekilde hissetmiştir: Stack Overflow'dan onlara ulaşın.
Stack Overflow'a git Bir hata veya eksik bir özellik mi buldunuz?AMP projesi, katılımınızı ve katkılarınızı güçlü bir şekilde teşvik ediyor! Açık kaynak topluluğumuzun devamlı bir katılımcısı olacağınızı umuyoruz ancak özel olarak ilgilendiğiniz konularla ilgili tek seferlik katkıları da memnuniyetle karşılıyoruz.
GitHub'a git