フォームを使用したフロントエンドポスト編集
-
16-10-2019 - |
質問
標準のメタボックスといくつかのカスタムフィールドを備えたカスタムポストタイプがあります。フロントエンドのフォームを介して投稿を編集するにはどうすればよいですか?
解決
既存の投稿を編集したい場合は、 フロントエンドエディター プラグイン。
新しい投稿を作成する場合は、これらのいずれかを試してください。
他のヒント
これは、投稿/ページを更新するための基本的なソリューションです。カスタムメタフィールドのクイックデモを追加しました。これは非常に基本的なものですが、フロントエンドの投稿のプラグインレス編集の方向を指します。これは非常に柔軟ではありませんが、必要なものは何でも追加できます。
このコードをループに追加します。
<form id="post" class="post-edit front-end-form" method="post" enctype="multipart/form-data">
<input type="hidden" name="post_id" value="<?php the_ID(); ?>" />
<?php wp_nonce_field( 'update_post_'. get_the_ID(), 'update_post_nonce' ); ?>
<p><label for="post_title">Title</label>
<input type="text" id="post_title" name="post_title" value="<?php echo $post->post_title; ?>" /></p>
<p><?php wp_editor( $post->post_content, 'postcontent' ); ?></p>
<p><label for="post_title">Test</label>
<?php $value = get_post_meta(get_the_ID(), 'edit_test', true); ?>
<input type="text" id="edit_test" name="edit_test" value="<?php echo $value; ?>" /></p>
<p><label for="post_title">Test 2</label>
<?php $value = get_post_meta(get_the_ID(), 'edit_test2', true); ?>
<input type="text" id="edit_test2" name="edit_test2" value="<?php echo $value; ?>" /></p>
<input type="submit" id="submit" value="Update" />
</form>
次に、このコードをページの上部に追加して、フォームを処理します。
if ( 'POST' == $_SERVER['REQUEST_METHOD'] && ! empty($_POST['post_id']) && ! empty($_POST['post_title']) && isset($_POST['update_post_nonce']) && isset($_POST['postcontent']) )
{
$post_id = $_POST['post_id'];
$post_type = get_post_type($post_id);
$capability = ( 'page' == $post_type ) ? 'edit_page' : 'edit_post';
if ( current_user_can($capability, $post_id) && wp_verify_nonce( $_POST['update_post_nonce'], 'update_post_'. $post_id ) )
{
$post = array(
'ID' => esc_sql($post_id),
'post_content' => esc_sql($_POST['postcontent']),
'post_title' => esc_sql($_POST['post_title'])
);
wp_update_post($post);
if ( isset($_POST['edit_test']) ) update_post_meta($post_id, 'edit_test', esc_sql($_POST['edit_test']) );
if ( isset($_POST['edit_test2']) ) update_post_meta($post_id, 'edit_test2', esc_sql($_POST['edit_test2']) );
}
else
{
wp_die("You can't do that");
}
}
私が使う 高度なカスタムフィールド メタボックスを使用したフロントエンドのポスト編集がたくさんあります。 ACFを使用すると、多くの高度なメタボックスフィールドを構築し、バックエンドポストパネルに自動的に追加できます。
しかし、があります フロントエンド機能 同じように。
この方法は完全に無料です。何でもかかる唯一の方法は、リピーター、柔軟性、ギャラリーなど、より複雑なフィールドタイプのアドオンを使用したい場合です。ここではすべてうまく機能します。
最初の欠点は、投稿のタイトルと説明が含まれていないことです...しかし、これをfunctions.phpに追加することで非常に簡単に修正できます。
/**
* Deregister admin styles on the front end when using ACF forms
*
* ACF makes sure that admin styles are queued when it loads its head, this almost always causes problems with front end forms and isn't needed for our purpose
*/
add_action( 'wp_print_styles', 'custom_acf_deregister_styles', 100 );
function custom_acf_deregister_styles()
{
if (! is_admin() )
{
wp_deregister_style( 'wp-admin' );
}
}
/**
* Save ACF field as post_content / post_title for front-end posting
*/
add_action( 'acf/save_post', 'custom_acf_save_post' );
function custom_acf_save_post( $post_id )
{
if (! is_admin() && 'acf' != get_post_type( $post_id ) ) // Don't run if adding/updated fields/field-groups in wp-admin
{
$post_title = get_post_meta( $post_id, 'form_post_title', true );
$post_content = get_post_meta( $post_id, 'form_post_content', true );
$post = get_post($post_id);
if ( ($post_title && $post_title != $post->post_title) || ($post_content && $post_content != $post->post_content) )
{
$post_data = array(
'ID' => $post_id,
);
if ( $post_content ) $post_data['post_content'] = $post_content;
if ( $post_title ) $post_data['post_title'] = $post_title;
remove_action( 'acf/save_post', 'custom_acf_save_post' );
wp_update_post( $post_data );
add_action( 'acf/save_post', 'custom_acf_save_post' );
}
}
}
/**
* Load existing post_title
*/
add_filter( 'acf/load_value/name=form_post_title', 'custom_acf_load_value_form_post_title', 10, 3 );
function custom_acf_load_value_form_post_title( $value, $post_id, $field )
{
$value = get_the_title($post_id);
return $value;
}
/**
* Load existing post_content
*/
add_filter( 'acf/load_value/name=form_post_content', 'custom_acf_load_value_form_post_content', 10, 3 );
function custom_acf_load_value_form_post_content( $value, $post_id, $field )
{
$post = get_post($post_id);
$value = $post->post_content;
return $value;
}
/**
* Install Add-ons (This adds two field groups that you can use to edit title and content)
*
* The following code will include all 4 premium Add-Ons in your theme.
* Please do not attempt to include a file which does not exist. This will produce an error.
*
* All fields must be included during the 'acf/register_fields' action.
* Other types of Add-ons (like the options page) can be included outside of this action.
*
* The following code assumes you have a folder 'add-ons' inside your theme.
*
* IMPORTANT
* Add-ons may be included in a premium theme as outlined in the terms and conditions.
* However, they are NOT to be included in a premium / free plugin.
* For more information, please read http://www.advancedcustomfields.com/terms-conditions/
*/
// Fields
add_action('acf/register_fields', 'my_register_fields');
/**
* Register Field Groups
*
* The register_field_group function accepts 1 array which holds the relevant data to register a field group
* You may edit the array as you see fit. However, this may result in errors if the array is not compatible with ACF
*/
if(function_exists("register_field_group"))
{
register_field_group(array (
'id' => 'acf_form-post-title',
'title' => 'Form Post Title',
'fields' => array (
array (
'key' => 'field_25',
'label' => 'Title',
'name' => 'form_post_title',
'type' => 'text',
'default_value' => '',
'formatting' => 'html',
),
),
'location' => array (
array (
array (
'param' => 'post_type',
'operator' => '==',
'value' => 'course',
'order_no' => 0,
'group_no' => 0,
),
),
),
'options' => array (
'position' => 'normal',
'layout' => 'no_box',
'hide_on_screen' => array (
),
),
'menu_order' => -2,
));
register_field_group(array (
'id' => 'acf_form-post-content',
'title' => 'Form Post Content',
'fields' => array (
array (
'key' => 'field_13',
'label' => 'Content',
'name' => 'form_post_content',
'type' => 'wysiwyg',
'default_value' => '',
'toolbar' => 'full',
'media_upload' => 'yes',
),
),
'location' => array (
array (
array (
'param' => 'post_type',
'operator' => '==',
'value' => 'course',
'order_no' => 0,
'group_no' => 0,
),
),
),
'options' => array (
'position' => 'normal',
'layout' => 'no_box',
'hide_on_screen' => array (
),
),
'menu_order' => -1,
));
}
これにより、このようなフロントエンドフォームに追加できるタイトルとコンテンツフィールドをサポートするすべてのコードが追加されます。
// Add this above get_header()
// This loads styles/scripts, but it also processes the form, so pretty important
acf_form_head();
get_header();
// Where 51 is the id of the ACF field group of meta box fields that I want to add
acf_form( array(
'field_groups' => array('acf_form-post-title', 'acf_form-post-content', 51)
) );
この方法は、最近作業しているほとんどのサイトで使用しています。私は基本的な投稿を作成するために重力形態を使用する傾向があり、その後、前端とバックエンドにACFを使用してすべてを制御します。一番いいのは、両方のために1つの場所からすべてを管理することです。しかし、それは注目に値します ACFを使用して投稿を作成できます 同じように。私はそれを使用していませんが、私の次のプロジェクトで試してみるので、完全なメタアクセスで作成できるようにします。
個人的には、ACFは、重力形態が終了していない場合は、唯一のプラグインです。
最も簡単な方法は、次の有料拡張機能で忍者形式のようなものを使用することです。
http://wpninjas.com/downloads/front-posting/
これを自分でコーディングすることもできます。基本的にフォームを作成してから使用します wp_insert_post()
完全な投稿を作成します。
サンプルフォーム:
<form action="" id="primaryPostForm" method="POST">
<fieldset>
<label for="postTitle"><?php _e('Post Title:', 'framework') ?></label>
<input type="text" name="postTitle" id="postTitle" class="required" />
</fieldset>
<fieldset>
<label for="postContent"><?php _e('Post Content:', 'framework') ?></label>
<textarea name="postContent" id="postContent" rows="8" cols="30" class="required"></textarea>
</fieldset>
<fieldset>
<input type="hidden" name="submitted" id="submitted" value="true" />
<button type="submit"><?php _e('Add Post', 'framework') ?></button>
</fieldset>
そして、送信すると、プロセスを保存します。
if ( isset( $_POST['submitted'] ) && isset( $_POST['post_nonce_field'] ) && wp_verify_nonce( $_POST['post_nonce_field'], 'post_nonce' ) ) {
if ( trim( $_POST['postTitle'] ) === '' ) {
$postTitleError = 'Please enter a title.';
$hasError = true;
}
$post_information = array(
'post_title' => wp_strip_all_tags( $_POST['postTitle'] ),
'post_content' => $_POST['postContent'],
'post_type' => 'post',
'post_status' => 'pending'
);
wp_insert_post( $post_information );
}
完全なコードとチュートリアルは次のものです。http://wp.tutsplus.com/tutorials/creative-coding/posting-via-the-front-inserting/