Schriftgröße veränderbar beim lesen eines Beitrags

30957 · Jul 20th 2018

Hallo, eine Frage.

Gibt es ein Plugin mit dem man steuern kann das die Schriftgröße beim Lesen eines Themas/Beitrags veränderbar (größer/kleiner) ist. Auf einigen Webseiten gibt es bereits den Button + - , so das der Lesende selbst seine benötigte Schriftgröße einstellen kann.

Vielen Dank und Gruß aus Aachen

norse · Jul 20th 2018

Wozu sollte das nötig sein? Einfach im Browser nach Bedarf Strg und + gleichzeitig drücken.

Gruß norse

30957 · Jul 20th 2018

Im Browser wird die ganze Seite vergrößert oder verkleinert.. nicht die Schrift ansich.

Schau dir mal die Seite an: Hier klicken

Oben rechts orange Button "Schrift"

Warlord · Jul 20th 2018

naja das ist aber eine Wordpress Seite

30957 · Jul 20th 2018

Das ist mir nix neues.. was glaubst warum ich hier nach einem Plugin frage..

Ansonsten hätte ich gefragt: Ist das eine Wordpress Seite ?

Gino Zantarelli · Jul 20th 2018

Schau mal hier: http://www.dynamicdrive.com/dynamicindex9/textsizer.htm

Mit etwas Grundwissen kann man das sicher einbauen, für das alte WBB 3 hatte ich das mal genutzt...

Geronimo · Jul 20th 2018

Wer kleine Schriften nicht lesen kann, hat das Problem vermutlich nicht exklusiv bei deiner Seite, und sollte vielleicht besser seinen Browser anpassen.

Gino Zantarelli · Jul 20th 2018

Anleitung für das Text Resize Script

1 Öffne das Template "header" der Templategruppe deines verwendeten Stils (wenn nicht vorhanden das original Template in die Templategruppe deines Stils kopieren).

2. Füge folgendes ab Zeile 2 ein:

Code

<script data-relocate="true">
/*------------------------------------------------------------
    Document Text Sizer- Copyright 2003 - Taewook Kang.  All rights reserved.
    Coded by: Taewook Kang (txkang.REMOVETHIS@hotmail.com)
    Web Site: http://txkang.com
    Script featured on Dynamic Drive (http://www.dynamicdrive.com)
    
    Please retain this copyright notice in the script.
    License is granted to user to reuse this code on 
    their own website if, and only if, 
    this entire copyright notice is included.
--------------------------------------------------------------*/

//Specify affected tags. Add or remove from list:
var tgs = new Array( 'div','td','tr');

//Specify spectrum of different font sizes:
var szs = new Array( 'xx-small','x-small','small','medium','large','x-large','xx-large' );
var startSz = 2;

function ts( trgt,inc ) {
    if (!document.getElementById) return
    var d = document,cEl = null,sz = startSz,i,j,cTags;
    
    sz += inc;
    if ( sz < 0 ) sz = 0;
    if ( sz > 6 ) sz = 6;
    startSz = sz;
        
    if ( !( cEl = d.getElementById( trgt ) ) ) cEl = d.getElementsByTagName( trgt )[ 0 ];

    cEl.style.fontSize = szs[ sz ];

    for ( i = 0 ; i < tgs.length ; i++ ) {
        cTags = cEl.getElementsByTagName( tgs[ i ] );
        for ( j = 0 ; j < cTags.length ; j++ ) cTags[ j ].style.fontSize = szs[ sz ];
    }
}
</script>
<style>
.textresize {
    text-align: right;
    padding: 10px 0px;
}
</style>

Display More

3. Suche folgende Codezeile (ca. ab Zeile 96):

Code

            <div id="content" class="content">

Füge folgendes darunter ein:

Code

<div class="textresize">
{lang}wcf.editor.button.size{/lang}: <a href="javascript:ts('body',1)" class="button">+</a>  <a href="javascript:ts('body',-1)" class="button">-</a>
</div>

Du solltest nun 2 Button im Content rechts oben sehen:

Die Schriftgröße wird NICHT gespeichert und ist nur nach jeweiliger Benutzung der Button verfügbar.

30957 · Jul 21st 2018

Super und vielen Dank für Deine Mühe ! ich werde es heute noch einbauen.

Gruß aus Aachen

Quitter · Jul 31st 2018

Wäre es möglich das Plus und Minuszeichen durch die entsprechenden Fondawsomesymbole zu ersetzen?
Sind so ein bisschen klein.

Quitter · Jul 31st 2018

Habs gefunden

Code

<div class="textresize">
{lang}wcf.editor.button.size{/lang}: <a href="javascript:ts('body',1)" class="button"><span class="icon icon16 fa-plus"></span></a>  <a href="javascript:ts('body',-1)" class="button"><span class="icon icon16 fa-minus"></a>
</div>

Harald-RS · Jul 31st 2018

Ich habe nur eine Frage wie kann ich verhindern das auch das Menü und die BreadCrums vergrößert werden?

Sondern nur ganz alleine der Bereich wo die Themen / Beiträge sind?

Gino Zantarelli · Jul 31st 2018

Um nur den Contentbereich zu vergrößern oder zu verkleinern nutze folgende Anleitung:

1 Öffne das Template "header" der Templategruppe deines verwendeten Stils (wenn nicht vorhanden das original Template in die Templategruppe deines Stils kopieren).

2. Füge folgendes ab Zeile 2 ein:

CSS

