Zeilenabstände im Textobjekt ändern 
Autor: Siegbert G.Vor einigen Jahren wurde schon einmal diese Frage gestellt.
Vielleicht wurde in der Zwischenzeit von Website X5 eine Verbesserung angeboten.
Ich habe links ein Textobjekt mit 11 Namen, die untereinander stehen und auf der rechten Seite befindet sich ein Galerieobjekt.
Der Kunde möchte, dass die Namen oben und unten mit den Bildern auf der rechten Spalte bündig sind.
Damit dieses funktioniert, sollten die Abstände der Namen angepasst werden können.
Es reicht nicht 1.5 oder doppelte Linie einzustellen. Habe auch schon versucht, ob die Ränder oben und unten einen Einfluß haben. Ohne Erfolg.
Bei unofficial wurde vor ein paar Jahren dieser Code vorgeschlagen.
- <scriptsrc="http://hilfe.unofficialwsx5.de/js/jquery.autolineheight.js"type="text/javascript"></script>
- <scriptsrc="http://hilfe.unofficialwsx5.de/js/jqem-uncompressed.js"type="text/javascript"></script>
- <scripttype="text/javascript">
- $(function(){
- $('.ff1 ,.fs20 ,.ff2 ,.fs18').autolineheight({minWidth:19,minLineHeight:0.9,ratio:.02});
- });
- </script>
Wenn ich LineHight einstelle ändern sich die Abstände in der Vorschau, aber nach dem Hochladen zum Provider ist keine Änderung sichtbar.
Gibt es einen besseren Code oder kann ich direkt in die Abstände von Website X5 eingreifen?
Ist es die Webseite der ...künstlergruppe - links 11 Namen und rechts 3 x 4 Bilder?
Da sieht es online gut aus, aber nur bei Desktop-Ansicht - nicht bei der Smartphone-Simulation, da ist die Liste der Namen viel länger oder Liste und Galerie sind übereinander platziert.
Autor
Ja, Daniel, es ist die Seite der Künstlergruppe.
Bei der Smartphone-Ansicht ist es kein Problem und ist auch so gewollt.
In der Desktop-Ansicht sind die Namen kürzer wie die Bilder.
Mal mit CSS-Code versuchen, siehe Screenshot unten, hier wurde der CSS-Code getestet.
In WebSite X5 unter "3 Sitemap" die betreffende Seite markieren und oben auf "Eigenschaften" klicken, dann den Reiter "Erweitert" anklicken und bei ...
Benutzerdefinierter Code
Vor dem </HEAD> Tag
... den unteren CSS-Code einfügen.
Anmerkung:
Bei anderen Textobjekten müssen die Zahlen und Werte für den CSS-Code neu ermittelt werden, z.B. mit den Web-Entwicklertools der Browser, im Screenshot ist es der von Firefox.
----- CSS-Code -----
<style>
#imTextObject_17_46_tab0 .1h1-5 { line-height: 1.95 !important; }
</style>
----- Screenshot -----
Ergänzung:
In neueren WebSite X5 Versionen kann man CSS-Code direkt dem (Text-)Objekt zuweisen, siehe
-----
So passen Sie den Stil eines Objekt mit CSS Code an
...
>> https://guide.websitex5.com/de/support/solutions/articles/44002549216
-----
Allerdings müsste man hier noch diesen Teil .1h1-5 im CSS-Code in der Vorschau von WebSite X5 mit Rechtsklick und der Auswahl "Quelltext" selber ermitteln.
Bei älteren Versionen ist dies noch nicht vorhanden, hier hilft meine oben beschriebene Methode.
Autor
Hallo Daniel,
vielen Dank für deine Unterstützung.
Ich habe den Code eingegeben, es hat sich aber nichts verändert.
Vielleicht mache ich etwas falsch.
Du darfst den Code nicht 1:1 übernehmen! Du musst selbst den CSS Selektor rausfinden und dann den Wert ändern.
#imTextObject_17_46_tab0 das wird bei dir anders heissen mit einer anderen Zahl
Habe bei meiner Testseite nochmal einen Tests gemacht und das DEVTool von WebSite X5 verwendet, um den CSS-Code zu ermitteln, dabei ist ein etwas anderer CSS-Code herausgekommen.
Im Screenshot (1) sieht man wie ich den CSS-Code ermittelt und den Wert (3.3) getestet habe.
Im Screenshot (2) habe ich den ermittelten CSS-Code zwischen <style> und </style> eingefügt.
Ich hoffe, dass mit dieser Anleitung der richtige CSS-Code ermittelt, kopiert und in WebSite X5 eingefügt werden kann, damit es klappt.
Der CSS-Code ist bei jedem Nutzer / jedem Text-Objekt anders und muss selber ermittelt werden.
Mit den Web-Entwicklungstools im Browser kann man auch auf fremden Webseite der CSS-Code ermitteln, aber es funktioniert nicht immer bzw. muss oft ergänzt, korrigiert und getestet werden.
----- (1) -----
----- (2) -----
Ergänzung zum Arbeiten mit dem DevTool von WebSite X5:
In der WebSite X5 Vorschau mit der rechten Maustaste auf den Text mit den Namen klicken und "Quelltext anzeigen" anklicken, dann erscheint das DevTool.
Und hier den alten Wert - z.B. 24px - anklicken, um ihn zu ändern zu können, siehe Screenshots
Die neue CSS-Code-Anzeige kann dann kopiert werden.
-----
-----
Autor
Hallo Daniel,
als ich das ".1h1-5" gegen das "div " getauscht habe, hat es funktioniert.
Super - vielen Dank.
Da das Ageny jetzt im Geburtstagsangebot ist, habe ich mir überlegt ob ich es kaufen soll weil man ja mit dem
neue Pro keine Homepage verkaufen kann. Ich bin mir nicht sicher ob ich die Seiten von Website X5 2023.2.8. ohne Probleme übernehmen kann. Was ist deine Meinung als Spezialist.
Die Homepage für die Künstlergruppe habe ich für eine frühere Zeichenlehrerin erstellt.
Normalerweise sollte es keine Probleme geben, da die Agency-Version im Prinzip eine normale Pro-Version ist, die zusätzlich den Verkauf der erstellten Webseiten erlaubt und auch noch 50 ansonsten im Marketplace kostenpflichtige Templates enthält.