Xenforo Custom Template Code Modifications

[JGaulard]

I've been working with Xenforo forum software for about a year and a half now and have learned a bit about how it operates. Now, I don't know a lot like some of the more senior members of the Xenforo Community do, but I can find my way around. One area I've sort of figured out has to do with template modifications. I've created custom page titles, snippets of text on the forum view and template pages, as well as how to change the color of sticky threads in the list of threads on the forum view page, among other things. In this thread, I thought I'd share some of what I've learned and what I've used on my own sites. In the space below, I invite you to ask questions and share what you've discovered as well.

 

[JGaulard]

How to Create Custom Page Titles

TEMPLATE: "PAGE_CONTAINER"

(changed original page titles to custom ones)

Look for:

<title><xf:title formatter="%s | %s" fallback="{$xf.options.boardTitle}" page="{$pageNumber}" /></title>

and change to something like (use your own title structure):

<!-- CUSTOM PAGE TITLE CODE -->

<xf:if is="$template == 'forum_list'">
<title><xf:title formatter="%s | %s" fallback="CUSTOM HOMEPAGE TITLE HERE" /></title>
<xf:elseif is="$template == 'forum_view'" />
<title><xf:title formatter="%s | %s" fallback="CUSTOM FORUM VIEW PAGE TITLE HERE" page="{$pageNumber}" /></title>
<xf:elseif is="$template == 'thread_view'" />
<title><xf:title /></title>
<xf:else />
<title><xf:title formatter="%s | %s" fallback="{$xf.options.boardTitle}" page="{$pageNumber}" /></title>
</xf:if>

<!-- CUSTOM PAGE TITLE CODE -->

 

[JGaulard]

How To Change the Color of Sticky Threads on Forum View Pages

TEMPLATE: "EXTRA.LESS"

(added background color css for sticky threads)

