Sie sind nicht angemeldet.

Lieber Besucher, herzlich willkommen bei: cms2day Forum - Community & Support rund ums cms2day. Falls dies Ihr erster Besuch auf dieser Seite ist, lesen Sie sich bitte die Hilfe durch. Dort wird Ihnen die Bedienung dieser Seite näher erläutert. Darüber hinaus sollten Sie sich registrieren, um alle Funktionen dieser Seite nutzen zu können. Benutzen Sie das Registrierungsformular, um sich zu registrieren oder informieren Sie sich ausführlich über den Registrierungsvorgang. Falls Sie sich bereits zu einem früheren Zeitpunkt registriert haben, können Sie sich hier anmelden.

djknuffel

Moderator

  • »djknuffel« ist männlich

Beiträge: 711

CMS Version: 4.0.1

Wohnort: Frankfurt a.M.

Paypal:

  • Nachricht senden

11

Mittwoch, 20. Oktober 2010, 11:57

ich hab damit gestern lokal noch ein wenig rumgespielt und kann nun php, js, css, xml und sql code verwenden,
hab dafür aber auch das TinyMCE Plugin nochmal ein wenig bearbeitet :D



es gibt aber vermutlich noch einfachere Wege, denn für das Resultat wie auf dem Bild zu sehen, hab ich locker bis zu 8 js Dateien einbinden müssen oO
akrell.de - Informationen zu meinen Modulen für das cms2day System und meine Arbeiten als Hobbyfotograf

Werbung

dot

Anfänger

  • »dot« ist männlich
  • »dot« ist der Autor dieses Themas

Beiträge: 32

Wohnort: Dornach

Beruf: Informatiker

  • Nachricht senden

12

Mittwoch, 20. Oktober 2010, 13:31

naja es lässt sich überlegen die brushes (wie sie ja heissen) statt hunderte zu laden schlicht alle in eines zu packen, ist halt abhängig wie die funktionen im javascript aufgerufen werden. oder aber die ausgabe des contents überprüfen solte der als editor daherkommen und nach gewünschter pre durchsuchen und somit die datei laden die gebraucht wird. man müsste es mal unter die lupe nehmen für den moment reichts mir, aber ich bin gerne dabei das teil auseinander zunehmen ;)

mfg


ps: djknuffel hast du msn, skype oder so? per pm ;)

Werbung

djknuffel

Moderator

  • »djknuffel« ist männlich

Beiträge: 711

CMS Version: 4.0.1

Wohnort: Frankfurt a.M.

Paypal:

  • Nachricht senden

13

Mittwoch, 20. Oktober 2010, 13:50

es gibt eine autoloader funktion mit der man die gewünschten brushes laden kann, das hab ich aber noch net zum laufen gebracht, kannst es ja selber versuchen, die grundlegenden dateien und änderungen am cms hast du ja schon getan, das plugin für den editor ist auf einige sprachen mehr ausgelegt als in meiner anleitung beschrieben, hab lokal schon hier eine weitere modifizierung, die sich auf die 5 sprachen beschränkt, die auf meinem letzten screen zu sehen sind :)

btw. arbeite ich gerade an einer variante die nicht so viele dateien erfordert, auf jquery basiert(was dem cms sowieso schon beigelegt is wenn ich nicht irre) und wahrscheinlich den selben zweck erfüllt :D

kannst mich in skype adden, den namen kannst ja mal raten bzw. is das sowieso hier im profil eingetragen, verfüge noch über eine handvoll weiterer messenger, nachfrage via pm ^ ^
akrell.de - Informationen zu meinen Modulen für das cms2day System und meine Arbeiten als Hobbyfotograf

Werbung

djknuffel

Moderator

  • »djknuffel« ist männlich

Beiträge: 711

CMS Version: 4.0.1

Wohnort: Frankfurt a.M.

Paypal:

  • Nachricht senden

14

Mittwoch, 20. Oktober 2010, 17:06

es gibt eine autoloader funktion mit der man die gewünschten brushes laden kann, das hab ich aber noch net zum laufen gebracht*schnipp*


