XF 1.5 Skyscraper ad to right of thread list

[Travis-Mc]

I'd like to put a skyscraper ad (160x600px) to the right of the thread list. When the screen is scaled down to less than 1000px, it should bump under the thread list. (it could go the bottom of the page too). I don't really want it in the sidebar unless the sidebar is empty. I can't seem to figure out how to make it work. Any help would be greatly appreciated! Thanks.

 

[Mouth]

https://xenforo.com/community/resou...r-inline-with-the-first-post-of-a-thread.986/ might be good help.

 

[Travis-Mc]

That will definitely help! Thank you.

 

[Mouth]

Please share your end result

 

[Travis-Mc]

The update in the link you provided helped. Here's what I ended up with..

I wrapped the discussion list two divs and put the ad below.

<div class="forumViewContainer">
    <div class="threadDiscussionList">
      
      
<div class="discussionList section sectionMain">
    <xen:include template="thread_list" />
</div>
  
<div class="pageNavLinkGroup afterDiscussionListHandle">
    <div class="linkGroup">
        <xen:if is="{$canPostThread}">
            <a href="{xen:link 'forums/create-thread', $forum}" class="callToAction"><span>{xen:phrase post_new_thread}</span></a>
        <xen:elseif is="{$visitor.user_id}" />
            <span class="element">({xen:phrase no_permission_to_post})</span>
        <xen:else />
            <label for="LoginControl"><a href="{xen:link login}" class="<xen:if is="@xb_login_overlay OR @xb_alt_login">OverlayTrigger </xen:if>concealed element">({xen:phrase log_in_or_sign_up_to_post})</a></label>
        </xen:if>
    </div>
    <div class="linkGroup"{xen:if '!{$ignoredNames}', ' style="display: none"'}><a href="javascript:" class="muted JsOnly DisplayIgnoredContent Tooltip" title="{xen:phrase show_hidden_content_by_x, "names={xen:helper implode, $ignoredNames, ', '}"}">{xen:phrase show_ignored_content}</a></div>
  
    <xen:pagenav link="forums" linkdata="{$forum}" linkparams="{$pageNavParams}" page="{$page}" perpage="{$threadsPerPage}" total="{$totalThreads}" />
</div>


    </div>      
</div>

    <aside>
       <div class="forumViewSide">
        AD CODE
    </div>
    </aside>

Then added this CSS to extra.css

/* styling for ad in forum view */

.forumViewContainer
{
    float : left;
    margin-right: -160px;
    width: 100%;
}

.forumViewSide {
    width: 160px;
    float: right;
}
.threadDiscussionList {
    margin-right: 176px;
}

.threadDiscussionList .sectionMain {
    margin: 0 auto;
}


<xen:if is="@enableResponsive">
@media (max-width:1000px)
{
    .Responsive .forumViewContainer
    {
         float: none;
         margin-right: 0;
         width: auto;
    }

    .Responsive .threadDiscussionList
    {
        margin-right: 0;
    }
  
    .Responsive .forumViewSide
    {
        float: none;
        margin: 0 auto;
    }

}
</xen:if>

In the code for the ad I made it not load when the viewport is less than 1000px wide. It loads an ad in the thread list instead.