Warning: count(): Parameter must be an array or an object that implements Countable in /usr/www/users/w007a7e8/germanis.de/public_html/components/com_k2/models/item.php on line 763

Warning: count(): Parameter must be an array or an object that implements Countable in /usr/www/users/w007a7e8/germanis.de/public_html/components/com_k2/models/item.php on line 763

Warning: count(): Parameter must be an array or an object that implements Countable in /usr/www/users/w007a7e8/germanis.de/public_html/components/com_k2/models/item.php on line 763

Warning: count(): Parameter must be an array or an object that implements Countable in /usr/www/users/w007a7e8/germanis.de/public_html/components/com_k2/models/item.php on line 763

Warning: count(): Parameter must be an array or an object that implements Countable in /usr/www/users/w007a7e8/germanis.de/public_html/components/com_k2/models/item.php on line 763

Warning: count(): Parameter must be an array or an object that implements Countable in /usr/www/users/w007a7e8/germanis.de/public_html/components/com_k2/models/item.php on line 763
CSS, HTML & Co.

Mini-Tutorial: die Sache mit der Feedausgabe bei EventList

Problem: Die Terminansicht wird korrekt angezeigt, die Ausgabe als Feed verlinkt aber nicht auf die entsprechenden Detailseiten der Einträge, sondern scheinbar wahllos auf andere (bereits abgelaufene) Termine.

Bei einem aktuellen Projekt bin ich darauf gestoßen:

Als Ausgabe für Termine wird EventList (www.schlu.net) in der aktuellen Version 1.0.1 verwendet:
www.ec-sachsen.de/index.php?option=com_eventlist&view=categoryevents&id=6&Itemid=189

Wie man am Link sehen kann, wird die Ansicht ("View") categoryevents verwendet. Aus dieser Ansicht kann eine Feedausgabe (RSS 2.0)erzeugt werden:

www.ec-sachsen.de/index.php?option=com_eventlist&view=categoryevents&format=feed&id=6&type=rss&Itemid=189

Dieser Feed erzeugte ursprünglich die fehlerhaften Links.


Warning: count(): Parameter must be an array or an object that implements Countable in /usr/www/users/w007a7e8/germanis.de/public_html/templates/gk_creativity/html/com_k2/templates/default/category_item.php on line 122
weiterlesen ...

Mini-Tutorial: ein "echtes" Override für Joomla!-Sprachdateien

Der ein- oder andere kennt das: im Template will man manche Ausdrücke, die im Joomla!-Core vorgegeben sind, austauschen.
Mir passiert das regelmäßig. Ein typisches Beispiel:

"Geschrieben von [Autor des Beitrags]"

Wenn man diesen Text z.B. in 

"[Autor des Beitrags] hat geschrieben"

ändern möchte, dann führt das meistens zum Griff in die Sprachdateien.

Was passiert aber bei einem Update?

Schnell ist das Update eingespielt - und genau so schnell sind evtl. neuere Sprachdateien im Verzeichnis.
Ergo: die eigenen Anpassungen sind futsch!
Wie man dieses Manko elegant umschiffen kann - damit befaßt sich dieses Mini-Tutorial.


Warning: count(): Parameter must be an array or an object that implements Countable in /usr/www/users/w007a7e8/germanis.de/public_html/templates/gk_creativity/html/com_k2/templates/default/category_item.php on line 122
weiterlesen ...

Mini-Tutorial: JCE und das Verschieben von Bildern

Der Joomla-Content-Editor, allgemein als JCE bekannt, wird von vielen Benutzern als die Referenz für Joomla! gesehen. Auch ich setze den JCE fast ausschließlich auf allen Seiten ein, die ich erstelle und betreue.

Mit dem Update des Editor-Plugins auf die Version 1.5.5 (aktuell ist 1.5.6) wurde wieder an vielen Schräubchen gedreht und manche liebgewonnene Eigenschaft des JCE ist plötzlich verschwunden.

Wenn man mit Bildern im Text arbeitet, weiß man zu schätzen, dass der JCE erlaubt, eingefügte Bilder per Drag&Drop zu verschieben. Durch einen Klick auf ein Bild und ein anschließendes Verschieben des Cursors lassen sich die Bilder von einem Ende des Textes zum anderen Ende verschieben - sehr komfortabel!

Seit Version 1.5.5 war diese bequeme Funktion offenbar verschwunden - doch das ist zum Glück nicht so. Die Funktion ist lediglich per Standard nicht eingerichtet. Folgender Worakround aktiviert die Funktion wieder:

JCE-Administration -> Configuration -> Erweitert -> Eigene Variablen - dort eintragen:

paste_block_drop:0 

...und schon lassen sich die Bilder im Editor wieder "bewegen"!


Warning: count(): Parameter must be an array or an object that implements Countable in /usr/www/users/w007a7e8/germanis.de/public_html/templates/gk_creativity/html/com_k2/templates/default/category_item.php on line 122
weiterlesen ...