mit ein bissl fuddeln und suchen via google, kann ich die zitierte Aussage korrigieren :D
Eine Anleitung dafür, die von der Website des Scriptes is nicht ganz korrekt, heute irgendwann in den Abendstunden :)
akrell.de - Informationen zu meinen Modulen für das cms2day System und meine Arbeiten als Hobbyfotograf

Werbung

djknuffel

Moderator

  • »djknuffel« ist männlich

Beiträge: 711

CMS Version: 4.0.1

Wohnort: Frankfurt a.M.

Paypal:

  • Nachricht senden

15

Mittwoch, 20. Oktober 2010, 19:03

so, wie schon angekündigt habe ich das ganze mit dem Autolader zum laufen bekommen, desweiteren habe ich noch eine Funktion geschrieben die Euch das einbinden der ganzen Dateien etc. in Eurer index.html abnimmt, Ihr müsst dann nur noch einen Schnipsel PHP Code einfügen und der rest läuft automatisch.

Der Übersicht halber füge ich hier nochmal den Part ein um den Editor im Backend mit einem Plugin auszustatten und füge am Ende des Beitrages nochmal das Plugin an da ich dort noch einige Änderungen vorgenommen habe.

Mit der folgenden Anleitung habt Ihr die Möglichkeit Code der Sprachen html, css, xml, php, javascript und sql in News od. Blogeinträgen bzw. in allen Bereichen wo der Editor zum Einsatz kommt, farblich hervorgehoben anzuzeigen, Bilder dazu gibt es auf der vorherigen Seite bzw. am Anfang dieser Seite.

Was wird benötigt?

