Forum Discussion

wilson_emma's avatar
2 years ago

Assistance Needed with Custom Widget Development in Khoros Studio

Hi Khoros Community,

I'm currently working on a project that involves developing a custom widget using Khoros Studio, and I've encountered a few challenges along the way. I was wondering if anyone in the community could provide some guidance or share insights based on their experience.

Specifically, I'm looking for assistance with the following:

  1. Data Binding in Custom Widgets: I'm trying to bind data dynamically to my custom widget, but I'm facing some issues. Are there any best practices or examples that could help me understand how to achieve effective data binding?

  2. Responsive Design for Widgets rails: Ensuring that my custom widget is responsive across different devices is crucial. Are there any recommendations or tips for implementing a responsive design in Khoros Studio widgets?

  3. Debugging Techniques: While developing my custom widget, I've run into some bugs, and the standard debugging tools in Khoros Studio seem limited. What are your preferred techniques for debugging custom widgets effectively?

Thanks in advance for your help!

  • Hi wilson_emma 

    Here are the answers to your concerns -
     
    #1 Data Binding in Custom Widget
    We need to first understand, what data is required to be binded. In case you want to fetch community data, eg: messages in the board/authors/nodes information etc. - you need to run API for that.

    #2 Responsive Design for Widgets rail
    For the responsive designs, you can either add media queries in SCSS file (Studio > Community Style > Community Skin) or use bootstrap for the same.

    #3 Debugging Technique
    To debug the issues, we can wrap the required code (which you think can cause issue) in Attempt/Recover. Use it as - <#attempt>ADD THE CODE HERE<#recover>${.error}</#attempt>. In case, the issue is with APIs i.e. APIs not rendering the results, we need to check the APIs by printing them within the code itself.

2 Replies

  • Hi wilson_emma 

    Here are the answers to your concerns -
     
    #1 Data Binding in Custom Widget
    We need to first understand, what data is required to be binded. In case you want to fetch community data, eg: messages in the board/authors/nodes information etc. - you need to run API for that.

    #2 Responsive Design for Widgets rail
    For the responsive designs, you can either add media queries in SCSS file (Studio > Community Style > Community Skin) or use bootstrap for the same.

    #3 Debugging Technique
    To debug the issues, we can wrap the required code (which you think can cause issue) in Attempt/Recover. Use it as - <#attempt>ADD THE CODE HERE<#recover>${.error}</#attempt>. In case, the issue is with APIs i.e. APIs not rendering the results, we need to check the APIs by printing them within the code itself.