4images Forum & Community

4images Modifications / Modifikationen => Mods & Plugins (Requests & Discussions) => Topic started by: rinaldos on June 18, 2009, 07:22:42 PM



Title: [TUT] TINYMCE in 4images integrieren.
Post by: rinaldos on June 18, 2009, 07:22:42 PM
Mit diesem Tutorial ist es möglich TINYMCE in 4images zu integrieren.
Wer auf seiner Homepage keine JAVA Plugins einbinden möchte, kann dieses Tutorial überlesen. Für die Benutzung muss der User JAVA aktiviert haben. Ist java nicht aktiviert, wird der TINYMCE nicht angezeigt. Texteingaben sind weiterhin ohne Probleme möglich.

Vorteile:
- Einfache Integration von SMILEYS
- Schnell unf komfortable den text formatieren
- unabhängig vom BBCODE
- flexibel in den zusätzlichen Funktionen

Nachteil:
- Java MUSS aktiviert sein
- konnte bisher keine weiteren finden

Hinweise:
Cut & Paste: http://www.4homepages.de/forum/index.php?topic=25098.msg138580#msg138580

DEMO: http://4images_1.rinaldos.homeip.net/details.php?image_id=6

Folgende Schritte sind dafür notwendig.

Auf folgender Webseite das Mainpackage herunterladen
http://tinymce.moxiecode.com/download.php

Nachdem Ihr dieses entpackt habt findet Ihr darin ein Verzeichnis tiny_mce. Dieses kopiert Ihr in das 4images ROOT (Hauptverzeichnis)
Die Struktur sollte danach so aussehen
/tiny_mce
/tiny_mce/langs
/tiny_mce/plugins
/tiny_mce/themes
/tiny_mce/utils
usw....

Nun müssen die Templates geändert werden, wo der TINYMCE aktiv sein soll.
So zum Beispiel comment_form.html, member_editcomment.html, member_editimage.html etc.....
In all den Dateien findet Ihr folgende Zeilen
<tr>
 <td class="row2" valign="top">&nbsp;</td>
 <td class="row2">{bbcode}</td>
</tr>
diese können nun bedenklos gelöscht werden. Da der BBCODE nun von TINY übernommen wird. Wer die Zeilen nicht löschen mag, kann diese auch wie folgt auskommentieren

1
2
3
4
<!-- <tr>
 <td class="row2" valign="top">&nbsp;</td>
 <td class="row2">{bbcode}</td>
</tr>-->
Danach fügen wir nun am Anfang der Dateien (sofern ein {header} vorhanden ist, dann darunter, folgenden Code ein.

<script type="text/javascript" src="{SCRIPT_URL}tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
mode : "textareas",
theme : "advanced",
    plugins : "safari,emotions",
theme_advanced_buttons1 : "bold,italic,underline,separator,strikethrough,justifyleft,justifycenter,justifyright,justifyfull,bullist,numlist,undo,redo,emotions",
theme_advanced_buttons2 : "",
theme_advanced_buttons3 : "",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_statusbar_location : "bottom"
});
</script>

Eine ALL OPTIONS MÖGLICHKEIT sieht so aus.
Einige zusätzliche Module sind kostenpflichtig und in dem Standard Download nicht enthalten, daher rate ich von dem unteren Beispiel ab. Probiert einfach aus, was bei Euch funktioniert!!

<script type="text/javascript" src="<your installation path>/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
// General options
mode : "textareas",
theme : "advanced",
plugins : "safari,spellchecker,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,imagemanager,filemanager",

// Theme options
theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,styleselect,formatselect,fontselect,fontsizeselect",
theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen",
theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,spellchecker,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,blockquote,pagebreak,|,insertfile,insertimage",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_statusbar_location : "bottom",
theme_advanced_resizing : true,

// Example content CSS (should be your site CSS)
content_css : "css/example.css",

