it-swarm-ja.com

Woocommerceの商品一覧ページのフォントサイズを変更する

より多くの列に収まるように、テーブル内のテキストのフォントサイズを小さくしたいです。使用できるフックはありますか、それともwordpress/woocommerceのコアを変更する必要がありますか?その場合、どのCSSまたはテンプレートファイルを変更する必要がありますか?woocommerce-products-listing-page

2
qbr

別の選択肢はcurrent_screenフックを使うことです

add_action( 'current_screen', 'my_admin_listing_custom_styles' );
function my_admin_listing_custom_styles() {
    $current_screen = get_current_screen();
    if( 'edit' == $current_screen->base && 'product' == $current_screen->post_type) {
        // Run some code, only on the admin products listing page for e.x add css style
        ?>
        <style type="text/css">
        a.row-title {font-size: 18px !important;}
        </style>
        <?php
    }
}
1
Bainternet

あなたはあなたの管理者にカスタムCSSシートを追加し、あなたが好きなものにスタイルを付けることができます。

  1. テーマフォルダにadmin-style.cssという名前の新しいCSSドキュメントを作成し、そこにルールを追加します。例えば:

    .wp-list-table .row-title,
    .wp-list-table th,
    .wp-list-table td,
    .row-actions {
        font-size: 11px !important;
    }
    
  2. 以下のコードをfunctions.phpファイルに追加してください。

    function load_custom_wp_admin_style() {
        wp_register_style( 'custom_wp_admin_css', get_stylesheet_directory_uri() . '/admin-style.css', false, '1.0.0' );
        wp_enqueue_style( 'custom_wp_admin_css' );
    }
    add_action( 'admin_enqueue_scripts', 'load_custom_wp_admin_style' );
    

これはコアを変更することを避け、子供のテーマにやさしく、そして必要に応じて管理者内部の他のスタイルを簡単に変更することを可能にします。

0
MarkPraschan

あなたはカスタムCSSを出力するためにadmin_print_stylesフックを使うことができます - この場合私は接尾辞-edit.php(これは投稿テーブルスクリーンのためのユニークなフックです)を使いました。私はまた、現在の投稿タイプがproductであることを確認します。そうでなければ、CSSはページ、投稿などに出力します。

function wpse_184211_edit_products_style() {
    if ( get_current_screen()->post_type === 'product' ) {
        ?>

<style>
    .column-purpose {
        font-size: 10px;
    }
</style>

<?php
    }
}

add_action( 'admin_print_styles-edit.php', 'wpse_184211_edit_products_style' );

CSSはその一例です。ページのソースコードを調べたり調べたりするだけで、どのクラス名やセレクタを使用する必要があるかがわかります。

0
TheDeadMedic