このエントリーをはてなブックマークに追加
Facebook にシェア
[`evernote` not found]
LINEで送る

wordpressでタイトルがある程度長いとスタイルが崩れる場合があります。
長いタイトルは途中から省略しておいいのですが、見栄えが悪くなるので、投稿時にJqueryをつかってタイトルが文字数を超えると警告がでるように変更するメモ

function.php部分

1
2
3
4
5
6
7
8
9
10
11
12
//新規投稿時と編集時に追加javascriptを読み込むようにフック
add_action('admin_head-post.php', 'admin_js');
add_action('admin_head-post-new.php', 'admin_js');
 
function admin_js() {
global $post_type;
//特定の投稿タイプにのみ適用させたいならここの部分を変更。全てに適用するなら省略可
    if ($post_type == 'post') {
　　　　　//admin.jsを読み込む
       wp_enqueue_script('admin', get_bloginfo('template_url').'/js/admin.js');
    }
}

admin.js部分

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
jQuery(function(){
//エラーメッセージの追加
    jQuery("#titlewrap").append('<span class="counterr" style="display:none;color:red;font-weight:bold">文字数が多すぎます</span>');
     
//文字数が規定数を超えているかチェック。今回は30文字に設定。30文字を超えるとエラーメッセージ＆公開ボタンが押せなくなる。
    jQuery("#title").bind("change keyup",function(){
    var count = jQuery(this).val().length;
        if(count > 30){
            jQuery(".counterr").css("display","block");
            jQuery("#publish").attr("disabled", "disabled");
        }else{
            jQuery(".counterr").css("display","none");
            jQuery("#publish").removeAttr("disabled");
        }
    });
});

なお、文字数は全角半角は考慮してません。全角でも半角でも30文字分です。