// Drop lists for link/image/media/template dialogs
template_external_list_url : "js/template_list.js",
external_link_list_url : "js/link_list.js",
external_image_list_url : "js/image_list.js",
media_external_list_url : "js/media_list.js",

// Replace values for the template plugin
template_replace_values : {
username : "Some User",
staffid : "991234"
}
});
</script>

Ihr könnt auch ein den Editor nach belieben anpassen. Beispiele und Codeintegrationen findet Ihr hier:
http://tinymce.moxiecode.com/examples/full.php

Um überflüssige Zeilenmbrüche die nach der Installation des TINYMCE entstehen müsst Ihr folgendes abändern.

findet in /include/functions.php folgenden Code
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
function format_text($text, $html = 0, $word_wrap = 0, $bbcode = 0, $bbcode_img = 0) {
  if ($word_wrap && $text != "") {
    $text = preg_replace("/([^\n\r ?&\.\/<>\"\\-]{".$word_wrap."})/i", " \\1\n", $text);
  }

  if ($html == 0 || $html == 2) {
    $text = safe_htmlspecialchars($text);
  }

  // Replace { to prevent parsing in templates
  global $site_template;
  $text = preg_replace(
    '='.preg_quote($site_template->start).'([A-Z0-9_]+)'.preg_quote($site_template->end).'=Usi',
    '&#123;\1&#125;',
    $text
  );

  if ($html !== 2) {
    $text = nl2br(trim($text));
    $text = replace_url($text);
  }

ersetzt den Code  mit
function nl2br_skip_html($text){
    // remove any carriage returns (mysql)
    $text = str_replace("\r", '', $text);
    // replace any newlines that aren't preceded by a > with a <br />
    $text = preg_replace('/(?<!>)\n/', "<br />\n", $text);
    return $text;
}

function format_text($text, $html = 0, $word_wrap = 0, $bbcode = 0, $bbcode_img = 0) {
  if ($word_wrap && $text != "") {
      $text = preg_replace("/([^\n\r ?&\.\/<>\"\\-]{".$word_wrap."})/i", " \\1\n", $text);
  }

/*  if ($html == 0 || $html == 2) {
      $text = safe_htmlspecialchars($text);
  }*/

  // Replace { to prevent parsing in templates
  global $site_template;
  $text = preg_replace(
    '='.preg_quote($site_template->start).'([A-Z0-9_]+)'.preg_quote($site_template->end).'=Usi',
    '&#123;\1&#125;',
    $text
  );

  if ($html !== 2) {
    $text = nl2br_skip_html(trim($text));
    $text = replace_url($text);
  }

Damit wird erreicht, dass die Zeilenumbrüche für den TINYMCE und für den REST des Systems entsprechend formatiert werden.

Es macht nur SINN den TINYMCE dort einzusetzen, wo Text formatiert werden soll. In den Textareas, wo unformatierter Text in die Datenbank eingefügt werden soll, insbesondere bei den Keywords, sollte der TINYMCE nicht eingebunden werden.
Um nun explizit den TINYMCE für die Bildbeschreibung einzusetzen, und nicht für die Suchwörter, versuche ich an dem folgenden Beispiel zu erläutern.

Als Beispiel nehme ich die Datei member_editimage.html

Dort seht Ihr folgenden Code:
          <tr>
            <td class="row1" valign="top"><b>{lang_description}</b></td>
            <td class="row1">
              <textarea name="image_description" cols="30" rows="10" wrap="virtual" class="textarea">{image_description}</textarea>
            </td>
          </tr>
          <tr>
            <td class="row2" valign="top"><b>{lang_keywords}</b></td>
            <td class="row2">
              <textarea name="image_keywords" cols="30" rows="10" wrap="virtual" class="textarea">{image_keywords}</textarea>
            </td>
          </tr>

Mit meiner Integration wäre nun der TINYMCE für beide TEXTAREAS aktiv. Wir wollen aber den TINYMCE nur in der TEXTAREA aktiv nutzen welche auch für die Bildbeschreibung zuständig ist.

Dafür müssen wir dem TINYMCE eine eindeutige Zuordnung nennen. Man kann dieses hier im Original nachlesen:
http://tinymce.moxiecode.com/examples/example_04.php

Wir nennen nun unseren TINYMCE "mceAdvanced". Dafür fügen wir in diesem Abschnitt (funktioniert nur im theme: "advanced")
mode : "textareas",
theme : "advanced",
    plugins : "safari,emotions",

unseren Namen ein:
Das ganze sieht dann so aus:
mode : "textareas",
theme : "advanced",
editor_selector : "mceAdvanced",
    plugins : "safari,emotions",

In unserem Template müssen wir auch die Zuordnung machen, damit der TINY weiss wofür er zuständig sein soll. Dazu suchen wir uns die "textarea" für die Beschreibung:

<textarea name="image_description" cols="30" rows="10" wrap="virtual" class="textarea">{image_description}</textarea>

Hier definieren wir die Zuordnung über die CSS Definition class: "class="textarea"
Die Zeile ändern wir wie folgt ab:

<textarea name="image_description" cols="30" rows="10" wrap="virtual" class="mceAdvanced">{image_description}</textarea>

Das Ergebnis ist, das nur dort der TINYMCE aktiv die Formatierung übernimmt. Ich habe auf meiner Beispielseite zwei Felder für die Kommentare gemacht. Dort seht Ihr den Unterschied direkt. Das oberste Feld ist mit TINY, das untere nicht!
http://4images_1.rinaldos.homeip.net/details.php?image_id=6

Folgende Browser werden unterstützt:
http://wiki.moxiecode.com/index.php/TinyMCE:Compatibility

Hier steht zwar, das Safari 4.x (MAC OSX) nicht unterstützt wird. Da ich meistens mit diesem Safari im Netz unterwegs bin, weiss ich das der 4.0 und 4.01 für MAC OSX unterstützt wird.

Weiterer Vorteil, in der Textbox wo der Text eingegeben wird, ist die rechte Maustaste (kopieren und einfügen) aktiv.

Ich kann nur Hilfestellung für die integration geben, einen Support für TINYMCE findet ihr auf der dortigen Homepage.


Gruß

Ingo


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: Sumale.my on June 18, 2009, 08:00:34 PM
GEIL!
ENDLICH!!!!!!!!!  8O

Schade das man dir nicht via einen Thank-o-Mat danken kann oder dir User-Punkte geben kann!!!!!!

HAMMER!

Edit://
Aber es wird nichts übernommen was ich dort hineinschreibe!?... hast eine PN


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: Sebas Bonito on July 11, 2009, 09:35:37 PM
Super!

Können eigentlich die "alten" Smileys vom BB-Code trotzdem eingefügt und weiter verwendet werden?
Also werden sie übernommen und bei der Ausgabe umberechnet (txt-pic)?


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: rinaldos on July 11, 2009, 09:40:33 PM
@Schnick und Schnack
Tiny kann zwar BBCODE, und es ist sicherlich auch möglich, das der alte BBCODE behalten wird. Der Nachteil ist, das dadurch noch ein paar Modifikationen für nötig sind. Ich werde mal schauen, ob ich das noch mit umsetze. Ich finde den Tiny eigentlich als alternative, und nicht als Addon. Aber ich schaue mal :-)

LG
ingo


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: Sebas Bonito on July 11, 2009, 09:44:53 PM
@Schnick und Schnack
Tiny kann zwar BBCODE, und es ist sicherlich auch möglich, das der alte BBCODE behalten wird. Der Nachteil ist, das dadurch noch ein paar Modifikationen für nötig sind. Ich werde mal schauen, ob ich das noch mit umsetze. Ich finde den Tiny eigentlich als alternative, und nicht als Addon. Aber ich schaue mal :-)

