Style des colonnes personnalisées dans les panneaux d'administration (en particulier pour ajuster la largeur des cellules de colonne)

14

J'utilise Wordpress en tant que système de gestion de contenu pour un projet qui utilise beaucoup les types d'articles personnalisés. Je dois afficher les colonnes dans les panneaux d'administration de chaque type d'article personnalisé d'une manière différente.

J'ai déjà créé et rempli les colonnes nécessaires. Ce que je dois faire, c'est ajuster un peu le CSS. Plus important encore, j'essaie de modifier la largeur de certaines colonnes. Par exemple, je n'ai pas besoin d'une colonne répertoriant l'ID de l'article pour qu'il soit aussi large que son nom.

J'ai mis en file d'attente une feuille de style dans les panneaux d'administration pour mes types d'articles personnalisés, mais je ne parviens pas à attribuer un style à la largeur des colonnes.

J'ai essayé d'ajuster la largeur maximale des éléments th ou td, mais c'est inefficace. De firebug je peux voir que le style css est là, mais ça ne fait rien.

Même si je pouvais trouver beaucoup de tutoriels pour ajouter / modifier des colonnes personnalisées, je n’ai pas vraiment rassemblé beaucoup d’informations sur la manière de styliser de telles colonnes. Un indice?

Merci!

    
posée unfulvio 16.11.2011 - 13:10

4 réponses

25

J'ai trouvé une solution qui fonctionne pour moi!

J'ai laissé ce code dans functions.php:

add_action('admin_head', 'my_column_width');

function my_column_width() {
    echo '<style type="text/css">';
    echo '.column-mycolumn { text-align: center; width:60px !important; overflow:hidden }';
    echo '</style>';
}
    
réponse donnée Nicusor Dumbrava 14.04.2012 - 05:10
7

Merci Nicusor: Fonctionne très bien. J'ai pu modifier la largeur des colonnes sélectionnées dans le panneau Messages (par exemple, Titre, Auteur, Catégories) avec votre solution, comme suit:

add_action('admin_head', 'my_admin_column_width');
function my_admin_column_width() {
    echo '<style type="text/css">
        .column-title { text-align: left; width:200px !important; overflow:hidden }
        .column-author { text-align: left; width:100px !important; overflow:hidden }
        .column-categories { text-align: left; width:100px !important; overflow:hidden }
    </style>';
}
    
réponse donnée Charles Borden 08.02.2013 - 10:33
4

Vous devriez pouvoir définir la largeur de la colonne en utilisant CSS assez facilement. Vous pouvez utiliser la classe .column-{name} pour appliquer des styles aux cellules de colonne ( th et td ). Par exemple:

.column-mycolumn { width:20%; }

Assurez-vous qu'aucun autre style ne remplace la largeur de votre colonne à cause des règles de la spécificité CSS . De plus, les mots longs sans espaces ni grandes images peuvent forcer la colonne à être plus large que celle spécifiée par certains navigateurs.

    
réponse donnée Geert 16.11.2011 - 13:32
4

Vous pouvez essayer ceci a résolu vos problèmes:

add_action('admin_head', 'my_admin_custom_styles');
function my_admin_custom_styles() {
    $output_css = '<style type="text/css">
        .column-date { display: none }
        .column-tags { display: none }
        .column-author { width:30px !important; overflow:hidden }
        .column-categories { width:30px !important; overflow:hidden }
        .column-title a { font-size:30px !important }
    </style>';
    echo $output_css;
}
    
réponse donnée Gaurang P 20.08.2015 - 13:56

Lire d'autres questions sur les étiquettes