WordPress:RSSフィードを投稿や固定ページに読み込むショートコード

ワードプレスのGutenbergエディタの編集単位――ブロック――にはたくさんの種類があります。埋め込みカテゴリーだと、使うかどうかは別として30種類以上のウェブサービスを埋め込むことができるようになっています。

RSSフィードを埋め込むには?

外部サイトの更新情報をRSSフィードを取り込んで表示するために、ワードプレスでは、RSSフィードを表示させるウィジェットが用意されています。
目的のサイトのRSSフィードのアドレスさえわかれば、簡単に更新情報を埋め込むことができます。

投稿や固定ページではフィードが埋め込めない

ところが、投稿や固定ページの中にRSSフィードを埋め込もうとすると、できそうでできません。外部のRSS/Atomフィードを埋め込むブロックが無いのでした。

ワードプレスにGutenbergエディタが導入される前のバージョンでもサイドバーなどのウィジェットにRSSフィードを埋め込むことはできましたから、簡単にブロックとして追加できるはずなのですが・・・・・
ようやくWordPress 5.2でRSSブロックが追加されるようです。

・・・・
いくつかの新しいブロックを追加しました。
RSSブロック

・・・・

WordPress 5.2 ベータ1

ショートコードでRSSフィードを埋め込もう

それまでのつなぎとして、RSSフィードをショートコードで埋め込めるようにしてみました。
functions.phpにコードを追加して、ショートコードを呼び出せるようにします。

/* RSSフィードショートコード */
function rss_func( $atts ) {
	include_once( ABSPATH . WPINC . '/feed.php' );

	$blog_rss = shortcode_atts( array(
		'url' => 'https://ja.wordpress.org/feed/',
		'num' => '5',
		'img' => 'https://s.w.org/style/images/wporg-logo.svg'),
	$atts );

	$feed_url = $blog_rss['url'];
	$feed_num = $blog_rss['num'];
	$img_url = $blog_rss['img'];
	$feed_content = '';
	$feed_contents = '';

	$rss = fetch_feed( $feed_url );
	if ( !is_wp_error( $rss ) ) :
		$maxitems = $rss->get_item_quantity( $feed_num );
		$rss_items = $rss->get_items( 0, $maxitems );

		foreach ( $rss_items as $item ) :
			$first_img = '';
			if ( preg_match( '/<img.+?src=[\'"]([^\'"]+?)[\'"].*?>/msi', $item->get_content(), $matches )) $first_img = $matches[1];
			if ( !empty( $first_img ) ) :
				$feed_img = esc_attr( $first_img );
			else:
				$feed_img = $img_url;
			endif;
			$feed_url = $item->get_permalink();
			$feed_title = $item->get_title();
			$feed_date = $item->get_date('Y.m.d');
			$feed_text = mb_substr(strip_tags($item->get_content()), 0, 160);
			
			$feed_content .= '<a rel="noopener" href="' . $feed_url . '" title="' . $feed_title . '" class="blogcard-wrap" target="_blank">';
			$feed_content .= '<div class="blogcard">';
			$feed_content .= '<figure class="blogcard-thumbnail">';
			$feed_content .= '<img src="' . $feed_img . '" class="blogcard-thumb-image" alt="">';
			$feed_content .= '</figure>';
			$feed_content .= '<div class="blogcard-content">';
			$feed_content .= '<div class="blogcard-title">' . $feed_title . '</div>';
			$feed_content .= '<div class="blogcard-abbreviation">' . $feed_text . '…</div>';
			$feed_content .= '</div>';
			$feed_content .= '<div class="blogcard-post-date">' . $feed_date . '</div>';
			$feed_content .= '</div>';
			$feed_content .= '</a>';
		endforeach;
	else:
		$feed_content = '<p>RSSフィードを取得できません</p>';
	endif;

	$feed_contents = '<div>' . $feed_content . '</div>';

return "{$feed_contents}";

}
add_shortcode( 'rss', 'rss_func' );

ショートコードは、RSSフィードのアドレス、フィードの取得数、デフォルト (フィードが画像を含んでいなかった時) の画像へのアドレスを引数として指定すると、RSSフィードを読み込んでブログカード形式で表示します。 引数を省略するとデフォルトで指定したアドレス、取得数、画像が使われます。
上記の例では
6 ’url’ => ‘https://ja.wordpress.org/feed/’,
7 ’num’ => ‘5’,
8 ’img’ => ‘https://s.w.org/style/images/wporg-logo.svg’
が使われます。
33 mb_substr(strip_tags($item->get_content()), 0, 160)
のところで本文の抜粋文字数(160文字)を指定しています。

