,

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

50 Kommentare
  1. kiriKari sagte:

    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

    Antworten
  2. *nane sagte:

    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

    Antworten
  3. Mia - Schönes Selbstgemacht sagte:

    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

    Antworten
  4. Jessica sagte:

    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!

    Antworten
  5. sternenliebe sagte:

    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!

    Antworten
  6. ullatrulla sagte:

    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

    Antworten
  7. smartie sagte:

    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

    Antworten
  8. Anni sagte:

    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!

    Antworten
  9. Sara sagte:

    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

    Antworten
  10. Wiebke sagte:

    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

    Antworten
  11. Sandra sagte:

    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

    Antworten
  12. creativlive sagte:

    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

    Antworten
    • Bine sagte:

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

      Antworten
  13. Dana sagte:

    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

    Antworten
  14. Sharon sagte:

    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

    Antworten
    • Bine sagte:

      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

      Antworten
  15. Ina sagte:

    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

    Antworten
  16. Contadina sagte:

    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

    Antworten
  17. Lyndywyn sagte:

    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

    Antworten
  18. SteffiMietz sagte:

    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

    Antworten
  19. Angel of Berlin sagte:

    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!

    Antworten
  20. SaKo sagte:

    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

    Antworten
  21. Kati by malamü sagte:

    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

    Antworten
  22. Juliana sagte:

    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

    Antworten
  23. Grace sagte:

    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 !!

    Antworten
  24. Elealinda-Design sagte:

    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

    Antworten
  25. Kathrin sagte:

    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*

    Antworten

Trackbacks & Pingbacks

  1. […] 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 […]

Dein Kommentar

An Diskussion beteiligen?
Hinterlasse uns Deinen Kommentar!

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.