Du bist nicht angemeldet. Der Zugriff auf einige Boards wurde daher deaktiviert.

#1 08. August 2014 06:55

Dancer62
Server-Pate
Ort: 26345 Bockhorn, Niedersachsen
Registriert: 08. November 2013
Beiträge: 414

[GELÖST] Maximale Größe der Spalten begrenzen

Ich habe ein Problem:
ich möchte die maximale Größe meiner Spalten begrenzen, d.h. solange der Inhalt der Spalte diese Größe nicht überschreitet, soll er komplett in der Spalte dargestellt werden. Überschreitet er jedoch die vorgegebene Größe, erscheint ein Link am Ende der Spalte (ggfs. kann er auch permanent erscheinen) - z.B. "mehr", "weiter" o.ä. - und der gesamte Inhalt soll in einem neuen (Popup ?)-Fenster dargestellt werden. Dabei muss natürlich beachtet werden, dass das Ganze in einem Template erfolgen soll, d.h. der Link muss "wissen", welches (Popup ?)-Fenster er öffnen muss. Zur Verdeutlichung soll das folgende Bild dienen:
2014-08-08_074516.jpg
In diesem Beispiel sollen nur die ersten drei Absätze dargestellt werden und der vierte Absatz erst beim Klick auf "mehr lesen" (entweder in einem neuen Fenster oder alternativ komplett dargestellt, d.h. die Spalte wird so weit vergrößert, dass alles lesbar ist (je nachdem, was einfacher realisierbar ist).

Ich hoffe, ich habe mich halbwegs verständlich ausgedrückt und erwarte nichts Unmögliches.


Man ist so alt, wie man sich fühlt...

Offline

#2 08. August 2014 07:00

nockenfell
Moderator
Ort: Lenzburg, Schweiz
Registriert: 09. November 2010
Beiträge: 2.927
Webseite

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Nur kurz die Google Suche angeworfen:

http://stackoverflow.com/questions/2073 … javascript
http://viralpatel.net/blogs/dynamically … nk-jquery/

Dies kannst du wahrscheinlich am einfachsten mit Javascript lösen.


[dieser Beitrag wurde mit 100% recycled bits geschrieben]
Mein Blog  /   Diverse Links rund um CMS Made Simple
Module: btAdminer, ToolBox

Offline

#3 08. August 2014 07:39

Dancer62
Server-Pate
Ort: 26345 Bockhorn, Niedersachsen
Registriert: 08. November 2013
Beiträge: 414

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Wenn man weiß, wonach man Google suchen lassen muss...  yikes

Vielen Dank nockenfell !!


Man ist so alt, wie man sich fühlt...

Offline

#4 08. August 2014 07:40

Dancer62
Server-Pate
Ort: 26345 Bockhorn, Niedersachsen
Registriert: 08. November 2013
Beiträge: 414

Re: [GELÖST] Maximale Größe der Spalten begrenzen

B.t.w.: wie kann ich einen Thread als [GELÖST] markieren (oder können das nur die Moderatoren) ?


Man ist so alt, wie man sich fühlt...

Offline

#5 08. August 2014 07:53

Andynium
Moderator
Ort: Dohna / SN / Deutschland
Registriert: 13. September 2010
Beiträge: 7.017
Webseite

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Nein, kannst du auch - schau mal in deinen ersten Beitrag unterhalb des Footers rechts. Dort findest du einen Link "Thema gelöst"  wink.

Offline

#6 08. August 2014 08:34

nockenfell
Moderator
Ort: Lenzburg, Schweiz
Registriert: 09. November 2010
Beiträge: 2.927
Webseite

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Dancer62 schrieb:

Wenn man weiß, wonach man Google suchen lassen muss...  yikes

Vielen Dank nockenfell !!

Ich habe nach "Javascript more text" gesucht.


[dieser Beitrag wurde mit 100% recycled bits geschrieben]
Mein Blog  /   Diverse Links rund um CMS Made Simple
Module: btAdminer, ToolBox

Offline

#7 08. August 2014 10:06

Dancer62
Server-Pate
Ort: 26345 Bockhorn, Niedersachsen
Registriert: 08. November 2013
Beiträge: 414

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Ich habe mich für die zweite Lösung entschieden und bin wie beschrieben vorgegangen (jQuery-Plugin herunterladen, einbinden und den betreffenden Inhalt mit class="comment" markieren. Allerdings habe ich das Skript entgegen dem Beispiel von Viral Petal nicht im <body> aufgerufen, sondern in meinem <head>-Bereich (innerhalb der {literal}-tags). Zur Erläuterung die beiden Code-Anteile:

<head>
<script type="text/javascript" src="{root_url}/uploads/themes/<theme>/js/jquery.shorten.1.0.js" ></script>

{literal}

<script type="text/javascript">
    $(document).ready(function () {
       $(".comment").shorten({
    "showChars" : 50,
    "moreText"  : "Mehr",
    "lessText"  : "Weniger",
      });
    });
</script>

{/literal}
</head>

und

                                 <article class="col-1">
                                    <div class="comment">
 {content}
                                    </div>
                                 </article>
                                 <article class="col-2">
                                    <div class="comment">
 {content block='Spalte_rechts'}
                                    </div>
                                 </article>

Das Ergebnis sieht folgendermaßen aus (der Block 'Spalte_rechts' entspricht dem Bild):
2014-08-08_094723.jpg
Soweit, so gut. Aber nun kommt es - klicke ich auf "Mehr", so wird mit einem Mal weniger angezeigt - und umgekehrt:
2014-08-08_094743.jpg

Außerdem werden in der ersten Zeile bereits nach 19 Zeichen die Punkte "..." angezeigt (statt nach den eingestellten 50 Zeichen). Habe ich etwas bei der Implementierung des Codes falsch gemacht oder habe ich etwas mißverstanden ?

Beitrag geändert von Dancer62 (08. August 2014 10:11)


Man ist so alt, wie man sich fühlt...

Offline

#8 08. August 2014 10:41

NaN
Moderator
Ort: Halle (Saale)
Registriert: 09. November 2010
Beiträge: 4.435

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Versuch's mal damit:

                                 <article class="col-1">
                                    <div class="comment">
 {content}
                                    </div>
                                 </article>
                                 <article class="col-2">
                                    <div class="comment more">
 {content block='Spalte_rechts'}
                                    </div>
                                 </article>

Auf Deutsch: Du musst dem Javascript über die Klasse "more" sagen, dass dieser Text gekürzt und der Link "More" angezeigt werden soll.


Module: GBFilePicker, AdvancedContent
Sicherheit: Beispiel .htaccess-Datei
CMSms 1.12 unter PHP 7:
cmsms-1.12.3.zip (inoffiziell - komplett inkl. Installer)
CMSms 1.12 unter PHP 8:
cmsms-1.12.4.zip (inoffiziell - komplett inkl. Installer)

Offline

#9 08. August 2014 11:25

Dancer62
Server-Pate
Ort: 26345 Bockhorn, Niedersachsen
Registriert: 08. November 2013
Beiträge: 414

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Toll, aber keine wirkliche Verbesserung...
Er zeigt jetzt folgendes an:
2014-08-08_121945.jpg
Zum Einen kürzt er jetzt offenbar bereits viel früher (nämlich bei der Überschrift, die sich ja im gleichen Inhalt befindet) und zum Anderen hat sich sein Verhalten bzgl. "Mehr" -> weniger anzeigen und "Weniger" -> mehr anzeigen immer noch nicht geändert.


Man ist so alt, wie man sich fühlt...

Offline

#10 08. August 2014 11:30

Andynium
Moderator
Ort: Dohna / SN / Deutschland
Registriert: 13. September 2010
Beiträge: 7.017
Webseite

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Normalerweise wird die Überschrift bei CMSMS separat eingegeben und im Template via {title} ausgegeben wink...

Offline

#11 08. August 2014 11:45

Dancer62
Server-Pate
Ort: 26345 Bockhorn, Niedersachsen
Registriert: 08. November 2013
Beiträge: 414

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Ich meine nicht die Überschrift der (Web)Seite, sondern eine Überschrift innerhalb des {content}, die ich im Backend des TinyMCE durch Formatieren eines Textes mit "Überschrift 3" vornehme. Diese Überschrift zählt meines Erachtens zu einem ganz "normalen" Text. Oder kann ich auch diese Überschrift gezielt ansprechen ?  yikes


Man ist so alt, wie man sich fühlt...

Offline

#12 08. August 2014 12:01

Andynium
Moderator
Ort: Dohna / SN / Deutschland
Registriert: 13. September 2010
Beiträge: 7.017
Webseite

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Das liegt an dir - für eine Unter-Überschrift könntest du dir einen separaten Content block anlegen

 
{content block='headline_2' oneline=true wysiwyg=false} 

Offline

#13 08. August 2014 12:42

Dancer62
Server-Pate
Ort: 26345 Bockhorn, Niedersachsen
Registriert: 08. November 2013
Beiträge: 414

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Klasse, ich danke Dir.

Aber wie kann ich die Unter-Überschrift dazu überreden, dass sie sich so verhält, wie ich es möchte (z.B. wie die reguläre Überschrift h3 aus meiner CSS-Datei ? Im Forum habe ich zwar einen Post gefunden, der sich mit der Schriftgröße im Body des TinyMCE befaßt, aber wie die dazugehörige Deklaration für die Unter-Überschrift heißt, weiß ich leider nicht (CMSMSh3 ??). Wo kann ich überhaupt die einzelnen Parameter finden (ich will Euch schließlich nicht wegen jeder Kleinigkeit belästigen wink ) ?

Beitrag geändert von Dancer62 (08. August 2014 17:53)


Man ist so alt, wie man sich fühlt...

Offline

#14 08. August 2014 12:51

Andynium
Moderator
Ort: Dohna / SN / Deutschland
Registriert: 13. September 2010
Beiträge: 7.017
Webseite

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Ganz einfach - indem du den Content block in ein h3 setzt wink.

Die Parameter findest du in der Hilfe. Die erreichst du in der Auflistung der Module bzw der Tags über den Link "Hilfe".

Offline

#15 08. August 2014 17:55

Dancer62
Server-Pate
Ort: 26345 Bockhorn, Niedersachsen
Registriert: 08. November 2013
Beiträge: 414

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Super - was mir aber immer noch nicht bei der Lösung des ursprünglichen Problems hilft - nämlich, wie ich den Text tatsächlich erst nach 50 Zeichen kürzen lassen kann.
Beim "Herumspielen" mit verschiedenen Werten für "showChars" konnte ich allerdings auch kein einheitliches oder nachvollziehbares Verhalten der Content-Blöcke feststellen, was mich nun endgültig verzweifeln läßt.


Man ist so alt, wie man sich fühlt...

Offline

#16 14. August 2014 17:08

Dancer62
Server-Pate
Ort: 26345 Bockhorn, Niedersachsen
Registriert: 08. November 2013
Beiträge: 414

Re: [GELÖST] Maximale Größe der Spalten begrenzen

So - nach einigem Probieren habe ich zumindest den Grund für die inkorrekte Darstellung gefunden: offensichtlich kommt das Skript nicht dem Smarty-Tag {content} zurecht sad . Lasse ich das Skript über das Smarty-Tag laufen, so gibt es mir scheinbar willkürlich gekürzt und mit dem oben beschriebenen Verhalten den Text aus. Gebe ich dagegen den Text als solchen im Template ein und lasse das Skript drüberlaufen, kürzt er den Text korrekt nach 50 Zeichen und gibt am Ende das "Mehr" bzw. "Weniger" aus neutral .

Wie kann ich dem Skript jetzt klarmachen, dass es die Smarty-Tags "genauso wie Text" zu behandeln hat ? oder gibt es noch einen anderen Trick ???


Man ist so alt, wie man sich fühlt...

Offline

#17 15. August 2014 08:17

NaN
Moderator
Ort: Halle (Saale)
Registriert: 09. November 2010
Beiträge: 4.435

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Hast Du Dir mal die Kommentare auf der Seite mit dem Script durchgelesen?
Da haben einige ähnliche Probleme: Das Script kommt offenbar nicht damit klar, wenn in dem Text, den es zu kürzen gibt, noch weitere html-Tags stehen (wie z.B. ein <p> oder ein <h3> etc.).

Das Script arbeitet z.B. so: Es nimmt den HTML Code im <div> und teilt ihn anhand der angebenen Zeichenlänge auf. Der Text, der versteckt werden soll, wird in ein <span> gepackt und dieses <span> mittels CSS ausgeblendet. Wenn Dein Text aber z.B. in einem Absatz steht, dann zerreist es diesen Absatz.
Beispiel...
Original HTML Code:

<div class="comment more">
	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
	Vestibulum laoreet, nunc eget laoreet sagittis,
	quam ligula sodales orci, congue imperdiet eros tortor ac lectus.
	Duis eget nisl orci. Aliquam mattis purus non mauris
	blandit id luctus felis convallis.
	Integer varius egestas vestibulum.
	Nullam a dolor arcu, ac tempor elit. Donec.</p>
</div>

Text nach Anwendung des Sciptes, der angezeigt werden soll:

<p>Lorem ipsum dolor sit amet, consectetur adipi

showChars:50
Resultat => 46 sichtbare Zeichen, weil der HTML Code - fälschlicherweise - mitgezählt wird.
Außerdem ist der Absatz kaputt.
Was daraus nun wird, liegt am Browser.

Text, der ausgeblendet wird:

iscing elit.
	Vestibulum laoreet, nunc eget laoreet sagittis,
	quam ligula sodales orci, congue imperdiet eros tortor ac lectus.
	Duis eget nisl orci. Aliquam mattis purus non mauris
	blandit id luctus felis convallis.
	Integer varius egestas vestibulum.
	Nullam a dolor arcu, ac tempor elit. Donec.</p>

1.: Das "i" bei "iscing" ist doppelt. Originalwort war "adipiscing". Angezeigt wird "adipi". Ausgeblendet ist "iscing". Ergibt am Ende "adipiiscing".
2. Der Absatz ist kaputt.
Was daraus wird, liegt am Browser.

Wie das also nachher tatsächlich aussieht bzw. funktioniert, ist für mich schon an dieser Stelle nicht mehr vorhersehbar. Ganz zu schweigen davon, wenn da noch mehr HTML Tags im Text dazukommen, weil jeder Browser fehlerhaftes HTML anders handhabt.

Fazit: Das Script ist fehlerhaft bzw. hat die Einschränkung, dass es nur reinen Text behandeln kann. Kein HTML.


Module: GBFilePicker, AdvancedContent
Sicherheit: Beispiel .htaccess-Datei
CMSms 1.12 unter PHP 7:
cmsms-1.12.3.zip (inoffiziell - komplett inkl. Installer)
CMSms 1.12 unter PHP 8:
cmsms-1.12.4.zip (inoffiziell - komplett inkl. Installer)

Offline

#18 15. August 2014 08:59

Dancer62
Server-Pate
Ort: 26345 Bockhorn, Niedersachsen
Registriert: 08. November 2013
Beiträge: 414

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Vielen Dank NaN - das heißt für mich, dass ich mich von diesem Skript verabschieden werde und solange andere Skripte suchen und ausprobieren muss, bis ich ein Skript finde, das meinen Bedürfnissen entspricht (und Dank Nockenfell weiß ich ja jetzt auch wonach ich suchen muss wink ).


Man ist so alt, wie man sich fühlt...

Offline

#19 15. August 2014 13:20

NaN
Moderator
Ort: Halle (Saale)
Registriert: 09. November 2010
Beiträge: 4.435

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Schau Dir mal das hier an: http://jsfiddle.net/e7fv6j3g/2/
Hab ich mir gerade aus verschiedenen Quellen zusammengebastelt.
Es hält den HTML-Code intakt, aber zählt die HTML-Tags nicht mit als Zeichen und entfernt überflüssige Leerzeichen (die werden sonst mitgezählt).
Scheint da wohl noch keine Patentlösung zu geben.

(Das Beispiel setzt jQuery vorraus)


Module: GBFilePicker, AdvancedContent
Sicherheit: Beispiel .htaccess-Datei
CMSms 1.12 unter PHP 7:
cmsms-1.12.3.zip (inoffiziell - komplett inkl. Installer)
CMSms 1.12 unter PHP 8:
cmsms-1.12.4.zip (inoffiziell - komplett inkl. Installer)

Offline

#20 15. August 2014 15:36

Dancer62
Server-Pate
Ort: 26345 Bockhorn, Niedersachsen
Registriert: 08. November 2013
Beiträge: 414

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Herzlichen Dank für Deine Mühe NaN, Deine Lösung funkioniert wunderbar und ohne Probleme kiss (upps ops ) . Ich habe das Skript und die CSS-Deklarationen etwas an meine Erfordernisse angepaßt und jetzt läuft es ganz nach meinen Vorstellungen.

Da das Problem gelöst ist, werde ich den Thread erstmal auf "gelöst" setzen.


Vielen herzlichen Dank noch einmal an alle, die mir bei der Lösung des Problems tatkräftig geholfen haben.

Man ist so alt, wie man sich fühlt...

Offline

#21 19. August 2014 09:08

Dancer62
Server-Pate
Ort: 26345 Bockhorn, Niedersachsen
Registriert: 08. November 2013
Beiträge: 414

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Hallo NaN,

gibt es eine Möglichkeit die Parameter der 'truncate'-Funktion bei mehreren, verschiedenen Aufrufen jedesmal separat zu setzen (z.B. beim ersten Aufruf mit char=100, bei einem anderen Aufruf mit char=200; ellipsisText='>>>' und wiederum bei einem anderen Aufruf mit ellipsisText='---'; moreText='weiter lesen') ?


Man ist so alt, wie man sich fühlt...

Offline

#22 20. August 2014 11:05

NaN
Moderator
Ort: Halle (Saale)
Registriert: 09. November 2010
Beiträge: 4.435

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Dazu müsste man das Script überarbeiten. Z.B. ein jQuery Plugin draus machen. Dann kann man jedem div eigene Einstellungen zuordnen: http://jsfiddle.net/e7fv6j3g/3/

Es gibt übrigens noch eine andere Möglichkeit, Text allein mit CSS zu kürzen, ohne den Text selbst manipulieren zu müssen: http://jsfiddle.net/xk9vxuk0/1/
Da kannst Du übers CSS mit Hilfe der Höhe festlegen, wieviel Text angezeigt wird.
(in dem Beispiel hier nur über max-height, weil sonst die Animation nicht funktioniert)


Module: GBFilePicker, AdvancedContent
Sicherheit: Beispiel .htaccess-Datei
CMSms 1.12 unter PHP 7:
cmsms-1.12.3.zip (inoffiziell - komplett inkl. Installer)
CMSms 1.12 unter PHP 8:
cmsms-1.12.4.zip (inoffiziell - komplett inkl. Installer)

Offline

#23 20. August 2014 11:21

Dancer62
Server-Pate
Ort: 26345 Bockhorn, Niedersachsen
Registriert: 08. November 2013
Beiträge: 414

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Super NaN,

da werde ich mich gleich mal ans Werk machen und das jQuery-PlugIn ausprobieren bzw. an meine Bedürfnisse anpassen (es geht doch nichts über erstklassige Programmierer, die dann auch noch dermaßen hilfsbereit sind - ich hoffe, dass ich das irgendwann einmal wieder gutmachen kann wink ).

Der zweite Link führt übrigens nicht zum Ziel : er gibt einen "Error: 404" aus... sad


Man ist so alt, wie man sich fühlt...

Offline

#24 20. August 2014 11:25

NaN
Moderator
Ort: Halle (Saale)
Registriert: 09. November 2010
Beiträge: 4.435

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Der zweite Link führt übrigens nicht zum Ziel : er gibt einen "Error: 404" aus... sad

Hab ihn korrigiert.


Module: GBFilePicker, AdvancedContent
Sicherheit: Beispiel .htaccess-Datei
CMSms 1.12 unter PHP 7:
cmsms-1.12.3.zip (inoffiziell - komplett inkl. Installer)
CMSms 1.12 unter PHP 8:
cmsms-1.12.4.zip (inoffiziell - komplett inkl. Installer)

Offline

#25 20. August 2014 11:37

Dancer62
Server-Pate
Ort: 26345 Bockhorn, Niedersachsen
Registriert: 08. November 2013
Beiträge: 414

Re: [GELÖST] Maximale Größe der Spalten begrenzen

Danke, aber bei der zweiten Lösung habe ich das Problem, dass ich entweder die genaue Höhe der Zeilen (inkl. Leerzeilen, Zeilenabstand, Zeichengröße etc.) kennen muss oder aber u.U. unschöne Effekte wie z.B. eine "Pixelreihe" akzeptieren muss. Da ich Ersteres schlecht voraussehen kann (ich möchte das Ganze so flexibel wie möglich gestalten) und Letzteres nicht akzeptieren kann (und möchte), bleibt mir nur, auf diese Lösung zu verzichten. Trotzdem, danke für Deine Bemühungen.  smile


Man ist so alt, wie man sich fühlt...

Offline