Java Script einfügen zur Ansichtsvergrösserung

  • Hallo,

    ich würde gern in dem Blog 2009 Joseph Haydn lebt!
    was ähnliches zur Ansichtsvergrösserung/verkleinerung integrieren
    wie es auf der Webseite Moers | Hilfe zur Benutzung
    zu finden ist.

    Dort hat man oben links in der Navigation die Möglichkeit, die Ansicht zu vergrössern oder zu verkleinern. Wie kann ich das bewerkstelligen?
    Hat jemand ein Script dazu?

    Im Grunde geht es ja über die Tastenkombination Strg + Strg -
    Möchte aber den Lesern so bequemer die Wahl lassen über einen Klick die Schriftgrösse bzw. Ansicht anzupassen.

    Kann mir jemand helfen?

    Und wo muss ich das javascript dann einfügen? in der style.css oder in der header.php? :-| bin ratlos..

    LG freu mich auf Feedback

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Hi, danke für den Input aber leider bringt mich das nicht weiter diese Debatte warum oder warum es keine Schriftenskalierung mehr gibt. Ich hab diese Funktion auf zahlreichen Webseiten schon gesehen da gibts dann in der Navigation ein kleines A, mittleres A und ein grosses A (jeweils zum Anklicken) und entsprechend vergrössert sich oder verkleinert sich alles am Bildschirm... so ähnlich wie die strg + Funktion und strg - Funktion... das möchte ich eben auf meinem weblog in die Navigation einbinden...

    LG

  • Na gut, wenn du nicht zu bekehren bist ;-) Hier ist es: Der Inhalt kann nicht angezeigt werden, da er nicht mehr verfügbar ist. Das kommt nach dem Entpacken in dein Theme-Verzeichnis. Dann schreibst du direkt unter den <body>-Tag:

    Code
    <script type="text/javascript" language="JavaScript1.2">
     if (efa_fontSize) efa_fontSize.efaInit();
    </script>


    und an die Stelle, wo die Vergrößerung/Verkleinerung erscheinen soll:

    Code
    <script type="text/javascript">
    if (efa_fontSize) document.write(efa_fontSize.allLinks);
    </script>


    Die js-Datei kannst du anpassen, also statt "Schrift größer stellen" kannst du da dein A hinschreiben etc.

  • oh wow wo hast du das denn dort gefunden.. ich kam mir glatt vor wie im dschungel... super sache.. ich probier das dann aus.. ich nehme an body meinst du dann in der style.css oder?

    LG

  • Auf der verlinkten Seite war das auch nicht mehr zu finden, sondern auf meiner Festplatte :mrgreen:
    Mit body meine ich nicht die style.css, sondern (je nach Theme) vermutlich die header.php, direkt unter den < body >-Tag.

  • Ahh okay.. hatte das nämlich über nddie style.css probiert *lach* aber das sah komisch aus zunächst - danke dir :-) ich probeir das mal mit der header.php.. ich denk das ist der richtige weg.. hast du das script selbst auch auf deinem blog?

    LG

  • Hast du evtl. den Html Code für das Beispiel "Schrift grösser stellen" wo dann das Script integriert wird.

    <script type="text/javascript">
    if (efa_fontSize) document.write(efa_fontSize.allLinks);
    </script>

  • Bzw. meine Frage ist noch ich muss ja irgendwo an eienr Stelle einen html code machen..

    z. bsp. Schrift (das dann verlinken irgendwie mit dem script code) wie mach ich das denn?

  • Die Verlinkungs des Scripts hab ich noch vergessen. In die header.php schreibst du (unter die META-Tags z.B.)

    Code
    <script type="text/javascript" language="JavaScript1.2" src="http://dein-blog.de/wp-content/themes/dein-theme/efa_fontsize.js"></script>


    - entsprechend an deine Domain und dein Theme angepasst
    Dann wie ich oben schon schrieb den einen Teil direkt unter den body-Tag, den anderen dort, wo die Vergrößerung sein soll, z.B. in die Sidebar einfügen.

  • Okay das klingt echt einleuchtend - danke. Wie sieht es aus wenn man das ganze aber dann wieder verkleinern will? Gibts da wieder ein Script dafür das entsprechend funktioniert? Das Skript oben ist also so wie ich es verstehe rein zur Vergrösserung..
    LG

  • Hm also es ist momentan so: (zumindest erscheint es im Widget in der Sidebar)
    aber die Links bzw. die Funktion ist noch nicht hergestellt (siehe 2009 Joseph Haydn lebt!)

    Der HTML Code im Widget:

    --

    irgendwas hab ich falsch gemacht.. aber immerhin ein Schritt weiter.. *grübel*

    Einmal editiert, zuletzt von marX (5. Februar 2009 um 10:26)

  • Es geht ein wenig durcheinander bei dir, du hast 2 head-Bereiche und 2 body-Bereiche. Machst du alles mit Frontpage? Das würde ich lassen, mache die Änderungen mit einem Editor wie Notepad oder Phase 5 o.ä.

  • okay gut ich werd es mit notepad machen... aber von der aufteilung her stimmt das?

    der code mit der verlinkung im widget
    der code mit document.write auch im widget im body bereich

    und auf der header.php dann das script:
    <script type="text/javascript" language="JavaScript1.2">
    if (efa_fontSize) efa_fontSize.efaInit();
    </script>


    Oder passt das nicht so? Die Verlinkung muss im Widget sein, wenn ich das naemlich rausnehme erscheint das Fenster nicht mehr mit groesser, kleiner und 100%...
    aber irgendwas passt da nicht...

  • und auf der header.php dann das script:
    <script type="text/javascript" language="JavaScript1.2">
    if (efa_fontSize) efa_fontSize.efaInit();
    </script>

    Oder passt das nicht so? Die Verlinkung muss im Widget sein, wenn ich das naemlich rausnehme erscheint das Fenster nicht mehr mit groesser, kleiner und 100%...
    aber irgendwas passt da nicht...

    Das Widget ist nicht das Problem, da kannst du die Verlinkung drin lassen. Schau dir mal den Quelltext deiner Seite an, du hast immer noch < head > und < body > zweimal dadrinstehen, einmal oben, wo es auch hingehört, dann ab Zeile 455 noch mal. Das muss raus, und dann schreibst du nur das

    Code
    <script type="text/javascript" language="JavaScript1.2" src="http://www.haydn-netz.com/wp-content/themes/default/efa_fontsize.js"></script>


    in den < head >.

  • Also ich hab jetzt head und body herausgenommen... und in zeile 455 steht nur der link und das <script type="text/javascript">
    if (efa_fontSize) document.write(efa_fontSize.allLinks);
    </script>

    (bzw. sind diese beiden codes direkt in das widget geschrieben)
    (der andere Code befindet sich in der header.php)

    Aber es funktioniert immer noch nicht :-/

  • Oder könnte es daran liegen? Das Widget befindet sich nämlich in der Sidebar2!

    Ich habe aber den nachfolgenden Code in der Header.php drin:
    <script type="text/javascript" language="JavaScript1.2">
    if (efa_fontSize) efa_fontSize.efaInit();
    </script>

    ???

  • Du bist ja ein schwieriger Fall :mrgreen:

    Oder könnte es daran liegen? Das Widget befindet sich nämlich in der Sidebar2!


    Das ist schon ok so.

    Ich habe aber den nachfolgenden Code in der Header.php drin:
    <script type="text/javascript" language="JavaScript1.2">
    if (efa_fontSize) efa_fontSize.efaInit();
    </script>

    ???


    Da soll er auch bleiben. Das einzige, was jetzt noch fehlt, ist dieses:

    Code
    <script type="text/javascript" language="JavaScript1.2" src="http://www.haydn-netz.com/wp-content/themes/default/efa_fontsize.js"></script>


    Das gehört auch in die header.php, aber irgendwo innerhalb des < head > -Bereichs, also oberhalb von < body>.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!