Compatibilité de WP avec mes anciens billets (Créer un compte)

  • WordPress :4.9
  • Statut : non résolu
15 sujets de 1 à 15 (sur un total de 22)
  • Auteur
    Messages
  • #2084922
    Darloup
    Participant
    Chevalier WordPress
    220 contributions

    Bonjour,

    Ma configuration WP actuelle

    • Version de PHP/MySQL :
    • Thème utilisé :
    • Extensions en place :
    • Nom de l’hébergeur :
    • Adresse du site : http://www.darloup.com/blog

    Problème(s) rencontré(s) :

    Bonjour,

    J’adore la réactivité de WP, mais j’avoue que les dernières versions créent des problèmes d’affichage avec mes anciens posts.

    Dans le passé, disons il y a 6-7 ans, j’avais l’habitude de mettre mes images dans des tables. Je précisais que la border devait être 0 pour que cette bordure n’apparaisse pas à l’écran.

    Pourtant, ceci ne marche plus actuellement. Pourquoi ???

    Par exemple, je vous invite à voir ce billet : http://www.darloup.com/blog/?p=1716 (publié en 2009).

    Originellement, les bordures autour des images n’apparaissaient pas. Voici le code d’origine :

    <table border="0">
    <tbody>
    <tr>
    <td>
    <p style="text-align: center;"><a title="Nelly et son costume durant le Carnaval de Barranquilla (2009)" href="http://www.darloup.com/blog/pix/nc12009.jpg" rel="lightbox"><img class="aligncenter" title="(cliquer pour agrandir)" src="http://www.darloup.com/blog/pix/nc12009.jpg" alt="" width="142" height="200" /></a></p>
    </td>
    <td width="10"></td>
    <td>
    <p style="text-align: center;"><a title="Nelly et son costume durant le Carnaval de Barranquilla (2009)" href="http://www.darloup.com/blog/pix/nc22009.jpg" rel="lightbox"><img class="aligncenter" title="(cliquer pour agrandir)" src="http://www.darloup.com/blog/pix/nc22009.jpg" alt="" width="138" height="200" /></a></p>
    </td>
    </tr>
    <tr>
    <td colspan="3" align="center"><em><strong>Le costume et le masque de Nelly</strong></em></td>
    </tr>
    </tbody>
    </table>

    La bordure de la table est bien « 0 » et devrait donc être invisible. Ceci marchait parfaitement dans le passé. Mais plus maintenant.

    J’ai des centaines de billets qui sont concernés.

    Merci d’avance pour vos conseils !

    Cordialement,

    Henry

    #2085503
    lorenzolamas
    Participant
    Maître WordPress
    3229 contributions

    Bonjour,

    Le plus simple est d’aller dans le CSS pour appliquer un style directement sur les bordures de tous les tableaux.

    Donc thème enfant > Style.css et tu rajoutes la propriété « border-style:none; » pour les table.

     

    #2092190
    Darloup
    Participant
    Chevalier WordPress
    220 contributions

    Bonjour et merci de ta réponse.

    Le problème avec ton excellente suggestion est que mon blog possède des pages (en opposition aux billets) dans lesquelles j’aimerais conserver la bordure de mes tableaux.

    Donc, si je modifie le CSS, toutes les bordures de tous mes tableaux vont disparaître… Ce que je ne désire pas.

    Ce que je ne comprends pas est si le code est

    <table border="0">

    pourquoi la bordure est-elle visible ? D’autant plus que cela marchait parfaitement dans le passé !

    #2092212
    PhiLyon
    Modérateur
    Maître WordPress
    28260 contributions

    Bonsoir.

    Fais un essai avec ça dans une page/article

    <div class="tab1">
    <table>
    <tbody>
    <tr>
    <td>
    <p style="text-align: center;"><a title="Nelly et son costume durant le Carnaval de Barranquilla (2009)" href="http://www.darloup.com/blog/pix/nc12009.jpg" rel="lightbox"><img class="aligncenter" title="(cliquer pour agrandir)" src="http://www.darloup.com/blog/pix/nc12009.jpg" alt="" width="142" height="200" /></a></p>
    </td>
    <td width="10"></td>
    <td>
    <p style="text-align: center;"><a title="Nelly et son costume durant le Carnaval de Barranquilla (2009)" href="http://www.darloup.com/blog/pix/nc22009.jpg" rel="lightbox"><img class="aligncenter" title="(cliquer pour agrandir)" src="http://www.darloup.com/blog/pix/nc22009.jpg" alt="" width="138" height="200" /></a></p>
    </td>
    </tr>
    <tr>
    <td colspan="3" align="center"><em><strong>Le costume et le masque de Nelly</strong></em></td>
    </tr>
    </tbody>
    </table>
    </div>

    Et colles-ça dans Apparence/Personnaliser/CSS additionnel

    .tab1 table, th, td {
    border: none;
    text-align:center
    }

    Si ça fonctionne, il faudra mettre dans une classe différente les tableaux à modifier.

    🙂

    #2092215
    PhiLyon
    Modérateur
    Maître WordPress
    28260 contributions

    J’oubliais, c’est ton thème qui rajoute ces bordures, essaies dans un autre (Twenty Seventeen), tu verras.

    🙂

    #2095541
    Darloup
    Participant
    Chevalier WordPress
    220 contributions

    Bonjour PhiLyon et merci de ta réponse.

    J’ai maintenant changé de thème et j’utilise Twenty Sixteen que j’aime bien et qui est casi identique à celui que j’utilisais.

    Malheureusement, cela n’a pas résolu le problème et les bordures des tables de mes anciens billets apparaissent toujours. Comme dans ce billet : http://www.darloup.com/blog/?p=1716

    Quel est le problème ?

    Cordialement,

    Henry

    #2095597
    Marie-Fogo
    Participant
    Initié WordPress
    6 contributions

    Bonsoir,

    Il semble que le problème vienne, comme le dit PhiLyon, du css du thème (même pour Twenty Sixteen).

    Ligne 521 du style.css :

    .table, th, td {
    border: 1px solid #d1d1d1; <= Là
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;

    Personnellement je virerais le  « solid #d1d1d1 », cela devrait permettre de pouvoir garder les bordures quand c’est nécessaire.

     

     

     

    #2095664
    Darloup
    Participant
    Chevalier WordPress
    220 contributions

    Bonjour,

    En effet, il semblerait que même les thèmes officiels de WP ne puissent/sachent pas gérer les tableaux et les alignements.

    Je viens de publier un nouveau billet/article test qui est simplement une photo avec une légende. J’ai choisi que l’alignement soit centré (la photo comme la légende). Le billet est publié ici : http://www.darloup.com/blog/?p=4459

    Vous constaterez que :

    1) La bordure du tableau est toujours visible

    2) Le tableau est trop grand pour le thème (la bordure de droite n’apparaît pas à l’écran)

    3) L’image n’est pas centrée

    4) La légende n’est pas non plus centrée

    Je pensais qu’utiliser un thème officiel de WP allait résoudre ces problèmes, mais ce n’est pas le cas.

    Mon problème est compliqué de par le fait que, dans certains tableaux, j’aimerais que la bordure soit visible et que, dans autres, j’aimerais qu’elle ne le soit pas.

    Je n’arrive pas à comprendre l’origine du problème.

    Merci d’avance de vos retours et suggestions !

    Voici le code de ce billet :

    <table class=" aligncenter" border="0"><caption>Photo</caption>
    <tbody>
    <tr>
    <td><img class="aligncenter size-medium wp-image-4460" src="http://www.darloup.com/blog/wp-content/uploads/2018/02/mujica01.jpg" alt="" width="225" height="300" /></td>
    </tr>
    </tbody>
    </table>

    #2095831
    PhiLyon
    Modérateur
    Maître WordPress
    28260 contributions

    Bonjour.

    Le premier fichier joint est une capture d’écran avec ton code, le second avec le code « normal ».

    Dans les deux cas il n’y a pas de bordure.

    Le code du deuxième fichier

    <table>
    <tbody>
    <tr>
    <td style="text-align: center;">Photo</td>
    </tr>
    <tr>
    <td><img class="aligncenter" src="http://www.darloup.com/blog/wp-content/uploads/2018/02/mujica01.jpg" alt="" width="225" height="300" /></td>
    </tr>
    </tbody>
    </table>

    🙂

    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2099633
    Darloup
    Participant
    Chevalier WordPress
    220 contributions

    Bonjour PhiLyon,

    Je ne comprends pas la différence entre « mon code » et le « code normal ». J’utilise l’éditeur de Word Press pour rédiger en mode WYSIWYG !

    Pourquoi les deux codes sont-ils alors différents ?

    Je viens de publier un nouveau billet en utilisant ton code :

    <table>
    <tbody>
    <tr>
    <td style="text-align: center;">Photo</td>
    </tr>
    <tr>
    <td><img class="aligncenter" src="http://www.darloup.com/blog/wp-content/uploads/2018/02/mujica01.jpg" alt="" width="225" height="300" /></td>
    </tr>
    </tbody>
    </table>

    Le résultat est visible ici : http://www.darloup.com/blog/?p=4465

    J’ai une bordure (ce qui me semble normal puisque la bordure n’a pas été réglée à « 0 ».

    Voir capture d’écran ci-jointe.

    Donc, pourquoi ne vois-tu pas de bordure alors que, en utilisant le même code, j’en vois une sur mon écran ?

    Je précise que j’utilise Twenty Sixteen sans ajout de CSS.

     

     

    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2099663
    PhiLyon
    Modérateur
    Maître WordPress
    28260 contributions

    Bonjour.

    Je viens de re-tester et toujours pas de bordures, désactives tes extensions pour voir.

    🙂

    #2099664
    PhiLyon
    Modérateur
    Maître WordPress
    28260 contributions

    Tu as bien la version 1.4 de Twenty Seventeen ?

    🙂

    #2099841
    Darloup
    Participant
    Chevalier WordPress
    220 contributions

    Oui, j’ai bien la version 1.4 de Twenty Sixteen (pas Seventeen).

    Je viens de désactiver mes 15 extensions, puis j’ai vidé le cache.

    J’ai toujours une bordure dans toutes les cellules de la table… <soupir>

    #2100007
    PhiLyon
    Modérateur
    Maître WordPress
    28260 contributions

    Bonjour.

    Pas fais gaffe à Twenty Sixteen

    Essaies comme ça

    <div class="noborder><table>
    <tbody>
    <tr>
    <td style="text-align: center;">Photo</td>
    </tr>
    <tr>
    <td><img class="aligncenter" src="http://www.darloup.com/blog/wp-content/uploads/2018/02/mujica01.jpg" alt="" width="225" height="300" /></td>
    </tr>
    </tbody>
    </table>
    </div>
    HTML Page

    .noborder {
    table: border: none;
    }
    CSS

    🙂

    #2101647
    Darloup
    Participant
    Chevalier WordPress
    220 contributions

    Bonjour PhiLyon,

    J’ai essayé ton nouveau code HTML – pas de problème.

    Par contre, lorsque j’ai voulu ajouter ton CSS additionnel, j’ai eu un message d’erreur. Voir fichier ci-joint.

     

    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
15 sujets de 1 à 15 (sur un total de 22)
  • Vous devez être connecté pour répondre à ce sujet.