Jump to content
X2Community Forums

X2 How-To: Add a new Widget


Guest X2Matthew

Recommended Posts

Guest X2Matthew

Greetings X2Contacts users! Today I'm going to explain how you can create and add new widgets to your application. Widgets are small windows on the right of X2Contacts, such as Message of the Day and Chat.

 

Note: adding widgets is an advanced topic and should only be done by a competent PHP developer. Programming the widget can be as simple or as complex as you like; you could just add a permanent link, or it could be an AJAX-enabled control panel for a custom module. That is outside the scope of this guide. We're just going to learn how to add a widget once you've created it.

  1. Create a widget class extending CWidget, and create a view file for it to render. I highly suggest looking at a few simple widgets like MessageBox and QuickContact for examples.
  2. Name your file to match the widget class (for example MyWidget.php).
  3. Copy the widget file(s) into the /protected/components directory, along with any views or other resource files.
  4. Add the widget to the registeredWidgets parameter in /protected/config/main.php. The array key has to be the same as the class name, and the value is the title that will be displayed (sorry, there is no support yet for dynamically generated widget titles). See below for an example.
  5. That's it! The widget should automatically appear at the bottom of your widgets bar. If not, see the troubleshooting section below.

Example of registeredWidgets parameter:

 

 

 


'params'=>array(
 // this is used in contact page
 'adminEmail'=>$email,
 'logo'=>"uploads/logos/yourlogohere.png",
 'webRoot'=>dirname(__FILE__).DIRECTORY_SEPARATOR.'..',
 'registeredWidgets'=>array(
  'MessageBox'=>'Message Board',
  'QuickContact'=>'Quick Contact',
  'GoogleMaps'=>'Google Map',
  'TwitterFeed'=>'Twitter Feed',
  'ChatBox'=>'Chat',
  'NoteBox'=>'Note Pad',
  'ActionMenu'=>'My Actions',
  'MyWidget'=>'My Widget',	// custom widget!
 ),
 'currency'=>''
),

 

Troubleshooting

Creating new widgets is not yet possible through X2Studio, so you will have to manually create and edit php files. If your widget isn't appearing, or the layout of the site is corrupted, you should check for the following issues:

  • Typos in the main.php config file
  • Class name in config file not matching the actual filename in /protected/components
  • Any kind of bug in your widget class or view file
  • Missing or extra closing HTML tags (especially </div>) in the view file
  • An empty view (widgets will not render unless they have some kind of content)

Translation

 

 

If you want to be able to translate your widget, you will have to make appropriate calls to Yii::t() within the widget view. The title of the widget is automatically translated if you put an entry in the 'app.php' language file.

 

Styling your widget

If you want to apply any custom CSS rules to your widget, the widget box will have an id like "widget_MyWidget". The easiest way to insert CSS would be to edit /themes/x2engine/css/main.css. The best way to understand the DOM structure of a widget is just spending a few minutes studying the HTML. It should be pretty straight-forward.

 

As always, feel free to post a question if you have any trouble.

Link to post
Share on other sites
  • 2 years later...

Hi Matthew,

 

1- Is this information still work? 

 

2- When registering the widget to the registeredWidgets parameter in /protected/config/main.php, does will an X2Engine update overwrite my widget registration? If not, very cool, but if so, can you guys code a reference in /protected/config/main.php so that it gets the parameters from custom/protected/config/main.php? 

 

3- Lastly, are yourwidgets completely based on Yii Framework? 

 

Thanks.

Link to post
Share on other sites
  • 7 months later...
  • 4 weeks later...

The last couple posts are a bit off topic from the thread but I will address them here.

 

Editing the settings of profile page widgets, as well as choosing which ones appear at all, is only configurable by an individual user. Changing these settings on an administrative level was not designed into the current functionality. At the time these were created, it wasn't part of the design philosophy to restrict users from configuring their own profile page. That said, we've since implemented the administrative ability to enforce default color scheme preferences, so enforcing default widget settings doesn't seem too far of a stretch at this point. It may be the case that we'll look into creating these abilities for administrators following our 5.0 release.

 

-Tony

  • Like 1
Link to post
Share on other sites
  • 3 months later...

Hi,

 

Is there a way to add a related model gridview to a parent detailview? for instance when i open an  'author' detail page, 'articles' gridview related to that author displays under the author detail on same page, also if 'create article' form for that specific author on the author detail page will be nice. could someone please guide me that how can i achieve this in x2 or should i have to create widgets containing gridview or form and include in detail page?

 

Regards

Link to post
Share on other sites

Hi Sir@j,

 

Is there a way to add a related model gridview to a parent detailview? for instance when i open an  'author' detail page, 'articles' gridview related to that author displays under the author detail on same page, also if 'create article' form for that specific author on the author detail page will be nice. could someone please guide me that how can i achieve this in x2 or should i have to create widgets containing gridview or form and include in detail page?

 

 

What you're describing seems similar to the existing relationships widget, which displays and allows you to create related records.

 

relationshipsWidget.png

 

Derek

Link to post
Share on other sites

Hi Derek,

 

An other question regarding relationship widget, when i gonna add records through relationship the lookup fields in inline form not working, I mean the lookup filed is missing "+" sign and also auto filled action is not working, could you please help?

 

Regards

Link to post
Share on other sites

Hi Sir@j,

 

Yes indeed i am thinking similar to relationship widget however i want to separate grids by types i.e separate grid for different relationship types. Is it possible?

 

 

That would be possible, but would require customization. If you have an understanding of PHP and JavaScript, it should be relatively straightforward to use the existing relationships widget as a template for your own custom widget.
 

 

An other question regarding relationship widget, when i gonna add records through relationship the lookup fields in inline form not working, I mean the lookup filed is missing "+" sign and also auto filled action is not working, could you please help?

 

 

I'm not sure what you mean by auto-filled action? Could you please be more specific?

 

The missing "+" buttons is simply a current limitation of inline record creation and is not a bug, though it's something we might be able to add in a future release.

 

Derek

Link to post
Share on other sites
  • 4 weeks later...

Version 5.05b has created a few more widgets like Calls & Emails in the relationship area, however would love to be able to create other ones like Account and be able to choose which fields show.

It would be even better as Rene said to have this in the Admin area.

Is that on the roadmap or is there a how to written somewhere on this?

Link to post
Share on other sites
  • 1 year later...

Hello I come to you because I also absolutely need to remove widgets for all users. How can I do this?

I would like that users can only create, view, edit their own contact card, Other useful modules only for me

thank you very much (sorry for my english translated, i'm french user)

:D 

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...