Neu Bootstrap im Content

Conny

Sehr aktives Mitglied
7. September 2009
548
60
Hi

ich versuche üver "Inhalte" -> "Eigene Seiten" einen Inhalt mit Bootstrap Syntax anzulegen.
Leider klappt das irgendwie nicht.

Hat jemand eine Idee:
HTML:
<div class="container">
<div class="row">
<div class="col-sm" style="background-color:yellow;">25%</div>

<div class="col-sm" style="background-color:orange;">25%</div>

<div class="col-sm" style="background-color:yellow;">25%</div>

<div class="col-sm" style="background-color:orange;">25%</div>
</div>
</div>

Ergbnis: https://testshop.classic-watch.de/Ueber-BJ-Hoffmann
 

Tomas

Sehr aktives Mitglied
8. Januar 2018
330
69
Lübeck
Hallo Conny,
du hast vergessen anzugeben, wie breit die Spalten sein sollen. Es müsste heißen "col-sm-3"

EDIT:
Außerdem solltest du "container" an der Stelle nicht verwenden. Das "row"-Div reicht an dieser Stelle vollkommen.

VG
Tomas
 

Conny

Sehr aktives Mitglied
7. September 2009
548
60
Kennst du evtl. ein Plugin für den CKeditor welches die Arbeit mit dem Bootstrap etwas erleichtert ?
 

Conny

Sehr aktives Mitglied
7. September 2009
548
60
Ich mach das alles zu Fuss, ohne den Editor. Ist aber für den Laien, der mal was am Content ändern will nicht machbar.
Dafür gibt es wohl noch keine vernünftig Lösung ?
Oder was benutzt du ?
 

Tomas

Sehr aktives Mitglied
8. Januar 2018
330
69
Lübeck
Ich verwende den "Visual Studio Code" Editor von Microsoft und kopiere Inhalte dann ggf. nur in den CKEditor rein. Ich habe grad gesehen, dass es dafür aber einige Bootstrap Plugins gibt.
 

Stephan K.

Sehr aktives Mitglied
14. Mai 2014
1.180
268
Kommt immer drauf an, was man wirklich braucht.

Bootstrap ist wie ne Sammlung an Fertiggewürzen. Man muss halt wissen, wie man die Gewürze anspricht und wählt, so eben "col-sm-3" das ist ein Code, der schon viel Infos enthält. Das Grid-System als Spalte, die Ansichtsgröße und der Wert dafür im 12er Grid-System (Spaltendarstellung: 3/12 Breite für Small-Ansicht). So hat man im Hintergrund die Gewürze fertig und sagt nur, wovon wieviel reinkommen soll, um etwas zu zaubern. Oder halt fertige Holzbalken. Man muss nicht erst ihre Länge bestimmen und auf Maß zuschneiden, sondern sagt einfach: 3er Balken für kleine Größen.

Dafür gibt es auch spezielle Editoren. Stylizer finde ich ganz gut, Pingendo, Bootstrap Studio. Sind halt kostenpflichtige Tools, aber teils auch nur ne Einmalzahlung.
Bootply, VvvebJs Bootstrap 4 als OS-Beispiele.

Andererseits sind viele moderne Programmiersprachen auch ständig im Wandel, da sie einfach richtig fett geworden sind und vielfach kombiniert werden. Sie bringen javascript mit, was die Seite lähmt.
Es wird noch ein paar Jahre dauern, bevor man sich nicht mehr so viele Gedanken darüber machen muss, aber es ist schon noch eine wichtige Komponente, wie viel man lädt, etc.
 
Zuletzt bearbeitet:

css-umsetzung

Offizieller Servicepartner
SPBanner
6. Juli 2011
6.635
1.581
Berlin
Der ckEditor ist auch nicht wirklich das beste was es gibt, er kann aber über Plugins erweitert werden. Ich habe hierfür ein Plugin geschrieben das den Editor um wichtige Funktionen erweitert.
Das Plugin habe ich aber letztendlich nicht veröffentlicht, da Shopbesitzer die keine Erfahrung mit html haben einfach überfordert sind und ich dann nur noch am fragen beantworten wäre.
Denn auch wenn der Editor mit Plugins erweitert wird, ist es erforderlich das der Anwender weiß wie der html Code letztendlich aufgebaut ist.

Mit dem 5er Shop kommt ja der OPC, dann wird es für alle viel einfacher schöne Contentseiten zu erstellen, darauf würde ich als Shopbesitzer jetzt warten.


1550041472114.png
 

Conny

Sehr aktives Mitglied
7. September 2009
548
60
Hi #css-umsetzung,

wenn der Screenshot deine Erweiterung anbetrifft, würde ich mich darüber freuen dies mal ausprobieren zu können.
Ist das möglich ?
 

