Status
Not open for further replies.
T

tfmore

  • tfmore
Please fill in the following so we can better assist you

Website address:
Style in question(if any): FA+


Hi Russ,
We can't seem to locate a FA setting that will allow for changing of individual sub-forum node icons. Could it be hiding in plain sight?

Thanks
 
T

tfmore

  • tfmore
Russ I had one other question that I wanted to ask you that slipped my mind. It is in regard to the Social Icons in the footer. Not the extended type footer, just the bottom of the page. Rather than the icons appearing beneath the Copyright info, is it possible to pull them over to the right side instead? On the same exact line as the copyright, but on the opposite side of the page.

Thank you
 

Russ

Pixel Exit Staff
Please fill in the following so we can better assist you

Website address:
Style in question(if any): FA+


Hi Russ,
We can't seem to locate a FA setting that will allow for changing of individual sub-forum node icons. Could it be hiding in plain sight?

Thanks

We have no option built in to control each node itself. The node icons can all be changed by going to :Style Properties -> Node Icons

To get each node its own icon, use this in extra.css

Code:
.node_98 .nodeIcon .fa:before { content: '\f0e6'; }
.node_77 .nodeIcon .fa:before { content: '\f188'; }
.node_11 .nodeIcon .fa:before { content: '\f059'; }

Of course reference the CSS sheet:
http://fortawesome.github.io/Font-Awesome/cheatsheet/

Just grab your node ID # and replace mine, then you can replace the font awesome icon using the cheat sheet.


For your social icons... try doing this in extra.css:

Code:
.XenBase #copyright
{
  display: block;
  float: none;
}
#copyright .xbSocialLinks
{
  float: right;
}
See if that helps.
 
T

tfmore

  • tfmore
Thanks so much, Russ.

Sub-forum:
I should have been more clear. The sub-forum icons in question are the ones that display on the Home page, right under their Main forum. We've un-ticked 'Show sub-forums popup', so now the sub-forum icons are the little fa-caret-right arrows. Will the code need to be adjusted to target this particular area?

Social Icons:
That did pull it over to the right perfectly. Is having them sit on the same horizontal line as the copyright doable? Simply for the sake of uniformity. They currently sit below it as you can see here: http://www.lancebase.com/ . Was also hoping to move it to the right a bit as so that its right most edge is vertically aligned with that little RSS icon. Are these things accomplished in the margin/padding fields of their settings?
 
Last edited by a moderator:

Russ

Pixel Exit Staff
Try this for the copyright:

Code:
.XenBase #copyright {
  display: block;
  float: none;
  overflow: hidden;
  height: 41px;
  line-height: 41px;
}
#copyright .xbSocialLinks
{
  float: right;
}
.XenBase .footerLegal .pageContent {
  padding: 12px 10px;
}

Replace what I gave you earlier.

As for those icons, easy to change:

Style Properties: ├ ─ Nodes -> Node Subforum Read

Notice the content: "\f0da"; you can change this using the Font Awesome Cheat Sheet
 
T

tfmore

  • tfmore
Russ,
The code worked perfect, except that it pushed the copyright out to the left even further as well. After playing with it we discovered that this can be avoided entirely were we to use the box style social icons, as they automatically line up vertically with that right side. Now we're trying to figure out how to change the colors of those boxes. All will be well at that point.

Nodes:
Works perfect, but we have one set of those sub-forum icons that differs from the others. Is it possible to change one set of them individually/only?

Thanks is mere
 

Russ

Pixel Exit Staff
To target a specific node:

Code:
.node_5 .subForumList li .nodeTitle:before { content: "\f0da"}
This would cover ALL of the sub-forums in node_5.

If you wanted to target a specific sub-node:

Code:
.subForumList li.node_5 .nodeTitle:before { content: "\f0da"}

It looks like the social icons are inheriting the color from the copyright, try this in extra.css:

Code:
#copyright .xbSocialLinks a {
  color: #FFF !important;
}
 
T

tfmore

  • tfmore
Node icons worked fantastically, thank you. I should have again been more clear, sorry, I meant the colors of the social icon boxes, not the icons themselves.
 
Status
Not open for further replies.

Pre-Sale Questions

If you have any questions or concerns you want to ask before you make a purchase don't hesitate to use one of our multiple support channels for your convenience.