We build. You grow.

Get best community software here

Start a social network, a fan-site, an education project with oxwall - free opensource community software

Get started

How to render a widget on custom page - SOLVED | Forum

Topic location: Forum home » Development » Custom Code Modifications

Petar Šlat Nov 11 '13

Hi all,

I need a little help getting some (any) widget to render on a custom built page.

So far I understand how to make and route my custom page.

Also I have no problem with making a widget and placing it on dashboard.

I'm stuck with rendering a widget on my custom page.

Any help would be appreciated.

best regards

Petar

EDIT:

A little update :)

I got it rendering on a Custom page;

But I'm missing... let's call it a template around the widget.

It looks like it's not listening to the Standard Setting Value List.

See pictures below

EXAMPLE:

On Dashboard page

On Custom page

The Forum post is edited by Petar Šlat Nov 14 '13

Team

Daisy Nov 12 '13

What styles are you using for this component? The HTML code should look like this:

<div class="ow_dnd_widget dashboard-CUSTOM_CMP_Custom_Widget">

    <div class="ow_box_cap ow_dnd_configurable_component clearfix">
    <div class="ow_box_cap_right">
        <div class="ow_box_cap_body">
            <h3 class="ow_ic_info">Custom Widget</h3>
        </div>
    </div>
</div>
<div style="" class="ow_box ow_stdmargin clearfix dashboard-BASE_CMP_QuickLinksWidget ow_break_word">

WIDGET CODE

<div class="ow_box_bottom_left"></div>
    <div class="ow_box_bottom_right"></div>
    <div class="ow_box_bottom_body"></div>
    <div class="ow_box_bottom_shadow"></div>
</div>

</div>

The Forum post is edited by Daisy Nov 12 '13

Petar Šlat Nov 12 '13

@Daisy: ty so much for a reply <3
It helped a lot; This is what I have learned so far :)

Indeed, I have used my personal CSS styles. As far as I'm aware there are two ways to resolve this. One way is described in your post above. When I tried it that way widget was double-boxed on the oXwall dashboard page. Other approach that I copied from "class BASE_CMP_Rate extends OW_Component" is to use decorator (I'm new to this and guessing it's a SMARTY template feature) in the view of the widget.
Example:

{block_decorator name='box' addClass='ow_stdmargin' langLabel = 'WIDGETNAME+TRANSLATION'}

{/block_decorator}

In this approach "Show title" and "Wrap in box" widget settings must be FALSE. If they are not, widget will again be double-boxed.

EXAMPLE of an empty widget on a custom page:

<h3 class="ow_ic_file">WIDGET NAME</h3>

</div>

</div>

So... my new questions would be:

- What would be the best practice case to use?

- I see you used one more <div> element to wrap the empty echoed widget. Is that used only on dashboard page?

EDIT:

-If something is ambiguous and needs further explanation by my side please tell me. I will put some pictures and try to elaborate further.

- How to copy and paste code to keep it's form upon commit.

The Forum post is edited by Petar Šlat Nov 13 '13

Team

Daisy Nov 14 '13

Quote from Petar Šlat - What would be the best practice case to use?

If you simply want to add a component to your custom page, you can use the solution I've provided. More over in this case you can add your custom inline styles.

If you create a plugin which adds a widget to, let's say the Dashboard page, it would be better to use the standard correct methods. I suggest that you download our new Plugin Skeleton plugin to see how to create a new widget. Here is URL to the Store item: http://www.oxwall.org/store/item/695

Quote from Petar Šlat - I see you used one more element to wrap the empty echoed widget. Is that used only on dashboard page?

This div was added by mistake.

The Forum post is edited by Daisy Nov 14 '13

Petar Šlat Nov 14 '13

I have already downloaded "Plugin Skeleton" plugin it was a great help to get me started :)

Is there any way to just call already built widget in an elegant manner on a custom page without scaffolding a template around it? Something like this?

EXAMPLE:

$myNewWidget = new MYNEWWIDGET_CMP_TopUsersWidget();

$this->addComponent('myNewWidget ', $myNewWidget );

and then in the view

{if $myNewWidget }

{$myNewWidget }

{/if}

Additionaly:

When user tries to customize Dashboard the widget again gets double-boxed.

Out of customization view double box is not visible because title and wrap in box parameters are disabled.

See picture below for double box problem.

As you typed in your reply. On custom page template around widget has to be scaffolded per widget. I think there is no elegant solution to just calling it from controler.

Idea just popped into my mind, ill try it and report back with results.

Ty so much for your help ;)

Petar Šlat Nov 14 '13

-= RESOLVED =-

So, this is how I personally resolved my little troubles.

To the custom widget I added a new method called "renderOnCustomPage()"

Method simply wraps/inserts $this->render(); in empty template widget I described in post no.3

This way you just elegantly call renderOnCustomPage() method on your custom page.

Widget doesn't get double boxed on Dashboard page (or any similar).

Hope this thread helps someone :)

Keep on coding \o/

The Forum post is edited by Petar Šlat Nov 14 '13

Team

Daisy Nov 21 '13

Thanks for the solution.

kyle gore Sep 13 '14

So would this work to move say the user widget to the join_index.html page?

If im following things on here right, I believe it would. But im still not quite sure what code to put into the css for the page.

would it be this code?

<h3 class="ow_ic_file">WIDGET NAME</h3>

</div>

with "users" inserted for the WIDGET NAME??

The Forum post is edited by kyle gore Sep 13 '14

kyle gore Sep 13 '14

So using the code above that i reposted I have created a box on the join_index page but the latest user widget is not in the box... what do i need to do in order to pull that in?

kyle gore Sep 14 '14

OK so I have managed to get the widget onto the page but when I add new members to the site their avatars are not added to the landing page.

what do i need to change in the script to make it so that it is changing with the new users that come to my site?If I remove the <a href codes with the current images then nothing shows up.
but when I add new profiles they dont show up.
Is it a code for the Avatar libary that i need to put in there? If so what would that code be?