Tạo trang chỉnh sửa bài viết WordPress không dùng Plugin
Tạo trang chỉnh sửa bài viết Wordpress không dùng Plugin dễ dàng tùy biến theo ý của bạn
Chào các bạn, ở 2 bài trước Mình đã giúp các Bạn tự tạo Trang Đăng bài và Trang quản lý bài cho thành viên, Tiếp theo mình sẽ giúp các bạn tạo trang sửa bài viết của thành viên đã đăng lên.
Đầu tiên bạn cần tạo file sua-bai.php
Trong file này bạn cần có các nội dung sau:
– Kiểm tra thành viên đã được đăng nhập hay chưa, nếu chưa thì hiển thị khung đăng nhập
<?php /* Template Name: Sửa bài */ ?> <?php if(is_user_logged_in()) { $user_id = get_current_user_id(); $current_user = wp_get_current_user(); $vnkings = $current_user->user_level; if($vnkings <= 2) { $vnstatus = "pending"; } else { $vnstatus = "publish"; } ?> // form Sửa bài <?php } else { ?> <div class="formdangnhap"> <?php wp_login_form(); ?> </div> <?php } ?>
– Thêm Form sửa bài viết (form mình đang sử dụng cấu trúc của Boostrap để các bạn tùy biến)
<?php $idvnkings = addslashes( $_GET['id'] ); ?> <form id="new_post" class="form-horizontal" method="post" action="" enctype="multipart/form-data"> <div class="form-group vnking_pd col-sm-12 col-md-6"> <label for="post_title">Tiêu đề</label> <input type="text" name="post_title" value="<?php echo get_the_title($idvnkings) ;?>" class="form-control" placeholder="Tiêu đề"> </div> <div class="form-group vnking_pd pd_0"> <label for="post_content">Nội Dung</label> <?php $post = get_post( $idvnkings, OBJECT, 'edit' ); $content = $post->post_content; wp_editor( $content, 'userpostcontent', array( 'textarea_name' => 'post_content' ));?> </div> <div class="form-group vnking_pd col-md-6"> <?php $cats = get_the_category( $idvnkings); $selected = 0; if( $cats ) { $selected = $cats[0]->term_id; } ?> <label for="post_content">Danh mục</label> <?php wp_dropdown_categories( array( 'orderby' => 'title', 'hide_empty' => false, 'id' => 'Posts_Picture_category', 'class' => 'form-control', 'name' => 'post_category', 'selected' => $selected ) ); ?> </div> <div class="form-group vnking_pd col-md-6"> <label for="post_tags">Từ khóa</label> <input type="text" name="post_tags" value="<?php echo $tagslist; ?>" class="form-control" placeholder="Từ khóa"> </div> <div style="clear:both;"></div> <div class="form-group"> <?php $feat_image = wp_get_attachment_url( get_post_thumbnail_id($idvnkings) ); ?> <p><img style="max-width:300px; display:block;" id="output_avatar" src="<?php echo $feat_image;?>"/></p> <script> var loadFile = function(event) { var output = document.getElementById('output_avatar'); output.src = URL.createObjectURL(event.target.files[0]); $('#output_avatar').addClass('active-avatar'); }; </script> <span class="btn btn-default btn-file">Hình ảnh bài viết <input class="input-file" accept="image/*" name="file" type="file" class="file" onchange="loadFile(event)"> </span> </div> <input type="hidden" name="add_new_post" value="post" /> <?php wp_nonce_field( 'post_nonce', 'post_nonce_field' ); ?> <div class="form-group"> <div class="col-sm-12" style="padding-left:0;"> <button type="submit" class="btn btn-primary">Sửa Bài</button> </div> </div> </form>
Giải thích đoạn code
- $idvnkings = addslashes($_GET[‘id’]) : Bạn hãy để ý đường dẫn khi click vào sửa bài ở trang quản lý bài viết sẽ có dạng : domain/sua-bai.html?id=60 vậy với đoạn code trên bạn sẽ lấy được id bài viết cần sửa
- $post = get_post() : Lấy thông tin bài viết
- $content = $post->post_content : Lấy nội dung bài viết
- wp_editor() : Khung viết bài của wordpress
- $feat_image : Lấy ảnh đại diện của bài viết
- $tagslist; : Lấy Tags bài viết
- wp_nonce_field() : Bảo mật cho form bài viết, giúp chứng thực sự hoạt động của người dùng nếu form đăng bài gửi đi
– Xử lý dữ liệu khi ấn vào sửa bài viết
<?php if( $_SERVER['REQUEST_METHOD'] == 'POST' && !empty( $_POST['add_new_post'] ) && current_user_can('level_0') && isset( $_POST['post_nonce_field'] ) && wp_verify_nonce( $_POST['post_nonce_field'], 'post_nonce' )) { if (isset($_POST['post_title'])) { $post_title = $_POST['post_title']; } if (isset($_POST['post_content'])) { $post_content = $_POST['post_content']; } else { echo 'Please enter the content'; } if (isset ($_POST['post_category'])) { $post_category = $_POST['post_category']; } else { $post_category = 1; } if (isset($_POST['post_tags'])) { $post_tags = $_POST['post_tags']; } $post = array( 'ID' => $idvnkings, 'post_title' => wp_strip_all_tags($post_title), 'post_content' => $post_content, 'post_category' => array($post_category), 'tags_input' => $post_tags, 'post_type' => 'post', 'post_status' => $vnstatus2, ); $lovendpost_id_edit = wp_insert_post($post); if ($_FILES['file']['name'] == "") { } else { foreach ($_FILES as $file => $array) { $newupload = insert_attachment($file,$lovendpost_id_edit); } } echo '<div class="alert alert-success"><strong>Sửa bài Thành Công!</strong> <a href="'. get_permalink($idvnkings). '"> Xem Bài!</a></div>'; } ?>
Vậy tổng kết lại ta sẽ có 1 file sua-bai.php như sau:
<?php /* Template Name: Sửa bài */ ?> <div class="vnkings_form col-md-12"> <?php if(is_user_logged_in()) { ?> <?php $idvnkings = addslashes( $_GET['id'] ); $post_tags = wp_get_post_tags($idvnkings); $tagsarray = array(); $vnstatus2 = get_post_status($idvnkings); foreach ($post_tags as $tag) { $tagsarray[] = $tag->name; } $tagslist = implode( ', ', $tagsarray ); ?> <?php $current_user = wp_get_current_user(); $userid = $current_user->ID; $curpost = get_post( $idvnkings ); $userlevel = $current_user->user_level; //has permission? $lovenduser = $curpost->post_author; if ($userid == $lovenduser || $userlevel > 2 ) { ?> <?php if( $_SERVER['REQUEST_METHOD'] == 'POST' && !empty( $_POST['add_new_post'] ) && current_user_can('level_0') && isset( $_POST['post_nonce_field'] ) && wp_verify_nonce( $_POST['post_nonce_field'], 'post_nonce' )) { if (isset($_POST['post_title'])) { $post_title = $_POST['post_title']; } if (isset($_POST['post_content'])) { $post_content = $_POST['post_content']; } else { echo 'Please enter the content'; } if (isset ($_POST['post_category'])) { $post_category = $_POST['post_category']; } else { $post_category = 1; } if (isset($_POST['post_tags'])) { $post_tags = $_POST['post_tags']; } $post = array( 'ID' => $idvnkings, 'post_title' => wp_strip_all_tags($post_title), 'post_content' => $post_content, 'post_category' => array($post_category), 'tags_input' => $post_tags, 'post_type' => 'post', 'post_status' => $vnstatus2, ); $lovendpost_id_edit = wp_insert_post($post); if ($_FILES['file']['name'] == "") { } else { foreach ($_FILES as $file => $array) { $newupload = insert_attachment($file,$lovendpost_id_edit); } } echo '<div class="alert alert-success"><strong>Sửa bài Thành Công!</strong> <a href="'. get_permalink($idvnkings). '"> Xem Bài!</a></div>'; } ?> <div id="postBox"> <form id="new_post" class="form-horizontal" method="post" action="" enctype="multipart/form-data"> <div class="form-group vnking_pd col-sm-12 col-md-6"> <label for="post_title">Tiêu đề</label> <input type="text" name="post_title" value="<?php echo get_the_title($idvnkings) ;?>" class="form-control" placeholder="Tiêu đề"> </div> <div class="form-group vnking_pd pd_0"> <label for="post_content">Nội Dung</label> <?php $post = get_post( $idvnkings, OBJECT, 'edit' ); $content = $post->post_content; wp_editor( $content, 'userpostcontent', array( 'textarea_name' => 'post_content' ));?> </div> <div class="form-group vnking_pd col-md-6"> <?php $cats = get_the_category( $idvnkings); $selected = 0; if( $cats ) { $selected = $cats[0]->term_id; } ?> <label for="post_content">Danh mục</label> <?php wp_dropdown_categories( array( 'orderby' => 'title', 'hide_empty' => false, 'id' => 'Posts_Picture_category', 'class' => 'form-control', 'name' => 'post_category', 'selected' => $selected ) ); ?> </div> <div class="form-group vnking_pd col-md-6"> <label for="post_tags">Từ khóa</label> <input type="text" name="post_tags" value="<?php echo $tagslist; ?>" class="form-control" placeholder="Từ khóa"> </div> <div style="clear:both;"></div> <div class="form-group"> <?php $feat_image = wp_get_attachment_url( get_post_thumbnail_id($idvnkings) ); ?> <p><img style="max-width:300px; display:block;" id="output_avatar" src="<?php echo $feat_image;?>"/></p> <script> var loadFile = function(event) { var output = document.getElementById('output_avatar'); output.src = URL.createObjectURL(event.target.files[0]); $('#output_avatar').addClass('active-avatar'); }; </script> <span class="btn btn-default btn-file">Hình ảnh bài viết <input class="input-file" accept="image/*" name="file" type="file" class="file" onchange="loadFile(event)"> </span> </div> <input type="hidden" name="add_new_post" value="post" /> <?php wp_nonce_field( 'post_nonce', 'post_nonce_field' ); ?> <div class="form-group"> <div class="col-sm-12" style="padding-left:0;"> <button type="submit" class="btn btn-primary">Sửa Bài</button> </div> </div> </form> </div> <?php } else { ?> <div class="alert alert-warning"><strong>Bạn</strong> không có quyền Sửa bài viết này!</div> <?php }?> <?php } else { ?> <div class="formdangnhap"> <div class="alert alert-warning"><strong>Bạn</strong> cần đăng nhập để sửa bài!</div> <?php wp_login_form(); ?> </div> <?php } ?> </div>
Trong quá trình thực hiện nếu bạn chưa hiểu hoặc khó thực hiện bạn có thể gửi câu hỏi ở bên dưới khung bình luận, mình sẽ cùng bạn hiểu rõ về nó!
Chúc các bạn thành công!
Bài liên quan
- Đưa trình soạn thảo WordPress 5.0 về phiên bản cũ không dùng plugin
- Thêm chức năng lọc theo Meta Fields trong Dashboard WordPress
- Sửa lỗi không hiển thị Page Template để chọn khi tạo Trang ở WordPress version 4.9
- Thêm reCAPTCHA vào form đăng nhập đăng ký WordPress
- Quản lý thời gian hoạt động cho Vip Member trong WordPress
- Hiển thị bài viết mới theo Category trong WordPress
- Tự tùy biến trang Single theo Category trong WordPress
- Tạo giao diện khác nhau cho từng Category trong WordPress
Anh cho em hỏi là nếu như em muốn bài viết nào của mình thì mình mới có quyền sửa, còn bài viết của thành viên khác mình không có quyền sửa !
Khi em sửa bài viết của em, em nhập id bài viết của người khác lên URL và vẫn sửa được bình thường, nếu như vậy ai biết sẽ có thể xóa hết các bài viết của các thành viên khác. Anh giúp em phần này với ạ
Vậy chắc em đang đăng nhập với Nick Admin phải không, vì như trong bài thì những người là admin hoặc chủ nhân của bài đó thì mới sửa được
Trên bài hướng dẫn Mình có đoạn code này
Có nghĩa là nếu là author của Post hoặc Quyền hạn là Tác Giả trở lên thì có quyền sửa bài viết, Bạn có thể xóa đoạn
Thì sẽ chỉ tác giả sửa bài của mình thôi
Tại sao mình ko update lại attachment thì sẽ bị mất đi nhỉ ? khi mình update bài nhưng ko update feature image thì bị lỗi .
Bạn có thể cho mình link trang bạn để mình test được không?. vì bên mình đang sử dụng hoàn toàn bình thường
Mình đã cập nhật code rồi bạn nhé
Em cũng bị lỗi khi sửa feature a ạ
làm sao để bật xét duyệt bài sửa của thành viên vậy bạn. Chứ không thành viên sửa rồi chèn nội dung hkacs
Nếu muốn sửa xong và cần xét duyệt thì bạn thêm dòng này vào đoạn code trên
Thay vào sẽ là :
Anh cho em hỏi làm sao để bỏ đi cái .html ở chỗ domain/sua-bai.html được ạ, của em khi ấn vào sửa bài nó không có .html thì sửa được, còn có thêm .html thì báo lỗi 404 ạ. Mong anh chị giúp em ạ
Mặc định ở page Wp không có .html em ạ. Web a custom thêm .html nên mới có.
Em cứ dùng không có .html nhé.
Nếu em muốn dùng không có .html thì edit code như thế nào ạ
Tất cả trong các đoạn code có: sua-bai.html
em sửa thành sua-bai là được em ạ.
Em tìm trong file sua-bai.php mà không thấy code nào chứa sua-bai.html cả,
Em có làm theo Serie Post Front-End của anh không, Nếu có thì em vào quan-ly-bai-viet.php để xóa .html trên link sửa bài nhé
Cảm ơn anh ạ ??.
Mình làm theo mà sau khi nhấn update thì nó báo lỗi 403 là sao bạn nhỉ? Chỉ có quyền Admin mới update bài viết được 🙁
Bạn xem kỹ lại xem có làm sai bước nào không, bên mình và mọi người đã test ok cả.
Nếu được bạn chụp ảnh màn hình lên đây nhé.
Cam on nhe!
Sửa bài Thành Công! Xem Bài!
Khúc này, em click vô xem bài thì ra lỗi, này fix sao a
Bạn ơi, mình thêm các trường vào đăng bài, thế sửa bài thì mình code như thế nào ? Bạn hương dẫn mình và các bạn luôn với ạ !
Chào bạn,
Đầu tiên bạn lấy ra giá trị trường đã thêm ở đăng bài:
Tiếp theo ở phần Input bạn thêm:
Khi xử lý code khi submit: