WordPress實現投稿與會員登錄投稿功能

2024-09-07 00:50:22

字體：大中小

來源：轉載

供稿：網友

WordPress實現投稿功能

一、添加投稿表單

1、首先在當前主題的目錄下新建一個php文件，命名為tougao-page.php，然后將page.php中的所有代碼復制到tougao-page.php中；

2、刪除tougao-page.php開頭的所有注釋，即 /* 與 */ ，以及它們之間的所有內容；

3、將 <?php the_content(); ?> 改成以下代碼:

<?php the_content(); ?>

<form method="post" action="<?php echo $_SERVER["REQUEST_URI"]; ?>">

<div style="text-align: left; padding-top: 10px;">

<label>昵稱:*</label>

</div>

<div>

<input type="text" size="40" value="" name="tougao_authorname" />

</div>

<div style="text-align: left; padding-top: 10px;">

<label>E-Mail:*</label>

</div>

<div>

<input type="text" size="40" value="" name="tougao_authoremail" />

</div>

<div style="text-align: left; padding-top: 10px;">

<label>您的博客:</label>

</div>

<div>

<input type="text" size="40" value="" name="tougao_authorblog" />

</div>

<div style="text-align: left; padding-top: 10px;">

<label>文章標題:*</label>

</div>

<div>

<input type="text" size="40" value="" name="tougao_title" />

</div>

<div style="text-align: left; padding-top: 10px;">

<label>分類:*</label>

</div>

<div style="text-align: left;">

<?php wp_dropdown_categories('show_count=1&hierarchical=1'); ?>

</div>

<div style="text-align: left; padding-top: 10px;">

<label>文章內容:*</label>

</div>

<div>

<textarea rows="15" cols="55" name="tougao_content"></textarea>

</div>

<br clear="all">

<div style="text-align: center; padding-top: 10px;">

<input type="hidden" value="send" name="tougao_form" />

<input type="submit" value="提交" />

<input type="reset" value="重填" />

</div>

</form>

二、添加表單處理代碼

在tougao-page.php中,將第一個<?php 改成如下代碼:

<?php /* * Template Name: tougao * @author: Ludou * @Email : zhouzb889@gmail.com * @Blog  : http://www.ludou.org/ */

if( isset($_POST['tougao_form']) && $_POST['tougao_form'] == 'send')

{

if ( isset($_COOKIE["tougao"]) && ( time() - $_COOKIE["tougao"] ) < 120 )

{

wp_die('您投稿也太勤快了吧，先歇會兒！');

}

// 表單變量初始化     $name = isset( $_POST['tougao_authorname'] ) ? trim(htmlspecialchars($_POST['tougao_authorname'], ENT_QUOTES)) : '';

$email =  isset( $_POST['tougao_authoremail'] ) ? trim(htmlspecialchars($_POST['tougao_authoremail'], ENT_QUOTES)) : '';

$blog =  isset( $_POST['tougao_authorblog'] ) ? trim(htmlspecialchars($_POST['tougao_authorblog'], ENT_QUOTES)) : '';

$title =  isset( $_POST['tougao_title'] ) ? trim(htmlspecialchars($_POST['tougao_title'], ENT_QUOTES)) : '';

$category =  isset( $_POST['cat'] ) ? (int)$_POST['cat'] : 0;

$content =  isset( $_POST['tougao_content'] ) ? trim(htmlspecialchars($_POST['tougao_content'], ENT_QUOTES)) : '';

// 表單項數據驗證     if ( empty($name) || strlen($name) > 20 )

{

wp_die('昵稱必須填寫，且長度不得超過20字');

}

if ( emptyempty($email) || strlen($email) > 60 || !preg_match("/^([a-z0-9+_-]+)(.[a-z0-9+_-]+)*@([a-z0-9-]+.)+[a-z]{2,6}$/ix", $email))

{

wp_die('Email必須填寫，且長度不得超過60字，必須符合Email格式');

}

if ( emptyempty($title) || strlen($title) > 100 )

{

wp_die('標題必須填寫，且長度不得超過100字');

}

if ( emptyempty($content) || strlen($content) > 3000 || strlen($content) < 100)

{

wp_die('內容必須填寫，且長度不得超過3000字，不得少于100字');

}

$post_content = '昵稱: '.$name.'<br />Email: '.$email.'<br />blog: '.$blog.'<br />內容:'.$content;

$tougao = array(

'post_title' => $title,

'post_content' => $post_content,

'post_category' => array($category)

);

// 將文章插入數據庫     $status = wp_insert_post( $tougao );

if ($status != 0)

{

setcookie("tougao", time(), time()+180);

wp_die('投稿成功！感謝投稿！');

}

else     {

wp_die('投稿失??！');

}

}

代碼補充說明,如果你想讓讓投稿的文章立即發布,而不需要審核再編輯,那么請將以上代碼45行改成如下代碼:

'post_content' => $post_content, 'post_status' => 'publish',

最后進入WordPress管理后臺 – 頁面 – 創建頁面,標題為投稿(可以自己起名),內容填上投稿說明等,右側可以選擇模板,選擇 tougao 即可好了,基本的投稿功能已經添加完畢,至于表單樣式不好看,表單缺少你想要的項目等問題,你就自己添加css、表單項吧

如何實現會員登陸后投稿？請移步到:WordPress 實現會員登陸投稿

下是實現登陸后投稿的一部分代碼,我相信看到這段代碼,就能實現你想要的功能了代碼如下:

if(!is_user_logged_in()){

?>

<h3 class="base-tit">您需要登陸才能投稿！</h3>

<form method="post" action="<?php bloginfo('url'); ?>/wp-login.php" name="loginform" class="submit-signin">

  <ul>

   <li><label><b>用戶名：</b><input type="text" size="20" value="" name="log" class="ipt"></label></li>

   <li><label><b>密碼：</b><input type="password" size="20" value="" name="pwd" class="ipt"></label></li>

   <li><input type="submit" value="立即登錄" name="submit" class="btn btn-primary"></li>

   <li><a href="<?php bloginfo('url'); ?>/wp-login.php?action=register" class="btn btn-mini">注冊</a><a href="<?php bloginfo('url'); ?>/wp-login.php?action=lostpassword" class="btn btn-mini">找回密碼</a></li>

  </ul>

  <input type="hidden" value="<?php bloginfo('url'); ?>/submit" name="redirect_to">

</form>

<?php }else{?>

<h3 class="base-tit">開始投稿！</h3>

這里是投稿的表單,可自行設計........

<?php }?>

如想要跟大前端效果一樣,那表單處添加這樣的HTML代碼：

