Widget Framework "hook" Formatting help

[cdub]

I'm posting here since the Widget Framework developer rarely responds to the thread on XF and I've posted there with no response... I've even joined his site and purchased support for $5 with no response so I was hoping the helpful community here might have some ideas. It really should be a paid addon with better support and/or there should be a widget framework of sorts built into XF... maybe it'll come with xf2.0.

Basically I'm trying to put the "Recent Threads" widget in the middle of the Showcase Index Sidebar widgets. I did this using a "custom hook". And it works... BUT the widget doesn't have the NORMAL sidebar look to it.

See here:

Student Films | Studentfilms.com



Any ideas? I'm sure it's a simple template/css fix away from being tweaked but I've been unable to figure it out. I know @alfa1 has the same issue and has had the same amount of luck getting help from xfrocks. Maybe the awesome community here knows the answer... worth a shot.

 

[Kintaro]

add "secondaryContent" to:

<div class=" widget WidgetFramework_WidgetRenderer_Threads non-sidebar-widget" id="widget-15">

​

<div class=" widget WidgetFramework_WidgetRenderer_Threads non-sidebar-widget secondaryContent" id="widget-15">

 

[cdub]

That's super awesome.... You rock! But I can't seem to figure out where in the template to add it to. I tried wrapping the hook with div=secondaryContent but that didn't seem to work.

Do I add it to the "wf_default_non_sidebar.css" template?

<xen:comment>Mimics sidebar style for non sidebar widgets</xen:comment>

/* list of users with 32px avatars, username and user title */
.non-sidebar-widget .avatarList li {
    @property "sidebarAvatarListItem";
    margin: 5px 0;
    overflow: hidden;
    zoom: 1;
    @property "/sidebarAvatarListItem";
}

    .non-sidebar-widget .avatarList .avatar {
        @property "sidebarAvatarListAvatar";
        margin-right: 5px;
        float: left;
        width: 32px;
        height: 32px;
        @property "/sidebarAvatarListAvatar";
       
        width: auto;
        height: auto;
    }
       
    .non-sidebar-widget .avatarList .avatar img {
        width: @sidebarAvatarListAvatar.width;
        height: @sidebarAvatarListAvatar.height;
    }
   
    .non-sidebar-widget .avatarList .username {
        @property "sidebarAvatarListUsername";
        font-size: 11pt;
        margin-top: 2px;
        display: block;
        @property "/sidebarAvatarListUsername";
    }
   
    .non-sidebar-widget .avatarList .userTitle {
        @property "sidebarAvatarListUserTitle";
        color: @mutedTextColor;
        @property "/sidebarAvatarListUserTitle";
    }


/* list of users */

.non-sidebar-widget .userList {
}

    .non-sidebar-widget .userList .username {
        @property "sidebarUserListUsername";
        font-size: @fafontsizes;
        @property "/sidebarUserListUsername";
    }

    .non-sidebar-widget .userList .username.invisible {
        @property "sidebarUserListUsernameInvisible";
        color: @primaryLightish;
        @property "/sidebarUserListUsernameInvisible";
    }
   
    .non-sidebar-widget .userList .username.followed {
        @property "sidebarUserListUsernameFollowed";

        @property "/sidebarUserListUsernameFollowed";
    }

    .non-sidebar-widget .userList .moreLink {
        display: block;
    }

 

[cdub]

add "secondaryContent" to:

<div class=" widget WidgetFramework_WidgetRenderer_Threads non-sidebar-widget" id="widget-15">

View attachment 2837
​

<div class=" widget WidgetFramework_WidgetRenderer_Threads non-sidebar-widget secondaryContent" id="widget-15">

@Kintaro any idea which template I need to mod to do this? I tried wrapping the hook with the div="secondaryContent" and that didn't work.

 

[Bob]

@Kintaro any idea which template I need to mod to do this? I tried wrapping the hook with the div="secondaryContent" and that didn't work.

That won't work, the exact DIV (which will be in the WF template) needs to have that class added to it.

 

[cdub]

Is this the right one:

wf_widget_threads

<xen:if is="{$layout} == 'sidebar'">

    <xen:if hascontent="true">
        <div class="avatarList">
            <ul>
                <xen:contentcheck>
                    <xen:if is="{$widget.options.type} == 'recent' OR {$widget.options.type} == 'latest_replies'">

                        <xen:foreach loop="$threads" value="$thread">
                            <xen:include template="wf_widget_threads_thread_sidebar">
                                <xen:set var="$_threadLink">{xen:if '{$visitor.user_id} > 0', {xen:link threads/unread, $thread}, {xen:link posts, {xen:array 'post_id={$thread.last_post_id}'}}}</xen:set>
                                <xen:set var="$_secondRow">
                                    {xen:phrase wf_x_replied, 'user=<a href="{xen:link 'members', $thread}" class="username">{$thread.username}</a>'} <xen:datetime time="{$thread.last_post_date}" />
                                </xen:set>
                            </xen:include>
                        </xen:foreach>

                    <xen:elseif is="{$widget.options.type} == 'most_replied'" />

                        <xen:foreach loop="$threads" value="$thread">
                            <xen:include template="wf_widget_threads_thread_sidebar">
                                <xen:set var="$_secondRow">
                                    {xen:phrase wf_x_posted, 'user=<a href="{xen:link 'members', {$thread}}" class="username">{$thread.username}</a>'}, {xen:phrase replies}: {xen:number $thread.reply_count}
                                </xen:set>
                            </xen:include>
                        </xen:foreach>

                    <xen:elseif is="{$widget.options.type} == 'most_liked'" />

                        <xen:foreach loop="$threads" value="$thread">
                            <xen:include template="wf_widget_threads_thread_sidebar">
                                <xen:set var="$_secondRow">
                                    {xen:phrase wf_x_posted, 'user=<a href="{xen:link 'members', {$thread}}" class="username">{$thread.username}</a>'},
                                    {xen:phrase likes}: <a href="{xen:link 'posts/likes', {xen:array 'post_id={$thread.first_post_id}'}}" class="OverlayTrigger">{xen:number $thread.first_post_likes}</a>
                                </xen:set>
                            </xen:include>
                        </xen:foreach>

                    <xen:else />

                        <xen:foreach loop="$threads" value="$thread">
                            <xen:include template="wf_widget_threads_thread_sidebar">
                                <xen:set var="$_secondRow">
                                    {xen:phrase wf_x_posted, 'user=<a href="{xen:link 'members', {$thread}}" class="username">{$thread.username}</a>'} <xen:datetime time="{$thread.post_date}" />
                                </xen:set>
                            </xen:include>
                        </xen:foreach>

                    </xen:if>
                </xen:contentcheck>
            </ul>
        </div>

        <xen:include template="preview_tooltip" />
    </xen:if>

<xen:elseif is="{$layout} == 'list'" />
  
    <xen:if hascontent="true">
        <div class="discussionList">
            <div class="DiscussionList">

                <dl class="sectionHeaders">
                    <dt class="posterAvatar"><a><span>&nbsp;</span></a></dt>
                    <dd class="main">
                        <a class="title"><span>{xen:phrase title}</span></a>
                        <a class="postDate"><span>{xen:phrase start_date}</span></a>
                    </dd>
                    <dd class="stats">
                        <a class="major"><span>{xen:phrase replies}</span></a>
                        <a class="minor"><span>{xen:phrase views}</span></a>
                    </dd>
                    <dd class="lastPost"><a><span>{xen:phrase last_message}</span></a></dd>
                </dl>

                <ol class="discussionListItems">
                    <xen:contentcheck>
                        <xen:foreach loop="$threads" value="$thread">
                            <xen:include template="thread_list_item" />
                        </xen:foreach>
                    </xen:contentcheck>
                </ol>

            </div>
        </div>

        <xen:include template="preview_tooltip" />
    </xen:if>

<xen:elseif is="{$layout} == 'full'" />

    <xen:if hascontent="true">
        <div class="WidgetFramework_WidgetRenderer_Threads_FullThreadList">
            <xen:contentcheck>

                <xen:foreach loop="$threads" value="$thread">
                    <xen:include template="wf_widget_threads_thread_full" />
                    <xen:edithint template="wf_widget_threads_thread_full_info" />
                </xen:foreach>

            </xen:contentcheck>
        </div>
      
        <xen:edithint template="message" />
        <xen:edithint template="wf_default.css" />
    </xen:if>

</xen:if>

 

[Kintaro]

sorry I don't know. I simply saw that that block got different class so I tried adding it by chrome inspector

 

[Bob]

That is a sub template, there is a wrapper involved and its within the wrapper that needs the class added. I'd have to do some research.

 

[cdub]

I got it to work.... at least for what I needed. I needed to put the Recent Threads under the categories but above the other Showcase sidebar widgets.

So what I did was... is I made a standalone widget for the Showcase Categories sidebar:



Then I placed it with the nflj_showcase_index_modular_news template and turned OFF the category sidebar widget for the index in Showcase Options.

Success.



It's working on the test site... I'll fix it on live site later.