html Tutorial :: Attribution entfernen und Eigene erstellen


Am Ende des Blogs befindet sich oft eine Attribution von Blogger, die manchmal echt stört. In meinem Fall stand da zwar mein Name, allerdings wer denn bitte schön ist Jason Morrow von dem anscheinend die Vorlagenbilder stammen?
No idea. Das hat mich schon ewig stört. Nachdem ich immer wieder an meinem Layout herum bastele wollte ich diese Zeile endlich durch mein eigenes Copyright ersetzen.


So habe ich mich auf die Suche gemacht, wie ich diese Attribution von Blogger entfernen und durch meine Eigene ersetzen kann. Und wie das geht zeige ich euch heute.


Die Sache ist nämlich die, man findet diese Attribution zwar im Layoutbereich, allerdings kann man sie nicht löschen. Das ist fix voreingestellt.


Um das zu ändern müssen wir in die Untiefen des html-Codes:

1 // Unter Vorlage >> HTML bearbeiten

2 // Sucht nun im html-Code nach folgender Zeile:
<b:widget id='Attribution1' locked='true' title='' type='Attribution'> 

3 // Nun ersetzt ihr locked='true' durch locked='false'. Der Code sieht dann so aus:
<b:widget id='Attribution1' locked='false' title='' type='Attribution'> 
  
4 // Anschließend speichert ihr die Vorlage und wechselt wieder in den Layout-Bereich. Die Attribution kann nun gelöschen werden.


Nun könnt ihr euren Blog ohne Attribution belassen oder fügt nun euren eigene ein. Das machen wir nun wieder im html-Code.
1 // Unter Vorlage >> HTML bearbeiten

2 // Sucht nun im html-Code nach folgender Zeile:
</body> 

3 // Direkt darüber fügt ihr nun folgendes ein:
<div class='credit'> &#169; 2014
<b>&#183;</b> <a href='https://www.genusskochen.com'>genusskochen.com</a>
<b>&#183;</b> <a href='https://www.genusskochen.com/p/impressum.html'>Impressum</a>
</div>

Noch ein wenig zur Erklärung:
&#169; = ©
&#183; = Punkt
Beim ersten Link setzt ihr eure Blogadresse und eueren Blognamen ein.
In der Zeile darunter habe ich zusätzlich noch einen Link zu meinem Impressum gesetzt. Wenn ihr das nicht wollt, dann löscht die Zeile weg. Wichtig: das </div> darf nicht gelöscht werden.

4 // Das Aussehen der Attribution definieren wir nun im CSS. Dazu suchen wir im html-Code folgende Zeile:
]]></b:skin> 

Direkt über den skin-Code fügen wir dann nachstehendes ein. Wichtig ist, dass ihr eure CSS wirklich vor der eckigen Klammer einfügt, sonst werdet ihr keine Veränderung sehen.
/* Attributon
----------------------------------------------- */
.credit{
color: #333333;
text-align: center;
margin-top: 10px;
margin-bottom: 10px;
}

.credit a:hover{
color: #a38d9e;
text-decoration: underline;
}

Noch ein wenig zur Erklärung, damit ihr eure CSS selbst anpassen könnt:
color = Text Farbe
color (bei a:hover) = Text Farbe beim Mouse-over Effekt
text-align: center; = Text zentriert
margin-top = Abstand von oben
margin-bottom = Abstand von unten
text-decoration: underline; = Text wird unterstrichen beim Mouse-over Effekt

Nach dem Einfügen des CSS schaut meine Attribution dann so aus:

9 Kommentare

  1. Ich finde dein neues Design einfach toll - da ich deinen Blog schon sehr lange lese habe ich jede Veränderung am Blog "mitbekommen" und finde ihn jetzt einfach super. Leider kenn ich mich mit dem ganzen nicht so aus, würde auch gerne mehr von diesen Blogger Vorlagen wegkommen und eigene machen.... Aja und auf meiner Polar Uhr steht ft4 :)

    AntwortenLöschen
    Antworten
    1. Danke dir :) Das freut mich gerade unheimlich. Naja ein paar Tutorial, kommen die nächsten Samstage. Solche, die ich bei meinem Blog auch vorgenommen habe. Versuche es einfach aus.
      Dachte ich mir dass es die FT4 Polar Uhr ist - danke für die Info.

      Löschen
  2. Super duper. Ich suche schon ewig so ein Tutorial. Danke♥

    AntwortenLöschen
  3. bei mir sitzt das trotz exakter übernahmes deines codes einfach nicht zentriert :/ hast du vielleicht eine idee woran das liegen könnte?

    und vielen dank für das super tutorial! :)

    AntwortenLöschen
  4. Vielen lieben Dank, hat mir sehr geholfen :)

    AntwortenLöschen
  5. vielen Dank, das war sehr hilfreich, ich bin gerade dabei meinen ersten Blog einzurichten. Und bewundere jetzt deine Seite ! So würde es mir auch gefallen

    AntwortenLöschen
  6. Vielen Dank für das Tutorial! Es hat wirklich super geklappt und so etwas hab ich auch noch nie gesehen. Ich hab noch ein paar Probleme mit meinem Hintergrund, aber das werd ich noch lösen. Danke!

    AntwortenLöschen
  7. Hat geklappt. Vielen, vielen Dank <3

    AntwortenLöschen

Hinweis: Mit dem Absenden des Kommentares bestätige ich, dass ich die Datenschutzerklärung gelesen habe und akzeptiere.
Deine E-Mail-Adresse wird nicht veröffentlicht.