HTML5 afişleri

2299 ovmak dahil

OVMAK

İçeri kilitlemek

Bugünün zamanında, HTML5 banner'ları, tamamen animasyonlu banner reklamlar için tek geçerli formattır. Bu evrensel çapraz platform biçimi, bir dizi sınır ve eksiklik yaratan Flash afişleri ile değiştirildi.

Bu tür davranışların ana nedenleri şunlardır:

• Flash teknolojisine, bilgisayar güvenliği ve mobil cihazların artan işlemci yorgunluğu alanında birikmiş iddialar;
• bazı tarayıcılar, engelleme amacıyla Flash'ın görüntülenmesini engellemeye başladı;
• mobilde iOs ek binaları(iPhone, iPad) virobnik ile taşmayan Flash harflerinin gösterimi;
• banner Flash reklamlarında engelleyici programların popülaritesi;
• Vіdmova ve Flash-tehnologii її її vlasnik, şirket Adobe.

Animasyonlu HTML5 afişleri herhangi bir tarayıcıda kenarlık olmadan gösterilebilir, ekranda akıllı telefonlar, tabletler ve medya TV dahil olmak üzere herhangi birini ekleyeceğim. Kime polygaє їх çapraz platform ve çok yönlülük.

Marka adı yöneticisi için HTML5 afişleri, kitlemizi para harcamadan genişleteceğimiz anlamına gelir.

HTML5 banner ne olabilir?

Ne bir baget. Bu bile, bir koristuvach ve navit vzaєmodіє z ona (etkileşimli afiş) saygı duyan gelişmiş bir formattır.

Animasyon açısından, böyle bir afiş vektör animasyonunu (ölçeklendirme olmadan), karakterlerin animasyonunu, fotoğrafları, logoları, grafikleri ve diyagramları, metni gösterebilir ve 3D animasyonu görüntüleyebilir. Etkileşim açısından bakıldığında, HTML5-banner çeşitlendirmeye tepki verebilir ve size ek içerik ve fizibilite sunabilir. Medya taşıma açısından HTML5-banner video, slayt ve ses kayıtlarını oynatabilir. Uyarlanabilirlik açısından, HTML5 afişleri, yanların tam genişliğine kadar uzayabilir, eklenti panelini genişletebilir veya tam ekrana genişleyebilir.

HTML5 banner'larının ana türlerine bir göz atalım.

Sabit boyutta animasyonlu HTML5 banner.
Çoğu reklam medyası için en popüler format. Yerleştirilmeden önce kabul edilenler listesinden gerekli afişlerin genişlik ve yüksekliği seçilir. Her zaman en geniş açılımı gösteriyoruz.

HTML5-banner'ı uzatın (uyarlanabilir, yapışkan).
Bu, ekranın tüm genişliğini (ve yüksekliğini) kaplayan, uzatılabilen bir afiştir. (Raporu bu makalede bulabilirsiniz)

Tam ekran HTML5 başlığı.
Afiş tüm ekranda görüntülenir. Kural olarak, zamanlayıcıyı bu "Kapat" düğmesini gösterecek şekilde ayarlayın. Gösteri için özellikle popüler mobil müştemilatlar.

Çoğu zaman, böyle bir afiş, farklı yönelimlerin ayarlanmasıyla uyarlanabilir ve bir mobil bağlantıya izin verebilir.

Açılan HTML5 afişi (patlama).
Ekranda sadece böyle bir banner'ın (teaser) başlangıç ​​paneli vardır. Verilen algoritmanın beklendiği saatin altında (ayıyı işaret etme veya itme, zamanlayıcı veya başka bir şekilde, yanda), başlığın başka bir kısmı ek genişletilmiş bilgilerle birlikte görüntülenir.

HTML5 Video başlığı.

Otomatik başlatmadan ve “Oynat” düğmesine bastıktan sonra olduğu gibi bir video klip de gösterebilirsiniz. Düğmelerden intikam alabilir ve sesi kapatabilirsiniz. Video dosyası harici barındırmada barındırılacak ve bir saatlik gösterim için alınacaktır.

Oyun etkileşimli afişler.
Baneri, yakі arama koristuvacha grupta açın, vykonuyuchi basit diy.

Bu tür afişler, hedef kitlenin saygısını arttırır, canlı bir ilgi uyandırır ve aynı zamanda düşük bir sınır oluşturur (örneğin, mobil ek binalarda bir farenin varlığı veya ek komut dosyalarının değiş tokuşu). Oynanabilir bir HTML5 banner'ı oluşturmaya karar verdiğiniz için vipadka'nın özel özelliklerini size kesin olarak anlatacağız.

Akıllı HTML5 afişleri (hesap makineleri).
Zaluchennya ve vzaєmodії z koristuvachem için Vykoristovuyutsya, gerekli parametreler ve dahili algoritma tarafından verilen formül için proponuyuchi yoma negainok razrahunok (örneğin, rozrakhunok kredisi, ipotek, vitrati budmaterialіv ve diğer beceriksiz işlemler).

HTML5 banner düzenleme- bazı durumlarda, zamovnik'in perakendecinin yardımına gitmeden afişlerde hızlı bir şekilde değişiklik yapması gerekir (örneğin, genellikle değişen fiyatlar, vodsotki veya fiyat teklifi). Bu tür görevleri gerçekleştirebilir ve gerekli parametreleri doğrudan yöneticinin bağımsız olarak değişiklik yapabileceği banner HTML koduna girebiliriz. Banner ile galip gelen verilerin eski dosyalarda nasıl görüleceği konusunda daha iyi bir karar talep etmek mümkündür.

Mevcut verileri ve API'yi geliştirmek için kullanılan HTML5 afişleri.
Üzerinde Narazi afişi zovn_shnіh dzherel'e gömmek için birçok reklam merezhes. Ancak banner siteye yerleştirildiğinden, HTML5 banner siteye gerekli bilgileri (metin, sayı, tırnak) verilen algoritmadan sonra işlenen API üzerinden talep edebilir, doğru bilgi.

3D HTML5 afişleri.
Bu tür pankartlar, yandaki görüntünün ob'emnі bir modelini yaratarak coristuvach'a saygı duyuyor.

HTML5 3D banner, saran nesne görünümünde, banner çerçevesinin kenarlarında, açılan kitap görünümünde veya diğer 3D efektlerde uygulanabilir.

Lütfen HTML5 başlığının birkaç özellik açıklaması içerebileceğini unutmayın. Örneğin, bir video afişi, kenar genişliğinin tamamı boyunca uzanabilir ve yan tarafta daha önemsiz bir animasyon, nadas şeklinde görüntülenebilir.

Sitemizde bir HTML5 banner oluşturmak istiyorsanız ve yaratıcı bir fikir farklı biçimlerin bir karışımını kullanıyorsa, fahivtsy'mize güç verin.

HTML5-banner - teknik olarak sizinki nedir?

HTML5 banner'ını mini site olarak doğru şekilde alın. Kesintisiz.

Banner biçimine adını veren HTML5, görünüşte daha basit olan web tarafı düzenimdir. І Verstaєtsya aynı yasalara göre, ne modern bir site. Vіn, bağlı olan div kaplarını, yazı tiplerini değiştirebilir, css stilleri ve js betiği. Head öğesi, tuval animasyon kabıdır. Animasyonun kendisi ile gerçekleştirilir java'ya yardım etçoğu, animasyon js-kütüphaneleri için özel olarak geliştirilmiş komut dosyası.

Ortada ne var? Arşivlerde yeni misiniz? Neden bu kadar çok dosya?

Aje mi zvikli, scho banner - bir resim dosyası JPG veya "gifka" veya "flash sürücü". Ama tahmin edin, daha önce yazdığımız gibi, HTML5 başlığı aslında bir mini site. Anonim dosyalar arasında yer alır ve zip arşivinde reklamcıya teslim edilir. Ortadaki arşiv, baş HTML dosyasını, java komut dosyalarını, kitaplıkları, stil sayfalarını ve görüntüleri içerir.

