Spalten werden in Mobile Version nicht als Spalten dargestellt.

Kräuterhexe

Hallo zämme

ich habe schon seit Jahren das Homepage Tool aber leider plage ich mich jedes Jahr mit den Kursterminen rum, weil ich diese nicht aus dem Excel sauber rein kopieren kann.

Nun habe ich versucht, anstelle des normalen Textfeldes die Spalten als Widget zu nutzen, was auch auf dem PC wunderbar aussieht. Jedoch in der Mobile Version zeigt es diese nicht sauber an, es ist sogar nicht zu gebrauchen, weil es die Spalten untereinander anstatt nebeneinander anzeigt.

Gibt es hier eine schlaue Lösung, oder wie kann ich Daten mit Uhrzeiten und Text sauber darstellen?

Danke für eure Hilfe!

Martina

DomiP

Hallo,

ich habe gemeint, dass es doch eine Tabellen-Funktion gibt? So sollte es am besten klappen.

Falls nicht, kannst du auch über HTML-Widgets oder Bausteine eine Liste / Tabelle erstellen: https://www.w3schools.com/html/html_tables.asp

Kräuterhexe

Ja gibt es. Auf dem PC sieht es wunderbar aus. Aber auf dem mobile führt es diese eben untereinander statt nebeneinander.

Daher er die Frage

DomiP

Könntest du mal einen Link der Seite teilen?

Eventuell gibts einen kleinen Trick.

Kräuterhexe

Hallo Domi

hier der Link zur Seite

https://kräuterzauber.ch/m-c3-a4rkte-kurse.shtml

DANKE für Deine Hilfe

DomiP

Hoi Martina,

Responsiveness (also, dass es überall gut aussieht und auch nutzbar ist) ist heutzutage noch nicht so weit verbreitet. Meiner Meinung nach unterstützt das Homepagetool der Swisscom diese neue Entwicklung nicht gerade so - wenn du also Zeit hast, würde ich dir empfehlen, die Seite der Einfachheit und Bedienbarkeit halber auf ein CMS umzustellen. Wordpress bietet sich da sehr gut an!

Um noch auf dein Problem einzugehen:

Versuche mal ein HTML -Element einzufügen, welches diesen Code hat:

<table style="font-family: arial, sans-serif; border-collapse: collapse; width: 75%">
  <tr>
    <td>15.02.2020</td>
    <td>09 - 12 Uhr</td>
    <td>Putzmittelkurs</td>
  </tr>
  <tr>
    <td>07.03.2020</td>
    <td>09 - 16 Uhr</td>
    <td>Kräutersalben und Balsame</td>
  </tr>
</table>

Teste es mal an PC und Natel. Falls das auch nicht klappt müssen wir weiterschauen. Falls es klappt wäre der Nächste schritt das Verlinken deiner Seiten.

Kräuterhexe

😞 auf dem PC Top und im Mobile wieder flopp.

Es ist ein Jammer mit der lieben Swisscom

DomiP

Komisch... Nun ja, ohne direkten Zugriff auf ein Interface kann man da nicht so viel sagen und zudem bin ich eher gegen solche Tools und programmiere lieber alles selber 😝.

@MarkusBe kannst du uns da als Hosting-Experte bei Swisscom vielleicht etwas weiterhelfen?

Jasy

Hallo Martina

Falls es noch aktuell ist evt. hilft Dir dies noch:

https://www.mediaevent.de/css/media-queries.html schon alleine um zu verstehen, was alles heute für Moble (media queries) gibt.

Als weiteren Input wäre noch das CSS abzuändern:
column-count: 3; (wäre für 3spaltig, damit der Browser weiss - dies sollte so angezeigt werden, ansonsten immer autom. untereinander!)

column-width:... (grösse, je nach dem was Du benötigst - Tipp mit z.B. 12em)

Leider sind bei Vorlagen (nicht nur im HP Swisscom, auch anderen CMS) oftmals die Vorgabe von Breite in px angegeben. Wenn man nicht genau diese Angaben hat und abändern kann (auf % oder em), dürfte es ein längeres probieren werden.

Ich selber habe HP, arbeite neu mit Joomla (Ausbildung) und gestern mit Wordpress angefangen.

Bei allen hängt es jedoch immer davon ab, was programmiert wurde.

Schliesse mich @DomiP an - eigen Programmierung geht zwar länger, aber Du weisst was Du programmiert hast.

Hast Du schon probiert alles in einer Spalte zu schreiben - quasi als eigene Box, nur alle nebeneinander?

Liebs grüessli und "Coole Page" 😊

Jasmine

DomiP

Ja die MediaQueries sind sehr beliebt, aber eben auch relativ umständlich in ein System wie das Homepage-Toom einzupflanzen.

Aber wenn wir schon dabei sind, wie wäre es dann mit einfachen Labels?

Ich arbeite in der Firma gerade viel mit Qt und da sind anstelle von Tabellen meist einfach mehrere Labels nebeneinander gereiht...

Eventuell kann das auch eine Lösung sein, dass du jeden Termin so einfügst:

12.04.2020 - 09 bis 16 Uhr: <a href='link.ch/kurs'>Kursbezeichnung</a>

15.04.2020 - 09 bis 16 Uhr: <a href='link.ch/kurs2'>Kursbezeichnung 2</a>

Den Code müsstest du dann halt immer anpassen aber dadurch, dass du nur eine String nutzt, und diesen mit einem Umbruch (br) vom nächsten Trennst, sollte es schon um einiges besser aussehen...

Gruss euch beiden ✌️