So I’m new to making widgets. I’ve followed several tutorials and was finally able to make my very own custom widget (yay!). However, for some reason it is not pulling the theme styling?
I have tried with several themes and it is always the same. Every other widget I add pulls the theme styling for the sidebar, however my custom ones have no styling (except for the div styling I have placed into the coding).
Is there a specific code I need to add somewhere to force the widget to pull the theme style?
Sorry I just wanted to add – I am wanting to offer this widget to a few friends who run fansites, so I want it to automatically pull the style from any theme.
Thanks in advance!
Sorry didn’t think to add that. Here is the code I am using:
class Current_Projects extends WP_Widget
{
public function __construct()
{
parent::__construct(
'current-projects',
'Current Projects',
array(
'description' => 'Current Projects'
)
);
}
public function widget( $args, $instance )
{
// output
echo '
<div style="padding:5px;margin:0auto;width:260px;text-align:left;margin- right:10px;"><img width="25%" float="left" src="'.esc_textarea($instance['image_uri']).'" />
<div style="float:right;width:65%"><div style="padding-top:0px;line-height:14px; padding-right:10px;"><b>Project: </b>'.esc_textarea($instance['text']).'</div>
<div style="padding-top:0px;line-height:14px;padding-right:10px;;"><b>Date: </b>'.esc_textarea($instance['date']).'</div>
<div style="padding-top:0px;line-height:14px;padding-right:10px;"><b>As: </b>'.esc_textarea($instance['role']).'</div></div>
<div style="padding-top:10px; line-height:14px;">'.esc_textarea($instance['summary']).'</div>
<div style="padding-top:10px;line-height:14px;"><a href="'.esc_textarea($instance['imdb']).'">IMDB</a> • <a href="'.esc_textarea($instance['official']).'">Official Site</a> • <a href="'.esc_textarea($instance['gallery']).'">Gallery</a></div>
<br /><br /></div>
';
}
public function form( $instance )
{
// new instances
?>
<p>
<label for="<?php echo $this->get_field_id('text'); ?>">Project Title</label><br />
<input type="text" name="<?php echo $this->get_field_name('text'); ?>" id="<?php echo $this->get_field_id('text'); ?>" value="<?php echo $instance['text']; ?>" class="widefat" />
</p>
<p>
<label for="<?php echo $this->get_field_id('date'); ?>">Date</label><br />
<input type="text" name="<?php echo $this->get_field_name('date'); ?>" id="<?php echo $this->get_field_id('date'); ?>" value="<?php echo $instance['date']; ?>" class="widefat" />
</p>
<p>
<label for="<?php echo $this->get_field_id('role'); ?>">Role</label><br />
<input type="text" name="<?php echo $this->get_field_name('role'); ?>" id="<?php echo $this->get_field_id('role'); ?>" value="<?php echo $instance['role']; ?>" class="widefat" />
</p>
<p>
<label for="<?php echo $this->get_field_id('imdb'); ?>">IMDB URL</label><br />
<input type="url" name="<?php echo $this->get_field_name('imdb'); ?>" id="<?php echo $this->get_field_id('imdb'); ?>" value="<?php echo $instance['imdb']; ?>" class="widefat" />
</p>
<p>
<label for="<?php echo $this->get_field_id('official'); ?>">Official Site URL</label><br />
<input type="url" name="<?php echo $this->get_field_name('official'); ?>" id="<?php echo $this->get_field_id('official'); ?>" value="<?php echo $instance['official']; ?>" class="widefat" />
</p>
<p>
<label for="<?php echo $this->get_field_id('gallery'); ?>">Gallery URL</label><br />
<input type="url" name="<?php echo $this->get_field_name('gallery'); ?>" id="<?php echo $this->get_field_id('gallery'); ?>" value="<?php echo $instance['gallery']; ?>" class="widefat" />
</p>
<p>
<label for="<?php echo $this->get_field_id('summary'); ?>">Project Summary</label><br />
<input type="text" name="<?php echo $this->get_field_name('summary'); ?>" id="<?php echo $this->get_field_id('summary'); ?>" value="<?php echo $instance['summary']; ?>" class="widefat" />
</p>
<p>
<label for="<?php echo $this->get_field_id('image_uri'); ?>">Image</label><br />
<input type="text" class="img" name="<?php echo $this->get_field_name('image_uri'); ?>" id="<?php echo $this->get_field_id('image_uri'); ?>" value="<?php echo $instance['image_uri']; ?>" />
<input type="button" class="select-img" value="Select Image" />
</p>
<?php
}
}
// end class
// register
add_action( 'widgets_init', create_function('', 'return register_widget("Current_Projects");') );
// js
function cp_enqueue()
{
wp_enqueue_style('thickbox');
wp_enqueue_script('media-upload');
wp_enqueue_script('thickbox');
// script
wp_enqueue_script('cp', '/wp-content/plugins/current-projects/script.js', null, null, true);
}
add_action('admin_enqueue_scripts', 'cp_enqueue');