Not. Bazı reklam türleri için, tüm komut dosyalarını ve görüntüleri base-64 biçiminde ekleyerek tüm başlığı tek bir dosyada kullanabilirsiniz. Bu, sertifikalı bir perakendeci için bir sorun değildir. Ancak pankartın hazırlanma süresinde böyle bir artış ve yeni bir değişikliğin devreye girmesi yardımcı olabilir. Neyse ki, nadiren böyle bir vimoga trapleyaetsya.

Bilgisayarımda HTML5 banner reklamlarını nasıl görebilirim?

Biraz basit. Zip arşivlerini açın ve ortasından açın HTML dosyası tarayıcınızda.

Geçerli bir HTML5 başlığı oluşturduğumu nasıl tahmin edebilirim?

Reklam için oluşturulmuş bir afiş gibi Google hizmetleri, ardından hizmetlerinize bir tasarımcının çalışmalarının kalitesini kontrol etmek için mucize bir araç - Google'dan bir çevrimiçi HTML5 doğrulayıcı. Kullanımı kolaydır: Bir afiş ile zip arşivinizi alın ve kontrol listesini geçip geçmediğinizi merak edin. Aflar kırmızı rozetlerle işaretlenecektir. Nitekim bayiniz boşuna değildir ve banner, Google Adwords veya Double Click'e yerleştirilmeye hazırdır.

Yandex, Mail.ru, Rambler, adFox, adRiver ve diğerleri reklam ağları için, sistemin web sitesine çekildikten sonra banner'ın teknik destek için geçerliliği için yeniden doğrulama da vardır. Sorun yaşarsanız, affın açıklamasını içeren moderatörün yorumunu alabilirsiniz. Deyakі Maidanchiki, reklam yardımcısına fırsat veriyor ileri revizyon test tarafında afiş.

Yine de, HTML5 banner'ının doğru şekilde hazırlanmasının en iyi garantisi, perakendecinin onayı ve maydanchikiv reklamcılığının teknik yönleri hakkında bilgi ve affı derhal düzeltmeye hazır olmaktır.

Ve Java Script'te animasyonlu bir afiş - başka neden?

Kafanızın karışmasına izin vermeyin. "Java Komut Dosyası başlığı", "Tuval başlığı" - genellikle "HTML5 başlığı" olarak adlandırılanlar hakkında kendiniz gidin. js kitaplığı veya düzen kuralları perakendecinin aracında değiştirilebilir, ancak genel seçim şeması aynı bırakılır.

HTML5 banner'ı nasıl oluşturulur?

HTML5 animasyonları oluşturmak için en popüler ara yazılım tasarımcısı Adobe Animate'tir.

Google, hükümetin keşif aracını tanıtıyor - Google Web tasarımcı. Diğer artıların yanı sıra, meçhul şablonların varlığı ve Google reklamcılık hizmetleri için aracı olmadan bir afiş yayınlama olasılığı: adWords ve Double Click. Eksiler arasında animasyon olasılığının azaltılması var.

Çoğu Amerikalı, oyunculuk yapan tasarımcılar, Green Sock Animation Platform kütüphanesinin editörüdür. Prote, kayda değer genişlikte bir kokumuz yok.

Sağlıklı, gerekli tüm bileşenler açık kod, iyi bir uzman en basiti için bir HTML5 banner'ı oluşturabilir Metin düzeltici. Ancak böyle bir yöntem etkili değildir, profesyonel animasyon programlarıyla karşılaştırılabilir.

HTML5 banner'ları için teknik destek.

Wimoglar koşuşturmaca:

• kb'de başlık HTML5-banner;
• zip-arşiv yapısı, klasör ve dosya sayısı;
• izin verilen dosya biçimlerinin listesi;
• bir başlık (banner bellenimi) tıklandığında URL göndermeyi etkinleştirme yöntemi;
• izin verilen js kitaplıklarının harici barındırmalara aktarılması;
• video ve ses dosyalarının bağlantı sırası ve değişimi;
• Çerçevenin tasarımından önce imogi, sorumluluk reddi, animasyonun sıklığı ve döngü sayısı, işlemciye ekleyeceğim.

Yine de, yeni olmaktan çok uzak, sanki perakendecilerimize yalan söylemek mümkünmüş gibi, yöneticiye reklam kampanyasını sorunsuz bir şekilde başlatmaya hazır bir HTML5 afişi verebilmeleri mümkündü.