<script data-relocate="true">
/*------------------------------------------------------------
    Document Text Sizer- Copyright 2003 - Taewook Kang.  All rights reserved.
    Coded by: Taewook Kang (txkang.REMOVETHIS@hotmail.com)
    Web Site: http://txkang.com
    Script featured on Dynamic Drive (http://www.dynamicdrive.com)
    
    Please retain this copyright notice in the script.
    License is granted to user to reuse this code on 
    their own website if, and only if, 
    this entire copyright notice is included.
--------------------------------------------------------------*/

//Specify affected tags. Add or remove from list:
var tgs = new Array( 'div','td','tr');

//Specify spectrum of different font sizes:
var szs = new Array( 'xx-small','x-small','small','medium','large','x-large','xx-large' );
var startSz = 2;

function ts( trgt,inc ) {
    if (!document.getElementById) return
    var d = document,cEl = null,sz = startSz,i,j,cTags;
    
    sz += inc;
    if ( sz < 0 ) sz = 0;
    if ( sz > 6 ) sz = 6;
    startSz = sz;
        
    if ( !( cEl = d.getElementById( trgt ) ) ) cEl = d.getElementsByTagName( trgt )[ 0 ];

    cEl.style.fontSize = szs[ sz ];

    for ( i = 0 ; i < tgs.length ; i++ ) {
        cTags = cEl.getElementsByTagName( tgs[ i ] );
        for ( j = 0 ; j < cTags.length ; j++ ) cTags[ j ].style.fontSize = szs[ sz ];
    }
}
</script>
<style>
.textresize {
    text-align: right;
    padding: 10px 0px;
    font-size: 13px !important;
}
</style>

Display More

In den "style"-Anweisungen wurde die Schriftgröße des Buttontitels auf 13 px festgelegt, damit sich diese später nicht auch verändert.

3. Suche folgende Codezeile (ca. ab Zeile 96):

Code

            <div id="content" class="content">

Füge folgendes darunter ein:

Code

<div class="textresize">
{lang}wcf.editor.button.size{/lang}: <a href="javascript:ts('content',1)" class="button">+</a>  <a href="javascript:ts('content',-1)" class="button">-</a>
</div>

Hier wurde der :ts-Bereich von "body" auf "content" angepasst, also wird auch nur dieser Bereich verändert.

SunnyC. · Jan 19th 2022

Quote from Gino Zantarelli

Anleitung für das Text Resize Script

1 Öffne das Template "header" der Templategruppe deines verwendeten Stils (wenn nicht vorhanden das original Template in die Templategruppe deines Stils kopieren).

2. Füge folgendes ab Zeile 2 ein:

Code

<script data-relocate="true">
/*------------------------------------------------------------
    Document Text Sizer- Copyright 2003 - Taewook Kang.  All rights reserved.
    Coded by: Taewook Kang (txkang.REMOVETHIS@hotmail.com)
    Web Site: http://txkang.com
    Script featured on Dynamic Drive (http://www.dynamicdrive.com)
    
    Please retain this copyright notice in the script.
    License is granted to user to reuse this code on 
    their own website if, and only if, 
    this entire copyright notice is included.
--------------------------------------------------------------*/

//Specify affected tags. Add or remove from list:
var tgs = new Array( 'div','td','tr');

//Specify spectrum of different font sizes:
var szs = new Array( 'xx-small','x-small','small','medium','large','x-large','xx-large' );
var startSz = 2;

function ts( trgt,inc ) {
    if (!document.getElementById) return
    var d = document,cEl = null,sz = startSz,i,j,cTags;
    
    sz += inc;
    if ( sz < 0 ) sz = 0;
    if ( sz > 6 ) sz = 6;
    startSz = sz;
        
    if ( !( cEl = d.getElementById( trgt ) ) ) cEl = d.getElementsByTagName( trgt )[ 0 ];

    cEl.style.fontSize = szs[ sz ];

    for ( i = 0 ; i < tgs.length ; i++ ) {
        cTags = cEl.getElementsByTagName( tgs[ i ] );
        for ( j = 0 ; j < cTags.length ; j++ ) cTags[ j ].style.fontSize = szs[ sz ];
    }
}
</script>
<style>
.textresize {
    text-align: right;
    padding: 10px 0px;
}
</style>

Display More

3. Suche folgende Codezeile (ca. ab Zeile 96):

Code

            <div id="content" class="content">

Füge folgendes darunter ein:

Code

<div class="textresize">
{lang}wcf.editor.button.size{/lang}: <a href="javascript:ts('body',1)" class="button">+</a>  <a href="javascript:ts('body',-1)" class="button">-</a>
</div>

Du solltest nun 2 Button im Content rechts oben sehen:

Die Schriftgröße wird NICHT gespeichert und ist nur nach jeweiliger Benutzung der Button verfügbar.

Display More

Hallo,

ist das ganze noch zeitgemäß und gibt es sowas auch global, für das gesamte System?

SoftCreatR · Jan 19th 2022

Quote from SunnyC.

ist das ganze noch zeitgemäß und gibt es sowas auch global, für das gesamte System?

Sowohl, als auch. Aber soweit ich das sehe, wird die gewählte Schriftgröße nirgends gespeichert, weshalb man bei jedem Seitenwechsel erneut da rumklicken muss.

SunnyC. · Jan 19th 2022

Quote from SoftCreatR

weshalb man bei jedem Seitenwechsel erneut da rumklicken muss.

Vielen Dank für den Hinweis. Schade an dieser Stelle.

Schriftgröße veränderbar beim lesen eines Beitrags

Anleitung für das Text Resize Script

Anleitung für das Text Resize Script

Participate now!

Share