Wie Ihr social media buttons in Euren blogspot Blog einbaut [Anleitung zum Selbermachen].

EDIT // 31.5.2013: Dieses Posting ist für alle blogspot-user. Ich habe es verfasst, als mein Blog noch bei blogspot und nicht bei wordpress lag!

Guten Morgen, Ihr Lieben! Eigentlich guten Tag, aber ich bin noch immer nicht ganz wach. Da hilft auch die dritte Tasse Kaffee nicht. Mein Wochenende war nicht nur extremst spannend, motivierend und inspirierend, es war auch ganz schön anstrengend. Ich habe soooo viele tolle Bloggerinnen kennen gelernt, wunderbare Gespräche geführt, viel gelernt und erfahren- ich bin voller Eindrücke und gleichzeitig leer gequatscht. Vielleicht melde ich mich später nochmal mit einem Bericht von The Hive… oder morgen, mal sehen! Jetzt aber zu Eurer Frage nach den social media buttons. Wie ich gelesen habe, wird die Antwort auf die Frage „Wir Ihr social media buttons in Euren blogspot blog einbaut?“ schon sehnsüchtig erwartet. ;-)

Achtung, mitschreiben! Öffnet ein neues Posting. Klickt dann auf html-Ansicht. Ladet Eure social media buttons als Bilder hoch. Das sieht dann so aus:

Wie man social media Buttons in einen Blogspot Blog einbaut | Anleitung | was eigenes Blog

 

Die gelbe Zeile ist mein Facebook-Button. Die rote Textzeile löscht Ihr nun rauss und ersetzt diese durch den Link zu Eurer jeweiligen social media Seite, in diesem Falle: zu meiner  Facebook Fanpage.

Das macht Ihr nun bei allen anderen Buttons ebenso.

Wie man social media Buttons in einen Blogspot Blog einbaut | Anleitung | was eigenes Blog

Wenn Ihr alle Links ersetzt habt, speichert Ihr das Posting als Entwurf. Dann kopiert Ihr den kompletten html-Code und schliesst das Posting.

Nun geht Ihr in Euer Blog-Layout, öffnet ein html-gadget und setzt den kopierten Code dort ein, dann speichern und die ansprechende Stelle in Eurem Layout schieben, fertig!

Ich musste ein bisschen mit den Größen der Symbole spielen- erst waren sie zu groß, dann zu klein. Die Bilder und gadgets meiner linken Sidebar sind z.B. 160 pixel breit. Um drei social media button nebeneinander ins gadget einzufügen, habe ich sie auf 50 x 50 pixel verkleinert- dass passt dann so ungefähr.

Social media buttons gibt es zu genüge im Netz, z.B. hier [klick] oder hier [klick] oder Ihr googelt mal nach „free social media buttons“. Hierbei hilft übrigens immer sehr gut die Bildersuche.

Viel Erfolg beim Linken, Basteln, Schieben und Veröffentlichen. :-)

Ein riesen Dankeschön gilt hier übrigens nicht mir, sondern meiner liebsten Buch-Blog-Freundin Frau Kännchen, von der ich wiederum diese Anleitung bekommen habe. Danke, Caro! :-*

Ich wünsche Euch einen schönen Montag!

Liebe Grüße, Bine

Anleitung, Rund ums Bloggen
Previous Story
Next Story