Daha önce oluşturulan Flash banner'larımla ne yapmalıyım?

Kendiniz görün - çoğu reklam medyası artık yerleştirilmeden önce Flash afişlerini kabul etmiyor, Flash bileşenleri tarayıcılarda ve iOs cihazlarında Swiffy robotlarını sabitleyerek engelleniyor (HTML5 için tek uygun çevrimiçi Flash afiş dönüştürücüsü).

Flash formatından HTML5'e otomatik dönüştürme neredeyse imkansızdır - aslında HTML5 editörlerini manuel olarak dönüştürmek gereklidir. Böyle bir durumda doğru kararlar Geçerli ve evrensel HTML5 biçiminde yeni bir dizi animasyonlu afiş oluşturmakla ilgileneceksiniz.

Peki ya "gifler"?

GIF animasyonunun ne olduğunu anlamak gerekir - video dosyalarında olduğu gibi çerçevelerin son seti. Bir GIF dosyası, çerçeve işleme hızı ve tekrar sayısı hakkında bilgi içerebilir. Tsim Yogo Mozhlivostі obmezhuyutsya.

GIF-banner, vektör grafikleri ile çalışamaz, programlı olarak animasyon oluşturamaz, dünyanın ihtiyaçlarına uyum sağlayamaz ve HTML5 banner animasyonunun kolayca işleyebileceği birçok başka şeyi yapamaz.

reklamveren ne demek?

Dünyalar üstü vaga sorunu. Yani, sy skhilnі navit banery. Maidan'ın tüm harika reklamları, kilobayt cinsinden yalnızca birkaç afiş reklamı gösteriyor.

Bir GIF başlığı, belki küçük bir metin animasyonu veya fotoğrafları değiştirmek için düğmeler içeren birkaç statik çerçeve göstermek için iyidir. Bu nedenle, GIF afişi, Maidanchik reklamlarının sınırlarını aşmamalıdır.

Animasyon yüzlerce kareyi değiştirmeye başlarsa, gif-banner sanki İngilizceymiş gibi "dramatik bir şekilde" büyüyecek, bu dramatik. Sağda bir sürü megabayt içeren 20 saniyelik bir gif var. ben kenara sığmıyorum reklam önlemleri, yakі haklı olarak turbovanі tim, zavantazhit koristuvachevі olur, schob afişe bakar.

Ayrıca, yüzü olmayan animasyon efektlerine, karakter animasyonuna, etkileşimli, uyarlanabilir veya video banner'a sahip bir banner'a ihtiyacınız varsa - en zoru için bir HTML5 banner'ı seçin.

Afiş (İngilizce afiş - sancak, afiş) - grafik görüntü basındaki reklam modülüne benzer reklam karakteri. Ya statik görüntüler kullanabilir ya da metin kullanabilirsiniz, böylece öğeleri canlandırabilirsiniz (video ve etkileşimli nesnelere kadar). Kural olarak, reklamverenin sitesine veya reklamın yanına bir köprü yerleştirebilirsiniz. Ek Bilgiler. Pankarttaki yönetici aynı. Malları satalım. Ve bu demek ki - anla Saygı, zatsіkaviti potansiyel müşteri, siteye taşınmadan önce mal veya hizmetlerin reklamını yaptı, pіdshtovhnut diї için sponkati(Eylem çağrısı). CTA, reklamcılığın son yöntemidir. І, farklı bir şekilde, banner yöneticisi є іmіdzheva chi marka reklamcılığı, meta marka bilinirliğini teşvik etmek ve marka hakkında olumlu bir imaj yaratın.

Popüler sitedeki iftirayı görün:

• grafik- İnternette reklam vermek için basit bir afiş türü. Reklam kaynağından şarkı genişlemesi ve intikam görüntüsünden oluşur.
• Flaş afiş- Ek bir vektör ve raster grafik kombinasyonu için bilgileri daha hızlı aktarmanıza olanak tanıyan, animasyon için harika fırsatlar olabilir.
• HTML5 banner'ı- tarayıcılara uyarlanmış özel animasyonlar ve görsel tasarımdan HTML öğelerinin kombinasyonu.

