EM Tippspiel als Stimmungsmacher :: Werbebanner
Drucken

Werbebanner

Innerhalb der Tippspiel-Administration belegen Sie unter "Inhalte -> Werbebanner" bis zu 2 Werbeplätze mit Inhalten. Der erste Werbebanner befindet sich unter der Hauptnavigation. Ein weiterer Werbebanner kann über dem Inhalt eingesetzt werden.

 

Bitte beachten Sie, dass Ihre Werbebanner responsives Webdesign unterstützen muss, damit Ihre Seite weiterhin auf allen Endgeräten gut aussieht. Sollte der Code für die Werbebanner nicht von Ihnen stammen, fragen Sie bitte den Hersteller des Codes ob dieser responsives Design unterstüzt.

 

Wenn Sie eigene Bilder als Werbebanner einsetzten wollen, dann fügen Sie bitte dem IMG-Tag folgenden Code hinzu:

 

class="img-responsive" style="margin: 0 auto;"

 

Dieser stellt sicher, dass sich Ihr Bild dem Endgerät anpasst und zentriert im vorgesehen Bereich angezeigt wird. Ein vollständiger Code für einen eigenen Werbebanner wäre:

 

<a href="/zcms/module/allgemein/URL" target="_blank"><img src="/zcms/module/allgemein/BILDADRESSE" alt="BESCHREIGUNGSTEXT" class="img-responsive" style="margin: 0 auto;" /&gt

 

Bitte geben Sie KEINE Bildgröße an. Dann würde sich der Werbebanner nicht mehr verkleinern.

 

Standardmäßig ist links und rechts ein Abstand von 15 Pixel eingebaut. Damit Ihre Banner links und rechts anliegt, muss ein DIV mit negativen Abstand eingebaut werden:

 

<div style="margin-left: -15px; margin-right: -15px;">IHR CODE</div>

 

Formatierung der Werbebanner

Die Werbebanner haben alle einen weißen Hintergrund und werden zentriert dargestellt. Nach oben und unten ist kein Abstand vorgesehen. All dies können Sie aber mit einem CSS-Code individuell beeinflussen.

 

Den Bereich des ersten Banners können Sie mit #banner1 ansprechen und nach Ihren Wünschen ändern:

 

#banner1 {

background-color: #cccccc;

padding-top: 15px;

padding-bottom: 15px;

}

 

Dieser CSS-Code ändert die Hintergrundfarbe in ein helles grau und fügt oben und unten einen Abstand von 15 Pixel hin. 

Den zweiten Banner können Sie mit #banner2 genauso manipulieren.