WordPress 表の罫線強制表示
表の罫線はテーマ依存か?
WordPress で表を作るとき、テーマに依存するんだと思うんですが、
罫線が表示されたり表示されなかったりします。
少なくとも、Markdown で入力すると、表の罫線の設定はできません(たぶん)
「こうなっちゃうんですよ(設定前)」例:
この表示の方がしっくりするという人や場合も多いとは思うんですが、
個人的には、どうも落ち着かないです。
テーマ Sparkling で罫線を強制表示するには
コンテンツを表示して、Chromeのデベロッパーツールで、確認したところ tableタグは、
<table class=" table table-hover">
だったので、
table.table.table-hover の th と td に罫線を設定すれば、強制表示できます(たぶん)。
副作用が、出ないともかぎりませんが・・・まぁそんときはそんとき
footer.php の書き換え
テーマのファイルを書き換えるのは最小限にとどめたいですが、
別の対策(このリンクが別ウィンドウで開くようにする対策)で、
既に footer.php を書き換えていたので、同じ場所に入れちゃいました。
wp-content/themes/sparkling/footer.php の最後に近いあたりに、
<script type="text/javascript">
jQuery(function() {
jQuery("table.table.table-hover th, table.table.table-hover td").css('border','1px solid #cccccc');
});
</script>
を入れると、強制表示できます。
そういうわけで、このサイトの footer.php は、現在
<script type="text/javascript">
jQuery(function() {
var atags = $("a[href$='#_blank']");
for(const atag of atags) {
jQuery(atag).attr('target', '_blank');
str = jQuery(atag).attr('href').slice(0, -7);
jQuery(atag).attr('href', str);
}
jQuery("table.table-hover th, table.table-hover td").css('border','1px solid #cccccc');
});
</script>
を追加してあります。
で、この対応により
「こうなります(設定後)」例:
のようになります。