LG
ingo
Hey Ingo,
danke für die Antwort!
Im Grunde genommen geht es (bei mir) nur um die Smileys. Aber die neuen Smiley-Grafiken kann man ja sicher
auch durch die alten ersetzen. Und da man den BBCode nicht abschalten braucht, gehen die alten "Tags" nicht
weg (also z.B. in den comments)... und die alten Smileys (im BBCode) bleiben bestehen. Richtig, oder?
Danke, Sebas


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: rinaldos on July 11, 2009, 09:49:39 PM
In der Standardversion hat 4images doch keine smileys, oder? Da ich ja keinen Code entfernt habe, sollten die anderen eigentlich drinne bleiben.... So der Plan ....


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: Sebas Bonito on July 11, 2009, 09:51:40 PM
In der Standardversion hat 4images doch keine smileys, oder? Da ich ja keinen Code entfernt habe, sollten die anderen eigentlich drinne bleiben.... So der Plan ....
öhhhhhhhhhh  8O KANN gut sein, dass ich das mal ergänzt habe. Allerdings alles im Rahmen des BB-Codes.
Also, brauchste erstmal nicht überarbeiten, macht ja eigentlich keinen Sinn. Ich versuche, das ganze mal zu übertragen  :)


Update: Also bei mir läuft das sehr gut... ähh, nein doch nicht!  :lol:
Ansich läuft's gut, doch mit der [MOD] Last comments v1.2.0  (http://www.4homepages.de/forum/index.php?topic=15701.0) gibt's arge Probleme. Und das sieht dann z.B. so aus (wenn man genau hinschaut, erkennt man das Problem):
1
2
<i><p><img title="Foot in mouth" src="tiny_mce/plugins/emotions/img/...</i>
</td><td width="25%" valign="top">