50 Kommentare

  • Reply
    kiriKari
    27. Mai 2013 at 13:10

    Liebe Bine,
    ich bin dir so so dankbar.
    wird gleich ausprobiert! :-) :-)
    auf den Bericht aus Berlin bin ich schon gespannt.
    Liebe Grüße und noch mal danke!
    Christine

  • Reply
    Meine-Deine made by ich
    27. Mai 2013 at 13:55

    Liebe Bine,
    ich muss grad bisschen schmunzeln:-) Habe ich doch vorige Woche wahnsinnig viel Zeit in der suche nach den richtigen Einstellungen für diese Buttons gesucht im www. LG Nadine

  • Reply
    *nane
    27. Mai 2013 at 15:17

    Huhu liebe Bine, zuerst mal vielen Dank für diesen Post, im www habe ich mittlerweile auch schon gestöbert und bin auf diverse Seiten gestoßen mit den free buttons, aber nun weiß ich wenigstens wie man die dann „installiert“ ! Große klasse, dass Du Dir die Mühe gemacht hast und uns weiter hilfst ;o)
    Vielen lieben Dank nochmal…..ich werde mich in nächster Zukunft damit beschäftigen ;o) Liebe Grüße Christiane

  • Reply
    Mia - Schönes Selbstgemacht
    27. Mai 2013 at 15:46

    Hallo liebe Bine,

    vielen, vielen Dank für diese tolle Anleitung!
    Ich habe es direkt einmal ausprobiert und siehe da… Es hat nach etwas Startschwierigkeiten wunderbar geklappt und sieht super aus!

    Danke nochmal und liebe Grüße,
    Anne

    • Reply
      kiriKari
      27. Mai 2013 at 15:48

      Liebe Mia,
      gleich mal bei dir geschaut- ist TOLL geworden…
      dann leg ich nachher gleich mal los.

  • Reply
    Mareike
    27. Mai 2013 at 16:08

    Das ist aber endlich mal eine tolle Anleitung für jedermann!!! Vielen Dank dafür :)

  • Reply
    Vronal
    27. Mai 2013 at 17:12

    cool! Danke für die Anleitung! Wurde schon umgesetzt :)

    LG Vroni

  • Reply
    kaline
    27. Mai 2013 at 17:35

    super! vielen dank für die anleitung!

  • Reply
    Jessica
    27. Mai 2013 at 19:32

    Liebe Bine,

    vielen Dank für diese einfache Anleitung! Ich habe sie gleich umgesetzt und es hat funktioniert! Toll.
    Und jetzt finde ich noch heraus, wie ich einen Email-Button verlinke ;)

    Danke!

  • Reply
    Miss Poupette
    27. Mai 2013 at 21:55

    ♡ Hallo Liebes ♡

    bin gerade auf deinen Blog gestoßen und er gefällt mir echt gut. Mach weiter so!

    Wenn du Lust und Zeit hast, kannst du auch einen Abstecher auf meinen Blog machen. Würde mich total freuen!

    Küsschen an dich, L. ♡

    von http://miss-poupette.blogspot.de/

  • Reply
    sternenliebe
    27. Mai 2013 at 22:24

    Super Super Super!!!!! DAAAAANKE. Ich stell mich vielleicht was doof an, aber seid Tagen versuche ich das raus zu bekommen, wie man das macht und das ganze Social Media Dings is gar nicht mal soooo einfach. Tausend Dank, damit wirds in der nächsten Woche wohl klappen! Merci! <3 Bist die Beste!

  • Reply
    KleinesLieschen
    27. Mai 2013 at 22:39

    Hey, super-super-super, lieben Dank dafür!

    LG vom KleinenLieschen

  • Reply
    ullatrulla
    28. Mai 2013 at 00:11

    Tach Bine,

    hach, das ist ja eine tolle Anleitung. Ich hab auch ganz eifrig probiert und nach ein paar Startschwierigkeiten hab ich die Buttons auch drin im Blog, aber sie werden nicht angezeigt (vermutlich auch, weil sie zu groß sind). Hüstel, wo genau verringer ich denn die Größe der Buttons?? Muss ich das vor dem Udpolad machen oder geht das über den HTML-Befehl? Hilfe .. :-(
    Tausend Danke!
    ullatrulla

    • Reply
      Bine {was eigenes}
      28. Mai 2013 at 10:39

      @ullatrulla, ich habe meine buttons in photoshop verkleinert. Geht aber bestimmt auch mit picmonkey oder picasa und anderen Foto/jpg.- Bearbeitungsprogrammen.
      LG Bine

  • Reply
    Schmuck~Stück
    28. Mai 2013 at 16:04

    Egal ob von dir oder Caro…. Ihr seit richtig große Klasse… vielen vielen Dank dafür!!!
    GLG Momo

  • Reply
    nadelundgabel
    28. Mai 2013 at 16:39

    Vielen, vielen Dank! Das ist ja tatsächlich total einfach … aber alleine wäre ich als Technikbanause darauf nicht gekommen!

  • Reply
    smartie
    29. Mai 2013 at 11:36

    Hallo Bine!
    Juhu, es hat geklappt und war eigentlich ja sooo einfach :) vielen lieben Dank!!
    Wenn du dir das Ergebnis ansehen willst, klick einfach auf meine Seite.

    Liebe Grüße,
    Dani
    mademoisellelavande.blogspot.com

  • Reply
    Anni
    30. Mai 2013 at 10:52

    Vielen, vielen Dank!!! Ich habe mich bislang nicht damit auseinander gesetzt. Es erschien alles zu kompliziert. Nun kann ich endlich auch an mein bloglayout weiter feilen, motiviert durch deine Posts. Dankeeee!

  • Reply
    Mami Made It
    30. Mai 2013 at 12:06

    Daaanke! Hat super geklappt!

  • Reply
    yoisbmgha
    5. Juni 2013 at 05:25

    ldipypgkn lenvw xcnrlcg hvpx gewhqhzceguseus

  • Reply
    Sara
    10. Juni 2013 at 02:59

    Aber warum denn die html-Ansicht? Die meisten Bloggerinnen verstehen kaum etwas von html. Da wäre doch die WYSIWYG-Ansicht – also „Verfassen“ wie es im Blogger-Editor heisst, sinnvoller.

    Viele Grüße
    Sara

  • Reply
    Wiebke
    15. Juni 2013 at 15:23

    Danke für die Anleitung! Damit habe ich gestern auch Social Media Button erstellt und sogar, weil ich schon so in Fahrt war, gleich noch eine facebook-Seite erstellt *räusper*
    Ich hab zusätzlich noch einen feedly-Button erstellt, wenn Interesse besteht, erklär ich, wie ich das gemacht habe 8-)

    Liebe Grüße,
    Wiebke

  • Reply
    Sandra
    22. Juli 2013 at 22:51

    Vielen, vielen Dank für die tolle Anleitung! Das war jetzt, glaub ich, die vierte die ich gelesen habe und endlich hat es funktioniert :-)

    Liebe Grüße, Sandra

  • Reply
    Selina
    25. Juli 2013 at 11:10

    OHHH, vielen Dank! Der allerbeste und am leicht zu verstehenste Post darüber :)
    habe es sofort hinbekommen und bin mega glücklich *-*

    • Reply
      Bine
      25. Juli 2013 at 14:54

      Das freut mich! ;-)

  • Reply
    Jasi
    19. August 2013 at 16:16

    Vielen lieben Dank *-*
    Du hast mir wirklich sehr geholfen damit!

  • Reply
    creativlive
    30. August 2013 at 10:12

    Das ist wirklich eine tolle Anleitung und soweit hat das auch super geklappt….aber wie bekomme ich denn die Buttons nebeneinander? Meine sind nicht wirklich groß, aber sie sind nur untereinander. Da für mich html wie russisch rückwärts ist würde ich über einen Tipp sehr freuen!
    Danke Astrid

    • Reply
      Bine
      30. August 2013 at 15:16

      dann versuch mal den jeweiligen code für jeden button gleich nebeneinander einzufügen. ansonsten habe ich leider auch keinen tipp! sorry. lg bine

  • Reply
    Dana
    29. September 2013 at 22:49

    Vielen lieben Dank für den tolle Anleitung. Ich habe das gestern ausprobiert und es hat alles ganz wunderbar geklappt.
    Aber eine Frage habe ich und ich hoffe du kannst mir da eine kleine Antwort geben.
    Ich habe jetzt das Wort facebook (auch instagram & bloglovin) ausgeschrieben als button auf meinen Blog geladen.
    Allerdings ist mir jetzt eine Seite (http://www.rdp-law.de/blog/worauf-sollte-man-bei-der-einbindung-von-social-media-button-auf-seiner-webseite-achten.html) ins Auge gestochen. Die hat mich etwas verunsichert. Darf ich diese Button so wie sie auf meinem Blog sind, verwenden?
    Könntest du mir da weiterhelfen?

    Du würdest mir einen großen Gefallen tun.

    Liebste Grüße und vielen Dank schon einmal.
    Dana

  • Reply
    Sharon
    15. Oktober 2013 at 10:55

    Liebe Bine…

    Super Post! Ich habe bis jetzt keine gute Beschreibung gefunden, um Icons in meinen Blog einzufügen. Mit deiner Beschreibung war es jedoch ein Kinderspiel. Danke!! Ich wäre sonst noch verzweifelt;)

    Ich finde deinen Blog allgemein super & sehr lesenswert! Wenn ich schon dabei bin, hätte ich noch zwei Fragen an dich.. Ich bin noch neu unter den Bloggern & habe daher manchmal etwas Schwirigkeiten mit dem Einfügen von gewissen Dingen :)

    Hier meine Fragen:

    1. Bei den Social Network Icons… Ich habe diese nun eingefügt, jedoch öffnet es bei mir keine neue Website. Wie kann ich das einstellen?

    2. Ich habe schon bei vielen Blogger, wie auch bei dir, gesehen, dass sie ein Foto von sich oben platziert haben – und alle in einer runden Form. Wie bringt ich das hin? Bei mir will das verflixte Foto einfach nicht dort hin.

    Danke dir 1000 Mal für deine Hilfe.

    Liebe Grüsse
    Sharon

    • Reply
      Bine
      15. Oktober 2013 at 13:07

      Hallo Sharon, danke für Deinen netten Kommentar!
      Zu Frage 1: kann ich Dir gerade leider nicht helfen, weil ich ja jetzt einen wordpress Blog habe… ich bin mir nicht mehr sicher, wie ich das damals genau auf
      meinem alten blogspot Blog gemacht habe. Ich glaube, Du musst in den html code irgendwas mit _blank einfügen. Goggle das mal.

      Zu Frage 2: Ich habe das runde Foto mit Photoshop erstellt. Dafür das Bild öffnen und rund ausschneiden. Solltest Du kein Photoshop haben… das geht sicherlich
      auch mit PicMonkey oder anderen Freeware-Programmen. Dann lädst Du das Foto als Bild hoch und verlinkst das Bild zu Deinem Profil.
      Somit hast Du kein klassisches blogspot-Profilbild, sondern Dein eigenes Foto mit Link zum Profil.
      Verständlich?

      LG Bine

  • Reply
    Ina
    19. Oktober 2013 at 21:56

    Danke für die Anleitung. Ich hab von HTML null Komma null Ahnung, aber mir deiner tollen Erklärung konnte ich heute immerhin 2 kleine Buttons einbinden

    Liebe Grüße
    Ina

  • Reply
    Contadina
    10. Februar 2014 at 17:54

    Vielen lieben Dank für diese erstklassige Anleitung – endlich habe sogar ich das mal kapiert… *g*

    Runde Buttons wollten es allerdings partout nicht werden – meine Programme haben sich alle gewehrt.

    Aber den Trick werde ich auch noch irgendwann rausbekommen. ;-)

    Liebe Grüße
    Sabine

  • Reply
    Caro
    27. Februar 2014 at 22:03

    Danke Bine, dass du auch an Bloganfänger denkst :o)

  • Reply
    Lyndywyn
    28. Februar 2014 at 23:50

    Danke für die Anleitung! Leider stehen die Icons bei mir untereinander. Wie bekommt man sie denn nebeneinander? Hast Du einen Tipp?
    Ich hab schon probiert sie anzuordnen.

    lg

  • Reply
    SteffiMietz
    30. März 2014 at 21:18

    Liebe Bine,

    tausend Dank für diese perfekte und doch so einfache Anleitung! Du hast mir damit gerade vermutlich stundenlanges Suchen im www erspart! Das einfügen der Icons ging mit deiner Anleitung Eins-Fix-Drei und hat sofort geklappt :-)

    Liebe Grüße
    Steffi

    • Reply
      Bine
      1. April 2014 at 07:58

      Toll- das freut mich sehr! Lieben DANK für die nette Rückmeldung, Steffi!

  • Reply
    Angel of Berlin
    8. April 2014 at 14:45

    Liebe Bine, Herzlichen Dank für das tolle Tutorial. Ich habe schon ewig gesucht und immer nur etwas mit Bilder bei Flickr hochladen gefunden. Jetzt hat es endlich geklappt. Ich danke Dir wirklich sehr für dieses Tutorial!

    • Reply
      Bine
      9. April 2014 at 09:47

      Bitte, gerne! Es freut mich, dass es geklappt hat!
      GLG Bine

  • Reply
    SaKo
    28. April 2014 at 12:31

    Hallo Bine!
    Sowohl im alten als auch im neuen Layout bin ich an den Buttons verzweifelt. Ich habe mehrere Anleitungen versucht, aber es klappte nie. Per Zufall bin ich jetzt mit anderen Wörtern in der Google-Suche zu dir gekommen und siehe da – es hat geklappt. Sie sind sogar nebeneinander. Ich muss nur noch herausbekommen, wie ich sie zentriert platziere, aber darum kümmere ich mich heute Abend.

    Vielen Dank und liebe Grüße,
    SaKo

  • Reply
    Kati by malamü
    7. Juli 2014 at 19:57

    1000 Dank für die Anleitung!
    Ich weiß nicht, wie viele ich schon versucht habe und nie hat’s geklappt.
    Es ist zwar noch nicht perfekt, aber viiiiel besser als vorher – Danke!
    LG
    Kati

  • Reply
    Juliana
    22. Juli 2014 at 08:53

    Vielen vielen Dank für diese super tolle und hilfreiche Anleitung! :)
    Ohne wär ich total aufgeschmissen gewesen und du hast das wirklich super verständlich erklärt!

    Liebste Grüße
    Juliana

  • Reply
    Grace
    2. August 2014 at 10:34

    Supiiiii!!! Vielen Dank :) endlich weiß ich wie ich die Social Media Buttons einbauen kann und das hat super funktioniert. Jetzt muss ich nur noch die für mich passenden Buttons finden.

    Many Thanks !!

  • Reply
    Katharina
    20. August 2014 at 20:28

    Oh gott tausenddank! habe lange nach so einem Post gesucht. Hat alles Einwandfrei geklappt :)

  • Reply
    Yasmin
    3. September 2014 at 21:07

    DANKE DANKE DANKE für diese tolle Anleitung! :)

    • Reply
      Bine
      4. September 2014 at 19:51

      Gerne. Gerne. Gerne! :-)
      LG Bine

  • Reply
    Elealinda-Design
    5. September 2014 at 08:40

    Liebe Bine, tausend Dank für diese wunderbare und doch recht einfache Anleitung. Das Thema Social Media Icons habe ich schon ewig vor mir hergeschoben. Dank deiner Hilfe habe ich es jetzt endlich in Angriff genommen und umgesetzt. Noch nicht perfekt, aber ich weiß ja jetzt, wie es geht :-). LG und schönes Wochenende, Paula

    • Reply
      Bine
      5. September 2014 at 08:54

      Sehr gerne! Das freut mich!
      LG Bine

  • Reply
    Kathrin
    4. April 2015 at 09:58

    Liebe Bine, ich habe so lange nach einer Anleitung dafür gesucht!! Danke dafür! Ich habe es auch schon sofort ausprobiert und es hat geklappt! Schöne Ostern für Dich! Kathrin*

  • Reply
    Behind the Seams: Januar Rückblick Behind the Seams: January Review
    26. Dezember 2015 at 16:58

    […] nach Weihnachten etwas Zeit hatte, hat sich auch ein bisschen was auf dem Blog getan. Dank diesem Tutorial von was eigenes, habe ich jetzt auf der rechten Seite kleine, feine Social Media Buttons. Außerdem […]

  • Ich freue mich über Deinen Kommentar!