Diğer afiş türleri için HTML'nin ana özellikleri
HTML5 teknolojisinde afiş oluşturmanın diğer yöntemleriyle, izleyiciyi kaynağa götürmek için bir dizi avantaj sağlar:

• Ancak bu formattaki sesler, ek tarayıcı uzantıları olmadan tüm eklerde görüntülenebilir.
  HTML5, reklam sesli formları, düğmeleri ile entegrasyon için daha fazla fırsat sunar sosyal önlemler, takvimler, kartlar ve diğer programlar.
• Daha az kaynak seçiminin tarayıcının taraflarının ilgisinin hızına katkıda bulunmaması küçüktür. Flash teknolojileri böyle bir sonuca izin vermez.
• HTML5 banner'larının etkinliğini değerlendirmek için Google Analytics istatistiklerine bakabilirsiniz. sunulan var fiyat bilgisi misafirler hakkında, mesajlar için gidin.

Apple, Mozilla, Amazon gibi büyük firmaların yükselişleri flash teknolojisinin eksikliklerinden biri haline geldi. Google, Flash için ana posta kutusu haline geldi. Kokunun arkasında Flash-animasyon dahil Google Chrome ve ardından push reklamcılık hizmetlerimizde HTML5'e üstünlük sağlayan Flash çarpıcı özelliğine geçtik.

HTML banner'ları oluşturmanın yolları
Banner açılımı okremoy tarafının katlanmasından başlar ve "iframe" üzerinden siteye getirilir. Dünyada en popüler olan siteye reklam afişleri dağıtmak için birkaç yöntem kullanın.

1. CSS3 ve JavaScript ile Çerçeve
Çerçeve, bağımsız belgeler olup olmadığını genişletme görevi alanına kadar zavantazhuvat yapmanızı sağlar. Tasarım için farklı stillerden ve komut dosyalarından farklı HTML kodları da kullanabilirsiniz. Animasyonların, küçüklerin, grafiklerin ve ek JavaScript ile oyunların genişletildiği tuval alanı üzerinden bir afiş uygulamak da mümkündür. Daha hızlı geliştirme için, üçüncü taraf kitaplıklarının, örneğin CreateJS'nin kullanılmasına izin verilir.

Perevagi:

• İşlevsellik diğer programlarla çevrili değildir, istediğiniz zaman uygulayabilirsiniz.

Nedolik:

• Katlamayı bitirmek için böyle bir süreç ve özel yerleşim becerileri gerektirir.
• Saatler boyu başka şekillerde harcanan büyük emek.

2. Adobe Kenar Animasyonu
Adobe'yi bilen Tim After Effects, Adobe Edge Animate programının arayüzü tanıdık geliyor. Adobe Edge Animate, HTML5, JavaScript ve CSS3 kullanarak basit animasyonlu içeriğin geliştirilmesine yönelik daha fazla stil işlevine sahiptir. Program, .svg, .png, .jpeg, .gif, HTML gibi biçimlerin içe aktarılmasını destekler; video desteği ve video formatları.

30'dan fazla yaratılmış efekt var, bu yüzden size bir kilka zamanında bir tür animasyon yaratma saatini soracağım:

Perevagi:

• Merezhya'dan çeşitli programlarla birçok video dersi.
• Basit işlevsellik, daha otomatikleştirilmiş süreçler.
• Program HTML5, JavaScript ve CSS3 bilgisi gerektirmez.
• Çalışmaların tamamlanmasının ardından siteye banner yerleştirmek için gerekli tüm belgeleri alacağız. Görüntüler - z klasörü grafik öğeleri afiş, JavaScript dosyası, html dosya biçimi An - dosyayı programda daha fazla düzenlemek için.
• Hazır afiş, tüm modern tarayıcılar tarafından desteklenir mobil programlar, Yandex ve Google'dan reklam kampanyalarının tüm teknik desteğini destekler.

Nedolik:

• Arayüz sadece İngilizce benimdir.
• 2015 yılında Adobe, Adobe Edge Animate projesinde geliştirmeyi sabitledi, program o sırada güncellenmedi ve geliştirme sınırına ulaştı. Edge Animate, Creative Cloud arşivlerinden hala indirilebilir.

3. Adobe Animasyon CC
Animate CC - ürün yeniden adlandırma Adobe Flash profesyonel. İÇİNDE Dinlenme saati Flash teknolojisi çok para harcadı, programın adını değiştirmek için gereken uzantı sayısı. Aslında, Flash Professional programının kendisi, ancak herhangi bir dosyada HTML5 ve JavaScript'e kaydedilir.

Arayüz Flash Professional'a benzer, ancak programlar farklılık gösterebilir.

Perevagi:

• Yaratma imkanı önemsiz grafikler. Referans animasyonu için çerçevenin derinliğini ölçmenizi sağlayan "kamera" aracını kullanın.
• Edge Animate görünümünde, Animate CC programı çok çeşitli vektör kalemlerine ve raster grafiklerle çalışma yeteneğine sahip olabilir.
• Program açıkça yeni olduğundan, Adobe projeyi aktif olarak geliştiriyor, bir güncelleme ve kapsamlı bir Animate CC yayınlıyor.
• Rus versiyonu.
• JavaScript/Html, jpeg, png, oam, svg, mov, gif biçimleri için genişletilmiş dosya dışa aktarma yetenekleri. Bir düğmeye basıldığında, banner'ın sprite içindeki öğeleri kaydedilir ve banner'ın yakalanma saati değiştirilir.

Nedolik:

• Programın yeniliği de kısa olarak kabul edilir. Animate CC'deki animasyon oluşturma dersleri, Adobe Edge Animate'teki kadar zengin değildir. Bu robot için fonksiyonlar bağımsız olarak yürütülmelidir ki bu kolay değildir. Program bağımsız bir düğün için katlanır bir şekilde tamamlanabilir, ancak alabilirsiniz.
• Edge Animate gibi bazı işlevler otomatikleştirilmez ve bu da banner oluşturma süresinden tasarruf sağlar.

4. Google Web Tasarımcısı
Google bizi mutlu etti kostovnym editörü html-banner'ların uygulanması için özel olarak oluşturulan Google Web Designer, ana hilesi AdWords'e yönlendirmek olan reklamcılığın uygulanmasına tamamen odaklanmıştır.

Yeni bir dosyanın yaratılmasına hayret ederken, saygılarımızla, program zaten reklam şablonlarını yeniden boyutlandırabilir.

Perevagi:

• Basit arayüz.
• Google'da reklamcılık için şablonların sunumu.
• Maliyetsiz bir programdır.
• Rus versiyonunun sunumu.
• Afişlerin uyarlanabilir tasarımı, html-banner her türlü bina ekranında görsel olarak görülebilir.

Nedolik:

• Google Web Designer'ın işlevselliği, animasyon şaheserleri oluşturmak için çok dar. Program zaten şablonlarla çevrilidir.
• Başlangıç ​​programları eksik. Google'ın bulguları, işlevselliğe tam bir giriş için yeterli değildir.

Yukarıda sunulan tüm yöntemler yeni değildir, ancak çarpıtılmıştır. Ayrıca, html banner'larının oluşturulmasının, çoğu reklamcı kızda, teknik becerilerinin en yüksek standartları karşılayabileceği gerçeğine kadar denetimden geçeceğinin garantisi vardır.

Afiş kodu katlama üreteci. Banner kodu oluşturmak için çevrimiçi prosedür basit ve göze batmayan. Siteye hiç banner yüklediniz mi?
Ürünlerin, hizmetlerin, marka tanıtımının reklamını yapmak, ürünlerinizi göstermek için siteye bannerlar ekliyoruz.

Malların, hizmetlerin reklamını yapmak, markayı biraz zorlamak için siteye bannerlar ekliyoruz.

Mayuchi, sitedeki banner kodunu sırayla, görmek istiyoruz, saygıyı kendinize çevirin.

Vikoristovuvati banery nasıl pratik olabilir?
Banner reklamları kullanma olanakları oldukça fazla olabilir. Hayattan gerçek bir örnek alalım. Örneğin, kayıt oldunuz Ortaklık Programı. Bu program çerçevesinde, yardımları için malları itebileceğiniz ortak çabalarını kabul edeceksiniz.