DENN: Auf der Startseite kann man so die neuesten Kommentare anzeigen lassen, und mit...
1
$text_len = 200; //max lenght of the text to show (bbcode and html are counted too)
...kann man (wie's schon da steht) die Textlänge verändern. Und das Problem steht auch schon da:
HTML-Code wird mitberechnet. Und so kam es, dass ich mir gerad die komplette Startseite (layouttechnisch)
zerschossen habe, weil mitten im HTML-Tag Schluss mit Lustig gemacht wurde.

Lösungsansatz: HTML-Code aus den Comments in der MOD entfernen, doch bloß wie?
Ich hab's schon probiert, im veränderten Part der index.php nach
1
2
3
4
 if (strlen($text) > $text_len)
  {
    $text = substr($text, 0, $text_len)." ...";
  }
...den $text zu bearbeiten (also preg_replace, und das ganze Gedöns, doch entweder ist es die falsche
Variable für den Kommentar-Textteil, oder ich mach gravierend was falsch). Jegliche Versuche sind bisher
gescheitert. Am sinnvollsten wäre es, sämtliche Tags (wie hier beschrieben (http://de3.php.net/manual/de/function.strip-tags.php#80429)) zu entfernen; zumindest
für die Startseite, wo der Textteil gekürzt wird.

Hat jemand ne Idee? Oder Du Rinaldos? Wie krieg ich die HTML-Tags weg?

Update 2:

Ich hab's selbst raus (ich hoffe, das war richtig?). Ich war schon dicht dran, ich hab diesen Textteil
1
2
3
4
 if (strlen($text) > $text_len)
  {
    $text = substr($text, 0, $text_len)." ...";
  }
folgendermaßen ergänzt:
1
2
3
4
5
6
7
8
if (strlen($text) > 0)
  {
$text = strip_tags($text);
  } 
  if (strlen($text) > $text_len)
  {
    $text = substr($text, 0, $text_len)."...";
  }
So läuft das....


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: Sebas Bonito on July 14, 2009, 01:38:32 PM
Ich würde übrigens jedem raten, das Plugin New SimplePaste (http://tinymce.moxiecode.com/punbb/viewtopic.php?id=10409) runterzuladen und zu installieren.

In die Textarea kann man nämlich kompletten HTML-Code (via Strg+V oder Contextmenü 'Einfügen') einfügen; im schlimmsten Falle zerschießt euch das euer Layout. Mit diesem kleinen Plugin wird sämtliches "einfügen" als Plaintext gemacht, d.h. reiner/unformatierter Text. Egal ob per Tastenkürzel eingefügt, oder über das Contextmenü. So kann auch nur DIE Formatierung vorgenommen werden, die Du auch anbietest (z.B. Fettdruck, Farben etc.), und keine weiteren.

1. Den Download (http://www.bolhoed.net/simplepaste-1.15.zip) entpacken
2. Den darin enthaltenen Ordner "simplepaste" in den Plugin-Ordner von TinyMCE verschieben.
3. Bei "tinyMCE.init" müsst ihr nun noch den Eintrag "simplepaste" ergänzen, das sieht dann z.B. folgendermaßen aus:
1
2
3
4
5
6
7
8
<script type="text/javascript" src="{SCRIPT_URL}tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
mode : "textareas",
theme : "advanced",
editor_selector : "mceAdvanced",
plugins : "safari,emotions,simplepaste,spellchecker,inlinepopups,advimagescale",
...............

Das war's auch schon!  :D

Der einzige Haken (generell an TinyMce) ist, dass es Javascript voraussetzt. Eigentlich hat das fast jeder aktiviert, und das ganze läuft unter Firefox, IE, Opera und Safari. Doch wenn JavaScript ausgeschaltet ist, kann jeglicher HTML-Code eingefügt werden, weil die Textarea dann einfach nur noch eine Textarea ist. Vielleicht gibt es da eine Möglichkeit, nur bestimmte HTML-Tags zu erlauben, die im Einklang mit TinyMCE stehen.


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: rinaldos on July 14, 2009, 02:03:47 PM
Danke für Deinen Hinweis.
Das ist sicherlich eine Sinnvolle Ergänzung zum Tiny MCE. Ich setzte mitlerweile den Tiny für alles auf meiner HP ein. Bin mit den Funktionen die dieser Editor bietet sehr zufrieden.
Werde Deinen Hinweis mal in den ersten POSt mit einfügen :-)

Gruß
ingo


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: Sebas Bonito on July 16, 2009, 04:06:20 AM
Danke für Deinen Hinweis.
Das ist sicherlich eine Sinnvolle Ergänzung zum Tiny MCE. Ich setzte mitlerweile den Tiny für alles auf meiner HP ein. Bin mit den Funktionen die dieser Editor bietet sehr zufrieden.
Werde Deinen Hinweis mal in den ersten POSt mit einfügen :-)
Gruß
ingo

Ja klar gerne  :)

Ich hab noch zwei weitere Vorschläge, die meines Erachtens sehr sinnvoll bei 4images sind. Zum einen, die Option, dass Bilder vom User nicht verzerrt, verkleinert oder vergrößert werden können (auch die Smileys sind davon betroffen), und zum anderen, die Link-Funktion durch eine Option zu ergänzen, die die Links nicht zu relativen Pfaden (leider automatisch) konvertiert.


Das letztere ist recht einfach, von daher zu erst  :lol:
Damit Links nicht falsch konvertiert werden, und so belassen werden, wie sie eingegeben wurden, die Option...
1
convert_urls : false,
...irgendwo in die tinyMCE.init einsetzen
(falls es die letzte Option vor }); ist, dann das Komma weg)