ショートコードの呼び出し

呼び出しは、ショートコードブロックにショートコードを書き込みます。

メディアデザイン・オフィスの年末年始のスケジュール
メディアデザインが入っているみやぎNPOプラザは、12月29日(日)から令和2年1月3日(金)まで休館となります。 それに伴いまして、メディアデザインのオフィスもお休みとなります。 年内は12月28日(土)まで、令和2年は、1月4日(土)からのオープンとなりますので、よろしくお願いいたします。 なお、この期間の…
仙台文庫e6「防災アウトドア術~危険回避、一人ひとりができること~」
仙台文庫e(電子書籍)の6冊目が発売されました。 チョモランマ登頂の著者によるアウトドア術 著者の八嶋 寛(やしま ひろし)さんは、10代から登山を始め、20代でヒマラヤ登山のプロジェクトに参加。以後は世界中の山々に登り続け、2000年にはチョモランマ(エベレスト)に登山隊隊長として登頂しています。 国内外…
新刊「防災アウトドア術~危険回避、一人ひとりができること~」
仙台文庫e(電子書籍)の新刊が発売されました。 タイトル:防災アウトドア術 ~危険回避、一人ひとりができること~著者:八嶋 寛(やしま ひろし) Amazon Kindle(電子書籍)https://www.amazon.co.jp/dp/B082ZFJWVN 八嶋さんは、東北アウトドア情報セ…

RSSフィード表示用スタイルシートの例

.blogcard-wrap {
    margin: 24px auto;
    padding: 0;
    width: 90%;
    background-color: #fff;
}
.blogcard {
    padding: 1.4% 2% 1.8%;
    border: 1px solid #ccc;
    border-radius: 4px;
    line-height: 1.3;
    position: relative;
}
.blogcard-thumbnail {
    float: left;
    margin-top: 3px;
    width: 160px;
}
.blogcard-thumbnail img {
    width: 100%;
}
.blogcard-content {
    margin-left: 170px;
    max-height: 140px;
    min-height: 100px;
    overflow: hidden;
}
.blogcard-title {
    font-weight: bold;
}
.blogcard-abbreviation {
    font-size: 0.8em;
}
.blogcard-post-date {
	text-align: right;
}

WordPress:Gutenbergのブロック

WordPressの新しいエディタ「Gutenberg」 では投稿や固定ページを作るのにブロック(Block)という単位が導入されています。ブロックは、見出し、段落や画像を単位とする概念で、WordPressには標準でもイロイロなブロックが存在しています。ま、あまり使わないだろう——個人的にはいらない——ブロックもあるのですが、とにかく使ってみました。

ブロックを呼び出す

投稿や固定ページにブロックを挿入/追加するには、作成画面に表示されるブロックの追加アイコン(丸にプラスマーク)をクリックします。

ブロックの追加アイコン(丸にプラスマーク)をクリックしてブロックを追加する
ブロックの追加アイコンをクリックしてブロックを追加する

ブロックの追加アイコンは作成画面のあちこちで登場しますが、どれも同じようにブロックを呼び出します。

標準ブロックの種類

呼び出すことのできるブロックは今のところ( バージョン 5.0.3 )標準でこれだけあります。ブロックの性質によってカテゴリーに分けられています。

  • インライン要素
    1. インライン画像
  • 一般ブロック
    1. 段落
    2. 見出し
    3. リスト
    4. 画像
    5. ギャラリー
    6. 引用
    7. 音声
    8. カバー
    9. ファイル
    10. 動画
  • フォーマット
    1. カスタムHTML
    2. ソースコード
    3. クラシック
    4. 整形済み
    5. プルクオート
    6. テーブル
  • レイアウト要素
    1. ボタン
    2. カラム
    3. メディアと文章
    4. 続きを読む
    5. 改ページ
    6. 区切り
    7. スペーサー
  • ウィジェット
    1. ショートコード
    2. アーカイブ
    3. カテゴリー
    4. 最新のコメント
    5. 最新の記事
  • 埋め込み
    1. 埋め込み
    2. Twitter
    3. YouTube
    4. Facebook
    5. Instagram
    6. WordPress
    7. SoundCloud
    8. Spotify
    9. Flickr
    10. Vimeo
    11. Animoto
    12. Cloudup
    13. CollegeHumor
    14. Dailymotion
    15. Funny or Die
    16. Hulu
    17. Imgur
    18. Issuu
    19. Kickstarter
    20. Meetup.com
    21. Mixcloud
    22. Photobucket
    23. Polldaddy
    24. Reddit
    25. ReverbNation
    26. Screencast
    27. Scribd
    28. SlideShare
    29. SmugMug
    30. Speaker Deck
    31. TED
    32. Tumblr
    33. VideoPress
    34. WordPress.tv
  • 再利用可能
    1. ユーザーが保存したブロック

よく使うものカテゴリー

数が多いので毎回リストから選択して呼び出すのが大変ですが、たびたび使うブロックは「よく使うもの」カテゴリーに配置されてリストの先頭に表示されるようになっています。

使う頻度の高いブロックはよく使うブロックとしてリストの先頭に配置される
よく使うものとしてリストの先頭に配置された使用頻度の高いブロック

特別な再利用可能カテゴリー

再利用可能カテゴリーはGutenbergを使い始めたときには表示されていないはずです。ユーザーが一度作成したオリジナルのブロックを再利用ブロックとして追加すると、追加したブロックが表示されるようになります。

作成したブロックの詳細設定から再利用ブロックに追加を行うと再利用可能ブロックとして保存される
ユーザーのブロックを再利用可能ブロックに追加して保存する

再利用ブロックに追加するオリジナルのブロックに名前を付けて保存します。

ユーザーが作成したブロックに名前を付けて保存すると再利用可能ブロックになる
ユーザーが作成したブロックに名前を付けて再利用可能ブロックとして保存する

呼び出すには他のブロックと同じように、ブロックの追加アイコンをクリックしてリストから選びます。

再利用可能カテゴリーから保存したオリジナルのブロックを呼び出す
再利用可能カテゴリーから保存したオリジナルのブロックを呼び出す

ユーザーからはあまりいい評判を聞かないWordPressの新しいエディタGutenberg、私自身も批判的なところが多いのですが、再利用可能ブロックは便利じゃないかと思いました。

WordPress:IE11だとGutenbergの再利用ブロックが使えない

WordPressの新しいエディタ「Gutenberg」の再利用ブロック――一度作成したカスタムHTMLなどのブロックを保存しておいて別の投稿に挿入できる――が、InternetExplorer 11だとうまく機能しません。
WordPressのバージョン 5.0.3でプラグインをすべて無効にし、一切カスタマイズしていない素の状態でもダメでした。

ブロックは削除されたか、利用できません。

「ブロックは削除されたか、利用できません。」と表示されてしまう
別のブラウザで保存していた「再利用ブロック(Reusable block)」がIE11では表示されません

あらかじめ作成していた投稿を、InternetExplorer 11を使って編集しようとしたら再利用ブロックが表示されませんでした。
他のブロックを編集して更新して投稿を表示すると、編集画面では表示されなかった再利用ブロックの部分も問題なく表示されました。どうやら、再利用ブロックが削除されたわけではなく編集できない状態になっているようです。

確認してみましたが、 InternetExplorer 11自体はWordPressのGutenbergに対応しているようです。


Gutenberg はどのブラウザーに対応しますか ?
Gutenberg はモダンブラウザーおよび Internet Explorer 11 で動作するようになります。
Make WordPress handbook に対応ブラウザーの一覧があります。私たちの言う「モダンブラウザー」とは、ほとんどの場合、各メジャーなブラウザーの最新および過去2バージョンのことを意味しています。

Gutenberg についてのよくある質問

Edgeなどのモダンブラウザは問題がない

Microsoft Edgeでは再利用ブロックがちゃんと表示される
Microsoft Edgeや他のモダンブラウザだと問題なく再利用ブロックが表示されます

念のためInternetExplorer 11 以外のブラウザ、Microsoft Edge、Mozilla Firefox やGoogle Chromeなどのモダンブラウザでも確認しましたが、編集画面で再利用ブロックが表示されない問題はありませんでした。

表示だけでなく再利用できない