css-umsetzung

Offizieller Servicepartner
SPBanner
6. Juli 2011
6.635
1.581
Berlin
Ja das ist meine Erweiterung für den CKEditor im Admin Bereich.
Aber wie ich schon schrieb, auch das erfordert einige Grundkenntnisse, da man bei solchen Geschichten auch nicht drum herumkommt, mal direkt den Quellcode zu editieren.

Die Bootstrap Plugins die ich hierfür zugekauft habe (Ich darf diese mit ausliefern) sind natürlich nicht perfekt und wenn man da nicht aufpasst kann schlimmes passieren :)

Ich gebe das jetzt und hier kostenlos raus, möchte aber keine Beschwerden hören wenn jemand sich damit seinen Content zerschießt.

Da das Zip recht groß ist, solltet Ihr das lieber per ftp (binär) übertragen und dann installieren, da der Upload bzw. das entpacken dann vermutlich scheitern könnte.
Es gibt keine Einstellungen die gemacht werden müssen, einfach installieren und gut ist.

Wenn Ihr dann das erste mal im Admin Bereich auf einer Seite seid wo der CKEditor aktiv ist, dann ein/zweimal strg-F5 drücken, damit der Cache eures Browsers die geänderten Bedingungen erkennt.
Danach solltet Ihr ne Menge mehr Optionen zur Verfügung haben.

https://css-umsetzung.de/shop/downloads/css_BackendTools.zip

Es gibt einen Grund warum ich das nicht zum kauf anbiete, der besteht darin das der Support sich nicht mit dem Verkauf finanzieren lassen würde, da ich davon ausgehe das viele Leute damit nicht klar kommen werden.
Ruft mich also bitte nicht an damit euch den CKEditor oder einzelne Funktionen erkläre.

Wer sich damit auskennt kann weitere Module über \css_BackendTools\editor\config.js einbinden
 
  • Gefällt mir
Reaktionen: Conny

peterwill

Gut bekanntes Mitglied
29. Oktober 2007
347
18
Hallo css-umsetzung
und erstmal DANKE !!!!!! für das tolle plugin. (GRATIS) :thumbsup: von Herrn Petermann.
Bin kein Profi was html angeht aber das plugin tut was es soll.
Wir finden es einfach genial und wenn man einwenig damit testet erklärt es sich auch von alleine. :thumbsup:
Wenn Fragen auftauchen sollten wir fairerweise es hier im Forum behandeln.
Von uns :thumbsup::thumbsup::thumbsup::thumbsup::thumbsup:
 

Conny

Sehr aktives Mitglied
7. September 2009
548
60
Hi css-umsetzung
leider bin ich eben erst dazu gekommen dein Plugin zu testen.
Ich bin begeistert und bedanke mich dafür, dass du das Proggi KOSTENLOS zur Verfügung stellst.
Genau solche Dinge habe ich gesucht.
VIELEN DANK nochmal.

LG Conny
 

css-umsetzung

Offizieller Servicepartner
SPBanner
6. Juli 2011
6.635
1.581
Berlin
Aber bitte geht vorsichtig damit um, bisher hatten nur einige wenige meiner Kunden dieses Plugin und kommen damit auch gut zurecht nachdem ich das wesentliche erklärt habe aber man weiß ja nie.
Da es mittlerweile ja eine History gibt, kann man den Content ja im Zweifel zurücksetzen.
Die die diesen Editor nutzen, erstellen damit auch die Artikelbeschreibungen und kopieren diese dann eben in das Textfeld der wawi, um damit diesen komischen Editor der wawi nicht nutzen zu müssen.

Wer sich damit auskennt, kann sich für diesen Editor auch eigene Stylesheet Klassen sowie vorgefertigte Vorlagen erstellen.
Es gibt auch weitaus mehr Bootstrap Plugins für den Editor, die vermutlich sogar noch besser sind als meine eingebundenen aber ich habe damals ein relativ günstiges Paket gekauft da ich eigentlich nur testen wollte was möglich ist.
 

j0e

Gut bekanntes Mitglied
29. Oktober 2017
103
3
Hey Andreas,
du bist echt mein Held.

Das Plugin ist der Hammer. Ich wusste gar nicht, dass es für den CK so Plugins gibt.
Sehr schön finde ich auch den WordCounter.

Vielen Dank!
 

css-umsetzung

Offizieller Servicepartner
SPBanner
6. Juli 2011
6.635
1.581
Berlin
Oh doch, dass der kommt ist MEGA wichtig :)
der hilft allen die mit HTML gar nichts am Hut haben und sorgt auch dafür, wenn der zugehörige Servicepartner sich mühe gibt, das man einzelne Seiten mit wenigen Klicks, sehr gut individualisieren kann.