- die Datei config.js vom TinyMCE Editor(findet Ihr im Verzeichnis "admin/data/tiny_mce/")
- die index.html von Eurem Layout(zu finden in "includes/templates/euerlayoutname/")
- die config.inc.php(zu finden in "includes")
- den SyntaxHighlighter(bitte selber von der Website downloaden: http://alexgorbatchev.com/SyntaxHighlighter/download/
- das Plugin für den TinyMCE Editor(siehe Anhang am Ende des Postings)

Installation Syntaxhighlighter

Ich habe den Syntaxhighlighter im Ordner "js" meines Templates abgelegt, wo ihr diese ablegt ist Eure Entscheidung, sollte aber im Template Ordner sein,.
Meine Ordnerstruktur sieht also so aus:

Quellcode

1
2
3
4
5
=> includes
==> templates
===> cms2day
====> js
=====> syntax


im Ordner "syntax" enthalten sind

Quellcode

1
2
3
4
5
6
7
=> compass (Ordner)
=> scripts (Ordner)
=> src (Ordner)
=> styles (Ordner)
=> index.html (Datei)
=> LPGL-License (Datei)
=> MIT License (Datei)


es muss an diesen Dateien nichts angepasst werden um das ganze Funktionsfähig zu bekommen, es kann aber, wer Ahnung hat, an den Styles gearbeitet werden, Standard wird ein Default Thema verwendet!

Öffne nun die config.inc.php und scroll bis zum Ende der Datei und füge noch vor dem "?>" ein

PHP-Quelltext

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
// Syntax Highlighter
// Durch diese Funktion, aufgerufen in der index.html des Templates, werden alle benötigten Dateien in der index.html eingebunden.
// $tpl -> name des templates(ordnername)
// $folder -> name des Ordners in dem Ihr die Dateien vom Syntaxhighlighter abgelegt habt ausgehend vom Templateverzeichnis
// Bsp: Die Files liegen im Ordner "test" als Unterverzeichnis von "js", dann ist der Wert für $folder "js/test"
function load_syntax_highlighting($tpl$folder) {
    global $settings;
    if($tpl != '' && $folder !='') {
        echo "<script type="text/javascript" src="".$settings['page_dir']."/includes/templates/".$tpl."/js/".$folder."/scripts/shCore.js"></script>\n";
        echo "<script type="text/javascript" src="".$settings['page_dir']."/includes/templates/".$tpl."/js/".$folder."/scripts/shAutoloader.js"></script>\n";
        echo "<link rel="stylesheet" type="text/css" href="".$settings['page_dir']."/includes/templates/".$tpl."/js/".$folder."/styles/shCore.css" title="screenprojection" />\n";
        echo "<link rel="stylesheet" type="text/css" href="".$settings['page_dir']."/includes/templates/".$tpl."/js/".$folder."/styles/shCoreDefault.css" title="screenprojection" />\n";
        echo "<script type="text/javascript">\n";
        echo "function path() {\n";
        echo "var args = arguments, result = [];\n";
        echo "for(var i = 0; i < args.length; i++) result.push(args[i].replace('@', '".$settings['page_dir']."/includes/templates/".$tpl."/js/".$folder."/scripts/'));\n";
        echo "return result;\n";
        echo "};\n\n";
        echo "$(document).ready(function(){\n";
        echo "SyntaxHighlighter.autoloader.apply(null, path('css @shBrushCss.js','js jscript javascript @shBrushJScript.js','php @shBrushPhp.js','text plain @shBrushPlain.js','sql @shBrushSql.js','xml xhtml xslt html @shBrushXml.js'));\n";
        echo "SyntaxHighlighter.all();\n";
        echo "});\n";
        echo "</script>\n";
    } else {
        echo "<!-- Fehler beim Laden der Dateien für Syntax Highlighting -->\n";
    }
}


öffne nun die index.html und füge vor dem "</head>" noch ein:

Quellcode

1
<?php load_syntax_highlighting('cms2day','js/syntax'); ?>


"cms2day" müsst Ihr gegen den Namen des Ordners von Eurem aktuell verwendeten Template austauschen
"js/syntax" müsst Ihr austauschen gegen den Pfad zu den Dateien vom Highlighter, ausgehend vom Templateverzeichnis

Installation Plugin TinyMCE

Die Zip Datei mit dem Plugin entpacken und den Ordner "codehighlighting" in den Ordner "admin/data/tiny_mce/plugins/" uploaden, dann die Datei "admin/data/tiny_mce/config.js" öffnen(Notepad, Notepad++ etc.) und suche

Quellcode

1
trim_span_elements : false,

füge darunter ein

Quellcode

1
remove_linebreaks : false,

suche nun nach

Quellcode

1
plugins : "fullscreen,insertdatetime,table,paste,advlink,advimage",

und ergänze am ende nach "advimage" aber noch vor dem ", um

Quellcode

1
,codehighlighting

suche weiter nach

Quellcode

1
theme_advanced_buttons3 : "link,unlink,|,anchor,|,image,|,code,|,table,|,charmap,|,insertdate,inserttime,|,sub,sup,|,removeformat,cleanup",

und ergänze zwischen | und ,code, noch mit

Quellcode

1
,codehighlighting


die config.js sollte nun komplett so aussehen

Quellcode

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
tinyMCE.init ({
	
	mode : "textareas",
	width : "658",
	height : "400",
	theme : "advanced",
	language : "de",
	
	convert_urls : false,
	relative_urls : false,
	remove_script_host : false,	
	verify_html : false,
	visual : false,
	fix_content_duplication : false,
	trim_span_elements : false,
    remove_linebreaks : false, 
	plugins : "fullscreen,insertdatetime,table,paste,advlink,advimage,codehighlighting",
	
	content_css : "../data/css/tiny.css",
	
	theme_advanced_resize_horizontal : false,	
	
	theme_advanced_toolbar_location : "top",
	theme_advanced_toolbar_align : "left",
	theme_advanced_blockformats : "h1,h2,h3,h4,h5,h6",
	
	theme_advanced_buttons1 : "formatselect,fontselect,fontsizeselect,|,forecolor,|,backcolor,|,hr,|,fullscreen,visualaid",
	theme_advanced_buttons2 : "undo,redo,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,paste,pastetext,pasteword,|,bullist,numlist,|,outdent,indent",
	theme_advanced_buttons3 : "link,unlink,|,anchor,|,image,|,codehighlighting,code,|,table,|,charmap,|,insertdate,inserttime,|,sub,sup,|,removeformat,cleanup",
	
	fullscreen_new_window : "true",
	theme_visualaid : "false",	
	theme_advanced_resizing : "true",	
	theme_advanced_statusbar_location : "bottom",
	
	fullscreen_settings : {
		
		theme_advanced_path_location : "top"
	
	}
 
});


nachdem nu alles hochgeladen wurde solltet Ihr im Backend, da wo der Editor zum Einsatz kommt, ein neuen Button finden(rot eingerahmt):



bei Klick auf diesen Button gibt es ein neues Fenster wo Ihr dann den Code einfügen könnt, über das Dropdown sind die Sprachen auswählbar, die auch automatisch geladen werden.
HINWEIS FÜR PHP CODE:
Der Code kommt da ohne die php Tags rein, falls Ihr die nämlich mit eintragt, dann werden die rausgefiltert...




Es ist nicht möglich, bereits eingefügten Code auf den selben Wege zu editieren wie Ihr den eingefügt habt, Ihr müsst dazu den Button "HTML" klicken und könnt dann zwischen so einem "<pre>" Tag Euren Code einfügen



Have Fun :)
»djknuffel« hat folgende Datei angehängt:
akrell.de - Informationen zu meinen Modulen für das cms2day System und meine Arbeiten als Hobbyfotograf

