I've created a custom Widget with the help of following code:

    // Creating the widget 
class wpb_widget extends WP_Widget {

function __construct() {
    // Base ID of your widget

    // Widget name will appear in UI
    __('WPBeginner Widget', 'wpb_widget_domain'), 

    // Widget description
    array( 'description' => __( 'Sample widget based on WPBeginner Tutorial', 'wpb_widget_domain' ), ) 

// Creating widget front-end
// This is where the action happens
public function widget( $args, $instance ) {
    $title = apply_filters( 'widget_title', $instance['title'] );
    // before and after widget arguments are defined by themes
    echo $args['before_widget'];
    if ( ! empty( $title ) )
    echo $args['before_title'] . $title . $args['after_title'];

    // This is where you run the code and display the output
    echo get_template_part( 'partials/widgets/test-w' );
    echo $args['after_widget'];

// Widget Backend 
public function form( $instance ) {
    if ( isset( $instance[ 'title' ] ) ) {
        $title = $instance[ 'title' ];
    else {
        $title = __( 'New title', 'wpb_widget_domain' );
    // Widget admin form
    <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 ); ?>" />

// Updating widget replacing old instances with new
public function update( $new_instance, $old_instance ) {
    $instance = array();
    $instance['title'] = ( ! empty( $new_instance['title'] ) ) ? strip_tags( $new_instance['title'] ) : '';
    return $instance;
} // Class wpb_widget ends here

// Register and load the widget
function wpb_load_widget() {
    register_widget( 'wpb_widget' );
add_action( 'widgets_init', 'wpb_load_widget' );

As you can see, i echo a html template with

echo get_template_part( 'partials/widgets/test-w' );

in the main code.

I've register the sidebar in my functions.php with following code

        'name'              => 'Index Right',
        'before_widget' => '<div id="%1$s" class="widget %2$s">',
        'after_widget'  => '</div>',
        'before_title'  => '<h3 class="widget-title">',
        'after_title'   => '</h3>',

The widget output in my frontend looks like:

enter image description here


The title is outside the widget box. I tried a lot of things to get the title to the top of the box like following image - but no luck :(

enter image description here

My php/html code ( echo get_template_part... ) for the widget looks like

   $default_thumbnail = 'http://vvvvvvvv.com/vvvvvvvvv.png';
   $the_query = new WP_Query('showposts=12&orderby=desc&category_name=featured');
  while ($the_query->have_posts()) : $the_query->the_post();
<div class="notbad-1">              
    <a target="_blank" href="<?php the_permalink()?>">
        <ul class="top-page-test">                          
            <li class="top-page-test-list">
                        if (has_post_thumbnail()):
                        <img src="<?php echo $thumbnail; ?>"/>
                        <?php endif; ?>
            <li class="test-image-title">               
            <?php the_title(); ?>       
<?php endwhile; ?>
<?php wp_reset_query(); ?>

Any suggestions on how to solve my problem?

1 Answer 1


You should not use echo in this case. Please visit the function reference of get_template_part. As you will see, there is nothing to print:

get_template_part doesn't return a value and doesn't warn if it fails to find a matching template file.

Additionally, I recommend that you check out this question: Should we use get_template_part() in functions files instead of include_once?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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