1コメントバブルJetpackのなしのジェットパックスタイルのコメント

One of the best things about word­press is the built-in social aspect provided by com­ments. Get­ting your com­ment sec­tion right can be very import­ant to any web­site, includ­ing ours. Over the years we’ve exper­i­mented with vari­ous com­ment plu­gins includ­ing Dis­qus and more recently Jet­pack. How­ever, 我々は常に管理のために戻って家の中のものを持って来ることになったきた, per­form­ance and pri­vacy reas­ons. When I moved back from Jet­pack com­ments I really missed some of the slick fea­tures provided by Jet­pack, both the social-net­work logins and the gen­er­al slick styl­ing. Any­way, to cut a long story short I finally had time today to take a good look at how word­press “does” com­ments and fig­ure out a way to build an in-house sys­tem which looks nice and slick like the com­ment inter­face provided by jet­pack. Best of all its sur­pris­ingly simple and does things the “prop­er” way…


First — to deal with the “social” aspect, I’ve resor­ted to a plu­gin called Word­Press Social Login 沿って MiledThere are sev­er­al “social login” plu­gins, but this ver­sion (unlike the oth­ers) keeps everything totally in-house. It is a bit more work to con­fig­ure, but for the bene­fit to our vis­it­ors pri­vacy alone this is well worth it.

次は、組み込みのWordPressのコメントフォーム機能を変更する方法を考え出すした (楽しいnily十分呼ばcomment_form()).  誰もがそれを要求した場合は、後で詳しく説明しますよ, 今すぐ下REL-EV-ANTのコードを見つけるために...

comments.php (テーマフォルダ内の)

<!-- You can start editing here. -->

<?php if ( comments_open() ) : ?>

<section id="respond" class="respond-form">
<?php comment_form(); ?>

<script>
document.getElementById('hidden-form-area').style.display = 'none';
function myFunction()
{
document.getElementById('hidden-form-area').style.display = 'block';
}
</script>

</section>

<?php endif; // if you delete this the sky will fall on your head ?>

のfunctions.php (テーマフォルダ内の)

function my_fields($fields)
{
    $fields['author'] = '<p class="comment-form-author"><input type="text" name="author" id="author" size="22" tabindex="1" placeholder="Name (required)" /></p>';
    $fields['email'] = '<p class="comment-form-email"><input type="text" name="email" id="email" size="22" tabindex="2" placeholder="E-mail (required - never shared with anyone)" /></p>';
    $fields['url'] = '<p class="comment-form-url"><input type="text" name="url" id="url" size="22" tabindex="2" placeholder="Website" /></p>';
    return $fields;
}
add_filter('comment_form_default_fields','my_fields');

function remove_notice($defaults)
{
    $defaults['comment_notes_before'] = '';
    $defaults['comment_notes_after'] = '';
    return $defaults;
}
add_filter( 'comment_form_defaults', 'remove_notice' );

function remove_textarea($defaults)
{
    $defaults['comment_field'] = '';
    return $defaults;
}
add_filter( 'comment_form_defaults', 'remove_textarea' );

function add_textarea()
{
    echo '<p class="comment-form-comment"><textarea id="comment" name="comment" placeholder="Enter your comment here..." onfocus="myFunction()"></textarea></p><div id="hidden-form-area">';
}
add_action( 'comment_form_top', 'add_textarea', 1 );

function add_hideend()
{
    echo '</div>';
}
add_action( 'comment_form_after', 'add_hideend' );

私たちが何かを逃したと思います? 私たちは以下のコメントで教えてください. あなたが購読したい場合は、右上のメニューで購読リンクをご利用ください. また、下記の社会的なリンクを使用してお友達とこれを共有することができます. 乾杯.

返信を残します

1 コメント