Tutorial: Menue-Modul mit MenuMatic

MenuMatic auf Basis von MooTools & Suckerfish Nachdem ich auf der Suche nach einer Lösung für den Einsatz von Joomla! 1.5.X & MenuMatic  letztendlich beides zur Zusammenarbeit bewegen konnte, möchte ich anhand eines kleinen Tutorials davon berichten.

Aber fangen wir von vorn an:
Die schicke Menü DropDown-Animation von MenuMatic stach mir schnell ins Auge und so suchte ich nach Möglichkeiten, die Mootools-Klasse für Joomla! 1.5.X tauglich zu bekommen.

MenuMatic von greengeckodesign (Jason J. Jaeger) ist eine auf  SuckerFish und Mootools basierende JavaScript-Applikation. Das heißt, man muss

  1. a) mit verschachtelten Listen das Menü erstellen und
  2. b) die Mootools-Bibliothek in der richtigen Version einbinden.Media 65 Menü-Modul für Joomla 1.5.X - Screenshot Backend

 

a) realisiert man am besten mit dem Media 65 Joomla Menu Module (Registrierung für Download notwendig). Im Gegensatz zum "herkömmlichen" mod_mainmenu hat man noch weitere Möglichkeiten, IDs und Klassen für CSS zu definieren (siehe Screenshot):

<ul class="menu" id="ptm-nav">
  <li class="current"><a href="#"><span>Startseite</span></a>
  <ul>
    <li><a href="#"><span>Joomla!-Lizenz</span></a></li>
    <li><a href="#"><span>Mehr über Joomla!</span></a>
    <ul>
      <li><a href="#"><span>FAQ</span></a></li>
    </ul>
    </li>
  </ul>
  </li>
  <li>[...]</li>
</ul>

So sollte die Struktur aussehen, wenn die "klassische" Suckerfish-Syntax (Suckerfish- Dropdowns by D. Griffiths and D. Webb )angewendet wird.

b) ist etwas tricky, da Joomla! - derzeit  in Version 1.5.10 - Mootools in der Version 1.11 verwendet und MenuMatic die Version 1.2 verlangt.

Nun sollte man nicht einfach die vorhandene Bibliothek [joomla-root]/media/system/js/mootools.js ersetzen, sondern dern Core möglichst in Ruhe lassen, damit 1. die Funktion und 2. die Updatefähigkeit des Systems erhalten bleibt. Abgesehen davon wird an verschiedenen Stellen berichtet, dass ein Adhoc-Upgrade auf Mootools 1.2 Probleme mit dem Backend-Menü verursacht.

Aus diesen Gründen lassen wir die originale Mootools-Bibliothek von Joomla! in Ruhe und beschränken uns ausschließlich auf die Integration in das Template. Auf der Grundlage dieser Anleitung gehen wir die Sache an:

  1. [joomla-root]/templates/[mein-template]/js/mootools-1.2.1-core.js
  2. [joomla-root]/templates/[mein-template]/js/mootools-1.2-more.js
  3. [joomla-root]/templates/[mein-template]/js/mootools-compact-core.js
  4. [joomla-root]/templates/[mein-template]/js/mootools-compact-more.js
  5. [joomla-root]/templates/[mein-template]/js/mootools-compact-custom.js
  • Da aber mit dem Befehl <jdoc:include type="head" /> im Template (index.php) u.a. die Joomla-eigene Mootools-Bibliothek eingebunden wird, muss dieser Aufruf unschädlich gemacht werden. Dazu benötigen wir einige PHP-Aufrufe:


zuerst "head" ganz nurmal einbinden:

        <jdoc:include type="head" />

 

danach die Einbindung von mootools.js verhindern:

<?php
/* --- This removes any default Scripts from the Header Buffer --- */
$header = $this->getHeadData();  // Get the current HEAD buffer
$header['scripts'] = array();    // Clear all current 'scripts' entries
$this->setHeadData($header);     // Update the HEAD buffer
/* --- We add the MooTools Framework manually, see below --- */
?>

 

zuletzt die eigenen Klassen für Mootools 1.2.1 "manuell" einbinden:

<script type="text/javascript" src="/<?php echo $this->baseurl ?>/templates/↵
<?php echo $this->template ?>/js/mootools-1.2.1-core.js"></script>
<script type="text/javascript" src="/<?php echo $this->baseurl ?>/templates/↵
<?php echo $this->template ?>/js/mootools-1.2-more.js"></script>
<script type="text/javascript" src="/<?php echo $this->baseurl ?>/templates/↵
<?php echo $this->template ?>/js/mootools-compact-core.js"></script>
<script type="text/javascript" src="/<?php echo $this->baseurl ?>/templates/↵
<?php echo $this->template ?>/js/mootools-compact-more.js"></script>
<script type="text/javascript" src="/<?php echo $this->baseurl ?>/templates/↵
<?php echo $this->template ?>/js/mootools-compact-custom.js"></script>

 

