有限会社Willさんいん ホーム

サイトマップ

お問い合わせ

0852-28-6220(平日 9時30分から17時30分)

このページの位置: Home > フロントエンドエンジニアのblog > 2ページ目

フロントエンドエンジニアのblog

RSS

管理画面のメニューから[外観]→[カスタマイズ]を消す

この記事は2017年4月11日に書かれたものです。情報が古い可能性がありますのでご注意ください。

WordPress の管理画面は、以前よく使ってた Movable Type や他の CMS に比べても、とても分かりやすく出来ていると思いますが、さらに使いやすくするために、案件に応じて不要なメニュー項目を削除したり、逆に投稿一覧画面などにはあったら便利という項目を表示させたりしています。

今回、編集者にカスタムメニューの操作権限を与える必要がありました。

まず、通常編集者はカスタムメニューを操作することはできないので、functions.php に以下を記述して操作権限を与えます。

function add_theme_caps(){
  $role = get_role( 'editor' );
  $role->add_cap( 'edit_theme_options' );
}
add_action( 'admin_init', 'add_theme_caps' );

これで編集者にも[外観]メニューが表示されますが、[テーマ]や[カスタマイズ]などのサブメニューは操作してほしくないのでこれらを消す必要がありましたが、この内[カスタマイズ]については他のサブメニューと URL の形式が異なるため、ちょっと工夫が必要でした。

“管理画面のメニューから[外観]→[カスタマイズ]を消す” の続きを読む »

リンクエリアをブロック要素全体に広げ、新しいタブで開くキーボードショートカットに対応する

この記事は2017年4月11日に書かれたものです。情報が古い可能性がありますのでご注意ください。

近年、スマホ等で閲覧した際のユーザビリティを考慮して、クリックやタップできるリンク範囲を広げる手法がよく使われています。

  • HTML5 で複数のブロック要素を a 要素で囲む方法
  • CSS の position プロパティを使って a 要素を直前のブロック要素に被せる方法
  • jQuery を使って a 要素を含むブロック要素のクリックに反応させる方法

などありますが、jQuery を使う方法は私もよく使います。

以前から多くのブログ等で紹介されている記述は次のようなものです。

$(function(){
  $('div.linkBox').click(function(){
    window.location = $(this).find('a').attr('href');
    return false;
  });
});

ただ、この方法は本来のリンク要素外の範囲では、リンク先を新しいタブで開くキーボードショートカットに反応しません。Windows では [ctrl] キーを、Mac では [command] キーを押しながらクリックすると、リンク先が新しいタブで開くというものです。

“リンクエリアをブロック要素全体に広げ、新しいタブで開くキーボードショートカットに対応する” の続きを読む »

年度別アーカイブの作成

この記事は2017年4月7日に書かれたものです。情報が古い可能性がありますのでご注意ください。

学校等のサイトを構築する際に必要になることがある年度別アーカイブ。Movable Type では FiscalYearlyArchives というプラグインを使って簡単に作成できましたが、今回 WordPress で作成する必要があり、いくつかの記事を参考にさせていただきながら構築できました。

まずは、年度別アーカイブリストの出力です。これはこちらの記事を参考にさせていただきました。
[WordPress] 年度別(4月から始まる)アーカイブリストを表示する | 制作メモ | 560DESIGNS

この記事で紹介されているコードを functions.php に記述しておき、<?php my_get_archives_by_fiscal_year(); ?> で年度別アーカイブリストを出力します。

続いて、年度別アーカイブページの作成。こちらは、サポートフォーラムの以下のトピックを参考にさせていただきました。
トピック: 年度別アーカイブは可能でしょうか? «  サポートフォーラム — WordPress

年別アーカイブは不要なので、年毎の表示を年度毎にそっくり入れ替えるこの方法で、年度別アーカイブページが生成できました。

そしてここからは、出力されたアーカイブタイトルなどの調整です。

“年度別アーカイブの作成” の続きを読む »

サイトマップのツリー構造を CSS のみで表現する

この記事は2016年12月4日に書かれたものです。情報が古い可能性がありますのでご注意ください。

次のようにサイトマップのツリー構造を表現する際、これまでずっとラインの画像をリストの背景として設定し、表現してきました。

画像:サイトマップイメージ

古い Internet Explorer が 6、7、8 と次々にサポートが打ち切られた今、これまで画像で表現していたデザインを CSS のみで表現できるようになり、様々な場面で画像を使わなくなりました。一方、サイトマップについては惰性で長らく画像を使っていたのですが、これも CSS のみでできるんじゃないかと思い、やってみました。

“サイトマップのツリー構造を CSS のみで表現する” の続きを読む »

投稿のカテゴリーのラベルを変更する

この記事は2016年12月4日に書かれたものです。情報が古い可能性がありますのでご注意ください。

WordPress の管理画面の「投稿」を「お知らせ」などのラベルに変更する方法はググるとあちらこちらで紹介されています。ここでも紹介しますが(笑)、functions.php 以下のように記述します。

function change_post_menu_label() {
  global $menu;
  global $submenu;
  $menu[5][0] = 'お知らせ';
  $submenu['edit.php'][5][0] = 'お知らせ一覧';
  $submenu['edit.php'][10][0] = '新規追加';
}
 function change_post_object_label() {
  global $wp_post_types;
  $labels = &$wp_post_types['post']->labels;
  $labels->name = 'お知らせ';
  $labels->singular_name = 'お知らせ';
  $labels->name_admin_bar = 'お知らせ';
  $labels->add_new = '新規追加';
  $labels->add_new_item = 'お知らせを追加';
  $labels->edit_item = 'お知らせの編集';
  $labels->new_item = '新規お知らせ';
  $labels->view_item = 'お知らせを表示';
  $labels->search_items = 'お知らせを検索';
  $labels->not_found = 'お知らせが見つかりませんでした';
  $labels->not_found_in_trash = 'ゴミ箱にお知らせは見つかりませんでした';
 }
add_action( 'init', 'change_post_object_label' );
add_action( 'admin_menu', 'change_post_menu_label' );

一方、投稿の「カテゴリー」や「タグ」のラベルを変更する方法はなかなか見つかりませんでしたが、「項目名の変更 管理画面編 WordPress - WordPress Snippet」でそのヒントが掲載されていました。

“投稿のカテゴリーのラベルを変更する” の続きを読む »

1 2 3 4 10

このページの先頭へ