highlight-authors-comments-in-wordpress

نظرات بخش بسیار مهمی را در وبسایت شما ایفا می کنند و نادیده گرفتن آن کمی کاربران را از شما و سایتتان دور می کند.تصور کنید متنی را نوشته اید که کاربری بسیار خوشش آمده و می خواهد نظر بدهد اما نظرات بسته هستند و یا اصلا وجود ندارند.در این آموزش چندین بحش استایل دادن به فرم های نظر دهی را برای شما قرار می دهیم تا کاربرانتان را ترغیب به ارسال نظر نمایید.

در قسمت  استایل دهی چیدمان نظرات در وردپرس به شما نحوه استایل دهی را آموزش دادیم و در قسمت کامنت ها در وردپرس نحوه ارتباط با کامنت ها در وردپرس را آموزش دادیم.حال می خواهیم فرم نظرات را استایل بدهیم

. را تولید می کند که شما می توانید از آن استفاده نمایید  <?php comment_form(); ?> وردپرس به طور پیشفرض تابع 

به طور پیش فرض این تابع فرم نظرات  را با سه زمینه متن (نام، ایمیل، و وب سایت)، یک textarea برای متن کامنت، و  دکمه ارسال تولید می کند. شما به راحتی می توانید هر یک از کلاسهای پیش فرض CSS  این زمینه ها را  با سرعت،  تغییر دهید. در زیر لیستی از پیش فرض کلاس های CSS که  وردپرس  به هر فرم نظر می افزاید  را می بینید .

#respond { } 
#reply-title { } 
#cancel-comment-reply-link { }
#commentform { } 
#author { } 
#email { } 
#url { } 
#comment 
#submit
.comment-notes { } 
.required { }
.comment-form-author { }
.comment-form-email { } 
.comment-form-url { }
.comment-form-comment { } 
.form-allowed-tags { } 
.form-submit

 

 

به سادگی شما می توانید با سرعت کلاس های css فرم خود را استایل دهید.بگذارید به جلوتر برویم و فرم های خود را کمی جلوه بهتر دهیم.به وسیله کد زیر می توانید فیلد فعال را highlight نمایید

#respond { 
background: #ececec;
padding:0 5px 0 5px;
}

/* Highlight active form field */

#respond input[type=text], textarea {
  -webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  -o-transition: all 0.30s ease-in-out;
  outline: none;
  padding: 3px 0px 3px 3px;
  margin: 5px 1px 3px 0px;
  border: 1px solid #DDDDDD;
}
 
 
#respond input[type=text]:focus, textarea:focus {
  box-shadow: 0 0 5px rgba(81, 203, 238, 1);
  margin: 5px 1px 3px 0px;
  border: 1px solid rgba(81, 203, 238, 1);
}

 


به وسیله کد زیر می توانید فیلد های متنی را استایل دهید

#author { 
font-family: Lobster, "Lobster 1.4", "Droid Sans", Arial;
font-size: 16px;
color:#1d1d1d; 
letter-spacing:.1em;
} 

#url  { 
color: #21759b;
font-family: "Luicida Console", "Courier New", "Courier", monospace; 
} 

 


به وسیله کد زیر می توانید دکمه  ارسال را استایل دهی نمایید

#submit {
font-family: Arial;
color: #ffffff;
font-size: 20px;
padding: 10px;
text-decoration: none;
box-shadow: 0px 1px 3px #666666;
-webkit-box-shadow: 0px 1px 3px #666666;
-moz-box-shadow: 0px 1px 3px #666666;
text-shadow: 1px 1px 3px #666666;
background: -webkit-gradient(linear, 0 0, 0 100%, from(#006ad4), to(#003366));
background: -moz-linear-gradient(top, #006ad4, #003366);
} 

#submit:hover {
  background: -webkit-gradient(linear, 0 0, 0 100%, from(#003366), to(#006ad4));
  background: -moz-linear-gradient(top, #003366, #006ad4)
}

 


همچنین به وسیله کد php زیر می توانید فیلد  url و یا وبسایت را غیر فعال نمایید.کد زیر را در functions.php وارد نمایید

function wpbeginner_remove_comment_url($arg) {
    $arg['url'] = '';
    return $arg;
}
add_filter('comment_form_default_fields', 'wpbeginner_remove_comment_url');

 

 

 

 

 

 

 

 

 

 

تاریخ آخرین بروزرسانی : ۲۶ فروردین ۱۳۹۵
میلاد میلادی

باور هایت را که پرورش دهی به هرچیزی دست خواهی یافت.

ارسال نظر

آدرس الکترونیکی شما نمایش داده نمی شود *

Time limit is exhausted. Please reload CAPTCHA.