SocialEngine 4: Create a Widget (Updated)

I’m currently working on a project that requires applying some modifications and creating plugins for SocialEngine 4. I’m new to socialengine so I’ll post here my findings during the work. Probably I’m not allowed to post the code in public, so I’m just going to post generic how tos that you could use to accomplish similar tasks.

My first task to is to allow users to post comments to other users’ profile. So the first challenge is to create a new tab where there would be a form, and other people comments displayed below it. More like the news feed, except that it shows and posts comments.

First thing to think about is where does this Widget belong? In my case, since it is displayed in a user’s profile then it should belong to the User module. So navigate to the Widgets folder inside the User module ({social_engine_root}/application/modules/User/widgets) and create a new directory with your widget’s name (mywidget for example). Create 2 files inside this directory:

• Controller.php
• index.tpl

As you’ve most probably figured out, SocialEngine uses the MVC architecture. So in this case the controller class lies in Controller.php and the view is in index.tpl. For the model I haven’t yet stepped into it so I’ll skip it now and come back to it when I find out more.

Controller.php:

<?php

class User_Widget_mywidgetController extends Engine_Content_Widget_Abstract {

public function indexAction()  {

$this->view->msg=”Hello Widget!”;

}
}

The indexAction() method is invoked whenever the widget is going to be displayed. So inside this method you should prepare data (if any) that should be passed to the view. To pass data to the view, use this convention $this->view->variablename=value like above, replacing variablename with any name of your choice, and value with the associated data.

Then in the view index.tpl:

<?php

echo $this->msg;

?>

Use this convention to get variables assigned in controller: $this->variablename

Now the next step is to tell the User module that it has got a shiny brand new widget. To do this edit the content file associated with User module: ({social_engine_root}/application/modules/User/settings/content.php)  and append the following at the very bottom of page (before the very last closing bracket ‘)’ )

array( ‘title’ => ‘My Widget’,

‘description’ => ‘This is a brand new User Widget’,

‘category’ => ‘User’,

‘type’ => ‘widget’,

‘name’ => ‘user.mywidget’,

),

always of course replacing “mywidget” with your widget’s name.

Now the Widget is registered with SocialEngine. I am going to add it under a new tab in User Profile. To do so, login as admin, click Admin from top menu and go to Layout Editor. Then Change Editing to Member profile, and in the Available Blocks scroll till you find the User section. If everything was done correctly you should find your widget under this section. Just drag it to the tabbed block and you’re done. Next up is how to create a model, and make the controller interact with it.

 

UPDATE:

I quote this from John Boehr’s comment:

If you want to create your own widgets, I’d recommend placing them in application/widgets instead. The widgets in the modules use a common content file, which would be replaced if you upgraded. The widgets in the application/widgets folder are designed to be atomic, so their files are not touched unless you specifically upgrade that widget (or never if it’s your own).

You can render a widget in a view script using:
echo $this->content()->renderWidget(‘user.list-online’, array(‘key’ => ‘value’));

Check out application/modules/Core/views/scripts/admin-index/index.tpl for examples in the code.

Great piece of info, thanks!