Herótom lett a CSS hackelésből!

  • The spam filter installed on this site is currently unavailable. Per site policy, we are unable to accept new submissions until that problem is resolved. Please try resubmitting the form in a couple of minutes.
  • GeSHi library error: sites/all/modules/geshifilter/geshi is not a directory.

Minden sitebuilder rémálma, hogy különböző böngészőkben hogyan fog szétesni az oldal. Az Internet Explorer CSS kezelése Bill Gates édesanyjának non-stop csuklásának a fő oka, azonban én most konkrétan egy egy pixeles Chrome elcsúszást próbáltam levadászni napok óta..

Az IE bugfix - főleg Zen sminkkel dolgozva - nem nagy truváj hiszen CSS-ben elég jól lehet az IE verziókra célozni. Normálisan használható Chrome hacket azonban nem találtam. Olyan lehetőség nincs, hogy nem lehet megoldani, úgyhogy azt találtam ki, hogyha a Zen amúgy is olyan szépen ellátja extra classokkal a body-t, miért ne tolhatnánk bele azt is, hogy épp milyen böngészővel látogtják az oldalt?

Kruska Roland oldalán találtam meg a szükséges szkriptet, amit a smink template.php-jébe beírva egy mezei page preprocessel elérjük, amit akarunk.

function ieversion() {
  ereg('MSIE ([0-9]\.[0-9])',$_SERVER['HTTP_USER_AGENT'],$reg);
  if(!isset($reg[1])) {
    return -1;
  } else {
    return floatval($reg[1]);
  }
}
function browser(){
  $browser = 'ismeretlen';
  if (stristr($_SERVER['HTTP_USER_AGENT'],"mozilla")){$browser = 'mozilla';};
  if (stristr($_SERVER['HTTP_USER_AGENT'],"msie")){$browser = ('ie' .ieversion());};
  if (stristr($_SERVER['HTTP_USER_AGENT'],"netscape")){$browser = 'netscape';};
  if (stristr($_SERVER['HTTP_USER_AGENT'],"galeon")){$browser = 'galeon';};
  if (stristr($_SERVER['HTTP_USER_AGENT'],"konqueror")){$browser ='konqueror';};
  if (stristr($_SERVER['HTTP_USER_AGENT'],"lynx")){$browser = 'lynx';};
  if (stristr($_SERVER['HTTP_USER_AGENT'],"opera")){$browser = 'opera';};
  if (stristr($_SERVER['HTTP_USER_AGENT'],"icab")){$browser = 'icab';};
  if (stristr($_SERVER['HTTP_USER_AGENT'],"safari")){$browser = 'safari';};
  if (stristr($_SERVER['HTTP_USER_AGENT'],"amaya")){$browser = 'amaya';};
  if (stristr($_SERVER['HTTP_USER_AGENT'],"aweb")){$browser = 'amiga Web';};
  if (stristr($_SERVER['HTTP_USER_AGENT'],"beonex")){$browser = 'beonex';};
  if (stristr($_SERVER['HTTP_USER_AGENT'],"chimera")){$browser ='chimera';};
  if (stristr($_SERVER['HTTP_USER_AGENT'],"dillo")){$browser = 'dillo';};
  if (stristr($_SERVER['HTTP_USER_AGENT'],"chrome")){$browser = 'chrome';};
  return $browser;
}

function SMINKNEVE_preprocess_page(&$vars, $hook) {
  $vars['browser'] = browser();
}

Ezután a page.tpl.php-ban akárhová pakolhatjuk, nekem a bodyba kell:

<body class="<?php print $browser; ?>">

Ilyen szinten nem nagyon túrtam még template.php-t, működni működik, de remélem nem csináltam semmi "drupalellenes" dolgot.

 UPDATE: A kommentekből és az azóta történt utána járásaimból kiderült, hogy ezt nem a legmegfelelőbb módszer a célom eléréséhez. Csak azért hagyom bent a postot, mert arra jó példa, hogy hogyan vezessünk be page.tpl.php-ba új változót smink preprocessen keresztül.

Hozzászólások

@zserno: A cache teljesen

@zserno: A cache teljesen jogos, erre nem gondoltam..

A $body classes benne maradt, e mellé írom ki, egyszerűen lusta voltam betenni a $body_classes-be. :)

Ok. Azt tudjuk, hogy lehet conditional css-t berakni ie-hez. Hogy csinálhatom meg chrome-al, ugyanezt?
Azóta már sajna nem csak az 1px-ről van szó, elég bonyolult oldalt csinálok rakás slideshow-val, meg fittyfenével, és már elég sok helyen kellett böngészőspecifikus beállításokat végezni.

Elmeletben jo megoldas, de

Elmeletben jo megoldas, de nem Drupallal.

Ez ugyanis csak akkor mukodik, ha nincs bekapcsolva az oldalak gyorstarazasa. Amint ez be van kapcsolva, a nem bejelentkezett latogatok kozul a legelso latogato (aki nem cache-bol kapja az oldalt) bongeszoje lesz eltarolva ertelemszeruen. Roviden 1px-ert cserebe bukoda a cachet anonymous latogatoknak.

Masik eszrevetel: A Zen smink alapbol ad neked egy csomo hasznos class-t a body tagnek ($body_classes), miert nem egeszited azt ki, ahelyett, hogy felulirod oket a $browser ertekevel?

Hátöööö... Nem

Hátöööö... Nem Drupal-ellenes, de nem is tartom szép megoldásnak. Arra emlékeztet, amikor a Javascriptek még böngésző-detektálással kezdődtek.

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.