Tag: HTML Code

Using Jetpack Comments with Required+ Foundation

coding

I wanted to use the WordPress Jetpack Comments feature on my site and found that the form wasn’t showing up with the original code for my site which uses the Required + Foundation basic framework so I did a quick search on Google and found a solution was to insert the comment form code into the comments.php instead of using the older comments template.

Here is some code to help add the comment form to the comment.php for the Require+Foundation theme framework. Not sure if this is the best way to do it, but it seems to work for me here on this site.

This is for Required+ Foundation version 1.0.10

Modified code with comments:

<?php
/**
 * The template for displaying Comments.
 *
 * The area of the page that contains both current comments
 * and the comment form. The actual display of comments is
 * handled by a callback to required_comment() which is
 * located in the functions.php file.
 *
 * @package required+ Foundation
 * @since required+ Foundation 0.3.0
 */
?>  <!-- START: comments.php -->

  <div id="comments">


  <?php if ( post_password_required() ) : ?>
    <p class="nopassword"><?php _e( 'This post is password protected. Enter the password to view any comments.', 'requiredfoundation' ); ?></p>
  </div><!-- #comments -->
  <?php
      /* Stop the rest of comments.php from being processed,
       * but don't kill the script entirely -- we still have
       * to fully load the template.
       */
      return;
    endif;
  ?>

  <?php // You can start editing here -- including this comment! ?>

  <?php if ( have_comments() ) : ?>
    <h2 id="comments-title">
      <?php
        printf( _n( 'One thought on “%2$s”', '%1$s thoughts on “%2$s”', get_comments_number(), 'requiredfoundation' ),
          number_format_i18n( get_comments_number() ), '<span>' . get_the_title() . '</span>' );
      ?>
    </h2>

    <?php if ( get_comment_pages_count() > 1 && get_option( 'page_comments' ) ) : // are there comments to navigate through ?>
    <nav id="comment-nav-above">
      <h1 class="assistive-text"><?php _e( 'Comment navigation', 'requiredfoundation' ); ?></h1>
      <div class="nav-previous"><?php previous_comments_link( __( '← Older Comments', 'requiredfoundation' ) ); ?></div>
      <div class="nav-next"><?php next_comments_link( __( 'Newer Comments →', 'requiredfoundation' ) ); ?></div>
    </nav>
    <?php endif; // check for comment navigation ?>

    <ol class="commentlist">
      <?php
        /* Loop through and list the comments. Tell wp_list_comments()
         * to use required_comment() to format the comments.
         * If you want to overload this in a child theme then you can
         * define required_comment() and that will be used instead.
         * See required_comment() in required/functions.php for more.
         */
        wp_list_comments( array( 'callback' => 'required_comment' ) );
      ?>
    </ol>

    <?php if ( get_comment_pages_count() > 1 && get_option( 'page_comments' ) ) : // are there comments to navigate through ?>
    <nav id="comment-nav-below">
      <h1 class="assistive-text"><?php _e( 'Comment navigation', 'requiredfoundation' ); ?></h1>
      <div class="nav-previous"><?php previous_comments_link( __( '← Older Comments', 'requiredfoundation' ) ); ?></div>
      <div class="nav-next"><?php next_comments_link( __( 'Newer Comments →', 'requiredfoundation' ) ); ?></div>
    </nav>
    <?php endif; // check for comment navigation ?>

  <?php
    /* If there are no comments and comments are closed, let's leave a little note, shall we?
     * But we don't want the note on pages or post types that do not support comments.
     */
    elseif ( ! comments_open() && ! is_page() && post_type_supports( get_post_type(), 'comments' ) ) :
  ?>
    <p class="nocomments"><?php _e( 'Comments are closed.', 'requiredfoundation' ); ?></p>
  <?php endif; ?>

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


<section id="respond">

/** Replace Reqired Code With The Comment Form Call */

<?php comment_form(); ?>

</section>

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

</div><!-- #comments -->
<!-- END: comments.php -->
									

HTML Twitter & Facebook Links

Let’s say you wanted to make a link somewhere on your site for Facebook and Twitter share buttons, but you wanted to control the url, the title, and the message being shared – Here is some example code on how to do just that:

Share this on Facebook

<a href="http://www.facebook.com/sharer.php?s=100&amp;p[title]=Put Your Title Here&amp;p[summary]=Put Your Message Text Here.&amp;p[url]=http://www.yoururl.com/"><img style="vertical-align: -10px;" src="http://cookefamily.us/wp-content/uploads/2012/03/facebook.png" alt="" /><span style="color: black; font-size: 14px;"> Share this on Facebook</span></a>
									

Share this on Twitter

<a style="text-decoration: none;" href="https://twitter.com/share?text=Put The Text You Want in Your Tweet Here @ReplyName : &amp;url=http://yoururlhere/" target="new"><img style="vertical-align: -10px;" src="http://cookefamily.us/wp-content/uploads/2012/03/twitter.png" alt="" /><span style="color: black; font-size: 14px;"> Share this on Twitter</span></a>
									

I would typically use this code on a landing page or product page with links back to that specific page and a blurb about the person, site, product. Icons and text for the links can be changed as well as the messages you use inside Facebook and Twitter.

Example 1:

Example 2:

Facebook:

Twitter: