Intégration de tinymce dans un projet web

tinymce et extrait d'un article

a marqué ce sujet comme résolu.

Je souhaite mettre en place un éditeur de texte dans l’espace admin de mon blog avec tinymce. Mais la mise en page du contenu de l’article ne fonctionne plus après intégration de tinymce. Il y a un énorme espace en début de l’article et entre chaque paragraphe, le background color se coupe. A mon avis le problème vient de la mise en place de l’extrait de l’article. Mais comme je suis débutant en php, je n’arrive pas à m’en sortir.

Voici le code de l’extrait de l’article:

<?php
        foreach ($listPosts as $post)
        {
             if (strlen($post->getContent()) <= 400)
            {
              $content = $post->getContent();
            }
            else
            {
              $debut = substr($post->getContent(), 0, 400);
              $debut = substr($debut, 0, strrpos($debut, ' ')) . '...';
              
              $content = $debut;
            }
        ?>
            <div class="news">
                <h3>
                    <?= $post->getTitle() ?>
                    <em>, publié le <?= $post->getCreation_date()->format('d/m/Y à H\hi') ?></em>
                    <?php echo ' par ' .$post->getAuthor() ?>
                </h3>          
                <p> 
                <?= $content ?> <br/>
                <em><a href="index.php?action=post&amp;id=<?= $post->getId() ?>">Continuer la lecture ...</a></em>
                </p>
            </div>
        <?php
        } 
        
        echo '<div class="pagination">' .$pagination. '</div>';
    ?>

Et voici celui du contenu d’un article unique:

 <div class="news">
            <h3>
                <?= $post->getTitle() ?>
                <em>, publié le <?= $post->getCreation_date()->format('d/m/Y à H\hi') ?></em>
                <?php echo ' par ' .$post->getAuthor() ?>
                <?php echo ($post->getCreation_date() == $post->getUpdate_date() ? '' : ' | Mis à jour le '.$post->getUpdate_date()->format('d/m/Y à H\hi')) ?>
            </h3>
            
            <p>
                <?= nl2br($post->getContent()) ?>
            </p>
        </div>

Est-ce que quelqu’un a une idée pour me débloquer la situation ?

Merci d’avance pour votre aide.

Salut !

Je soupçonne soit des imbrications de balises particulières, soit du style qui n’est pas appliqué comme attendu (parce que la structure est particulière). Est-ce que tu pourrais nous montrer un exemple de code HTML généré pour la liste ?

TinyMCE met les paragraphes dans des balises <p>. Or, tu affiches le contenu dans des balises <p>, ce à quoi je m’attendrais, c’est qu’il y ait donc des <p> imbriqués. Dans les templates dont tu nous fournis le code, préfère utiliser <div> avant $post->getContent().
D’autre part, dans le contenu d’un article unique, tu utilises encore nl2br(). Le souci est que TinyMCE aura déjà converti les retours à la ligne en balises, mais conserve les retours à la ligne pour une certaine lisibilité. Donc en gros, avec nl2br(), tu dédoubles ces espacements…

+0 -0

Salut Ymox et merci pour ta réponse. J’ai mis les div à la place des p et j’ai enlevé le nl2br(). Avec toutes ces modifications, une bonne partie du problème est résolu excepté les retour à la ligne. J’ai inspecter la page d’un article unique, il a bien les balises p mais les retours à la ligne ne se font pas. Voici les codes après modifications: Article unique:

<div class="news">
            <h3>
                <?= $post->getTitle() ?>
                <em>, publié le <?= $post->getCreation_date()->format('d/m/Y à H\hi') ?></em>
                <?php echo ' par ' .$post->getAuthor() ?>
                <?php echo ($post->getCreation_date() == $post->getUpdate_date() ? '' : ' | Mis à jour le '.$post->getUpdate_date()->format('d/m/Y à H\hi')) ?>
            </h3>
            
            <div>
                <?= $post->getContent() ?>
            </div>
        </div>

liste article:

<?php
        foreach ($listPosts as $post)
        {
             if (strlen($post->getContent()) <= 400)
            {
              $content = $post->getContent();
            }
            else
            {
              $debut = substr($post->getContent(), 0, 400);
              $debut = substr($debut, 0, strrpos($debut, ' ')) . '...';
              
              $content = $debut;
            }
        ?>
            <div class="news">
                <h3>
                    <?= $post->getTitle() ?>
                    <em>, publié le <?= $post->getCreation_date()->format('d/m/Y à H\hi') ?></em>
                    <?php echo ' par ' .$post->getAuthor() ?>
                </h3>          
                <div> 
                <?= $content ?> <br/>
                <em><a href="index.php?action=post&amp;id=<?= $post->getId() ?>">Continuer la lecture ...</a></em>
                </div>
            </div>
        <?php
        } 
        
        echo '<div class="pagination">' .$pagination. '</div>';
    ?>

N’oublie surtout pas que les retours à la ligne ne sont pas pris en compte en PHP HTML. Si tu souhaites le faire, c’est lors de la rédaction avec TinyMCE. Si je me souviens bien, ENTER créé un nouveau paragraphe (donc au niveau HTML, génère </p><p>), tandis que + ENTER va générer un bris de ligne (<br />).

Maintenant, tu dis juste que tu as encore un problème avec les retours à la ligne, tu arrives à en dire plus et donc être plus précis ?

Edit

Si jamais, pour le code, mets plutôt ```html que ```php. Ça colorera les deux syntaxes quand elles sont mélangées, ce qui est ton cas.  ;)

+0 -0

Comme j’ai enlevé nl2br() au niveau du contenu de l’article unique, tout le contenu se colle comme si c’était un seul paragraphe. En remettant nl2br(), on distingue bien les paragraphes mais avec les mêmes soucis que j’avais au début (Un grand espace entre le titre de l’article et le reste du contenu et l’absence du backgroud color entre les paragraphes.) Donc le fait de remplacer les <p> par les <div> ne change rien mais c’est l’absence du nl2br() qui améliore les choses mais cela fait disparaître tous les paragraphes.

C’est justement pour ça que je souhaiterais voir du code HTML pur généré avec des exemples d’articles dedans. Parce que pour l’instant, je ne comprends toujours pas, c’est un peu comme si tu utilisais TinyMCE sans qu’il ne mette de formatage…

+0 -0
Connectez-vous pour pouvoir poster un message.
Connexion

Pas encore membre ?

Créez un compte en une minute pour profiter pleinement de toutes les fonctionnalités de Zeste de Savoir. Ici, tout est gratuit et sans publicité.
Créer un compte