kostenloser Webspace werbefrei: lima-city


Facebook Meta-Tags per jQuery ändern

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    alfr3d

    alfr3d hat kostenlosen Webspace.

    Hallo,

    ich baue auf einer Homepage einen dynamischen Facebook Gefällt-mir-Button in eine Galerie ein mit dem man das aktuell angezeigte Bild auf Facebook teilen kann.
    Hierzu setzte ich per
    <meta name="fbComment" property="og:image" content="http://domain.de/pfad/zum/bild.jpg" />
    <meta name="fbTitle" property="og:title" content="Titel des Bildes" />
    <meta name="fbDescription" property="og:description" content="Beschreibung des Bildes" />
    die entsprechenden Meta-Tags um das richtige Bild und einen individuellen Titel und Beschreibung in Facebook anzuzeigen.
    Jetzt möchte ich diese Meta-Tags gerne per jQuery ändern wenn man in der Galerie weiterklickt. Hierzu verwende ich
    $("fbComment").attr("content", "Neuer Kommentar");
    ...

    Allerdings werden die Meta-Tags dadurch nicht geändert, bzw wenn ich wieder auf den neuen "gefällt-mir-Button" klicke werden die Contents der ursprünglichen Meta-Tags verwendet.

    Meine Frage ist also wie ich diese Meta-Tags dynamisch per jQuery so ändern kann, dass die Inhalte von Facebook übernommen werden.

    Ist das überhaupt möglich?
    Hat jemand schon einmal dieses Problem gehabt?
    Hat jemand andere Lösungansätze für mein Problem?

    Vielen Dank für alle hilfreiche Beiträge :smile:

    Beitrag zuletzt geändert: 26.1.2012 15:47:19 von alfr3d
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. $("meta[property='og:image']").attr("content", "http://domain.de/pfad/zum/bild.jpg");
    $("meta[property='og:title']").attr("content", "Titel des Bildes");
    $("meta[property='og:description']").attr("content", "Beschreibung des Bildes");


    Das name-Attribut solltest du wieder entfernen. Wird nicht valid sein, schätze ich.

    Beitrag zuletzt geändert: 26.1.2012 16:12:51 von fabo
  4. Mit facebook kenne ich mich nicht besonders aus, frage mich aber, ob der Spider dort überhaupt mit Javascript umgehen kann? Ich vermute eher, das nein.
    Dann bekommt er nur das zu sehen, was bei der Auslieferung der Seite an Metatags gesetzt war und Du kannst dir den Aufwand sparen.
  5. Ich denke schon, dass das funktioniert. Der Facebook-Spider muss ja kein JS können (wobei ich mir da gerade nicht sicher bin ob er's nicht doch kann, werd's aber gleich testen), da die entsprechenden Tags (wahrscheinlich) beim Aufruf der Seite erst einmal mit vordefinierten Inhalten gefüllt sind.

    Der User teilt dann nur den Link zum Bild, welches er gerade aufgerufen hat, wobei Facebook dann ja die Tags unabhängig von JQuery wieder ausliest (da sie ja mit den entsprechenden vordefinierten Inhalten gefüllt sind beim Direktaufruf).

    Ich befürchte nur grad, dass ich gerade zu wirr schreibe und nun keiner verstanden hat, was ich eigentlich sagen wollte :D

    Also nochmal: Die Tags sind statisch, beim Direktaufruf eines Bildes. Lediglich beim Besucher werden sie mittels JQuery verändert, wenn weiter navigiert.

    Beitrag zuletzt geändert: 26.1.2012 16:27:24 von fabo
  6. fabo schrieb:
    Also nochmal: Die Tags sind statisch, beim Direktaufruf eines Bildes. Lediglich beim Besucher werden sie mittels JQuery verändert, wenn weiter navigiert.

    Da den Besucher die Tags aber nicht interessieren und Facebok nur den statischen Content vorgesetzt bekommt, ist das Unterfangen doch sinnlos, oder irre ich mich?

    Frage zum Verständnis: Die FB-metas sind doch dazu da, daß FB, wenn es die Seite crawlt, z.B. weil ein User eines der Bilder verlinkt, oder den "gefällt mir"-Button drückt, zusätzlich ein paar Infos bekommt. Ist das so richtig?
  7. Richtig. Die Besucher interessieren die Tags nicht, aber die Tags bestimmen u.A. auch das Verhalten des Like-Buttons :)

    Funktioniert alles so, wie alfr3d das plant und wenn man sich damit etwas auseinandersetzt, leuchtet das Vorhaben auch ein. Die Tags müssen sich bei jedem Bild entsprechend verändern, damit der Inhalt des "Likes" dazu passt (Text, Bild, etc.). Der Besucher sieht die dynamische Version der aktuellen Seite, bei der die Tags immer mittels JS aktualisiert werden, Facebook die statische, wo die Tags mittels PHP vordefiniert werden.

    Kann natürlich sein, dass ich mich täusche und alfr3d das anders macht. Jedoch würde es so funktionieren :)

    Beitrag zuletzt geändert: 26.1.2012 17:23:26 von fabo
  8. Autor dieses Themas

    alfr3d

    alfr3d hat kostenlosen Webspace.

    Danke schon einmal für eure Ideen und Anregungen.

    Ursprünglich war geplant, dass ich einen "Share-Button" einbaue. Wenn man auf diesen klickt öffnet sich eine Dialog, in welchem man eine Statusnachricht verfassen kann. Hierfür wollte ich die Meta-Tags dynamisch ändern. Da ich jetzt aber nur noch einen normalen "Like-Button" einbaue, ist es wohl nicht mehr nötig die Meta-Tags per jQuery zu ändern, da sie beim Direktaufruf der Seite über PHP gesetzt werden, was für Facebook funktionieren sollte.

    Ein anderes Problem ist jetzt aber viel mehr, dass Facebook diese Tags nicht mehr "erkennt" und mir deshalb auch kein Vorschaubild, keine Beschreibung und nur den Seitentitel als Titel anzeigt. Hat jemand eine Idee woran das liegen könnte?
  9. Poste mal einen Link, wo man sich das ansehen kann.
  10. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!