Die erste Sache ist allerdings auch recht einfach zu implementieren.
Man benötigt das Plugin advimagescale (http://code.google.com/p/tinymce-plugin-advimagescale/), damit eingefügte Smileys oder Bilder nicht bearbeitet werden können.

1. Die editor_plugin_src.js (http://tinymce-plugin-advimagescale.googlecode.com/svn/trunk/editor_plugin_src.js) downloaden
2. und sie nach tiny_mce/plugins/advimagescale kopieren (letzteren Ordner neu erstellen).
3. Nun bei der Plugin-Auflistung in der tinyMCE.init das ganze mit advimagescale ergänzen. Das könnte so aussehen:
1
plugins : "safari,emotions,simplepaste,spellchecker,inlinepopups,advimagescale",
4. Nun als Option noch folgenden Wert setzen:
1
advimagescale_noresize_all: true,
(falls letzte Option, dann natürlich das Komma weg)

...hochladen. Fertig!  8)


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: ivan on July 18, 2009, 04:35:45 PM
Hi Ingo,
den obigen Code findet man nicht in 1.7.6 oder 1.7.7

Das ist der Original Code... vielleicht war es ein Kopierfehler
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
function format_text($text, $html = 0, $word_wrap = 0, $bbcode = 0, $bbcode_img = 0) {
  if ($word_wrap && $text != "") {
    $text = preg_replace("/([^\n\r ?&\.\/<>\"\\-]{".$word_wrap."})/i", " \\1\n", $text);
  }

  if ($html == 0 || $html == 2) {
    $text = safe_htmlspecialchars($text);
  }

  // Replace { to prevent parsing in templates
  global $site_template;
  $text = preg_replace(
    '='.preg_quote($site_template->start).'([A-Z0-9_]+)'.preg_quote($site_template->end).'=Usi',
    '&#123;\1&#125;',
    $text
  );

  if ($html !== 2) {
    $text = nl2br(trim($text));
    $text = replace_url($text);
  }


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: rinaldos on July 18, 2009, 04:48:38 PM
@IVAN,
danke für deinen Hinweis. Ich habe nun dreimal den POSt editiert und mit verschiedenen Browsern diesen Abschnitt neu eingefügt. Als letztes mit dem [ code ] TAG. Damit scheint es zu funktionieren. :-)

Gruß
Ingo


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: ivan on July 18, 2009, 04:50:51 PM
ist komisch dass es bei Dir nicht sauber funktioniert

Na ja, hauptsache es ist drin ;)


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: Sebas Bonito on September 02, 2009, 11:39:51 AM
Version 3.2.6 ist seit einigen Tagen draußen:

Quote  [Expand]
Version 3.2.6 (2009-08-19)
   Added new wordcount plugin, this will display the number of typed words as you write. Contributed by Andrew Ozz.
   Added new getNext and getPrev methods to DOM utils. These will return the first matching sibling.
   Fixed bug where it was impossible to place the caret after a table on Gecko. It will now add a paragraph after tables.
   Fixed bug where inline dialogs would fail if used in a window opened using a showModalDialog. Patch contributed by Derek Britt.
   Fixed bug where IE could sometimes render a unknown runtime error on invalid input HTML.
   Fixed bug where some incorrectly placed tables wouldn't be moved outside the paragraphs on IE.
   Fixed bug where uppercase script/style element wouldn't be handled correctly and converted to valid lowercase.
   Fixed bug where some WebKit versions on Mac OS X would produce issues with hidden select fields.
   Fixed bug where the media plugin would fail on WebKit since the node wasn't properly imported to the right document.
   Fixed bug where absolute URLs for the TinyMCE script using a base href element would cause loading problems in IE 6/7.
   Fixed bug where pasting using the paste plugin wasn't possible on IE with to restrictive security settings.
   Fixed bug where pasting of whitespace was impossible using the new custom paste method.
   Fixed bug where pasting on some WebKit browsers would not work if you pasted specific contents due to a WebKit bug.
   Fixed bug where doctypes with multiple lines would not be parsed correctly by the fullpage plugin. Patch contributed by Colin.
   Fixed bug where the autoresize plugin would break the fullscreen functionality.
   Fixed bug where tables would be chopped up running on IE using invalid contents and pasting paragraphs into a cell.
   Fixed bug where the each method of jQuery build didn't iterate styleSheets. We now use the TinyMCE API one instead.
   Fixed bug where auto switching to paragraphs after headers some times failed in Gecko.   
   Fixed so all editor options gets passed to the Serializer class. Patch contributed by Jasper Mattsson.
   Fixed so script/style blocks isn't wrapped in paragraphs as other inline elements.
   Fixed so the XHR requests sends the X-Requested-With HTTP header.
   Fixed so the data url scheme is handled in the tinymce.util.URI class.
   Changed inline documentation to use moxiedoc style comments.
   Removed the compat2x plugin people should have upgraded to the 3.x API by now. 3.0 was released more then a year ago.
   Re-added Gecko specific message for users who doesn't understand the security concept regarding paste.