InternetExplorer 11 ではブロックの追加リストに再利用ブロックが出てこない
InternetExplorer 11 ではブロックの追加リストに再利用ブロックが出てこない

再利用ブロックは表示されないだけでなく、ブロックの追加のリストに表示される一覧にも出てきません。
この現象も InternetExplorer 11だけで、ほかのモダンブラウザでは認められませんでした。

使うべきじゃない InternetExplorer 11

この再利用ブロックの問題はおそらくGutenbergのバグだと思われますが、バグが修正されるのを待つよりは「 InternetExplorer 11 は使わない」というのが結論です。

モダンブラウザでは追加リストにちゃんと表示されている再利用ブロック
モダンブラウザでは追加リストにちゃんと表示されている再利用ブロック

あまりいい評判を聞かないWordPressのGutenbergですが、今後のことを考えたら慣れていかないといけません。できるだけ使い込んでみます。

WordPress:Gutenbergの編集画面が日本語化されない不具合修正

WordPressの新しいエディタ「Gutenberg」 で、編集画面の日本語翻訳が一部だけになるという不具合がバージョン 5.0.1の時点では存在しましたが、 バージョン 5.0.2で修正されたようです。

特定の条件下での不具合

不具合が生じたのは、 WordPressをサブディレクトリにインストールし、ルートドメインからは
https://mediadesign.jp/sub-dir/
のような状態でWordPressのトップページが表示される場合でした。

日本語訳が不完全な編集画面

バージョン 5.0.2へアップデート

WordPress のシステムをバージョン 5.0.2へアップデートしたところ、サブディレクトリにインストールした場合でもちゃんと日本語に翻訳されるようになりました。

バージョン5.0.2では日本語訳されている

それでもまだ新しいエディタに馴染めません・・・・・

WordPress:Gutenbergの編集画面が日本語化されない

WordPress5シリーズのリリースに伴って追加された新しいエディタ「Gutenberg」は、投稿内容をブロック単位で管理するようになっていて、「見出しブロック」「段落ブロック」「ソースコードブロック」「カスタムHTMLブロック」「ショートコードブロック」「最新の記事ブロック」等々を単位として投稿に追加・編集するようになりました。
使い慣れるまでにちょっと時間がかかりそうですが、少しずつ慣れるしかありませんね。でも不具合がちょっと・・・・

翻訳が不完全

WordPressのバージョン 5.0.0にアップデートした時点で、編集画面の日本語翻訳が一部だけだったので、今後のアップデートで修正されるのかと思っていたら、バージョン 5.0.1になっても不完全なままです。

日本語訳が不完全な編集画面

ただでさえ大きく変わったGutenbergエディタですから、こういった不具合があるとちょっとこれは使いにくいな、使うのやめようか、と思わざるをえません。

ちゃんと翻訳されてるサイトもある

ところが、別のWordPressサイトで投稿の新規追加を行うと、編集画面はちゃんと日本語訳されています。

日本語訳されている編集画面

違いは何だろう?

どちらのサイトもWordPressのバージョンは同じ 5.0.1です。
もちろん使っているテーマやプラグインは違っていますが、翻訳が一部だけのサイトの方がカスタマイズされていないWordPressなので、翻訳が不完全になる原因はテーマファイルやプラグインの不具合によるものではなさそうです。

原因は?

翻訳されているサイトと、されないサイトを比較してみると次のようなことがわかりました。

日本語訳が不完全なサイトはWordPressをサブディレクトリにインストールしていました。インストールしたディレクトリがサブディレクトリで、ルートドメインからは
https://mediadesign.jp/sub-dir/
のような状態でWordPressのトップページが表示されるようになっているとダメなようです。

一方で、日本語訳が表示されるのはルートドメインあるいはサブドメインのトップでトップページが表示されているサイトでした。
https://mediadesign.jp/ ルートドメインのトップ(日本語訳OK)
https://sub-dom.mediadesign.jp/ サブドメインのトップ(日本語訳OK)

また、サブディレクトリにインストールしている場合でも、プラグインの「
Gutenberg」を有効にしていると日本語訳が表示されるようになりました。どうも翻訳ファイルの読み込みがうまくできていないのが原因のようです。



「Contact Form 7」が表示するメッセージボックスの位置を変更する

