UI.X 1.5.22.0
- Thread starter Dad.
- Start date
Gazhyde
Well-known member
No
Since we haven't released the 1.3 version yet, that would explain why it isn't 1.3 supported. I have all the leg work done, just need to releaseSince things are going along smoothly I figured I wait until the official release which, if everything goes well for XenForo I could see it being no more than a week or two.
Mouth
Well-known member
Gazhyde
Well-known member
What did you do with the template merging not, err, merging? It's the only thing stopping me going live with 1.3 atm
Mouth
Well-known member
Only took a couple of mins to manually merge the 3 (or 4?) templates that didn't action automatically.
Jens1986
Active member
Hi
1. Due to the inconsistent nature of sidebar markup it is a bit difficult for me to explain except on a per plugin basis. So on my demo, I've enabled the widget framework. Here is a screenshot of the area in question; the icon.
View attachment 68509
Note the markup is different than XenForo's ever so slightly but enough to where (I) couldn't find a way to make it work with one line of code. So this will be different if you do not have the widget frame work installed:
The code about selects the h3 that falls inside the section block class named WidgetFramework_WidgetRenderer_Stats. Then note the :before, which is a pseudo selector that essentially selects the space before the h3 and creates a square that an icon can fit inside of. Now don't worry I did all that work for you, the only think you need to do is:Code:.section .secondaryContent.widget.WidgetFramework_WidgetRenderer_Stats h3:before { content: '\f080'; }
1. Find an icon that you want
2. Note its character unicode value (the thing in parentheses on the link in point 1; the fontawesome cheat sheet
3. From that unicode value, strip out some stuff. So for example, if I wanted fa-heart, the unicode value for that is: . So what I want to do is just note the f004; or just everything after the f character, really.
4. Find the class of the block you want. Do so by inspecting or viewing the source on your webpage. You'll have to see the unique class on each block, and generally they will end in blahblah_users or blahblah_donate or something. Note that above I was selecting the stats block, or as the widget framework names it: WidgetFramework_WidgetRenderer_Stats
5. Now fill in the blanks:
Rich (BB code):.section .secondaryContent.widget.theClassFromPoint4 h3:before { content: '\f080'; }
The green is the class you found from the source code, the red is the stripped out unicode from the icon you wanted from FontAwesome. If you want to use a different icon, you can just replace this with a background image to that icon or a font-family + new unicode and I think it should work fine. but by default I have the font-family of FontAwesome here.
6. Add the code from point 5 you created to somewhere generic, such as extra.css, which is where I'd recommend adding it.
Should be good!
Sorry for the delay in response had a flu all weekend. As you can see our collapse function doesn't seem to like the waindigo tabs, so I will take a look and try and figure out why when I get a chance.
So for me this works on all the widgets except "Who is online" - this is the code I insert into extra.css:
Code:
.section .secondaryContent.widget.WidgetFramework_WidgetRenderer_OnlineUsers h3:before {
content: '\f007';
}And do you have any idea about the other question I asked in my last post?
Thanks!
Last edited:
FredC
Well-known member
I just confirmed this on my on forum which is pretty new XF install. (albeit 1.3 b4-which im aware is unsupported)
Rho Delta
Well-known member
I'm locked out of Audentio.com somehow. I was wanting to see updates on UI.XSomething Ill take a look at for the 1.3 release
UI.X question ...... any idea why, when I upload a logo.png file, that it shrinks it down? I have a 131px height logo, and have the "height of header logo" box set to 131. It uploads the logo, but shrinks it down to 32px high. If I look at the properties of the image on the page, it says it is "scaled." It works perfectly on the Xenforo default style.
Any idea what is up?
Thanks,
Tom
Any idea what is up?
Thanks,
Tom
Sheldon
Well-known member
Sheldon, you are a genius. At least relative to me you are. Thanks so much.
I wondered if you, or anyone else, could give me some guidance on the most effective way to do what I'm trying to do. Not saying it was the best way to do it, but on my old vB board, I had a header/logo that was basically a two tables.
The top table was a gray background with an image on the left, and another image (actually a blob of text I turned into an image), and was about 2/3 of the way across the page. So, as the page was made bigger or smaller, the leftmost image always stayed left, and the other image (text) kind of floated about 2/3 of the way across the page). It worked just fine.
The second table was simply a black bar to separate the logo stuff from the navbar. Again, not the most elegant, but it all worked just fine.
Now on my Xenforo dev board I have some choices to make. One choice would be to try to do it the way I did on my vB board, although admittedly when fooling around with the forum_list template or the header template I couldn't even begin to figure out how to do it.
Another way, I think, would be to redo the logo so that it included the gray background, the image on the left, and the text blob partway across. But, I think if the screen size changes, it's going to scrunch that text blob so it looks bad.... or will it?
Again, at this point I'm open to whatever is the most reasonable way to accomplish the look I'm trying to replicate. If it's easier to look at the old board, it's at www.christianparentsforum.com.
Thank you so much for your help!
Tom
I wondered if you, or anyone else, could give me some guidance on the most effective way to do what I'm trying to do. Not saying it was the best way to do it, but on my old vB board, I had a header/logo that was basically a two tables.
The top table was a gray background with an image on the left, and another image (actually a blob of text I turned into an image), and was about 2/3 of the way across the page. So, as the page was made bigger or smaller, the leftmost image always stayed left, and the other image (text) kind of floated about 2/3 of the way across the page). It worked just fine.
The second table was simply a black bar to separate the logo stuff from the navbar. Again, not the most elegant, but it all worked just fine.
Now on my Xenforo dev board I have some choices to make. One choice would be to try to do it the way I did on my vB board, although admittedly when fooling around with the forum_list template or the header template I couldn't even begin to figure out how to do it.
Another way, I think, would be to redo the logo so that it included the gray background, the image on the left, and the text blob partway across. But, I think if the screen size changes, it's going to scrunch that text blob so it looks bad.... or will it?
Again, at this point I'm open to whatever is the most reasonable way to accomplish the look I'm trying to replicate. If it's easier to look at the old board, it's at www.christianparentsforum.com.
Thank you so much for your help!
Tom
FredC
Well-known member
Robust
Well-known member
How do I use an image for the background? Please refer to http://xenforo.com/community/threads/changing-the-style-background.69752/
Sheldon
Well-known member
It was answered in that thread.
Ensure the AD Styler is turned off:
Style Properties - [UI.X] AD Styler
Go to your General Settings --> Body, add in the image you want:
