0

I'm encountering an odd issue with a simple custom widget that I made to show contact info in a widget.

For some reason when I add a phone number it's repeated multiple times as you can see here:

Highlighted HTML shows repeated output example.

I've included the code for the widget below. There's nothing particularly unusual about it:

<?php


// Block direct requests
if ( !defined('ABSPATH') )
    die('-1');


add_action( 'widgets_init', function(){
   register_widget( 'my_custom_contact_widget' );
}); 

/**
 * Adds my_custom_contact_widget widget.
*/
class my_custom_contact_widget extends WP_Widget {

/**
 * Register widget with WordPress.
 */
function __construct() {
    parent::__construct(
        'my_custom_contact_widget', // Base ID
        __('Contact Info', 'my_custom-theme-support'), // Name
        array( 'description' => __( 'Your business address and email.', 'my_custom-theme-support' ), ) // Args
    );
}

/**
 * Front-end display of widget.
 *
 * @see WP_Widget::widget()
 *
 * @param array $args     Widget arguments.
 * @param array $instance Saved values from database.
 */
public function widget( $args, $instance ) {

    extract( $args );

    $title = apply_filters( 'widget_title', $instance['title'] );
    $street = $instance['address_street'];
    $city = $instance['address_city'];
    $state = $instance['address_state'];
    $zip = $instance['address_zip'];
    $email = $instance['email'];
    $email_clean = antispambot($email,1);
    $phone = $instance['phone'];
    $phone_clean = preg_replace('/\D+/', '', $phone);

    $address = '<p translate="no" itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
                    <span class="address-street" itemprop="streetAddress">%s</span><br>
                    <span class="address-locality" itemprop="addressLocality">%s</span>, <abbr title="California" itemprop="addressRegion">%s</abbr> 
                    <span class="address-zip" itemprop="postalCode">%s</span> 
                </p>';

    $email_link = '<a class="contact-email" href="mailto:%s" itemprop="email">%s</a>';

    $phone_link = '<a class="contact-phone" href="tel:%s" itemprop="telephone">%s</span>';


    echo $before_widget;

    if ( $title ) {
        echo $before_title . $title . $after_title;
    }
    if ( $street ) {
        echo sprintf($address, $street, $city, $state, $zip);
    }

    if ( $email ) {
        echo sprintf($email_link, $email_clean, $email);
    }

    if ( $phone ) {
        echo sprintf($phone_link, $phone_clean, $phone);
    }

    echo $after_widget;

}       


/**
 * Back-end widget form.
 *
 * @see WP_Widget::form()
 *
 * @param array $instance Previously saved values from database.
 */
public function form( $instance ) {

    if ( isset( $instance[ 'title' ] ) ) {
        $title = $instance[ 'title' ];
    }

    else {
        $title = __( '', 'my_custom-theme-support' );
    }


    if ( isset( $instance[ 'address_street' ] ) ) {
        $address_street = $instance[ 'address_street' ];
    }

    else {
        $address_street = __( '', 'my_custom-theme-support' );
    }

    if ( isset( $instance[ 'address_city' ] ) ) {
        $address_city = $instance[ 'address_city' ];
    }

    else {
        $address_city = __( '', 'my_custom-theme-support' );
    }

    if ( isset( $instance[ 'address_state' ] ) ) {
        $address_state = $instance[ 'address_state' ];
    }

    else {
        $address_state = __( '', 'my_custom-theme-support' );
    }

    if ( isset( $instance[ 'address_zip' ] ) ) {
        $address_zip = $instance[ 'address_zip' ];
    }

    else {
        $address_zip = __( '', 'my_custom-theme-support' );
    }

    if ( isset( $instance[ 'email' ] ) ) {
        $email = $instance[ 'email' ];
    }

    else {
        $email = __( '', 'my_custom-theme-support' );
    }


    if ( isset( $instance[ 'phone' ] ) ) {
        $phone = $instance[ 'phone' ];
    }

    else {
        $phone = __( '', 'my_custom-theme-support' );
    }


    ?>
    <p>
        <label for="<?php echo $this->get_field_id( 'title' ); ?>"><?php _e( 'Title:' ); ?></label> 
        <input class="widefat" id="<?php echo $this->get_field_id( 'title' ); ?>" name="<?php echo $this->get_field_name( 'title' ); ?>" type="text" value="<?php echo esc_attr( $title ); ?>">
    </p>
    <p>
        <label for="<?php echo $this->get_field_id( 'address_street' ); ?>"><?php _e( 'Street:' ); ?></label> 
        <input class="widefat" id="<?php echo $this->get_field_id( 'address_street' ); ?>" name="<?php echo $this->get_field_name( 'address_street' ); ?>" type="text" value="<?php echo esc_attr( $address_street ); ?>">
    </p>
    <p>
        <label for="<?php echo $this->get_field_id( 'address_city' ); ?>"><?php _e( 'City:' ); ?></label> 
        <input class="widefat" id="<?php echo $this->get_field_id( 'address_city' ); ?>" name="<?php echo $this->get_field_name( 'address_city' ); ?>" type="text" value="<?php echo esc_attr( $address_city ); ?>">
    </p>
    <p>
        <label for="<?php echo $this->get_field_id( 'address_state' ); ?>"><?php _e( 'State:' ); ?></label> 
        <input class="widefat" id="<?php echo $this->get_field_id( 'address_state' ); ?>" name="<?php echo $this->get_field_name( 'address_state' ); ?>" type="text" value="<?php echo esc_attr( $address_state ); ?>">
    </p>
    <p>
        <label for="<?php echo $this->get_field_id( 'address_zip' ); ?>"><?php _e( 'Postal Code:' ); ?></label> 
        <input class="widefat" id="<?php echo $this->get_field_id( 'address_zip' ); ?>" name="<?php echo $this->get_field_name( 'address_zip' ); ?>" type="text" value="<?php echo esc_attr( $address_zip ); ?>">
    </p>
    <p>
        <label for="<?php echo $this->get_field_id( 'email' ); ?>"><?php _e( 'Email Address:' ); ?></label> 
        <input class="widefat" id="<?php echo $this->get_field_id( 'email' ); ?>" name="<?php echo $this->get_field_name( 'email' ); ?>" type="text" value="<?php echo esc_attr( $email ); ?>">
    </p>
    <p>
        <label for="<?php echo $this->get_field_id( 'phone' ); ?>"><?php _e( 'Phone:' ); ?></label> 
        <input class="widefat" id="<?php echo $this->get_field_id( 'phone' ); ?>" name="<?php echo $this->get_field_name( 'phone' ); ?>" type="text" value="<?php echo esc_attr( $phone ); ?>">
    </p>
    <?php 
}

/**
 * Sanitize widget form values as they are saved.
 *
 * @see WP_Widget::update()
 *
 * @param array $new_instance Values just sent to be saved.
 * @param array $old_instance Previously saved values from database.
 *
 * @return array Updated safe values to be saved.
 */
public function update( $new_instance, $old_instance ) {
    $instance = array();
    $instance['title'] = ( ! empty( $new_instance['title'] ) ) ? sanitize_text_field( $new_instance['title'] ) : '';
    $instance['address_street'] = ( ! empty( $new_instance['address_street'] ) ) ? sanitize_text_field( $new_instance['address_street'] ) : '';
    $instance['address_city'] = ( ! empty( $new_instance['address_city'] ) ) ? sanitize_text_field( $new_instance['address_city'] ) : '';
    $instance['address_state'] = ( ! empty( $new_instance['address_state'] ) ) ? sanitize_text_field( $new_instance['address_state'] ) : '';
    $instance['address_zip'] = ( ! empty( $new_instance['address_zip'] ) ) ?  sanitize_text_field( $new_instance['address_zip'] ) : '';
    $instance['email'] = ( ! empty( $new_instance['email'] ) ) ?  sanitize_email( $new_instance['email'] ) : '';
    $instance['phone'] = ( ! empty( $new_instance['phone'] ) ) ?  sanitize_text_field( $new_instance['phone'] ) : '';

     return $instance;
 }

} // class my_custom_contact_widget

If anyone has any insights as to what I'm doing wrong. I would appreciate your thoughts.

Thank You!

2

Your widget markup is broken!

Check this line

$phone_link = '<a class="contact-phone" href="tel:%s" itemprop="telephone">%s</span>';

Opening tag is <a> and closing tag is </span>. Correct it with

$phone_link = '<a class="contact-phone" href="tel:%s" itemprop="telephone">%s</a>';
  • 1
    Thanks for picking up on that, was a pretty silly mistake. – tnog Mar 23 '16 at 1:12

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.