WordPressのメールフォームプラグイン「Contact Form 7」では、フォームに記入された内容を実際に送信する前にチェックして、ユーザーに「入力内容に不備があります。確認してもう一度送信してください。」といったメッセージを表示します。
しかしながら、デフォルトのメールフォームが表示するメッセージボックスの位置はフォームの一番最後となっているので、ディスプレイサイズによってはメッセージボックスが画面の外に表示されて、スクロールしないと見ることができません。
contactform7_2
contactform7_3

メッセージボックスの位置を変更するには、コンタクトフォーム内の好きな位置にメッセージボックスを表示させる[response]というタグを設置します。
contactform7_4

これだけでメッセージボックスを思い通りの場所に表示させることができます。
contactform7_5

WordPressのメールフォームを「Contact Form 7」で設置する

WordPress(ワードプレス)からメールを送るためのフォームを手軽に作ることができるプラグイン「Contact Form 7」。投稿や固定ページにデザインされたメールフォームを簡単に設置できるばかりでなく、機能的にも優れたプラグインです。

Contact Form 7のページ
http://contactform7.com/ja/

インストール
WordPressの管理画面のプラグイン>新規追加で「Contact Form 7」をキーワードにしてプラグインの検索をします。
contactform7

「いますぐインストール」をクリックして正常にインストールできたら、「有効化」します。
contactform7b

メールフォームの設置
WordPressの管理画面の「お問い合わせ」をクリック、サンプルとして設定済みのメールフォーム「コンタクトフォーム 1」に手を加えて、メールフォームを設置してみます。「コンタクトフォーム 1」をクリックしてフォームの編集画面に移動します。
contactform7c

「コンタクトフォームの編集」の画面で「このコードをコピーして・・・」の下のに表示されているショートコード[contact-form-7 id="199" title="コンタクトフォーム1"]をコピーします。id=”xxx”で指定されている数字はフォーム作成時に指定される固有の数字です。
メールフォームの名前を変えたければ、上に表示されている「コンタクトフォーム1」の部分をクリックすると変更できます。
contactform7d

投稿や固定ページの本文中にコピーしたショートコードを貼り付けます。
「公開」をクリックすればメールフォームの出来上がり。ですが、ちゃんと送信できるのかテストがまだです。ページの「公開状態」を「非公開」にして「更新」します。
contactform7e

メールフォームのページから送信されるメールは「コンタクトフォームの編集」画面の「メール」にある「宛先:」で指定されているアドレスに送られます。このアドレスは、WordPressの管理画面の設定>一般で設定してあるメールアドレスが使われます。別のメールアドレスに送りたい場合には、「コンタクトフォームの編集」画面の「メール」にある「宛先:」で別のアドレスを指定します。
contactform7f

必要最低限のメールフォームですが、ちゃんと機能するでしょうか。非公開のページからでもテスト送信は可能です。
期待通りにメールが送信できたら、公開です。
contactform7g

WordPressのインストール:WordPressをローカル環境で動かす

1 WordPressのダウンロード

