Ötlet: Dinamikusan változtatható szélességű Facebook pluginek

Kategória: 
Gyorstippek

Ez egy ötlet, ami működik, viszont nem vagyok egy Stahl Judit, süti témában annyit tudok, hogy vannak, és lehet használni. Tehát a kockázatok és mellékhatások következményeiről írjon itt a kommentben, vagy kérdezze meg sminkmesterét, sitebuilderét (hopp, fail.. ez én vagyok..)

Probléma a következő: Adott egy manapság oly divatos reszponzív drupal smink. Szépen be van állítva cssből, hogy milyen méretekben, hogyan jelenjen meg. Igenám, de a facebook plugineknek többnyire van egy olyan csúnya paraméterük, hogy "width". Ezt php-ből állítani tudjuk, de szerveroldalon nem tudunk meggyőződni a böngésző szélességéről.

Mi most mégis megcsináljuk, az alapötlet rém egyszerű:

Vegyük a facebook pluginek méretét alapértelmezetten a legkisebbre, ami a reszponzív sminkünk legkisebb felbontás melletti formázásaihoz passzol.

Jqueryvel tegyünk egy hosszúlejáratú sütit a user gépére.

(function ($) {
  Drupal.behaviors.tm_hooks = {
    attach: function(context, settings) {
      $.cookie("en_kicsi_kukim", $(window).width(), {expires : 365});
    }
  };
})(jQuery);

Majd phpvel kiolvasva állítsuk a facebook plugin paraméterét a kívánt értékre a sminkfüggvényünkben, vagy templateben.

Pl 1280-nál kisebb böngészőnél 350pxes, annál nagyobbnál 520px-es plugint kérünk.
És itt kell még egy help: Az a fránya jquery nem igazán a böngésző rendes szélességét adja vissza, legalábbis ami a firefox web developer toolbar méretezését illeti, szóval ez most hogy is van?

$fb['width'] = isset($_COOKIE['en_kicsi_kukim']) && $_COOKIE['en_kicsi_kukim'] > 1263 ? 520 : 350;

Ebben az esetben mindössze egyetlen alkalommal fog a felhasználónál a legkisebb méretű plugin megjelenni, és még ha át is méretezi a böngészőt, az is korrigálva lesz a következő oldalletöltéskor.

Kérdések:

  1. Mennyire ok, ez módszer, nincs-e benne valami buktató, amit benéztem?
  2. Van-e más lehetőség?
    • Css kilőve, egy likeboxnál még keservesen be lehet jól sminkelni, de egy fb_commentnél már kizárt.
    • Valami jquery vudu, amivel az iframen belül lehet babrálni? Ezzel megint olyan gázt érzek, hogy az fb azért a szélesség paraméter alapján elég sok mindent kiszámol. Szóval ez valahogy a dokumentum betöltése előtt jöhet szóba, tehát nem kizárt.
    • Valami a facebook apiban?

Hozzászólások

Hozzászólás

A mező tartalma nem nyilvános.
  • Internal paths in double quotes, written as "internal:node/99", for example, are replaced with the appropriate absolute URL or relative path.
  • Engedélyezett HTML elemek: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <del> <img>
  • A webcímek és email címek automatikusan linkekké alakulnak.
  • A sorokat és bekezdéseket a rendszer automatikusan felismeri.
  • Engedélyezett HTML elemek: <a> <blockquote> <br> <cite> <code> <dd> <del> <div> <dl> <dt> <em> <li> <ol> <p> <span> <strong> <ul>
  • You can enable syntax highlighting of source code with the following tags: <code>, <blockcode>, <bash>, <c>, <cpp>, <drupal5>, <drupal6>, <java>, <javascript>, <mysql>, <php>, <python>, <ruby>, <sql>. The supported tag styles are: <foo>, [foo].
  • Minden email cím át lesz alakítva ember által olvasható módon, vagy (ha a JavaScript engedélyezett) ki lesz cserélve kattintható, de biztonságos hivatkozásra.
Type the characters you see in this picture. (verify using audio)
Type the characters you see in the picture above; if you can't read them, submit the form and a new image will be generated. Not case sensitive.