Hallo, lieber Forum Benutzer. Wir haben in letzter Zeit festgestellt, dass die Kommunikation via https://slack.com/ viel schneller und zielführender ist als ein Beitrag im Forum. Aufgrund der neuen Möglichkeiten der Kommunikation ist das Forum ein wenig eingeschlafen und weniger Nutzer benutzen das Forum aktiv (trotzdem lohnt es sich evtl. hier nach Lösungen zu suchen oder seine Frage zu stellen).

Wir empfehlen bei Fragen/Problemen aktuell die Frage (zusätzlich) im Slack zu stellen. Dort sind viele kompetente REDAXO Benutzer aktiv und beantworten gerne (Anfänger)Fragen.

Selbst einladen kannst Du dich hier: http://redaxo.org/slack/

Slack wird von uns sehr intensiv und meistens "rund um die Uhr" benutzt :-)
Daimonion
Beiträge: 38
Registriert: 15. Okt 2015, 21:00

Colorpicker um Farbe auf einer Seite einzustellen

15. Okt 2015, 21:06

Hallo

Ich bin ziemlich neu in Redaxo, aber finde das Konzept genial. Bisher habe ich entweder mit meinen eigenen CMS Systemen gearbeitet oder auf komplette Systeme wie Wordpress, Serendipity, Websitebaker, Joomla etc. gesetzt.

Gerade aber für kleine individuelle Seiten ist Redaxo Gold wert.

Nun bin ich dabei eine recht einfache Seite zu designen und hab im Hintergrund Redaxo laufen.
Als Eigenschaft dieser kompletten Webseite soll es so sein, dass auf jder Unterseite der Hintergrund eine andere Farbe bekommt. Implementieren kann ich das sehr einfach via CSS. Kein Problem soweit. Der Webseitenbetreiber will diesen farbigen Hintergrund nun aber selbst im Redaxo Backend einstellen. Nichts leichter als das hab ich ihm zugesichert. ;)
Ich dachte mir nun wäre es doch einfach ein Modul zu nehmen, wo als Eingabe ein Colorpicker implementiert ist und als Ausgabe implementiere ich den entsprechenden CSS Header für die HTML Seite. Da ich das Rad nicht neu erfinden wollte dachte ich ich frage mal bei euch bzw. erst bei Google nach ob es so was für Redaxo schon gibt.

Leider habe ich bisher noch nichts gefunden. Hab ich es nur übersehen oder gibt es das wirklich noch nicht?

Danke schon mal im Voraus für die Hilfe
Grüße
Daimonion

Benutzeravatar
Thomas.Blum
Entwickler
Beiträge: 5063
Registriert: 24. Aug 2004, 22:11
Wohnort: Dresden
Kontaktdaten: Website

Re: Colorpicker um Farbe auf einer Seite einzustellen

16. Okt 2015, 08:25

Hej,

das ist recht einfach zu lösen.

In der Moduleingabe einfach ein Textfeld mit einer CSS-Class (colorpicker) vergeben.

Ich nutze für solche Fälle diesen Colorpicker
https://bgrins.github.io/spectrum/

Dann noch die CSS und JS-Dateien einbinden und die Class aufrufen

Code: Alles auswählen

<link rel="stylesheet" type="text/css" href="/dir/spectrum.css" />
<script type="text/javascript" src="/dir/spectrum.js"></script>
<script type="text/javascript">jQuery(".colorpicker input").spectrum({ showInput: true,  preferredFormat: "hex", clickoutFiresChange: true, showPalette: false, chooseText: "Farbe wählen", cancelText: "abbrechen" });</script>
Fertig

vg Thomas

Daimonion
Beiträge: 38
Registriert: 15. Okt 2015, 21:00

Re: Colorpicker um Farbe auf einer Seite einzustellen

16. Okt 2015, 10:43

Danke Thomas für die Hilfe.

Ich werde das heute Abend mal einbauen. Evtl. muss ich mich dann nochmal melden. ;)

Grüße
Daimonion

Daimonion
Beiträge: 38
Registriert: 15. Okt 2015, 21:00

Re: Colorpicker um Farbe auf einer Seite einzustellen

16. Okt 2015, 22:01

So, jetzt muss ich mich doch nochmal melden. Das Einbinden des Colorpickers hat soweit geklappt. Die Ausgabe ist jetzt aber doch schwieriger als gedacht, da ich ja an der Stelle wo ich die einzelnen Module definiere, schon das Template definiert habe.

Gibt es nun eine Möglichkeit Die Modulausgabe so in das Template einzubauen, dass die Farbe im Body Tag mittels style="background-color:#000000;" verändert werden kann?
Kann ich eine Variable in einem Modul so speichern das ich im template mittels $this->value("color") zugreifen kann?

Ich hoffe ihr versteht was ich meine.

Benutzeravatar
Cheffchen
Beiträge: 1808
Registriert: 3. Mär 2009, 13:51
Wohnort: Berlin
Kontaktdaten: Website

Re: Colorpicker um Farbe auf einer Seite einzustellen

16. Okt 2015, 22:58

Hallo,

ich häte da eine Idee auch wenn bestimmt nicht nicht beste aber geht zumindest, vielleicht kommt ja noch was besseres.

gebe die stellen ein eindeutigen platzhalter wo das color einfügen möchtest im template zb "DASistMEINEclass"
jetzt im modul das am ende

Code: Alles auswählen