Kural olarak, bir kerede mal satışından, gelirinizin daha fazla olması için, başka ortakların edinilmesi için yönlendirme gücünü ortadan kaldıracaksınız.

Ortaklık programındaki materyaller gibi, şunları da alabilirsiniz: hazır afişler. Böyle bir sıralamada, yayılan afiş kodu Tüccarda, örneğin web sitenizde, malların reklamını yapar ve iyi ortaklar edinirsiniz.

Banner kodunu kaldırmak için çevrimiçi hizmet

Bu oluşturucunun yardımıyla, banner kullanıcı butonunuz için özel bir HTML kodu oluşturabilirsiniz. Kodu kendiniz yazamıyorsanız, formu tek tıklamayla doldurmak, sitenin yanına eklenebilecek hazır HTML'yi alır. web sitenizin adresi Örnek giriş: https://site/ girin https://'den Başlık veya düğme için resim URL'leri Örnek giriş: https://website//moibaneri/1703.gif Başlığa veya düğmeye (başlık) nişan alma saati için ipucu Bir ekleme açıklamasına bir örnek: bonus web sitesi afişi Afiş veya düğme genişliği (genişlik) Giriş bölümü (yalnızca sayısal girin

Sitede kayan bir blok (aksi halde çöken, sabitleyen, yapışkan olarak da adlandırılır) yan tarafta kaydırırken asi bir öğe yapmak için kullanılır, bu durumda reklamlar en sık yerleştirilir (iltifatlar, afişler veya bağlam).

Maalesef adsense kuralları bizim korumamız için değil. Tim daha az değil, sitelerde otorite açısından zengin ve kendi korkusu ve riskiyle ilgili kuralları görmezden geliyor. Muhtemelen bedel karşılığında cezalandırılmıyorlar ama ben risk almak için değilim.

Bu tür bloklara RMYA'yı, kendi teaser'larımı/afişlerimi yerleştiriyorum ve bazen reklamları vivoj ile değiştiriyorum, benzer girişler var veya bilgi sağlamak için bir çizgi çekeceğim.

Sitenizde nasıl kayan bir blok oluşturabileceğinizi öğrenelim.

Yönetici: kalan bloğu plaj sütununda (kenar çubuğu) inşa edin - yüzer. Ayrıca, coristuvach yeni bir kaydırmaya ulaşırsa ve pencere açıldığında hemen değil, yalnızca o anda yapışır. Ayrıca, blok altbilgiye ulaşarak “vіdlipati” yapabilir (bükülmekten kaçınmak için).

En çalışma yolu

Yapışan bloğu uygulamak için birçok seçenek vardır, ancak tüm kokular düzgün çalışmaz. Ben diyecek özel sertifika: bir sitedeki bir blok için bir ve aynı kurulum yöntemi kullanılabilir ve diğerinde pervazlar görünür.

Aşağıda, kurduğum tüm sitelere pratik olarak yerleştirilmiş yüzen bir bloğun poposu var. Stok yoktu. Motor da önemli değil (DLE, WordPress, LiveStreet vb.).

Beyaz sütunun bagan şehrine aşağıdaki HTML kodunu ekleyin:

$(pencere).scroll(function() (
var sb_m = 20; /* üst ve alt kısımları girin */
var mb = 300; /* Rezervin yüksekliği */
varst = $(pencere).scrollTop();
var sb = $(".yapışkan blok");
var sbi = $(".sticky-block .inner");
var sb_ot = sb.offset().
var sbi_ot = sbi.offset() .top;
var sb_h = sb.height();

If(sb_h + $(belge).scrollTop() + sb_m + mb< $(document) .height () ) {
if(st > sb_ot) (
var h = Math.round(st - sb_ot) + sb_m;
sb.css(("paddingTop": h));
}
Başka(
sb.css(("paddingTop": 0));
}
}
} ) ;

Tüm kodun canavara, aşağıdan ayarlanabileceği ve tabanınızın yüksekliğini tobto getirmek için. bu yükseklik, de bloğun bilenmesi gerekiyor.

Şimdi JS dahildir. HEAD bölümünde bunun için yazılmıştır:

Galmuy