Download (http://tinymce.moxiecode.com/download.php)


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: Sumale.my on January 24, 2010, 10:31:00 PM
3.2.7 ist schon raus!

@ Rinaldos,

kannst du den TinyMCE auch im Adminbereich integrieren? Das wäre etwas ganz feines!

Edit://
Habe es schon hinbekommen!


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: GaYan on February 16, 2010, 05:26:12 AM
can we st this to admin panel as well ?


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: Sumale.my on June 20, 2010, 11:36:34 PM
Kann man das ganze auch mit diesem Editor machen?
http://www.openwebware.com/wysiwyg/demo.shtml

Der ist viel besser als der TinyMCE,
wäre super wenn du dafür, oder jemand anderes, eine Möglichkeit hat!


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: Sebas Bonito on July 02, 2010, 04:01:13 PM
Wo ist der besser?  8O


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: Sumale.my on July 02, 2010, 06:21:00 PM
Wenn du dir das mal genauer anschaust siehst du es, alleine schon das <p> Problem ist nicht vorhanden!


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: Sumale.my on July 06, 2010, 10:38:26 PM
can we st this to admin panel as well ?

Yes we can:
Follow the instruction on page #1 (http://www.4homepages.de/forum/index.php?topic=25098.0)

And the follow my instruction for ACP:

ADDON: TinyMCE for ACP

Step 1
Open / öffne: admin/admin_functions.php
Search / Suche:
1
<script type="text/javascript" language="javascript" src="<?php echo ROOT_PATH?>admin/calendar.js"></script>
Add after / danach einfügen:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<script type="text/javascript" src="<?php echo ROOT_PATH?>tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
mode : "textareas",
theme : "advanced",
editor_selector : "mceAdvanced",
plugins : "safari,emotions",
theme_advanced_buttons1 : "bold,italic,underline,separator,strikethrough,justifyleft,justifycenter,justifyright,justifyfull,bullist,numlist,undo,redo,emotions",
theme_advanced_buttons2 : "",
theme_advanced_buttons3 : "",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_statusbar_location : "bottom"
});
</script>
Search / suche:
function show_textarea_row($title, $name, $value = "", $cols = "", $rows = 10) {
  global $error, $HTTP_POST_VARS, $textarea_size;
  $cols = (empty($cols)) ? $textarea_size : $cols;
  if (isset($error[$name])) {
    $title = sprintf("<span class=\"marktext\">%s *</span>", $title);
  }
  if (isset($HTTP_POST_VARS[$name])/* && $value == ""*/) {
    $value = stripslashes($HTTP_POST_VARS[$name]);
  }
  echo "<tr class=\"".get_row_bg()."\" valign=\"top\">\n<td><p class=\"rowtitle\">".$title."</p></td>\n<td><p><textarea name=\"".$name."\" rows=\"".$rows."\" cols=\"".$cols."\">".format_text($value, 2)."</textarea></p></td>\n</tr>\n";
}Add after / danach einfügen:
function show_tinymce_row($title, $name, $value = "", $cols = "", $rows = 10) {
  global $error, $HTTP_POST_VARS, $textarea_size;
  $cols = (empty($cols)) ? $textarea_size : $cols;
  if (isset($error[$name])) {
    $title = sprintf("<span class=\"marktext\">%s *</span>", $title);
  }
  if (isset($HTTP_POST_VARS[$name])/* && $value == ""*/) {
    $value = stripslashes($HTTP_POST_VARS[$name]);
  }
  echo "<tr class=\"".get_row_bg()."\" valign=\"top\">\n<td><p class=\"rowtitle\">".$title."</p></td>\n<td><p><textarea name=\"".$name."\" rows=\"".$rows."\" cols=\"".$cols."\" class=\"mceAdvanced\">".format_text($value, 2)."</textarea></p></td>\n</tr>\n";
}
Step 2
Now are tricky / Jetzt wird es etwas knifflig
Replace all / erste alle
show_textarea_rowto / zu
show_tinymce_rowfor showing up the tinymce / damit der tinymce angezeigt wird