Damit haben wir die Grundlagen für MenuMatic abgeschlossen.

Zuguterletzt muss MenuMatic selbst eingebunden anhand einer Instanz der Klasse zum Arbeiten bewegt werden:

<!-- Load the MenuMatic Class -->
<script language="JavaScript" type="text/javascript" src="/↵
<?php echo $this->baseurl ;?>/templates/<?php echo $this->template ;?>↵
/js/MenuMatic_0.68.2.js"></script>
<!-- Create a MenuMatic Instance -->
<script type="text/javascript" >
window.addEvent('domready', function() {
var myMenu = new MenuMatic();
});
</script>
</body>
</html> 

Im Beispiel wird mit Absicht die Version MenuMatic_0.68.2.js verwendet.
Mit der aktuellen Version MenuMatic_0.68.3.js ließ sich das Script leider nicht zur Mitarbeit überreden.

Ich hoffe, die Anleitung hilft dem ein- oder anderen weiter. Über Resonanz freue ich mich.


Warning: count(): Parameter must be an array or an object that implements Countable in /usr/www/users/w007a7e8/germanis.de/public_html/templates/gk_creativity/html/com_k2/templates/default/category_item.php on line 122
weiterlesen ...

CSS: geliebtes Border-Box-Modell

CSS: Border-Box-ModellJeder, dessen CSS-Definitionen nicht nur mit aktuellen Browsern (Firefox > 1.0.x und IExplorer 7) korrekt ausgegeben werden sollen steht irgendwann einmal vor dem Dilemma des Border-Box-Modells.

Genauer gesagt: er steht vor dem Problem, dass IExplorer 5.x und 6.0  das Border-Box-Modell mit Innen-/Außenabständen, Breite und Rand in Eigeninterpretation betrachten (Box Model Bug).

Solange vor allem der IExplorer 6 (laut Zugriffs-Statistik sämtlicher (Kunden-)Webseiten) nach wie vor die Nase vorn hat und CSS3 noch nicht in greifbare Nähe rückt, muß man als Web-Developer sich diesem Problem wohl oder übel stellen.

Aus diesem Grund ist bei jeder Template-Frickelei das geliebte Border-Box-Modell Grund für diverse Nervenzusammenbrüche...

Einige Grundregeln für ein identisches Aussehen eines Templates in allen Browsern habe ich heute von Marcus erfahren:

  1. Nutze, wenn möglich, für Boxen (DIV & Co.) nie feste Breiten kombiniert mit Abständen (padding /margin).
  2. Zum Zentrieren niemals fixe Abstands-Definitionen nehmen, das erfordert meistens Hacks für den IExplorer:
    margin 0 auto; /* funktioniert nur in neueren Browsern */text-align: center; /* für alle anderen */

Vor allem mit (1.) lassen sich marginale Probleme umgehen.

 

BTW, die "CSS-Spickzettel" (CSS cheat sheets) von lesliefranke.com oder www.ilovejackdaniels.com helfen auch - bei grundlegenden Problemen ;-)

gefunden bei webtagebu.ch

 

To be continued... 


Warning: count(): Parameter must be an array or an object that implements Countable in /usr/www/users/w007a7e8/germanis.de/public_html/templates/gk_creativity/html/com_k2/templates/default/category_item.php on line 122
weiterlesen ...

Links kennzeichnen per CSS

Link-Icons per CSSIm Rahmen der Web Content Accessibility Guidelines, die vom W3C-Konsortium für Web-Designer herausgegeben werden, um die Zugänglichkeit zu Internetangeboten zu fördern, findet sich auch die Forderung nach Kennzeichnung von Links. Ein kleines Icon (Icon für externe Links) hilft bei der Unterscheidung von internen und externen Links oder Downloads.

Eine Möglichkeit, dies mit Hilfe von JavaScript zu realisieren, beschreibt Ask the CSS Guy. Besser noch ist jedoch die Variante per CSS: Wie das funktioniert zeigen Martin Terber und userstyles.org.


Warning: count(): Parameter must be an array or an object that implements Countable in /usr/www/users/w007a7e8/germanis.de/public_html/templates/gk_creativity/html/com_k2/templates/default/category_item.php on line 122
weiterlesen ...
Diesen RSS-Feed abonnieren
Warning: count(): Parameter must be an array or an object that implements Countable in /usr/www/users/w007a7e8/germanis.de/public_html/templates/gk_creativity/html/com_k2/templates/default/category.php on line 191
Um unsere Webseite für Sie optimal zu gestalten und fortlaufend verbessern zu können, verwenden wir Cookies. Durch die weitere Nutzung der Webseite stimmen Sie der Verwendung von Cookies zu. Weitere Informationen zu Cookies erhalten Sie in unserer Datenschutzerklärung.
Zustimmen Ablehnen