<?php
$meintext = '#ff00ff';
$suchtext = 'hiermeinsuchtext'; #wenn dieses stück schon im header ist wird meintext nicht eingefügt
rex_register_extension('OUTPUT_FILTER', create_function('$params', 'if (strpos($params[\'subject\'], \''.$suchtext.'\')===false) return str_replace(\'DASistMEINEclass\',\''.$meintext.'\',$params[\'subject\']);')); 
?>
Cheffchen

Ingo
Beiträge: 782
Registriert: 24. Jun 2010, 00:34

Re: Colorpicker um Farbe auf einer Seite einzustellen

17. Okt 2015, 12:32

a) sowas gehört nicht ins modul sondern in die artikelmetas
b) kannst du einen <style></style> block auch mitten im body ausgeben. ist zwar nicht valide, wird aber vom browser angenommen

Daimonion
Beiträge: 38
Registriert: 15. Okt 2015, 21:00

Re: Colorpicker um Farbe auf einer Seite einzustellen

17. Okt 2015, 14:37

Danke für die Antworten.

Ingo, kann ich ein zusätzliches Feld in die Metadaten einfügen? Wäre ja eigentlich genau an der richtigen Stelle.

Einen style Tag im Body würde ich erst machen wenn es nichts anderes mehr gibt.

Cheffchen

Deine Idee geht genau so gut. ;) Muss ich mal schauen was ich da umsetze.

Daimonion
Beiträge: 38
Registriert: 15. Okt 2015, 21:00

Re: Colorpicker um Farbe auf einer Seite einzustellen

19. Okt 2015, 21:41

Hi Leute.

Ich liebe Redaxo.

Aktuell kann ich die Farbe in den Body tag laden indem ich diese nicht innerhalb eines Modules implementiere, sondern ich hab mir ein neues Metadatenfeld gemacht. Momentan schreibe ich nun die Farbe da in HEX rein. Mal schauen, wenn die Webseite soweit fertig ist, werde ich mich mal dran machen und da den Colorpicker reinbauen.

Danke euch allen mal für die Hilfe!

Grüße Daimonion

Benutzeravatar
RexDude
Beiträge: 2540
Registriert: 22. Apr 2010, 11:24

Re: Colorpicker um Farbe auf einer Seite einzustellen

20. Okt 2015, 00:25

Hi,

im Backend Utilities > Colorizer Plugin gibt es einen mitgelieferten Colorpicker. Ich habe gerade das Plugin umgeschrieben, so dass man den Colorpicker von überall im Backend über die CSS Klasse "rex-colorpicker" nutzen kann. Download der aktuellen (noch inofiziellen) Version nur über GitHub: https://github.com/RexDude/be_utilities
(über Download Zip Button)

Daimonion
Beiträge: 38
Registriert: 15. Okt 2015, 21:00

Re: Colorpicker um Farbe auf einer Seite einzustellen

16. Mai 2016, 21:01

So, hallo

Was lange währt wird gut..

Ich habe den Colorpicker nun mal für eine Moduleingabe benutzt und soweit lädt er auch korrekt. Farben werden angezeigt und nun bin ich am schauen wie ich den Hex String in eine Redaxovariable bekomme:

Code: Alles auswählen

<script src='../template/spectrum.js'></script>
<link rel='stylesheet' href='../template/spectrum.css' />
    <div>
        <div style="float:left;width:180px;font-weight:bold;font-size:14px;vertical-align:center;">Farbe Überschrift:</div>
        <div>
            <input id="colorpicker" type="text" name="VALUE[5]" value="REX_HTML_VALUE[5]" />
            <script type="text/javascript">jQuery("#colorpicker").spectrum({
                                showPaletteOnly: true,
                                togglePaletteOnly: true,
                                togglePaletteMoreText: 'zeige mehr',
                                togglePaletteLessText: 'zeige weniger',
                                color: 'blue',
                                showInput: true,
                                preferredFormat: 'hex3',
                                clickoutFiresChange: true,
                                palette: [
                                ["#000","#444","#666","#999","#ccc","#eee","#f3f3f3","#fff"],
                                ["#f00","#f90","#ff0","#0f0","#0ff","#00f","#90f","#f0f"],
                                ["#f4cccc","#fce5cd","#fff2cc","#d9ead3","#d0e0e3","#cfe2f3","#d9d2e9","#ead1dc"],
                                ["#ea9999","#f9cb9c","#ffe599","#b6d7a8","#a2c4c9","#9fc5e8","#b4a7d6","#d5a6bd"],
                                ["#e06666","#f6b26b","#ffd966","#93c47d","#76a5af","#6fa8dc","#8e7cc3","#c27ba0"],
                                ["#c00","#e69138","#f1c232","#6aa84f","#45818e","#3d85c6","#674ea7","#a64d79"],
                                ["#900","#b45f06","#bf9000","#38761d","#134f5c","#0b5394","#351c75","#741b47"],
                                ["#600","#783f04","#7f6000","#274e13","#0c343d","#073763","#20124d","#4c1130"]]
                                });
            </script>
        </div>
    </div>
    <div style="float:clear;margin-bottom:15px;"></div>
Ich hab da noch meine Probleme damit wo ich die Change Funktion hinstecken könnte, so dass der HexWert in den REX_HTML_VALUE[5] geladen werden kann.

https://bgrins.github.io/spectrum/#events-change

Zurück zu „Module/Aktionen [R4]“