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

Template editing and more.

#1
Alright, so using the XenPorta add-on and the Flexile style, this is what my frontpage looks like now:

mypage.jpg

What I want to achieve is something like this:

' Untitled-1.png


So anyway, I have a number of questions regarding this:

1. In the second picture there's no breadcrumb. How do I remove it without removing it from other pages such as the forum? I'

2. How do I apply the same type of div to the news posts as the side-bar modules? I tried just pasting the same <div=> thing into the News template, but didn't get the result I wanted.

3. There are a number of squares, kinda confused me for a while. Anyway, I want to get rid of the square that connects to the breadcrumb and surrounds the news posts, and keep the one that surrounds all the modules. I'm kinda lost as to which square belongs to which template. Something that's also pretty weird is that the top breadcrumb is part of the square that surrounds the news, while the bottom one is part of the larger square. I also want to add some space above the newspost inside the outer square, but I assume that's not very complicated.

4. Atm all my content is on the left of the browser. How do I center the webpage?

5. This isn't really related to the above images, but anyway: Is there anyway to cut off the header/nav/body and add a background to the sides? As illustrated in the sexy layout below:

Untitled-2 copy.jpg

I'll probably add more questions as they appear, I've been playing around with xenforo a lot and it's all new to me.


Thanks!
 

Jake Bunce

XenForo moderator
Staff member
#2
1-3) I don't have XenPorta installed. No doubt you will need to modify XenPorta's templates and CSS to achieve the desired result. Ideally you should contact the author of XenPorta. He may be able to help you modify the portal to your liking.

4) The style is already centered by default. Have you changed the alignment? A fixed width centered layout would be set like this:

Admin CP -> Appearance -> Style Properties -> General -> Page Width Controller

Code:
width: 700px;
margin: auto;
Screen shot 2011-01-22 at 10.30.38 PM.png

5) You can set a background image by editing this class:

Admin CP -> Appearance -> Style Properties -> General -> Body

Screen shot 2011-01-22 at 10.34.50 PM.png
 
#3
Thanks for answering. And yeah, regarding 4, I had accidentally changed it, fixed now!

About 5: changing the body Background would only affect the website below the navigation bar. I want to cut off the whole website at the edges, if you see what I'm saying. Is there any way to limit the maximum width of the header/navigation bar?

Extra question: How do I add user links (Profile, alerts, inbox etc) to the top bar (the black one at the top of the header)?
 

Jake Bunce

XenForo moderator
Staff member
#4
About 5: changing the body Background would only affect the website below the navigation bar. I want to cut off the whole website at the edges, if you see what I'm saying. Is there any way to limit the maximum width of the header/navigation bar?
Admin CP -> Appearance -> Style Properties -> Header and Navigation -> Header

Set a transparent header background, like so:

Screen shot 2011-01-24 at 9.20.29 AM.png

Now the body background can be seen behind the header.

Extra question: How do I add user links (Profile, alerts, inbox etc) to the top bar (the black one at the top of the header)?
That is the moderation bar which normally only shows for admins and mods. You can edit this template to change the bar:

Admin CP -> Appearance -> Templates -> moderator_bar

If you want that bar to show for all logged in users then you need to modify this code:

Admin CP -> Appearance -> Templates -> PAGE_CONTAINER

Code:
<xen:if is="{$visitor.is_moderator} || {$visitor.is_admin}">
	<xen:include template="moderator_bar" />
<xen:elseif is="!{$visitor.user_id} && !{$hideLoginBar}" />
	<xen:include template="login_bar" />
</xen:if>
 
#5
Thanks, I pretty much figured it out.

On a pretty much separate note (I didn't want to make another thread), do you guys have any idea what styles/add-on one could use to achieve this website?

http://projectego.net/

The frontpage is wordpress, but it's incorporated in a xenforo design that I really like. This is what I meant by cutting the header and navigation bar.
 

Jake Bunce

XenForo moderator
Staff member
#6
XenPorta uses xenForo's style. You just need to modify your forum style.

Per my previous post, setting a transparent header background will allow the body background image to show through and will look very much like that site.
 
#7
Well, that's only the header, no? Not the navigation bar?

How do I change the opacity exactly?

Oh, and I realise that's a different style. I just wondered if someone knew what style it was exactly, couldn't find it myself.
 

Jake Bunce

XenForo moderator
Staff member
#8
Well, that's only the header, no? Not the navigation bar?
This is the effect you get when you set a transparent header and a body background image (per my previous posts):

Screen shot 2011-01-26 at 12.37.14 PM.png

How do I change the opacity exactly?
You can add an opacity attribute to the Miscellaneous section of any class in the Style Properties area. For example:

Screen shot 2011-01-26 at 12.35.34 PM.png

Oh, and I realise that's a different style. I just wondered if someone knew what style it was exactly, couldn't find it myself.
I don't recognize that style. It's probably custom. You can always contact their webmaster and ask them about their style.
 

Ryan Kent

Well-known member
#9
I would like to remove the breadcrumb bar from just my forum page, and the site name area below it. Basically I'd like my forum main page to appear similarly to my home page which has XenPorta. I checked forum_list and PAGE_CONTAINER templates, did some experiments but no luck. Can someone share the secret plz?

Basically I'd like everything in the red box in the below image to disappear :) ForumHeader2.JPG
 

Ryan Kent

Well-known member
#11
worked perfectly, as always thx Brogan.

one follow up question plz. In XF terminology, what is $xenOptions ? Is that a hook or ?
 

Jake Bunce

XenForo moderator
Staff member
#12
what is $xenOptions ? Is that a hook or ?
http://xenforo.com/community/threads/1-0-0-b1-finding-variables-available-to-templates.6071/


$xenOptions - This is like $vboptions in vB. It contains settings from the xf_option table in the database. The indexes are the option_id values from each record in that table. For example, here are some references that work in the templates and in template conditionals:​
{$xenOptions.attachmentExtensions}​
{$xenOptions.boardActive}​
{$xenOptions.contactEmailAddress}​