Xenforo tip

Status
This thread has been locked.

MilkyKoekie

Feedback score
-1
Posts
217
Reactions
31
Resources
0
Hello guys,
I have just been working on some custom html/css i wanted to add to my xenforo forum.
It needs to be completely at the top but im not sure where to add it.
<!DOCTYPE html>
<html>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<head>
<style>
div {
max-width: 1920px;
height: 43px;
background-color: #3D3D3D;
}
p.thicker {
font-weight: 650;
color: White;
top: 8px;
position: absolute;
font-size: 14px;
font-family: "Helvetica";
left: 370px;
width: 200px;
height: 100px;
}
p.iphover {
font-weight: 400;
color: #979797;
position: absolute;
top: 8px;
font-size: 14px;
font-family: "Helvetica";
left: 506px;
width: 200px;
height: 100px;
}
p.thickerb {
font-weight: 650;
color: White;
top: 8px;
position: absolute;
font-size: 14px;
font-family: "Helvetica";
right: 370px;
width: 200px;
height: 100px;
}
p.store {
font-weight: 400;
color: #979797;
position: absolute;
top: 8px;
font-size: 14px;
font-family: "Helvetica";
right: 270px;
width: 200px;
height: 100px;
}
p.line {
font-weight: 400;
color: #979797;
position: absolute;
top: 8px;
font-size: 14px;
font-family: "Helvetica";
right: 235px;
width: 200px;
height: 100px;
}
p.social {
font-weight: 400;
color: #979797;
position: absolute;
top: 8px;
font-size: 14px;
font-family: "Helvetica";
right: 230px;
width: 200px;
height: 100px;
}
a:link {
color: #979797;
background-color: transparent;
text-decoration: none;
}
a:visited {
color: #979797;
background-color: transparent;
text-decoration: none;
}
a:hover {
color: #9122a7;
background-color: transparent;
text-decoration: none;
}
</style>
</head>
<body>
<p class="thicker"><i class="fa fa-play-circle"></i> </i>Come play today!</li>
<p class="thickerb"></i>Visit us at our:</li>
<p class="line"></i>|</li>
<p class="iphover"><a href="http://www.luminousmc.com/"></i>play.luminousmc.com</li>
<p class="store"><a href="http://www.luminousmc.com/"></i>Store</li>
<p class="social"><a href="http://www.luminousmc.com/"></i>Twitter</li>

<div></div>

</body>
</html>

I might make some changes but for now, were do i put it?
 
PebbleHost
High performance, consistent uptime and fast support. Minecraft hosting that just works.

Shaun

Web Developer, owner of Syncore LLC
Supreme
Feedback score
20
Posts
622
Reactions
408
Resources
0
Hey, custom CSS should be added to the EXTRA.CSS template. I'm not entirely sure how to make global changes to the HTML, but you could paste it in the forums index template?
 

Glitch

Website Developer
Supreme
Feedback score
32
Posts
426
Reactions
114
Resources
0
CSS should go to extra.css
and from the looks from your code. You're making a navigation. You can add that on header template
 

MilkyKoekie

Feedback score
-1
Posts
217
Reactions
31
Resources
0
CSS should go to extra.css
and from the looks from your code. You're making a navigation. You can add that on header template
Hey, custom CSS should be added to the EXTRA.CSS template. I'm not entirely sure how to make global changes to the HTML, but you could paste it in the forums index template?
Whatever i do, it looks like this... I think im going to have to pay someone to put it in for me.
 

Attachments

  • rip.PNG
    rip.PNG
    363 KB · Views: 17

MilkyKoekie

Feedback score
-1
Posts
217
Reactions
31
Resources
0
You shouldn't place the entire code into the header template
I didn't, i tried placing a little part of the css part into extra.css, this happens.
Tried the same in header.css and in navigation.css and this keeps happening.
 

MilkyKoekie

Feedback score
-1
Posts
217
Reactions
31
Resources
0
Code:
div {
max-width: 1920px;
height: 43px;
background-color: #3D3D3D;
}

this code might have some conflict with xenforo
Is there an easy fix or should i hire someone to do it for me? I thought this part (basiclly just a black bar with some text) wouldn't be to hard. And if i just load the code it works, but if it conflicts with xenforo i have no idea what to do...
 
Status
This thread has been locked.
Top