Example for the image upload / Beispiel für den Bilder uploade
Open / öffne: admin/images.php
Search / suche:
show_textarea_row($title, "image_description", $image_row['image_description'], $textarea_size);replace with / ersetze mit
show_tinymce_row($title, "image_description", $image_row['image_description'], $textarea_size);Search / Suche:
    show_input_row($lang['field_image_name'], "image_name_".$i, "", $textinput_size);
    show_textarea_row($lang['field_description_ext'],"image_description_".$i, "", $textarea_size);replace with / ersetze mit:
    show_input_row($lang['field_image_name'], "image_name_".$i, "", $textinput_size);
    show_tinymce_row($lang['field_description_ext'],"image_description_".$i, "", $textarea_size);
It works perfekt with the Template-Edit:
Der TinyMCE Editor ist bestens für Template bearbeitung im ACP geeignet

Step 1
Open / öffne: admin/templates.php
Search / Suche:
  echo "<textarea name=\"content\" cols=\"60\" rows=\"30\" wrap=\"off\" class=\"template_textarea\">\n";
  echo htmlspecialchars($content);
  echo "</textarea>";replace with / ersetze mit:
  echo "<textarea name=\"content\" cols=\"60\" rows=\"30\" wrap=\"off\" class=\"template_textarea mceAdvanced\">\n";
  echo htmlspecialchars($content);
  echo "</textarea>\n";
  echo "<textarea name=\"content\" cols=\"60\" rows=\"30\" wrap=\"off\" class=\"template_textarea\">\n";
  echo htmlspecialchars($content);
  echo "</textarea>";
Thats all / Das ist alles

Pleas Push the Button / Bitte auf den Button drücken
(http://www.4homepages.de/forum/Themes/babylon/images/german/thank_you.gif)

LG


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: Rembrandt on July 06, 2010, 10:53:46 PM
...
And the follow my instruction for ACP:

ADDON: TinyMCE for ACP...
http://www.4homepages.de/forum/index.php?topic=16639.msg88949#msg88949


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: Sumale.my on July 06, 2010, 10:59:05 PM
Hoppla, übersehen!


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: GaYan on July 09, 2010, 04:12:08 PM
@ Sumale.nin , Thanks alot sir !


Title: Re: [TUT] TINYMCE in 4images integrieren.
Post by: x23piracy on November 30, 2010, 05:05:09 PM
Hi,

FYI

the simplepaste plugin is obsolete and is not needed anymore,
the newer versions of tiny mce have a new paste logic.

Some information: http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/paste (http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/paste)

Wenn du dir das mal genauer anschaust siehst du es, alleine schon das <p> Problem ist nicht vorhanden!

For your <p> problem you should check these settings for init:

1
2
3
4
5
6
forced_root_block : "",
force_p_newlines : false,
remove_linebreaks : false,
force_br_newlines : true,
remove_trailing_nbsp : false,
verify_html : false,

For a normale <br> instead of a <p> you can press shift + enter in tinymce

Just an RTFM problem!: http://tinymce.moxiecode.com/punbb/viewtopic.php?id=3878&p=2 (http://tinymce.moxiecode.com/punbb/viewtopic.php?id=3878&p=2)


Greetz X23