Développer un site : jour 6

Markos
PHP

Bonjour,

Dans le tutoriel "Développez un site de A à Z : jour 6, éditeur WYSIWYG", minute 08:22 :
J'ai un problème avec mon TinyMCE : une fois que j'ai réduit le nombre de boutons à quatre, contrairement à ce qui se passe dans la vidéo, mon textarea TinyMCE ne fait plus que 181 pixels sur 149. C'est petit. Et il est impossible de le configurer avec un attribut "rows", qui est sans effet.
Mon TinyMCE est inséré dans le fichier Form.php, au moyen de la ligne suivante :

<?php echo $this->Form->input('content','Contenu',array('type' =>'textarea','class'=>'wysiwyg','cols' => '80')); ?>

L'attribut cols="80" bien attribué à mon textarea, mais reste sans effet, sans doute à cause de la série d'imbrications qui le suit, créée par TinyMCE : une span "inputcontent_parent", une table "inputcontent_tbl", un iframe, etc.

Est-il possible de régler la largeur de mon textarea ?

7 réponses

B-Art
Réponse acceptée

Salut Markos,

Quand tu appel TinyMCE dans ta page php, essaie d'ajouter des éléments de taille width et height (largeur et hauteur) dans la configuration.

Exemple:

tinyMCE.init({
        // General options
        mode: "textareas",
        theme: "advanced",
        width: "300",
        height: "200",
        ...

Espérant avoir pu t'aider!

A+

Markos
Auteur

Autre problème : l'iframe TinyMCE dans lequel on tape le texte, lui, fait 179 pixels de large, et, après avoir rajouté des boutons, comme indiqué dans la suite du tuto (10:14), mon TinyMCE fait maintenant 308 pixels de large, mais mon iframe fait toujours 179 pixels de large, donc, ramasse le texte à gauche de la zone. Il faudrait que l'iframe ait la même largeur (moins les bordures) que le TinyMCE.

B-Art

Salut Markos,

As tu essayé en modifiant les caractéristiques de ton textarea dans le .css associer à ta page?

Bonne journée

Markos
Auteur

Justement, c'est ça qui est difficile, d'abord parce que le CSS associé est le framework CSS Bootstrap de Twitter (voir la vidéo), donc un truc costaud, et puis TinyMCE est configuré en JavaScript, avec une quantité de fichiers et de sous-fichiers et une somme de codes intersidérale... L'interface TinyMCE n'est pas un simple textarea, d'ailleurs, mais est constituée d'une foule d'éléments combinés, spans, liens, iframe, éléments de tableau, etc...
(En fait, moi, je reproduis à l'identique le code qui est dans la vidéo, c'est pourquoi je m'étonne de ne pas aboutir toujours au même résultat. Lorsque j'aurai terminé le tutoriel, je pourrai me permettre de l'adapter et de le personnaliser, mais pour l'instant, je recopie).

Markos
Auteur

Bonsoir à tous !

Dans le fichier view/posts/admin_edit.php, conformément au tutoriel, j'ai bien :

function fileBrowser (field_name,url,type,win) {
    tinyMCE.activeEditor.windowManager.open({
        file : '<?php echo Router::url('admin/medias/index/'.$id); ?>',
        title : 'Galerie',
        width : 420,
        height : 400,
        resizable : 'yes',
        inline : 'yes',
        close_previous : 'no'
    },{
        window : win,
        input : field_name
    });
    return false;
}

Et pourtant, ce redimensionnement est sans effet. On continue de chercher...

A bientôt !

Markos
Auteur

Non, pardon, ça c'est pour les images... Ca n'a rien à voir...Attends, je reviens...

Markos
Auteur

OK, je crois que ça marche. Merci, B-Art.