名称未設定-5WordPressの日本語サイト(http://ja.wordpress.org/)から
WordPress 3.5.1をダウンロード。

2 WordPressのインストール

名称未設定-6ダウンロードしたwordpress-3.5.1-ja.zipを展開(Windowsの場合ダブルクリックでオープン)。
その中にあるwordpressフォルダを、XAMPPポータブルをインストールしたディレクトリ内のhtdocsフォルダへコピーします。

ブラウザでhttp://localhost/wordpress/へアクセスする。
名称未設定-7「wp-config.phpファイルが見つかりません。・・・」というエラー画面が表示されますが、これから作成するので問題なし。
「設定ファイルを作成する」をクリックして続行します。

名称未設定-8データベースの設定に進みます。
「さあ、始めましょう!」をクリックして続行。

名称未設定-9データベース名には、先ほどphpMyAdminで作成した「wp」を入力。
データベースのユーザー名は「root」。
データベースのパスワードは設定されていないので空欄のままにします。
データベースのホスト名は「localhost」。
テーブル接頭辞は変更せずに「wp」のまま。あるいは適当な名前にしてもかまいません。
「送信」ボタンクリックで続行。

名称未設定-10データベースとの接続に成功しました。
「インストール実行」をクリックして続行します。

名称未設定-11
サイトのタイトルは空欄のままでも可。

ユーザー名を入力。

パスワードは任意のワードを入力。あるいは自動生成されるので空欄のままでも大丈夫です。

メールアドレスは必須。

プライバシーのチェックはどちらでも可。

「WordPressをインストール」をクリックして続行。

名称未設定-12
インストールに成功するとログインできるようになります。
「ユーザー名」と「パスワード」をメモしてから「ログイン」ボタンをクリックして続行。

名称未設定-13
メモしておいた「ユーザー名」と「パスワード」を入力して「ログイン」。

ログインに成功すると、
WordPressのダッシュボードが表示されます。

名称未設定-14
ローカル環境でWordPressを動かす準備が整いました。

データベースの作成:WordPressをローカル環境で動かす

XAMPPの動作を確認したら、次はWordPressが使うMySQLのデータベースを作成します。

1 phpMyAdminの起動

名称未設定-2XAMPPコントロールパネルのMySQLの「Admin」ボタンをクリック。

名称未設定-3ブラウザでphpMyAdmin(データベースの管理ツール)が起動。
「データベース」をクリック

2 データベースの作成

名称未設定-4「データベースを作成する」下の空欄に、WordPressで使用するデータベース名を入力して「作成」をクリック。
上記の例では「wp」という名前のデータベースを作成。

名称未設定-4b

XAMPPのApacheが起動しない:WordPressをローカル環境で動かす

※ 起動できないときはポートをチェック

>>Skype、IISとXAMPP

もし、起動できないようであればXAMPPが利用するポートが既に使われている可能性があります。一部のアプリケーション(SkypeやGladinet Cloud Desktop、IIS)では、XAMPPのApacheが使用するポート番号80を使用することが知られています。

>>portcheck.batを使う

XAMPPをインストールしたパソコンのポート状況を調べるには、XAMPPをインストールしたフォルダ(xampp-portable\install)にある「portcheck.bat」を使います。
キャプチャ1「portcheck.bat」をダブルクリックして起動すると、コマンドプロンプト画面のウィンドウが表示され、チェックが終わると自動的に閉じます。

キャプチャ2xampp-portable\installフォルダに「portcheck.ini」というファイルが作成されるので、テキストエディタで開いてみます。

[Ports]
Port80=FREE
Port443=FREE
Port3306=FREE
Port21=FREE
Port14147=FREE
Port8080=FREE

XAMPPのモジュールが起動していない時に、すべてのポートが「FREE」となっていれば問題ありませんが、「BLOCKED」となっていた場合にはそのポートを使うことができません。

>>XAMPPコントロールパネルのNetstatでチェック

キャプチャ3あるいは、XAMPPコントロールパネルの「Netstat」ボタンを押してチェックすることもできます。

キャプチャ4Apacheで使うポート番号80、443が、既に使われていないか確認します。

もしも必要なポート番号が使われていた場合には、方法1 そのポートを使っているプロセス(プログラム)・サービスを停止するか、方法2 XAMPPで使うポートを変更する必要があります。

方法1 プロセス・サービスを停止

Windowsのタスクマネージャで必要なポート番号を使っているプロセスのタスクを終了させたり、サービスを停止します。
間違えて別のタスクを終了させたり、必要なサービスを止めると思わぬ副作用が生じたりトラブルの原因となる場合もあるので注意。

方法2 Apacheのポート設定変更

XAMPPポータブルをインストールしたxampp-portableディレクトリ内にあるxampp-portable\apache\confの「httpd.conf」のポート番号を書き換え。

httpd.conf
・・・・・・・
#Listen 0.0.0.0:80
#Listen [::]:80
Listen 8080
・・・・・・・
#ServerName localhost:80
ServerName localhost:8080

もう一つ、XAMPPポータブルをインストールしたxampp-portableディレクトリ内にあるxampp-portable\apache\conf\extraの「httpd-ssl.conf」のポート番号を書き換え。

httpd-ssl.conf
・・・・・・・
#Listen 0.0.0.0:443
#Listen [::]:443
Listen 448

いずれの場合も書き換えるポート番号は使われていない番号でなくてはなりません。

現在動いているローカルマシンに変更を加えない方法2がおすすめです。
方法2でポートを変更したローカルホストにアクセスするには

http://localhost:8080/

のように、ポート番号を付け加えてアクセスする必要があります。