1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Adding a thread prefix to a forum in the forum home

Discussion in 'Styling and Customization Questions' started by ChemicalKicks, Mar 1, 2012.

  1. ChemicalKicks

    ChemicalKicks Well-Known Member

    I was wondering if anyone could talk me through adding a thread prefix to a forum when viewing the main forum index?
     
  2. borbole

    borbole Well-Known Member

    I am not sure I understood what you meant. Can you post a screenshot of what you want to achive?
     
  3. ChemicalKicks

    ChemicalKicks Well-Known Member

    Sure thing.

    example.png
     
  4. Brogan

    Brogan XenForo Moderator Staff Member

    Thread prefixes only apply to threads, not forum titles.

    Try this though.
    Add this to EXTRA.css:
    Code:
    .nodeList .node_32 .nodeTitle:before {
    content: url('path/to/image.png');
    display: inline;
    }
    Change the 32 to the node ID.

    This is the result:
    image.PNG

    Obviously you'll have to create some images too.
     
    ChemicalKicks likes this.
  5. ChemicalKicks

    ChemicalKicks Well-Known Member

    Thanks, that's working.

    Do you know how I could align the image vertically so that it's centred with the text in the forum name. In the picture you can see that because the image is taller than the text it looks like it's not square.

    ex1.png
     
  6. Brogan

    Brogan XenForo Moderator Staff Member

    The image looks larger than the text, it looks like it is aligned to the bottom.

    Can you link me to the page and I'll see what I can do.
     
  7. Brogan

    Brogan XenForo Moderator Staff Member

    Never mind I found it, add this:

    Code:
    vertical-align: middle;
    padding-right: 4px;
    image.PNG
     
    ChemicalKicks likes this.
  8. ChemicalKicks

    ChemicalKicks Well-Known Member

    Thanks Brogan x
     
  9. Jainic

    Jainic Active Member

    I'm trying to accomplish a similar look but have the thread prefixes on the right side of the forum links. I changed the css and now it places it on the right side :
    .nodeList .node_4 .nodeTitle:after {

    My question is : Is it possible to have the actual thread prefix links instead of an image?

    [​IMG]
     
  10. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    You can style it with CSS, and reference the @titlePrefix property to pull in the default styling of thread prefixes:

    Code:
    .nodeList .node_2 .nodeTitle:after {
    content: 'Prefix';
    color: white;
    background-color: red;
    border-color: #F88;
    @titlePrefix
    }
    
     
    Shelley and Jainic like this.
  11. Jainic

    Jainic Active Member

    Edit :

    After a bit of CSS researching, it doesn't look like I can add url/links by css.
    Is this only possible through an addon or a hook?

    I'm hoping to use thread prefixes (not just an image but the link - Show only threads prefixed by XXX - must be intact) instead of subforums.
     
  12. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    Yeah that can't be done with CSS. A template edit is required.

    Admin CP -> Appearance -> Templates -> node_forum_level_2

    Add the red code:

    Code:
    		<div class="nodeText">
    			<h3 class="nodeTitle"><a href="{xen:link forums, $forum}" data-description="{xen:if @nodeListDescriptionTooltips, '#nodeDescription-{$forum.node_id}'}">{$forum.title}</a></h3>
    
    			<xen:if is="{$forum.node_id} == 2">
    				<a href="{xen:link forums, $forum, 'prefix_id=1'}" class="prefixLink"
    					title="{xen:phrase show_only_threads_prefixed_by_x, 'prefix={xen:helper threadPrefix, 1, plain}'}">{xen:helper threadPrefix, 1, html}</a>
    			</xen:if>
    
    			<xen:if is="{$forum.description} AND @nodeListDescriptions">
    				<blockquote class="nodeDescription {xen:if @nodeListDescriptionTooltips, nodeDescriptionTooltip} baseHtml" id="nodeDescription-{$forum.node_id}">{xen:raw $forum.description}</blockquote>
    			</xen:if>
    
    			<div class="nodeStats pairsInline">
    				<dl>
    					<dt>{xen:phrase discussions}:</dt> <dd>{xen:if $forum.privateInfo, '&ndash;', {xen:number $forum.discussion_count}}</dd>
    					<dt>{xen:phrase messages}:</dt> <dd>{xen:if $forum.privateInfo, '&ndash;', {xen:number $forum.message_count}}</dd>
    				</dl>
    				<xen:if is="{$renderedChildren} AND {$level} == 2">
    					<div class="Popup subForumsPopup">
    						<a href="{xen:link forums, $forum}" rel="Menu" class="cloaked" data-closemenu="true"><span class="dt">{xen:phrase sub_forums}:</span> {xen:number $forum.childCount}</a>
    						
    						<div class="Menu JsOnly subForumsMenu">
    							<div class="primaryContent menuHeader">
    								<h3>{$forum.title}</h3>
    								<div class="muted">{xen:phrase sub_forums}</div>
    							</div>
    							<ol class="secondaryContent blockLinksList">
    							<xen:foreach loop="$renderedChildren" value="$child">
    								{xen:raw $child}
    							</xen:foreach>
    							</ol>
    						</div>
    					</div>
    				</xen:if>
    			</div>
    		</div>
    
    You need to specify the node_id and the prefix_id in the above code.

    Admin CP -> Appearance -> Templates -> EXTRA.css

    Add this code:

    Code:
    .nodeList .node_2 .nodeTitle,
    .nodeList .prefixLink
    {
    	display: inline;
    }
    
    That will create a hyperlinked thread prefix inline with the forum title in the node listing.
     
    Jainic likes this.
  13. Jainic

    Jainic Active Member

    Cool that works! If I want more than one thread prefixes, do I just repeat the code with the other node_id and prefix_id?


    This is my newbie attempt :oops:. It doesn't work lol.
    Code:
    <xen:if is="{$forum.node_id} == 4,12">
      <a href="{xen:link forums, $forum, 'prefix_id=1,2'}" class="prefixLink"
    title="{xen:phrase show_only_threads_prefixed_by_x, 'prefix={xen:helper threadPrefix, 1,2, plain}'}">{xen:helper threadPrefix, 1,2, html}</a>
    </xen:if>
    
     
  14. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    Presumably each forum will have a different prefix. You need to duplicate the entire block:

    Code:
    		<div class="nodeText">
    			<h3 class="nodeTitle"><a href="{xen:link forums, $forum}" data-description="{xen:if @nodeListDescriptionTooltips, '#nodeDescription-{$forum.node_id}'}">{$forum.title}</a></h3>
    
    			<xen:if is="{$forum.node_id} == 2">
    				<a href="{xen:link forums, $forum, 'prefix_id=1'}" class="prefixLink"
    					title="{xen:phrase show_only_threads_prefixed_by_x, 'prefix={xen:helper threadPrefix, 1, plain}'}">{xen:helper threadPrefix, 1, html}</a>
    			</xen:if>
    
    			<xen:if is="{$forum.node_id} == 3">
    				<a href="{xen:link forums, $forum, 'prefix_id=2'}" class="prefixLink"
    					title="{xen:phrase show_only_threads_prefixed_by_x, 'prefix={xen:helper threadPrefix, 2, plain}'}">{xen:helper threadPrefix, 2, html}</a>
    			</xen:if>
    
    			<xen:if is="{$forum.description} AND @nodeListDescriptions">
    				<blockquote class="nodeDescription {xen:if @nodeListDescriptionTooltips, nodeDescriptionTooltip} baseHtml" id="nodeDescription-{$forum.node_id}">{xen:raw $forum.description}</blockquote>
    			</xen:if>
    
    			<div class="nodeStats pairsInline">
    				<dl>
    					<dt>{xen:phrase discussions}:</dt> <dd>{xen:if $forum.privateInfo, '&ndash;', {xen:number $forum.discussion_count}}</dd>
    					<dt>{xen:phrase messages}:</dt> <dd>{xen:if $forum.privateInfo, '&ndash;', {xen:number $forum.message_count}}</dd>
    				</dl>
    				<xen:if is="{$renderedChildren} AND {$level} == 2">
    					<div class="Popup subForumsPopup">
    						<a href="{xen:link forums, $forum}" rel="Menu" class="cloaked" data-closemenu="true"><span class="dt">{xen:phrase sub_forums}:</span> {xen:number $forum.childCount}</a>
    						
    						<div class="Menu JsOnly subForumsMenu">
    							<div class="primaryContent menuHeader">
    								<h3>{$forum.title}</h3>
    								<div class="muted">{xen:phrase sub_forums}</div>
    							</div>
    							<ol class="secondaryContent blockLinksList">
    							<xen:foreach loop="$renderedChildren" value="$child">
    								{xen:raw $child}
    							</xen:foreach>
    							</ol>
    						</div>
    					</div>
    				</xen:if>
    			</div>
    		</div>
    
     
    Jainic likes this.
  15. Jainic

    Jainic Active Member

    Wow, that's going to be a lot of copy and pastes! I think I might have over 25 thread prefixes.. will this slow down my site at all? I'm curious how this effects site performance. Thank you for the help Jake.
     
  16. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    No. It's an ugly template hack, but it won't affect performance.
     
    Jainic likes this.
  17. Jainic

    Jainic Active Member

    Lool indeed but it'll do! Thanks!
     
  18. Hoolio

    Hoolio Active Member

    Has a forum list page prefix system been integrated yet? or is the above code the best bet? Many thanks
     

Share This Page