WordPressのログインユーザーがフロントエンドから新規投稿や編集・削除できるようにするプラグイン「Frontend Publishing」
【この記事の目次】－ 必要な部分だけ見たいときにどうぞ － [表示する]
Wordpressでサイトを作るにあたってやってみたいのが「誰かに投稿してもらう」機能の追加。有名処では
というプラグインがあります。
ちょっと脱線しますが「Wp User Frontend」プラグインは、独自のフォーム（選択ボタンなども設置可能）で、登録ユーザーまたは未登録ユーザー（つまりゲスト）が何かを投稿するための機能を追加するプラグインで高機能なのでいろいろなところで紹介されています。
今回紹介する「Frontend Publishing」は、単純に登録したユーザーがログインした状態でもバックエンドへ行くことなく新規投稿、編集、削除が行えるプラグインで、「Wp User Frontend」のように、投稿後の表示方法をテンプレートにゆだねる必要がありません（つまり、いつもの管理画面側からの投稿と同じ）から、サイトによっては「Wp User Frontend」よりも使い勝手がいいプラグインかも知れません。
【Frontend Publishing】プラグインの用途や機能
- 登録ユーザーがログインした状態でのみフロントエンドから投稿できる
- そのユーザーが投稿したリストを表示でき、編集や削除ができる
- タイトルや本文の文字数に制限をかけることができる
- ほぼ管理画面の投稿画面と同じことができる
- メディアのアップロード、挿入ができる
- ビジュアルエディタで編集できるので投稿プレビューと同じ効果がある
有料版ではゲスト投稿ができるようになるようです（入手してテストしてないので未確認です）
※ちなみに赤線の項目は「Wp User Frontend」にないものです。
フロントエンドから投稿できるようにするプラグインでは一般的に「プレビュー」表示ができず、公開してしまってから修正する（それでも編集を完了して確認しないとどう変わったかが確認できない）必要があるのですが、このプラグインではビジュアルエディタと同じで画像の挿入などもしながら記事が書けるので、再編集しなくてもある程度完成形が作れるのが魅力だと思います。
※テストではこのプラグインのショートコードを使って出力する投稿リストはきちんとそのユーザーのもの限定になりますが、メディアボタンをクリックして表示される画像は全ユーザーのものになりますのでその点は少し残念です。
この紹介記事を最後に編集したときの環境・バージョンなど
プラグインは製作者によって日々更新されていくため、この紹介記事が最新バージョンのものであるとは限りません。参考までにこの記事の最終更新日時点におけるテスト環境、プラグインバージョン、プラグイン導入時の留意点などを記載しておきます。
プラグインを使用（試用）したテスト環境
この記事を参考にプラグインの導入をする際以下に留意ください
- テスト環境での動作に基づいた紹介記事ですので、すべての環境で正常に動作するかどうかは不明です
- 無料版と有料版（Pro版）がある場合、特に記載がなければ無料版の情報のみを紹介しています
- このページでプラグインを使用する際に必要なショートコードやコードなどは、コピーして使用することができますが、環境によっては記号などが文字化けすることがあります。コピーしたのに動作しない場合は特に「”」「’」などの記号を入力し直してみてください。
- プラグイン本体の動作不具合や質問などは公式サイトのフォーラムなどで行ってください（ここでは質問にお答えすることはできません）
- この記事を参考にしてプラグインの導入を行われた方はページ末尾のコメント（使用した感想）への協力をお願いします
【Frontend Publishing】プラグインの設定画面や表示の日本語化と翻訳
当サイトで私が翻訳した【Frontend Publishing】プラグインの日本語化ファイルを配布しています。翻訳ファイルについての詳しい説明は
※フロントエンドでの表示部分や警告表示などについても翻訳ファイルで日本語化する必要がありますので、翻訳は必須だと思います
【Frontend Publishing】プラグインのインストールと設定
インストール方法
インストールはプラグインの新規追加でプラグイン名で検索してインストールするか、ページ先頭の画像をクリックして表示されるWordpressのプラグイン公式配布ページがダウンロードしてからアップロードインストールします。
インストール方法の詳しい解説は
を参照ください
基本的な設定方法や使い方
基本的に投稿画面を表示するには
[fep_submission_form][fep_article_list]日本語化済みの状態でリストとフォームを表示すると
な感じになります。
フォームは本文幅いっぱいに表示され、通常の投稿編集画面と同じようにビジュアルエディタで編集できるので完成したイメージを持ちながら投稿することができますから、特に投稿する方には優しい画面なのではないかと思います。
リストはそのユーザーが公開している（設定により承認待ちになっている）投稿の一覧のみが表示され、タイトル右に「編集」「削除」のリンクがあるのですぐに作業ができて便利だと思います。
無料版で設定できる項目としては
- タイトルや本文の文字数制限（最短・最長の指定が可能）
- タグの設定数（最小数・最大数の設定が可能）
- 本文などに挿入できるリンクの数
- アイキャッチ画像の設定を必須にするか否か
- 投稿に関する権限レベルの設定
など、必要最低限の機能制御ができるようになっています。
【Frontend Publishing】プラグインの便利な使い方・カスタマイズ方法など
より便利に使うカスタマイズ技やテストサイトで使用した結果や感想、Wordpressのプラグイン公式配布ページには書かれていない事柄などを紹介します。
メディアのポップアップ画面の表示が崩れるときは
私の環境での問題かも知れませんが、投稿フォームの「メディア」をクリックするとバックエンドと同じメディアのアップロードや選択ができる画面が出てきます。が、このポップアップ画面で文字や項目が被る現象が発生しました。対応するには以下のコードをテーマのCSSへ追記します（テーマによってはご自身で調整する必要があると思います）
.attachments-browser .media-toolbar {
height: 150px!important;
margin-top:10px!important;
}
h2.media-views-heading.screen-reader-text {
display: none!important;
}
.attachments-browser .attachments, .attachments-browser .uploader-inline {
top: 150px!important;
}
.media-modal label, .media-modal legend {
display: block!important;
}
.media-modal-content .media-frame select.attachment-filters {
width: 300px!important;
}
.media-modal-close {
width: auto!important;
}
button.su-generator-button.button {
display: none;
}投稿編集画面にボタンを追加するプラグインのボタンが動作しないときは
このプラグインは管理画面側の投稿編集画面をそのまま引っ張ってきている感じの動作をしますので、何かのコンテンツを追加するためのボタンが投稿編集画面に追加されるとフロントエンドフォームでも表示されるようになります。が、それらのボタンはクリックしても機能しない（呼び出されない）ので非表示にする必要があります。
通常のCSS編集と同じくブラウザのデベロッパーツールでクラス特定してdisplay:noneにすることで非表示にできますので、対処しましょう（テーマのCSSへ追記することで適用されるのは通常フロントエンド部分のみですのでバックエンドの編集画面でもボタンが消えてしまうことはありません）
ユーザーの登録やログイン／ログアウト環境を作るには
このプラグインにはユーザーの管理をフロントエンドで行う機能は備わっていませんので
※ユーザー管理プラグインには大きく
- WordPress標準のユーザーへ登録するプラグイン
- そのプラグイン独特のユーザー管理を行うプラグイン
がありますので、前者の機能を持つプラグインを使う必要がありますので注意が必要です。
このプラグインの脆弱性に関する情報
プラグインはWordpressで作ったサイトを簡単に充実させることができる魔法の追加機能ですが、それを狙って悪意のあるコードを挿入したり、情報を盗み取ったり、最悪の場合はサイトを壊す、乗っ取るといった行為を行う入り口になってしまう可能性があります（これを脆弱性といいます）。
ここではこのプラグインに関して【WPScan脆弱性データベース】で脆弱性が確認されている情報を紹介します。お使いのプラグインのバージョンに該当する情報がある場合には、対策済みのバージョンへ更新する、対策が取られていないようであれば別のプラグインの利用を検討するなどの対応をおすすめします。
脆弱性情報一覧
英語サイトからの取得データのため、一覧は英語表示、リンク先も英語ページとなりますので、英語が苦手という方は、同時翻訳が可能なブラウザを使用して閲覧してください
よく出てくる脆弱性警告と簡単な解説・参考サイト
※個人的な理解や解釈ですので、より詳しい内容についてはご自身でお調べください
Cross-Site Scripting (XSS)
フロントエンドから入力などを行うことができるサイトで、フォームに悪質なコードを仕込み、さまざまな方法でログイン情報などを盗み取る行為。より詳しい情報は以下のサイトを見てください（英語サイトです）
SQL Injection
何かを入力して条件などを設定する機能に対して悪意を持って条件を入力することで改ざんを行ったり、情報を盗み取ったりされる可能性を示す警告のことです。
WPScan脆弱性データベースの概要
以下WPScanに掲載されている概要の引用文です。WPScanの詳細はこちらを参照ください。
WPScanは、非営利目的の無料のブラックボックスWordPress脆弱性スキャナーであり、セキュリティの専門家やブログの管理者がサイトのセキュリティをテストするために作成されています。
WPScan脆弱性データベースを使ったセキュリティスキャンプラグイン
WPScanへの登録（無料）が必要ですが、現在サイトにインストールされているプラグインやテーマに関して他者から攻撃を受ける可能性があるか（安全なものかどうか）を管理画面からチェックできます。
プラグインの使用感や使用している環境など情報をお待ちしております
最後までご覧いただきありがとうございました。いかがでしたか？この記事は役に立ちましたか？？
ページの末尾にはコメント欄を用意しております。貴サイトで使用したときの感想や環境などの情報をお寄せいただけると、このプラグインに興味を持った方への有用な情報となりますので、ぜひ情報提供をお願いします。
- 基本的にいただいた情報への返信は行いませんのでご了承ください
- プラグインの不具合・使用に関する質問、このページで紹介している内容に関する問い合わせにはお答えしていません
- 誹謗中傷などこのページに不相応と思われるコメントについては公開を控えさせていただく場合があります
Wordpressのカスタマイズ、不具合解消、プラグインの使用方法などのご相談はすべてココナラのダイレクトメッセージからお受けしております。まずはこちらのバナーからお気軽にお問い合わせください。
※一度もココナラを使ったことがない方はココナラへの無料登録が必要です。こちら
から登録後、上のリンクをクリックする、またはココナラトップページから「ひまあーと」を検索してお問い合わせください。
※お問い合わせ内容により有料での対応となる場合がありますのでご了承の上ご相談ください
Wordpressの本
Amazonの人気商品楽天市場の人気商品
【中古】 本格ビジネスサイトを作りながら学ぶWordPressの教科書 2（スマートフォン対応サイト編 / プライム・ストラテジー株 / [大型..
761 円 (税込)
著者：プライム・ストラテジー株式会社出版社：SBクリエイティブサイズ：大型本ISBN-10：4797370963ISBN-13：9784797370966■こちらの商品もオススメです ● 20歳の自分に受けさせたい文章講義 / 古賀 史健 / 講談社 [新書] ■通常24時間以内に出荷可能です。■メール便は、1冊..
![できるWordPress WordPress Ver．5．x対応 本格ホーム [ 星野邦敏 ]](https://thumbnail.image.rakuten.co.jp/@0_mall/book/cabinet/6275/9784295006275.jpg?_ex=128x128)
できるWordPress WordPress Ver．5．x対応 本格ホーム [ 星野邦敏 ]
1,628 円 (税込) 送料込
WordPress Ver．5．x対応 本格ホーム 星野邦敏 相澤奏恵 インプレスデキル ワード プレス ホシノ,クニトシ アイザワ,カナエ 発行年月：2019年06月 予約締切日：2019年05月15日 ページ数：272p サイズ：単行本 ISBN：9784295006275 星野邦敏（ホシノクニトシ） WordPressの..
いつでもご相談・サイトカスタマイズの依頼を受け付けています
Wordpressのカスタマイズ、不具合解消のご相談はすべてココナラのダイレクトメッセージからお受けしております。まずはこちらのバナーからお気軽にお問い合わせください。
※一度もココナラを使ったことがない方はココナラへの無料登録が必要です。こちらから登録後、上のリンクをクリックする、またはココナラトップページから「ひまあーと」を検索してお問い合わせください。
【スポンサーリンク】
記事の拡散にご協力をお願いします
閲覧いただきありがとうございました。役に立つ情報でしたら是非SNSでシェアをお願いします
