im-Tal.net » Joomla

Effekte mit der jQuery JavaScript Library

maxe — Wed, 12 Aug 2009 09:45:33 +0000

Mit der jQuery JavaScript Library sind tolle Effekte möglich, wie z. B. Sliding, Fading, Animating etc.
Wir haben uns selber noch nicht viel mit jQuery befasst, wollen aber unsere ersten Versuche hier als Einstiegsanleitung niederschreiben.

Also zu erst muss die Library ins Template eingebunden werden. Entweder man lädt sich die .js Datei hier herunter und bindet sie anschließend so (am besten im Header) ein:

<script src="jquery-1.3.2.min.js" type="text/javascript">script>

oder man bindet z. B. direkt die von jquery.com ein:

<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript">script>

So, nachdem nun die Library eingebunden ist, können wir mit dem Javascript beginnen. Es läuft immer nach ähnlichem Schema.
Erst sagen wir, wir wollen eine Funktion:
$(document).ready(function()
Dann können wir bei Bedarf bestimmen, welches Element/Objekt bei Klick o. ä. die Änderung vornehmen soll:
$("button").click(function ()
Auf jeden Fall werden dann die Element/Objekte bestimmt, welche ihr Aussehen/Verhalten ändern sollen:
$("p").slideToggle

Als 1. kleines Beispiel lassen wir mit slideToggle alle Texte innernhalb eine p-Tags durch einen Button ein-/ausblenden:

<script type="text/javascript">
  $(document).ready(function(){
 
    $("button").click(function () {
      $("p").slideToggle("slow");
    });
 
  });
script>

Um den Button nun sichtbar zu machen, ist es nötig diesen an die entsprechende Stelle (vorzugsweise direkt über den Text) anzulegen:

Hier steht der Text der nun ein- bzw. ausgeblendet werden kann.

So lässt sich z. B. auch eine Sidebar aus-/einblenden. Statt “p” nimmt man dann z. B. den Div-Container der Sidebar (z. B. “#sidebar”).

Als 2. Beispiel wollen wir zeigen, wie z. B. die Kombination von mehreren Elementen/Objekte mit mehrfacher Veränderung möglich sind:

<script type="text/javascript">
  $(document).ready(function(){
 
    $("button").click(function () {
    $("div.block").add("p.extra").addClass("blau");
     alert("Class in blau geaendert");
    });
 
  });
script>

Alle Div-Container mit der Class “.block” und alle p-Tags mit der Class “.extra” bekommen eine neue Class “.blau” zugefügt und es wird ein Hinweistext ausgegeben. Statt addClass können auch andere Attribute, wie z. B. toggleClass genutzt werden.

Eine weitere Spielerei wäre ein FadeIn-Effekt bei allen Bildern die im Div-Container “#content” sitzen:

<script type="text/javascript">
  $(document).ready(function() {
    $("#content img").css("display","none");
    $("#content img").fadeIn(5000)
});
script>

Weitere Effekte findest du in der jQuery-Documentation: http://docs.jquery.com/Effects

Ein kleiner Hinweis für WordPress-User:
WordPress bringt eine jquery.js im Verzeichnis /wp-includes/js/jquery/jquery.js mit. Falls ihr also damit arbeiten wollt ist eine kleine Abweichung zu beachten. Statt des $-Zeichen muss in WP jQuery benutzt werden:


<script type="text/javascript">
  jQuery(document).ready(function(){
 
    jQuery("button").click(function(){
    jQuery("div.block").add("p.extra").toggleClass("blau");
     alert("Class geaendert");
    });
 
  });
script>

Der chCounter geht in die nächste Runde: expCounter

im-Tal.net — Fri, 24 Jul 2009 14:40:30 +0000

Als Besuchszähler (Counter) setz(t)en wir bisher auf im-Tal.net den chCounter von Christoph Bachner bzw. ab 2007 weiterentwickelt von Bert Körn ein.

Wie wir bereits in unserem Artikel “chCounter für Wordpress nutzen” erwähnten, ist die Entwicklung vom chCounter seit einiger Zeit aus nicht bekannten Gründen eingeschlafen. Jetzt greift Volker S. Latainski das Projekt auf und entwickelt den Counter, dank GPL (Lizenz), unter neuem Namen weiter:

Die Installation erfolgt wie vom chCounter gewohnt. Auch der Umstieg vom chCounter auf den expCounter, wie hier beschrieben, ist sehr einfach. Das Template (zuständig für die Anzeige) lässt sich sehr einfach über den Template-Generator anpassen.

Wir haben nun ziemlich früh umgestellt und sind auf die (Weiter-)Entwicklung des Counters gespannt.

Ach übrigens, unser Artikel “chCounter für Wordpress nutzen” (sowie die Artikel die sich mit der Einbindung in Joomla beschäftigen) hat bisher noch Gültigkeit. Falls sich für die Einbindung in WordPress etwas ändern sollte werden wir selbstverständlich berichten.

chCounter mit Sicherheitslücke

im-Tal.net — Sun, 26 Apr 2009 06:20:27 +0000

im-Tal.net benutzt seit Anfang an den chCounter als Statistiktool. Im April 09 erfuhren wir auf stadt-bremerhaven.de, dass im chCounter wohl eine Sicherheitslücke entdeckt wurde. Demnach soll es möglich sein sich auf der Login-Seite des chCounters mit “or ‘=’” (ohne die Anführungszeichen) als Benutzernamen und Passwort anzumelden. Auf im-Tal.net war dies so nicht möglich.

Trotzdem wollen wir auch auf die Lösung des Problems hinweisen. In der functions.inc.php im includes-Ordner vom chCounter muss nach folgendem Code gesucht werden:

function chC_login( $name, $pw, $cookie = 0, $admin_required = FALSE )
{

Dieser Code muss um eine Zeile ergänzt werden:

function chC_login( $name, $pw, $cookie = 0, $admin_required = FALSE )
{
$name=mysql_real_escape_string($name);

Also einfach die Zeile $name=mysql_real_escape_string($name); hinzufügen.

noindex und nofollow

maxe — Tue, 02 Dec 2008 13:45:37 +0000

noindex heißt auf deutsch nichts anderes als “nehm diese Seite nicht in deinen Suchemaschinen-Index auf”.
nofollow heißt auf deutsch nichts anderes als “Folge den Links auf dieser Seite nicht”.

noindex verhindert also bei den “freundlichen” Suchmaschinen (es ist nur ein Hinweis woran sich aber nicht alle Crawler halten), dass die Seite in ihren Index aufgenommen werden. Als Beispiel könnte man hier die Impressums-Seite oder den Disclaimer nennen.

nofollow ist für die Blogsysteme oder Internetforen eingeführt worden. Spammer kamen früh auf die Idee über die Kommentarfunktion sämtliche Links zu hinterlassen, die die Webcrawler dann natürlich abgegrast haben und als positive Verweise (Linkpopularität) auf die Spamseiten gewertet haben. Das sollte natürlich nicht Sinn und Zweck der Kommentarfunktion sein. Also wurde ca. 2005 das rel=”nofollow”-Attribut erfunden. Das Attribut kann den Weblinks angehängt werden. Bei Wordpress u.a. wird dies z.B. automatisch für die Kommentar-Links angefügt.

Example

Für ganze Archive oder Seiten steht das Meta-Tag robots mit den Werten noindex und nofollow zur Verfügung.
Wer also, z. B. in Wordpress für die Tages-Archive, die Suche, die 404-Seite, die Authoren-Archive und die Impressums-Seite die Indexierung verhindern aber trotzdem die Weiterverfolgung der Links aktivieren will, kann folgenden Code in die header.php seines Themes schreiben:

 if( is_day() || is_search() || is_404() || is_author() || is_page('impressum') ) { echo "\"robots\" content=\"noindex,follow\" />"; } ?>

grobe Übersetzung:
–> wenn es sich um ein Tages-Archive ODER die Suche ODER die 404-Seite ODER die Authoren-Archive ODER die Impressums-Seite handelt
–> dann setzte den Meta-Tag: name=”robots” content=”noindex,follow” (keine Indexierung aber bitte den Links folgen)

Auch gibt es noch den Wert “noodp”. Mehr dazu: Wikipedia.

Website mit verschiedenen Browsern testen

maxe — Fri, 28 Nov 2008 20:11:40 +0000

Website-Besitzer haben oft nur ein bis zwei aktuelle Browser zur Verfügung um ihre Website zu testen. Wie sieht aber die Website in älteren (z.B. IE 6) oder in anderen nicht so weit verbreiteten Browsern aus? Naja, man könnte jetzt hergehen und sich alle Browser in den verschiedensten Versionen (was oft sowieso nicht geht) installieren …

Es geht aber auch etwas einfacher. Auf der Website http://browsershots.org kann man die Browser-Kompatibilität der Website mit momentan ca. 60 Browsern testen und bekommt sogar von jedem Browser einen Screenshot.

Wer nicht ganz so viel testen will und sich nur auf den IE in den verschiedenen Versionen beschränken will kann sich den IETester von DebugBar installieren. Damit lassen sich lokal die IE Versionen von 5.5 bis 8 testen.

Globale Einstellungen in Joomla 1.5 ändern

im-Tal.net — Thu, 11 Sep 2008 18:57:52 +0000

In Joomla 1.5 sind die Globalen Einstellungen etwas versteckter als in der Vorgängerversion.

für Beiträge:
Inhalt | Beiträge
Voreinstellungen -> z.B. Author-Anzeige, PDF/Print/Email etc.

für Weblinks:
Komponenten | Weblinks
Voreinstellungen -> z.B. Zugriffe etc.

für Kontakte:
Komponenten | Kontakte
Voreinstellungen -> z.B. eMail o. Mobilfunknummer anzeigen etc.

Kompatibilitätsmodus in Joomla 1.5

im-Tal.net — Thu, 11 Sep 2008 18:57:10 +0000

Falls Du in Joomla 1.5 beim installieren von Komponenten bzw. Modulen für Joomla 1.0.xx folgende Fehlermeldung bekommst:

Die Erweiterung scheint für eine frühere Version entwickelt zu sein. Zum Fertigstellen muß der Kompatibilitätsmodus in der “Konfiguration” aktiviert sein.

dann kannst Du so den Kompatibilitätsmodus aktivieren:
Erweiterungen | Plugins
Plugin “System – Legacy”

Titel in Joomla setzen, ändern und auslesen

im-Tal.net — Thu, 11 Sep 2008 18:43:17 +0000

Der Browser- bzw. Seitentitel kann in Joomla einfacher als gedacht verändert, getauscht, gelöscht oder ausgelesen werden.

Um den Browsertitel in Joomla 1.0.xx dahin zu ändern, dass nur noch der Dokumententitel ohne Sitename steht, gehe wie folgt vor:
in der includes/joomla.php

$this->_head['title'] = $title ? $GLOBALS['mosConfig_sitename'] . ' - '. $title : $GLOBALS['mosConfig_sitename'];

ersetzen durch

$this->_head['title'] = $title;

Möchte man die Reihenfolge von Sitename – Dokumententitel umkehren, muss man in der includes/joomla.php

$this->_head['title'] = $title ? $GLOBALS['mosConfig_sitename'] . ' - '. $title : $GLOBALS['mosConfig_sitename'];

ersetzen durch

$this->_head['title'] = $title ? $title . ' - ' . $GLOBALS['mosConfig_sitename'] : $GLOBALS['mosConfig_sitename'];

Einen Dokumententitel in Joomla 1.0.xx setzen, z.B. in einer Komponente:

$mainframe->SetPageTitle( 'gewünschter Browsertitel' );

Seitentitel in Joomla 1.0.xx auslesen:

$mainframe->_head['title'];

Seitentitel in Joomla 1.5 setzen:

$mainframe->setPageTitle( 'gewünschter Browsertitel' );

Seitentitel in Joomla 1.5 auslesen:

$mainframe->getPageTitle();

Wer bei Joomla 1.5 im Browsertitel den Sitename stehen haben will muss die “head.php” im Pfad “libraries/joomla/document/html/renderer/” ändern.
Dazu

$strHtml .= $tab . ''</span> <span style="color: #339933;">.</span> <span style="color: #990000;">htmlspecialchars</span><span style="color: #009900;">(</span><span style="color: #000088;">$document</span><span style="color: #339933;">-></span><span style="color: #004000;">getTitle</span><span style="color: #009900;">(</span><span style="color: #009900;">)</span><span style="color: #009900;">)</span> <span style="color: #339933;">.</span> <span style="color: #0000ff;">'' . $lnEnd;

suchen und durch folgende Zeile ersetzen

$config = new JConfig();
if(( $_SERVER['REQUEST_URI'] == '/') || ( $_SERVER['REQUEST_URI'] == '' ) ) $site_name = '';
else $site_name = $config->sitename . " - ";
$strHtml .= $tab . ''</span> <span style="color: #339933;">.</span> <span style="color: #000088;">$site_name</span> <span style="color: #339933;">.</span>  <span style="color: #990000;">htmlspecialchars</span><span style="color: #009900;">(</span><span style="color: #000088;">$document</span><span style="color: #339933;">-></span><span style="color: #004000;">getTitle</span><span style="color: #009900;">(</span><span style="color: #009900;">)</span><span style="color: #009900;">)</span> <span style="color: #339933;">.</span> <span style="color: #0000ff;">'' . $lnEnd;

Datum in der Joomla-Seitenanzeige ändern

im-Tal.net — Thu, 11 Sep 2008 18:39:35 +0000

%a – abgekürzter Name des Wochentages, abhängig von der gesetzten Umgebung
%A – ausgeschriebener Name des Wochentages, abhängig von der gesetzten Umgebung
%b – abgekürzter Name des Monats, abhängig von der gesetzten Umgebung
%B – ausgeschriebener Name des Monats, abhängig von der gesetzten Umgebung
%c – Wiedergabewerte für Datum und Zeit, abhängig von der gesetzten Umgebung
%C – Jahrhundert (Jahr geteilt durch 100, gekürzt auf Integer, Wertebereich 00 bis 99)
%d – Tag des Monats als Zahl (Bereich 01 bis 31)
%D – so wie %m/%d/%y
%e – Tag des Monats als Dezimal-Wert, einstelligen Werten wird ein Leerzeichen voran gestellt (Wertebereich Â´ 1Â´ bis Â´31Â´)
%g – wie %G, aber ohne Jahrhundert.
%G – Das vierstellige Jahr entsprechend der ISO Wochennummer (siehe %V). Das gleiche Format und der gleiche Wert wie bei %Y. Besonderheit: entspricht die ISO Wochennummer dem vorhergehenden oder folgenden Jahr, wird dieses Jahr verwendet.
%h – so wie %b
%H – Stunde als Zahl im 24-Stunden-Format (Bereich 00 bis 23)
%I – Stunde als Zahl im 12-Stunden-Format (Bereich 01 bis 12)
%j – Tag des Jahres als Zahl (Bereich 001 bis 366)
%m – Monat als Zahl (Bereich 01 bis 12)
%M – Minute als Dezimal-Wert
%n – neue Zeile
%p – entweder `am’ oder `pm’ (abhängig von der gesetzten Umgebung) oder die entsprechenden Zeichenketten der gesetzten Umgebung
%r – Zeit im Format a.m. oder p.m.
%R – Zeit in der 24-Stunden-Formatierung
%S – Sekunden als Dezimal-Wert
%t – Tabulator
%T – aktuelle Zeit, genau wie %H:%M:%S
%u – Tag der Woche als Dezimal-Wert [1,7], dabei ist 1 der Montag.
%U – Nummer der Woche des aktuellen Jahres als Dezimal-Wert, beginnend mit dem ersten Sonntag als erstem Tag der ersten Woche.
%V – Kalenderwoche (nach ISO 8601:1988) des aktuellen Jahres.
Als Dezimal-Zahl mit dem Wertebereich 01 bis 53, wobei die Woche 01 die erste Woche mit mindestens 4 Tagen im aktuellen Jahr ist. Die Woche beginnt montags (nicht sonntags). (Benutzen Sie %G or %g für die Jahreskomponente, die der Wochennummer für den gegebenen Timestamp entspricht.)
%w – Wochentag als Dezimal-Wert, Sonntag ist 0
%W – Nummer der Woche des aktuellen Jahres, beginnend mit dem ersten Montag als erstem Tag der ersten Woche.
%x – bevorzugte Datumswiedergabe (ohne Zeit), abhängig von der gesetzten Umgebung.
%X – bevorzugte Zeitwiedergabe (ohne Datum), abhängig von der gesetzten Umgebung.
%y – Jahr als 2-stellige-Zahl (Bereich 00 bis 99)
%Y – Jahr als 4-stellige-Zahl inklusive des Jahrhunderts
%Z – Zeitzone, Name oder eine Abkürzung
%% – ein %-Zeichen

Main Menü in Joomla 1.5.xx anpassen

im-Tal.net — Wed, 10 Sep 2008 22:38:25 +0000

Im Backend ist unter

Erweiterungen -> Module -> Modul “Main Menü” – Erweiterte Parameter

diesem ein Modul-Klassen-Suffix (_menu) zugeordnet. Wenn Du aber das Aussehen des Main Menüs den anderen Menüs anpassen willst, solltest Du das Suffix entfernen.

Anders herum geht es natürlich auch:
Setze in die anderen Menüs auch das Modul-Klassen-Suffix = _menu.

im-Tal.net » Joomla

Effekte mit der jQuery JavaScript Library

Verwandte Artikel:

Der chCounter geht in die nächste Runde: expCounter

Verwandte Artikel:

chCounter mit Sicherheitslücke

Verwandte Artikel:

noindex und nofollow

Website mit verschiedenen Browsern testen

Verwandte Artikel:

Globale Einstellungen in Joomla 1.5 ändern

Verwandte Artikel:

Kompatibilitätsmodus in Joomla 1.5

Verwandte Artikel:

Titel in Joomla setzen, ändern und auslesen

Verwandte Artikel:

Datum in der Joomla-Seitenanzeige ändern

Verwandte Artikel:

Main Menü in Joomla 1.5.xx anpassen

Verwandte Artikel: