Matthias Apsel: wysiwyg-Editor gesucht

Hallo alle,

ich suche einen Editor, mit dessen Hilfe Menschen, die überhaupt keine Ahnung von HTML und Co. zu haben brauchen, einzelnen Wörtern, Wortgruppen, Absätzen Klassen zuweisen können.

Eigentlich suche ich WORD + Semantik. Etwa ein Wort wird markiert → Rechtsklick → Klasse "foo" zuordnen.

Ziel ist es, die Inhalte von Word-Dokumenten für die Übernahme in eine Datenbank vorzubereiten, dazu müssten (viele) einzelne Elemente getagt werden. Anhand dieser Tags erfolgt dann die Einordnung in die DB-Struktur.

Gibt es da etwas, was ich ausprobieren könnte?

Bis demnächst
Matthias

--
Rosen sind rot.

akzeptierte Antworten

  1. Ziel ist es, die Inhalte von Word-Dokumenten für die Übernahme in eine Datenbank vorzubereiten, dazu müssten (viele) einzelne Elemente getagt werden. Anhand dieser Tags erfolgt dann die Einordnung in die DB-Struktur.

    Ich habe das jetzt nicht in Word probiert. Aber Libroffice hat die Eigenschaft, bei einem HTML-Export eine zugewiesene, selbst erstellte Formatvorlage als Klasse zu verwenden… Womöglich bringt Dich das auf eine Idee. Ich würde das an Deiner Stelle mal mit einer Word-Datei machen, dieser die Endung .zip verpassen, das dann auspacken und mir die xml-Dateien mal mit einem geeigneten Programm ansehen.

    Alternativ hilft Dir vielleicht auch vba (ALT+F11) weiter.

  2. Hallo Matthias,

    ich würde TinyMCE vorschlagen: Beispiel mit einer mittels Klassen ausgezeichneten Adresse

    Screenshot von TinyMCE mit Formate-Dropdown

    Im Beispiel können vordefinierte Klassen über das Formate-Dropdown zugewiesen werden, diese Klassen fügt TinyMCE dann den die entsprechenden Abschnitten umhüllenden span-Elementen hinzu. Über für den Inhalt des Editors definiertes CSS können die zugewiesenen Klassen im Editor visualisiert werden. Damit beim Copy-and-Paste nicht das Schraddel-Markup von Word in der Datenbank landet, wird nur der Text eingefügt (auch detaillierter konfigurierbar).

    Allgemein kann TinyMCE gut angepasst werden. Beispielsweise könnte man die Menü-Leiste streichen und nur die wirklich benötigten Funktionen in die Toolbar aufnehmen.

    Gruß
    Julius

    1. Hallo Julius,

      ich würde TinyMCE vorschlagen: Beispiel mit einer mittels Klassen ausgezeichneten Adresse

      Danke. Das gefällt mir gut. Könntest du mal bitte zu Demo-Zwecken solch ein CSS hinzufügen:

      .name::after, .straße::after, .nummer::after {
        content: attr(class);
      }
      

      damit man sieht, dass die Zuordnung mehrerer Klassen wirklich funktioniert und ich das zeigen kann?

      Bis demnächst
      Matthias

      --
      Rosen sind rot.
      1. Hallo Matthias,

        ich habe den per CSS generierten Text grau eingefärbt, damit man ihn vom Text unterscheiden kann. Ich bin etwas spät dran mit der Änderung, sorry…

        Eigentlich wollte ich das auch als Codepen bereitstellen, aber irgendwie verträgt sich das nicht mit Tinymce (Symbole werden nicht korrekt dargestellt, vielleicht ein Problem mit FontAwesome?).

        Gruß
        Julius

        1. Hallo Julius,

          ich habe den per CSS generierten Text grau eingefärbt, damit man ihn vom Text unterscheiden kann. Ich bin etwas spät dran mit der Änderung, sorry…

          Kein Problem. Dafür bin ich etwas früh dran. Schließlich stehen wir ganz am Anfang.

          Krieg ich auch einen Link? 😉

          Eigentlich wollte ich das auch als Codepen bereitstellen, aber irgendwie verträgt sich das nicht mit Tinymce (Symbole werden nicht korrekt dargestellt, vielleicht ein Problem mit FontAwesome?).

          TinyMCE selbst stellt Beispiele bei CodePen vor. Vielleicht schaust du da mal rein.

          Bis demnächst
          Matthias

          --
          Rosen sind rot.
          1. Hallo Matthias,

            ich habe den per CSS generierten Text grau eingefärbt, damit man ihn vom Text unterscheiden kann. Ich bin etwas spät dran mit der Änderung, sorry…

            Kein Problem. Dafür bin ich etwas früh dran. Schließlich stehen wir ganz am Anfang.

            Krieg ich auch einen Link? 😉

            Du hast ihn sogar schon – es ist weiterhin der alte. Ich habe nur die tinymce-semantik.css ergänzt (Cache löschen).

            Wenn ich <span class="nummer">Nummer</span> im Quelltext einfüge (Werkzeuge > Quelltext), macht das CSS das, von dem ich meine, dass du es wolltest 😉

            Eigentlich wollte ich das auch als Codepen bereitstellen, aber irgendwie verträgt sich das nicht mit Tinymce (Symbole werden nicht korrekt dargestellt, vielleicht ein Problem mit FontAwesome?).

            TinyMCE selbst stellt Beispiele bei CodePen vor. Vielleicht schaust du da mal rein.

            Eigentlich müsste es laufen, habe deren Beispiel geforkt – muss ich, wenn ich mehr Zeit habe, mal nachforschen...

            Gruß
            Julius

            1. Hallo Julius,

              Du hast ihn sogar schon – es ist weiterhin der alte. Ich habe nur die tinymce-semantik.css ergänzt (Cache löschen).

              Ah ja, danke.

              Wenn ich <span class="nummer">Nummer</span> im Quelltext einfüge (Werkzeuge > Quelltext), macht das CSS das, von dem ich meine, dass du es wolltest 😉

              Leider nein, weil mein CSS-Wunsch vom ursprünglichen überschrieben wird. Aber das ist kein Problem. Ich bin inzwischen an meinem eigenen TinyMCE am umherspielen.

              Falls du Lust und Zeit hättest, könntest du im CSS die Zeilen 13, 17 und 21 löschen. Dann könnte ich zum Vorführen auf deine Variante zurückgreifen, ohne die Entwicklertools öffnen zu müssen und ich noch nichts eigenes habe.

              Dankeschön.

              Bis demnächst
              Matthias

              --
              Rosen sind rot.
              1. Hallo Matthias,

                Falls du Lust und Zeit hättest, könntest du im CSS die Zeilen 13, 17 und 21 löschen. Dann könnte ich zum Vorführen auf deine Variante zurückgreifen, ohne die Entwicklertools öffnen zu müssen und ich noch nichts eigenes habe.

                So?

                Ich habe alles mal gezippt, ist alles drin, brauchst es nur entpacken.

                Gruß
                Julius

                1. Hallo Julius,

                  So?

                  Sollte passen. 😀

                  Bis demnächst
                  Matthias

                  --
                  Rosen sind rot.
  3. Hallo Matthias,

    schau dir mal die Formatvorlagen (also Zeichen- und Absatzformate) an. Damit kannst du Semantik ins Dokument bringen. Einige der vordefinierten Vorlagen werden beim Speichern als HTML auch direkt in ihren entsprechenden Elementen notiert, z.B. hervorgehobenem.

    Viele Grüße
    Robert

    1. Hallo Robert B.,

      schau dir mal die Formatvorlagen (also Zeichen- und Absatzformate) an.

      Das reicht leider nicht.

      Bis demnächst
      Matthias

      --
      Rosen sind rot.
      1. Hallo Matthias,

        was fehlt denn noch?

        Viele Grüße
        Robert

        1. Hallo Robert B.,

          was fehlt denn noch?

          Es geht wirklich um inhaltliche Klassen. Einzelne Wortgruppen müssen mehrere Klassen bekommen, die sich nicht in der Darstellung widerspiegeln dürfen/müssen. So als Icon hintendran find ich das recht gut.

          Das Projekt steht noch ganz am Anfang, es ist also nur ein Brainstorming. Konkreteres kann ich leider nicht verlauten lassen. Ziel ist es, dass Leute ohne HTML-Kenntnisse ein Word-Dokument so aufbereiten können, dass seine Inhalte von Leuten, die Ahnung von Datenbanken haben, in eine DB überführt werden können.

          Die einen haben die inhaltliche Ahnung, die anderen die fachliche. Ich steh dazwischen.

          Bis demnächst
          Matthias

          --
          Rosen sind rot.
          1. Hallo Matthias,

            Es geht wirklich um inhaltliche Klassen. Einzelne Wortgruppen müssen mehrere Klassen bekommen, die sich nicht in der Darstellung widerspiegeln dürfen/müssen. So als Icon hintendran find ich das recht gut.

            Hm, also selbst mit Formatvorlagen, die nichts formatieren geht das AFAIK nicht, weil man da einer Zeichenkette oder einem Absatz immer nur eine Vorlage zuweisen kann.

            Das Projekt steht noch ganz am Anfang, es ist also nur ein Brainstorming. Konkreteres kann ich leider nicht verlauten lassen. Ziel ist es, dass Leute ohne HTML-Kenntnisse ein Word-Dokument so aufbereiten können, dass seine Inhalte von Leuten, die Ahnung von Datenbanken haben, in eine DB überführt werden können.

            Vielleicht ließe sich mit Makros noch etwas machen …

            Viele Grüße
            Robert

            1. Hallo Robert B.,

              Hm, also selbst mit Formatvorlagen, die nichts formatieren geht das AFAIK nicht, weil man da einer Zeichenkette oder einem Absatz immer nur eine Vorlage zuweisen kann.

              Stimmt.

              Vielleicht ließe sich mit Makros noch etwas machen …

              Möglich.

              Bis demnächst
              Matthias

              --
              Rosen sind rot.
              1. Noch eine Idee:

                In Word kann man auch Kommentare hinzufügen. Im den XML-Dateien sollten die auswertbar dem Text zugeordnet stehen. Da das Verfahren für die angedachte Funktion zu umständlich ist (die Kommentare müssen ja getippt werden) könnte man das womöglich via VBA-Makro und einem Miniformular vereinfachen. Einfach mal aufzeichnen und das Makro dann umarbeiten wäre die von mir präferierte Vorgehensweise.

  4. Hallo alle,

    ich bin dabei TinyMCE auszuprobieren. Dazu möchte ich natürlich Dateien zum Bearbeiten auswählen und auch speichern. Gibts da was fertiges?

    Bis demnächst
    Matthias

    --
    Rosen sind rot.
    1. Gibts da was fertiges?

      Nun ja. Ich habe jetzt auf die Schnelle nichts gefunden, womit Du Dateien in einer Verwaltung aussuchen und in TinyMCE anlegen / öffnen / speichern kannst. Man könnte zwar was fertiges nehmen und anpassen, aber das sieht mir nach ziemlich viel Arbeit aus, zumal die "Sicherheitskonzepte" dieser Tools überprüft und überdacht werden müssen.

      Für mich sieht es so aus: Die Aufgabe ist trivial, sowas ist schneller selbst geschrieben als Fremdsoftware abgeändert. Dabei kann man auch gleich sein "Sicherheitskonzept" einbauen.

      1. Hallo Regina Schaukrug,

        Dabei kann man auch gleich sein "Sicherheitskonzept" einbauen.

        • Zugang über HTTP-Authentifikation
        • Dateien außerhalb document-root

        Sonst noch was?

        Im Produktivsystem – so es dazu kommt – liegt das nicht in meiner Verantwortung.

        Bis demnächst
        Matthias

        --
        Rosen sind rot.
          • Zugang über HTTP-Authentifikation
          • Dateien außerhalb document-root

          Sonst noch was?

          Ja ist gut, reicht aber nicht. Da ist noch viel mehr und viel komplizierteres.

          Ich denke da an:

          • "Gleichzeitiges" bearbeiten unterbinden ("Wer zu Letzt speichert behält recht?")
          • Nutzerrechte an Dateien ("Darf der Willi bearbeiten was der Gerda gehört?")

          Ich bin mir sicher, da ist noch mehr. Möglicherweise muss man einiges davon über eine Datenbank oder META-Dateien (dann wohl im Stil von getfacl) regeln.

          1. Hallo Regina Schaukrug,

            • "Gleichzeitiges" bearbeiten unterbinden ("Wer zu Letzt speichert behält recht?")
            • Nutzerrechte an Dateien ("Darf der Willi bearbeiten was der Gerda gehört?")

            Wird im Testsystem nicht vorkommen bzw. keine Rolle spielen.

            Im Produktivsystem – so es dazu kommt – ist das alles nicht mein Aufgabenbereich.

            Bis demnächst
            Matthias

            --
            Rosen sind rot.
            1. Die einen haben die inhaltliche Ahnung, die anderen die fachliche. Ich steh dazwischen. Im Produktivsystem – so es dazu kommt – ist das alles nicht mein Aufgabenbereich.

              Ja. Mag sein. Aber um die Lösungsansätze beurteilen zu können solltest Du schon mal wissen, was da auf die Programmierer bzw. Softwareingenieure zukommt. Es reicht meiner Ansicht nach nicht aus, diese Dinge ins PAL-Feld/SEP-field zu rücken.