Werbung

16

Montag, 1. November 2010, 15:16

Genau das was ich gesucht habe, doch leider klappt das nicht!
Es ist alles richtig hochgeladen und eingestellt.

Aber folgendes Problem:
Wenn der Code eingetragen wird und man auf Absenden klickt, dann bleibt der Code nicht erhalten!

Werbung

djknuffel

Moderator

  • »djknuffel« ist männlich

Beiträge: 711

CMS Version: 4.0.1

Wohnort: Frankfurt a.M.

Paypal:

  • Nachricht senden

17

Montag, 1. November 2010, 17:05

wie sieht denn dann der quelltext aus bzw. auch den Hinweis aus meinem Beitrag beachtet:

Zitat

HINWEIS FÜR PHP CODE:
Der Code kommt da ohne die php Tags rein, falls Ihr die nämlich mit eintragt, dann werden die rausgefiltert...
akrell.de - Informationen zu meinen Modulen für das cms2day System und meine Arbeiten als Hobbyfotograf

Werbung

18

Montag, 29. November 2010, 21:54

Ja habe ich drauf geachtet.

<?php

echo "Hallo";

?>

geht nicht!

Und nur

echo "Hallo";

leider auch nicht!

Das wäre das Addon überhaupt!

Werbung

19

Samstag, 4. Dezember 2010, 22:34

Für den backend-Bereich hab ich auch einen Code-Editor mit Highlightfunktion eingebaut.
Der ist richtig Nett. Der Codeeditor erlaubt ein Bearbeiten des Codes mit Real-Highlighting (PHP, HTML, SQL,....).

Falls den auch jemand haben möchte, hier ist der Link:http://www.gerd-tentler.de/tools/codeedit/

Wenn ihr diesen nicht einbauen könnt, so gebt mir bescheid, ich erstell dann dementsprechend ein vernünftiges Addon für den Backendbereich.

Werbung

djknuffel

Moderator

  • »djknuffel« ist männlich

Beiträge: 711

CMS Version: 4.0.1

Wohnort: Frankfurt a.M.

Paypal:

  • Nachricht senden

20

Sonntag, 5. Dezember 2010, 00:57

@Bizzi
wenn ich das richtig sehe verwendet Dein Script die Prototype Bibiliothek?
Sollte man ggf. mit erwähnen denn ich bin mir jetzt nicht sicher ob diese Bibliothek im cms2day schon mit dabei ist wie jquery oder ob man die noch zusätzlich einbinden muss :)
akrell.de - Informationen zu meinen Modulen für das cms2day System und meine Arbeiten als Hobbyfotograf

Werbung