Kde se vzala reklama na blogu?
Bystří návštěvníci našeho blogu si jistě všimli, že je od tohoto týdne umístěn na pravé straně stránek reklamní banner. Protože je náš blog poháněn systémem inPage, možná Vás napadla otázka, jak jsme toho dosáhli a jak lze toto udělat i na vlastních stránkách.
Čáry se styly
Umístění reklamy zcela mimo stránky je poměrně jednoduché a stačí k tomu základní znalost HTML a CSS. Takže pokud se nebojíte, můžete si to vyzkoušet také.
Je potřeba říci, že příklad který zde uvádím platí pouze pro šablonu číslo 3.
Nastavení umístění reklamy
Pro nastavení pozice reklamního banneru nebo jakéhokoliv prvku mimo stránky je potřeba vytvořit nový STYL a vložit ho v administraci inPage do vlastních stylů: MENU Vzhled - Vlastní CSS styl.
Styl pro umístění banneru Skyscraper do šablony MEDIA:
#skyscraper {
position: absolute;
top: 186px; right: -130px;
width: 120px; height: 600px;
}
Po vložení vlastního stylu nezapomeneňte zaškrtnout volbu "Nastavit aktivní", jinak by styl nefungoval.
Nastavení banneru
Pokud máme připraven banner, tzv. Scysraper o velikosti 120 x 600px, můžeme ho nahrát do administrace inPage. Bannery se dělají buď ve formátu GIF nebo FLASH. Samozřejmě může být umístěn i obrázek JPG či PNG, tyto však nemají možnost animace, takže se na obrázku nebude nic hýbat.
Pokud máme reklamu ve formátu GIF, JPG nebo PNG, vytvoříme si například fotogalerii "Reklama" a obrázky nahrajeme. Pokud máme reklamu ve formátu FLASH, nahráváme ji do sekce SOUBORY a nastavíme
Vložení banneru na stránky
Nyní již můžeme vložit obrázek na stránky. To provedeme tak, že buď do Vlastního boxu nebo Vlastní patičky vložíme následující HTML kód:
<!-- ************************************* -->
<!-- reklama mimo stránky -->
<!-- ************************************* -->
<div id="skyscraper">
<object width="120" height="600" data="/soubor/flash-skycraper-swf/?clickTHRU=http://www.inpage.cz" type="application/x-shockwave-flash">
<param name="PLAY" value="true" />
<param name="LOOP" value="true" />
<param name="QUALITY" value="high" />
<param name="src" value="/soubor/flash-skycraper-swf/?clickTHRU=http://www.inpage.cz" />
<param name="wmode" value="opaque" />
<param name="quality" value="high" />
</object>
</div>
Pokud bychom vkládali obrázek, kód by byl mnohem jednodušší, například:
<!-- ************************************* -->
<!-- reklama mimo stránky -->
<!-- ************************************* -->
<div id="skyscraper"><a title="AKCE" href="http://www.inpage.cz"><img src="/obrazek/2/banner/" alt="" width="48" height="48" /></a>
</div>
HOTOVO, reklama nebo jiný obrázek by měl být umístěn mimo stránky jako na našem blogu.
Závěrem je potřeba říci, že názvy a umístění uvedených obrázků je potřeba nastavovat podle toho jak je máte nahrané v administraci. Umístění banneru si můžete také zkoušet posunout, pokud si budete hrát se stylem #skysraper a těmito hodnotami: "top: 186px; right: -130px;". Aby se banner zobrazoval z Vlastního boxu, je nutné box v administraci aktivovat. Pokud byste dávali banner do patičky, musíte ji mít také aktivní.
Protože toto je ukázka našeho řešení u šablony MEDIA, rozhodli jsme se vytvořit vzorové kódy pro všechny šalony, které budeme brzy publikovat na našem blogu.
Petr Komárek
petr.komarek(zav)zoner.cz
Přidat komentář
Přehled komentářů
-
Reklama pre šablónu č.6
3.11.2009 0:36:00 | Ing Robert Važan
Mám podstatné dôvody pre používanie šablóny č.6.
Pretože chcem uverejňovať bezplatnú reklamu príležitostí v rámci komunity telepráce, rád by som získal čo najskôr úpravu práve pre šablónu č. 6
Môžete mi postup úpravy poslať čo najskôr ?
www.renovital.inpage.cz
email renovital.in@gmail.com
Ďakujem a prajem kolektívu tvorcov veľa tvorivých nápadov. Važan -
sablona 6
3.11.2009 10:55:32 | webmaster
Dobrý den,
tento návod je prakticky univerzální pro všechny šablony. Jediné co si upravíte je umístění bloku podle vašeho uvážení.
Kdyby se Vám nedařilo reklamu umístit, dejte nám vědět na admin@zoner.cz. -
Reklama
14.7.2010 20:19:39 | Du-san
A ak chceme dať viac reklamných bannerov pod seba ako postupovať?
postmaster@h-dcs.sk -
RE: reklama
15.7.2010 14:23:06 | admin
postup je naprosto stejný jako s prvním bannerem, akorát v CSS musíte obě nebo více reklam rozdělit (skycraper1, skycraper2, skycraper3).
Stejně tak to musíte opavit v HTML kodu na stránce, kam ty reklamy vkládáte.
A nakonec si zkopírujete původní parametry z CSS, přiřadíte je ke skycraper2 a pouze změníte odsazení odvrchu. -
Probelm s nahranim souboru GIF
23.1.2011 16:20:16 | Martin
Zdravim, chci se zeptat v cem je problem, ze mi nejde nahrat obrazek typu gif? nebo respektive jde, ale nezobrazuje se vubec spravne...diky
-
RE: problém s .GIFem
24.1.2011 11:00:16 | Hana Medková
Dobrý den, nahrajte obrázek ve formátu .gif do administrace inPage - normálně do sekce OBRÁZKY.
Následně přejděte k editaci stránky, kam chcete obrázek (.gif) vložit. Vložení obrázku do editoru provedete tak, že kliknete na ikonu STROMU, následně vyberte obrázek ze seznamu (důležité je vybrat ten obrázek, který je označen jako - ORIGINÁL). Následně po uložení obrázku i stránky bude váš .gif obrázek fungovat. -
Animovaný gif
13.5.2011 11:51:37 | Václav Lukeš
Dobrý den,
po uložení animovaného gifu se však zobrazuje banner jako statický . Prosím o radu.
Děkuji
VL -
RE: Animovaný gif
14.5.2011 13:44:18 | Jan Ráčil
Na podobný dotaz zde odpověděla již dříve pí. Hana Medková:
"Vložení obrázku do editoru provedete tak, že kliknete na ikonu STROMU, následně vyberte obrázek ze seznamu (důležité je vybrat ten obrázek, který je označen jako - ORIGINÁL). Následně po uložení obrázku i stránky bude váš .gif obrázek fungovat.". -
vypnutý levý sloupec Zara
9.4.2012 11:44:28 | Martin
dobrý den,
předpokládám, že to uložení do boxu nefunguje, pokud mám vypnutý levý sloupec (konkrétně u šablony Zara). nebo to jde nějak obejít?
díky
-
RE: vypnutý levý sloupce
10.4.2012 9:14:27 | Hana Medková
Dobrý den, pokud máte vypnutý levý sloupce a roztažen obsah po celé šířce šablony, dá se to vložení reklamy obejít tak, že ji umístíte do vlastní patičky stránek. Vytvoříte si nový článek, nazvěte jej vlastní patička, umístěte si do něj obsah reklamy a následně tento článek nastavte jako tzv. vlastní patičku přes sekci NASTAVENÍ - PRVKY STRÁNEK - PATIČKA STRÁNEK