<h3 class="base-tit">您需要登陸才能投稿！</h3>

    <form method="post" action="<?php bloginfo('url'); ?>/wp-login.php" name="loginform" class="submit-signin">

        <ul>

            <li><label><b>用戶名：</b><input type="text" size="20" value="" name="log" class="ipt"></label></li>

            <li><label><b>密碼：</b><input type="password" size="20" value="" name="pwd" class="ipt"></label></li>

            <li><input type="submit" value="立即登錄" name="submit" class="btn btn-primary"></li>

            <li><a href="<?php bloginfo('url'); ?>/wp-login.php?action=register" class="btn btn-mini">注冊</a><a href="<?php bloginfo('url'); ?>/wp-login.php?action=lostpassword" class="btn btn-mini">找回密碼</a></li>

        </ul>

        <input type="hidden" value="<?php bloginfo('url'); ?>/submit" name="redirect_to">

    </form>

    <?php }else{?>

    <h3 class="base-tit">開始投稿！</h3>

    <ul class="submit-form">

        <li>

            <label>

                <span class="submit-tit"><em>*</em>文章標題</span>

                <input type="text" class="ipt ipt-submit-title u_ipt_error" placeholder="寫點什么..." size="40">

                <span class="u_tip" style="display: inline-block;">標題不能為空！</span>

            </label>

        </li>

        <li>

            <label>

                <span class="submit-tit"><em>*</em>所屬分類</span>

                <?php wp_dropdown_categories('show_count=1&hierarchical=1&exclude=1,97,149,461&class=ipt-submit-cat'); ?>

            </label>

        </li>

        <li>

            <label>

                <span class="submit-tit"><em>*</em>文章網址</span>

                <input type="url" class="ipt ipt-submit-url" size="40" value="http://">

                <span class="u_tip"></span>

            </label>

        </li>

        <li>

            <label>

                <span class="submit-tit"><em>*</em>作者</span>

                <input type="url" class="ipt ipt-submit-author" size="40" value="<?php echo $u_name;?>">

                <span class="u_tip"></span>

            </label>

        </li>

        <li>

            <label>

                <span class="submit-tit"><em>*</em>E-mail</span>

                <input type="url" class="ipt ipt-submit-email" size="40" value="<?php echo $u_mail;?>">

                <span class="u_tip"></span>

            </label>

        </li>

        <li>

            <label>

                <span class="submit-tit"><em>*</em>文章內容</span>

                <textarea placeholder="寫點什么..." class="submit-content u_ipt_error"></textarea>

                <span class="u_tip u_tip_content" style="display: inline-block;">內容不能為空！</span>

            </label>

        </li>

        <li>

            <input type="button" value="立即提交" class="btn btn-primary dosubmit">

            <input class="btn"  type="reset" value=" 重填 " />

        </li>

        <li style="padding-top:10px;"><span class="tip"></span></li>

    </ul>

接著就是CSS樣式了,代碼如下:

<style>

.submit-form li{margin-bottom: 12px;padding-left: 100px;clear: both;position: relative;}

.submit-tit{width: 94px;float: left;margin-left: -100px;text-align: right;font-size: 14px;line-height: 26px;}

.submit-form label em{color: #f00;font-style: normal;font-family: fantasy;margin-right: 2px;}

.submit-form .ipt{width: 300px;}

.submit-form select{border: 1px solid #D2D2D2;width: 314px;padding: 2px;border-radius: 2px;height: 30px;}

.submit-form textarea{border: 1px solid #D2D2D2;width: 98%;padding: 5px;border-radius: 2px;height: 250px;}

.submit-form .btn-primary{width: 90px;margin-right: 10px;}

.u_tip{position: absolute;margin-left: 10px;background-color: #F2DEDE;border: 1px solid #EED3D7;border-radius: 2px;height: 29px;line-height: 29px;padding: 0 10px;color: #B94A48;display: none;}

.u_ipt_error,.submit-form textarea.u_ipt_error{border: 1px solid #E0BAD2;box-shadow: 0 0 4px #E0BAD2;}

.u_tip_content{bottom: -42px;left: 47%}

.tip{background-color: #D9EDF7;border: 1px solid #BCE8F1;border-radius: 2px;padding: 6px 10px;color: #3A87AD;font-weight: bold;display: none;}

.article-entry ul{margin-left: 36px;}

.submit-signin ul{padding:10px 0 0 200px;}

.submit-signin li{clear:both;margin-bottom: 15px;}

.submit-signin b{float: left; width: 195px;text-align: right; margin-left: -200px;line-height: 29px;font-size: 14px;}

.submit-signin .ipt{width: 220px;font-weight: bold}

.submit-signin .btn-primary{width: 100px;}

.submit-signin .btn-mini{margin-right: 10px;}

</style>

對了,還有表單處需要一些參數,以下代碼是調用參數的,代碼如下:

<?php

    global $current_user;

    get_currentuserinfo();

    $cur_id    = $current_user->ID;

    $user_info = get_userdata($cur_id);

    $u_login   = $user_info->user_login;

    $u_mail    = $user_info->user_email;

    $u_time    = $user_info->user_registered;

    $u_name    = get_user_meta($cur_id,'nickname',true);

?>