HOW TO TUTORIAL
ganz einfacher Werbebutton Code

tutorialDie Bloggerwelt wandelt sich im Sauseschritt, früher (vor öööhm 5 Jahren…) haste dir überlegt deine Gedanken in diesem Internetz preiszugeben und hast einfach losgelegt und auf veröffentlichen geklickt.

Heute zerbrichst du dir dir den Kopf über Blogthemes, Zielgruppen, Reichweite, Keywords und setzt dich mit Gesetzen für’s Impressum, zum Urheberrecht und Werbung auseinander.

Mich bringt so etwas dazu, still und heimlich schon mal nach hübschen Bloggerknast Locations zu googeln – man weiß ja nie wann die Blogpolizei kommt und einem die Handschellen anpasst.

Der letzte BLOGST Twitter Treff mit Christian Solmecke, seines Zeichens hofierter, gefeierter und populärer Social Media Rechtsexperte, stand unter dem Motto Recht. Und nur mal ganz kurz am Rande, wer eine Horde Frauen ganz hibbelig machen will referiert über Social Media Recht, damit kriegt man die Online Hühner von der Stange, schwör!

Nun kann jeder die Topthemen der Twitterparty unter dem BLOGST-Hashtag nachlesen, mein persönliches Highlight war und ist die Kennzeichnungspflicht von gesponserten Blogartikeln mit dem Wort „WERBUNG“.

Alles klar, ich kennzeichne meine Beiträge seit jeher nur ein bisschen schöner könnte es schon sein, daher habe ich mir mit meinen rudimentären HTML Kenntnissen einen kleinen Code gebastelt den ich nun ganz entspannt in meine Artikelüberschrift hefte und ganz klar beschreibt was den Leser erwartet.

Der Code sollte theoretisch bei WordPress und Blogger funktionieren und ist komplett individualisierbar:

<h6><span style=“color: #999999; background-color: #dededc;“>Werbung</span></h6>

  • h6 = Schriftgröße der Überschrift
  • Color = Schriftfarbe
  • Background-color = Hintergrundfarbe

Den Code einfach in die Titel des Blogartikels einfügen und danach die eigentliche Überschrift, das Wort „Werbung“ steht dann über der Hauptüberschrift. So wie bei diesem Artikel das „How To Tutorial“. Ihr braucht nicht im Quellcode rummurksen und könnt individuell den Code einfügen.

Die Farben lassen sich nach dem Hexadezimal Farbcode einfach ändern indem ihr die entsprechende Farbe eingebt oder den Farbcode.

hexadecimal color codes HTML Farbcodes

Ich hoffe meine Erklärung ist einigermaßen verständlich, bei Fragen schreibt einfach einen Kommentar.


EDIT:

Zum besseren Verständnis habe ich ein paar Screenshots gemacht, denn manches macht in Bildern mehr Sinn.

werbung screenshot

 

19 Kommentare

  1. Hallo Nicole,
    ui das kommt genau richtig. Ich habe schon versucht irgendwas zu basteln, was einigermaßen aussieht. Vielen lieben Dank.
    Ich habe jetzt nur eine Leerzeile zwischen Werbung und Posttitel. Hast Du eine Idee wie ich die wegbekomme?

    LG
    Silvia

  2. Hallo Nicole,

    super Tutorial. Bei mir funktioniert es – und ich werde jetzt erstmal alle meine entsprechenden Beiträge neu kennzeichnen =)

    Liebe Grüße
    Kathleen

    • Livelifedeeply-now

      Dankeschön! Mir geht es mit HTML nicht anders aber mittlerweile habe ich zumindest die Standardsachen kapiert.

  3. Super Idee!!! Nur scheint es bei mit in WordPress nicht zu funktionieren. Vielleicht bin ich aber auch nur zu … verwirrt 😉 … um das richtig einzubauen. Wenn ich das in der Feld für meine Headline kopiere, dann kommt da nur Murks raus –> die Headline sitzt dann ganz recht über meinen Tags. Hiiiilfeee!

    • Livelifedeeply-now

      Ich habe gerade mal geschaut, es mag vielleicht daran liegen, dass deine Headline ohnehin schon sehr groß ist und dadurch Platzprobleme entstehen, vielleicht würde es schon helfen die Headline um einen Punkt zu verkleinern auf H2 oder so, vielleicht spinn ich aber auch nur 🙂

  4. Hi Nicole,

    toller Tipp – danke! Ich hab’s gerade für meinen Blog versucht und es hat leider nicht funktioniert. Kann es daran liegen, dass ich die kostenfreie WordPress-Version nutze?

    Liebe Gruß aus Hamburg
    Melanie

    • Livelifedeeply-now

      Das kann ich mir eigentlich nicht vorstellen, da der HTML Code universell ist, vielleicht noch einmal probieren? Bin da ziemlich überfragt, du verwendest ja auch ein Standardtheme von daher sollte es eigentlich unproblematisch sein.

      • Also ich hab es mehrfach genauso versucht wie beschrieben und es geht einfach nicht. Das Wort Werbung steht einfach ganz normal mit in der Headline (Selbe Größe, Farbe, Zeile).

  5. Du bist meine Heldin, ich bastel hier auch schon den ganzen Tag rum, aber das einfach mit HTML umzusetzen, auf die Idee bin ich nicht gekommen. Ich frickel in der php rum, obwohl ich davon gar keinen Plan hab… Momentan bekomm ich deine Lösung nur unter die Überschrift, wenn es drüber ist, dann ist der Titel nur noch in normaler Schriftgröße. Muss ich mal ein bisschen rumbasteln. Dementsprechend vielen vielen Dank für diesen Post, rettet meinen Abend 🙂

    LG Andrea

  6. Pingback: eine kleine sonntagsflüsterei | glasgefluester

  7. Wie genial ist das denn, vielen Dank 🙂
    Ich habe es eingefügt, leider sieht es aber nicht so schön aus wie bei dir….
    Hier ist das gleiche Problem wie bei einigen anderen, dass eine große Leerzeile dazwischen ist und ich die Farben nicht abändern kann.
    Wenn du mal schauen magst: http://www.boocadeaux.blogspot.de
    Ich werde es jetzt aber einfach so lassen, vielleicht finde ich irgendwie noch raus, warum das so ist….
    Liebe Grüße
    Doro

  8. Liebe Nicole,

    nach Deinem Post hatte ich einen Test gemacht, der reibungslos lief. Nun wollte ich gerade meinen neuen Beitrag damit versehen, aber plötzlich erscheint nur das Wort „Werbung“ rot (sonst ist die ganze Überschrift in Rot). Außerdem hebt sie die eigentliche Überschrift nicht mehr vom Beitrag ab. Irgendwas mache ich also plötzlich falsch…
    Hättest Du einen Tipp??

    Kirsti

Kommentar verfassen