Add this code to the EXTRA.LESS template (sample color used below:

/* STICK THREAD TABLE COLOR */

.structItemContainer-group--sticky .structItem {
background-color: #fff4e6;
}

/* STICK THREAD TABLE COLOR */

 

[JGaulard]

How to Remove Forum Descriptions From Forum List Popup Page When Member is Creating Thread

TEMPLATE: "FORUM_POST_THREAD_CHOOSER"

(remove description snippet)

Remove this code:

<xf:if is="$node.description">
<div class="contentRow-minor contentRow-minor--singleLine">
{$node.description|strip_tags}
</div>
</xf:if>

 

[JGaulard]

How to Add Custom Alt and Title Attributes to Logo

TEMPLATE: "PAGE_CONTAINER"

(add page title to logo image alt and title)

Look for:

<div class="p-header-logo p-header-logo--image">
<a href="{{ ($xf.options.logoLink && $xf.homePageUrl) ? $xf.homePageUrl : link('index') }}">
<img src="{{ base_url(property('publicLogoUrl')) }}"
alt="{$xf.options.boardTitle}"
{{ property('publicLogoUrl2x') ? 'srcset="' . base_url(property('publicLogoUrl2x')) . ' 2x"' : '' }} />
</a>
</div>

and change to something like:

<!-- CHANGE LOGO ALT ATTRIBUTE / ADD TITLE ATTRIBUTE -->

<div class="p-header-logo p-header-logo--image">
<a href="{{ ($xf.options.logoLink && $xf.homePageUrl) ? $xf.homePageUrl : link('index') }}">
<img src="{{ base_url(property('publicLogoUrl')) }}"
alt="<xf:if is="$template == 'forum_list'">
<xf:title formatter="%s | %s" fallback="CUSTOM TEXT HERE" />
<xf:elseif is="$template == 'forum_view'" />
<xf:title formatter="%s | %s" fallback="CUSTOM TEXT HERE" page="{$pageNumber}" />
<xf:elseif is="$template == 'thread_view'" />
<xf:title />
<xf:else />
<xf:title formatter="%s | %s" fallback="{$xf.options.boardTitle}" page="{$pageNumber}" />
</xf:if>"
title="<xf:if is="$template == 'forum_list'">
<xf:title formatter="%s | %s" fallback="CUSTOM TEXT HERE" />
<xf:elseif is="$template == 'forum_view'" />
<xf:title formatter="%s | %s" fallback="CUSTOM TEXT HERE" page="{$pageNumber}" />
<xf:elseif is="$template == 'thread_view'" />
<xf:title />
<xf:else />
<xf:title formatter="%s | %s" fallback="{$xf.options.boardTitle}" page="{$pageNumber}" />
</xf:if>"

{{ property('publicLogoUrl2x') ? 'srcset="' . base_url(property('publicLogoUrl2x')) . ' 2x"' : '' }} />
</a>
</div>

<!-- CHANGE LOGO ALT ATTRIBUTE / ADD TITLE ATTRIBUTE -->

 

[JGaulard]

How to Add a noindex Meta Tag to Error Pages

TEMPLATE: "ERROR"

(add meta noindex)

add:

<xf:head option="metaNoindex"><meta name="robots" content="noindex" /></xf:head>

 

[JGaulard]

How to Remove the Links to Member Pages for Guests in Andy's Similar Threads Addon

TEMPLATE: "ANDY_SIMILARTHREADS"

(remove thread starter member link for guests)

(comments not allowed in this template)

Find and change:

<!-- REMOVE THREAD STARTER FOR GUESTS -->

<xf:if is="$xf.visitor.user_id">

<xf:avatar user="{$thread.User}" size="xs" defaultname="{$thread.username}" />

<xf:else />

<xf:avatar user="{$thread.User}" size="xs" defaultname="{$thread.username}" href="" />

</xf:if>

<!-- REMOVE THREAD STARTER FOR GUESTS -->

 

[JGaulard]

How to Add Search Bar by customizeFX to Any Template

TEMPLATE: "SEARCH_RESULTS (or any other one you like)"

add:

<!-- SEARCH BAR WIDGET -->

<xf:widget key="search_bar" />

<!-- SEARCH BAR WIDGET -->

 

[JGaulard]

How to Remove New Posts Link From Upper Right Corner of Forum List Page (Homepage)

TEMPLATE: "FORUM_OVERVIEW_WRAPPER"

(remove "newest posts" button from upper right corner of homepage)

line 10

<xf:button href="{{ $xf.options.forumsDefaultPage == 'new_posts' ? link('forums/new-posts') : link('whats-new/posts') }}" icon="bolt">
{{ phrase('new_posts') }}
</xf:button>

 

[JGaulard]

How to Remove New Posts Link From Newest Threads Widget

TEMPLATE: "WIDGET_NEW_THREADS"

(remove "newest posts" link)

line 7

<a href="{$link}" rel="nofollow">{$title}</a>

 

[JGaulard]

How to Remove Hidden Newest Posts Link on Homepage

TEMPLATE: "PAGE_CONTAINER"

(remove "newest posts" hidden link)

line 289

<a href="{{ link('whats-new') }}"
class="p-navgroup-link p-navgroup-link--iconic p-navgroup-link--whatsnew"
aria-label="{{ phrase('whats_new')|for_attr }}"
title="{{ phrase('whats_new')|for_attr }}">
<i aria-hidden="true"></i>
<span class="p-navgroup-linkText">{{ phrase('whats_new') }}</span>
</a>

 

[JGaulard]

How to Remove Prefix From Page Title and Change Position of Prefix in H1

TEMPLATE: "THREAD_VIEW"

(remove prefix from page title, move prefix from front to back of h1)

line 1

Look for:

<xf:title page="{$page}">{{ prefix('thread', $thread, 'escaped') }}{$thread.title}</xf:title>
<xf:h1>{{ prefix('thread', $thread) }}{$thread.title}</xf:h1>

and change to:

<!-- REMOVE PREFIX FROM PAGE TITLE, MOVE PREFIX -->

<xf:title page="{$page}">{$thread.title}</xf:title>
<xf:h1>{$thread.title} {{ prefix('thread', $thread) }}</xf:h1>

<!-- REMOVE PREFIX FROM PAGE TITLE, MOVE PREFIX -->

 

[JGaulard]

How to Remove Username Quote Links to Posts on Thread Pages

TEMPLATE: "BB_CODE_TAG_QUOTE"

(remove quote username link (goto) for guests - /goto/ links on thread pages)

line 9

<!-- REMOVE QUOTE USERNAME LINK FOR GUESTS -->

<xf:if is="$xf.visitor.user_id">

<a href="{{ link('goto/' . {$source.type}, null, {'id': $source.id}) }}"
class="bbCodeBlock-sourceJump"
data-xf-click="attribution"
data-content-selector="#{$source.type}-{$source.id}">{{ phrase('x_said:', {'name': $name}) }}</a>

<xf:else />

{{ phrase('x_said:', {'name': $name}) }}

</xf:if>

<!-- REMOVE QUOTE USERNAME LINK FOR GUESTS -->

 

[JGaulard]

How to Remove Links to Reactions on Thread Pages

TEMPLATE: "REACTION_LIST_ROW"

(remove reactions link row for guests - /posts/ links on thread pages)

line 5

<!-- REMOVE REACTIONS FOR GUESTS -->

<xf:if is="$xf.visitor.user_id">

<a class="reactionsBar-link" href="{{ link($link, $content, $linkParams) }}" data-xf-click="overlay" data-cache="false">{$reactions}</a>

<xf:else />

{$reactions}

</xf:if>

<!-- REMOVE REACTIONS FOR GUESTS -->

 

[JGaulard]

How to Remove Prefix Links on Forum View Pages for Guests

TEMPLATE: "THREAD_LIST_MACROS"

(remove prefix filter link for guests)

line 91

<!-- REMOVE PREFIX FILTER LINK FOR GUESTS -->

<xf:if is="$xf.visitor.user_id">

<a href="{{ link('forums', $forum, {'prefix_id': $thread.prefix_id}) }}" class="labelLink" rel="nofollow">{{ prefix('thread', $thread, 'html', '') }}</a>

<xf:else />

{{ prefix('thread', $thread, 'html', '') }}

</xf:if>

<!-- REMOVE PREFIX FILTER LINK FOR GUESTS -->

 

[JGaulard]

How to Remove Date Link on Forum View Pages for Guests

TEMPLATE: "THREAD_LIST_MACROS"

(remove date link for guests)

line 150

<!-- REMOVE DATE LINK FOR GUESTS -->

<xf:if is="$xf.visitor.user_id">

<li class="structItem-startDate"><a href="{{ link('threads', $thread) }}" rel="nofollow"><xf:date time="{$thread.post_date}" /></a></li>

<xf:else />

<li class="structItem-startDate"><xf:date time="{$thread.post_date}" /></li>

</xf:if>

<!-- REMOVE DATE LINK FOR GUESTS -->

 

[JGaulard]

How to Remove More Date Link on Forum View Pages for Guests

TEMPLATE: "THREAD_LIST_MACROS"

(remove date link for guests)

line 180

<!-- REMOVE DATE LINK FOR GUESTS -->

<xf:if is="$xf.visitor.user_id">

<a href="{{ link('threads/latest', $thread) }}" rel="nofollow"><xf:date time="{$thread.last_post_date}" class="structItem-latestDate" /></a>

<xf:else />

<xf:date time="{$thread.last_post_date}" class="structItem-latestDate" />

</xf:if>

<!-- REMOVE DATE LINK FOR GUESTS -->

 

[JGaulard]

How to Remove Thread Links in Node Lists For Guests

TEMPLATE: "NODE_LIST_FORUM"

(remove thread link for guests)

line 121

<!-- REMOVE THREAD LINK FOR GUESTS -->

<xf:if is="$xf.visitor.user_id">

<xf:if is="$extras.LastThread.isUnread()">
<a href="{{ link('threads/unread', $extras.LastThread) }}" class="node-extra-title" title="{$extras.LastThread.title}">{{ prefix('thread', $extras.LastThread) }}{$extras.LastThread.title}</a>
<xf:else />
<a href="{{ link('threads/post', $extras.LastThread, {'post_id': $extras.last_post_id}) }}" class="node-extra-title" title="{$extras.LastThread.title}">{{ prefix('thread', $extras.LastThread) }}{$extras.LastThread.title}</a>
</xf:if>

<xf:else />

<xf:if is="$extras.LastThread.isUnread()">
{{ prefix('thread', $extras.LastThread) }}{$extras.LastThread.title}
<xf:else />
{{ prefix('thread', $extras.LastThread) }}{$extras.LastThread.title}
</xf:if>

</xf:if>

<!-- REMOVE THREAD LINK FOR GUESTS -->

 

[JGaulard]

How to Remove Date Links in Threads For Guests

TEMPLATE: "THREAD_VIEW"

(remove thread date link for guests)

line 16

<!-- REMOVE THREAD DATE LINK FOR GUESTS -->

<xf:if is="$xf.visitor.user_id">

<a href="{{ link('threads', $thread) }}" class="u-concealed"><xf:date time="{$thread.post_date}" /></a>

<xf:else />

<xf:date time="{$thread.post_date}" />

</xf:if>

<!-- REMOVE THREAD DATE LINK FOR GUESTS -->

 

[JGaulard]

How to Remove More Date Links on Thread Pages for Guests

TEMPLATE: "POST_MACROS"

(remove post date link for guests)

line 21

<!-- REMOVE POST DATE LINK FOR GUESTS -->

<xf:if is="$xf.visitor.user_id">

<a href="{{ link('threads/post', $thread, {'post_id': $post.post_id}) }}" class="u-concealed"
rel="nofollow">
<xf:date time="{$post.post_date}"/>
</a>

<xf:else />

<xf:date time="{$post.post_date}"/>

</xf:if>

<!-- REMOVE POST DATE LINK FOR GUESTS -->

 

[JGaulard]

How to Remove Share Tool Tip and Link on Thread Pages for Guests

TEMPLATE: "POST_MACROS"

(remove share toolstip and link for guests)

line 32

<!-- REMOVE SHARE TOOLTIP LINK FOR GUESTS -->

<xf:if is="$xf.visitor.user_id">

<a href="{{ link('threads/post', $thread, {'post_id': $post.post_id}) }}"
data-xf-init="share-tooltip" data-href="{{ link('posts/share', $post) }}"
rel="nofollow">
<xf:fa icon="fa-share-alt"/>
</a>

<xf:else />

<xf:fa icon="fa-share-alt"/>

</xf:if>

<!-- REMOVE SHARE TOOLTIP LINK FOR GUESTS -->

 

[JGaulard]

How to Remove Post Number Link on Thread Pages for Guests

TEMPLATE: "POST_MACROS"

(remove post date number link for guests)

line 51

<!-- REMOVE POST NUMBER LINK FOR GUESTS -->

<xf:if is="$xf.visitor.user_id">

<a href="{{ link('threads/post', $thread, {'post_id': $post.post_id}) }}" rel="nofollow">
#{{ number($post.position + 1) }}
</a>

<xf:else />

#{{ number($post.position + 1) }}

</xf:if>

<!-- REMOVE POST NUMBER LINK FOR GUESTS -->

 

[JGaulard]

How to Show Advertisements on All Pages Except for Forum List Page, Forum View Pages, Thread Pages, and Search Results

Customize how you want.

(show ads in only some templates)

<xf:if is="$__globals.template == 'forum_list'">
<xf:elseif is="$__globals.template == 'forum_view'" />
<xf:elseif is="$__globals.template == 'thread_view'" />
<xf:elseif is="$__globals.template == 'search_results'" />
<xf:else />

ADVERTISEMENT GOES HERE

</xf:if>