How do i make a box with text in header?

Heavy

Active member
Hi Xenforo!

I wanna create a box like this
81868327bc271c3f7217627cb3795c00.png
, but instead of above the search bar, i want it left to the search box!

Can anyone help me with creating this box - with text? If you want to see the box it's on 8wayrun.com

Thanks in advance!
 
Hi,

You need a minimum of knowledge about XenForo to reproduce certain things. I'll give you a solution.

It is better to increase the height of the header to put a big box and easier to put on. Go to "Style Properties", "Header and Navigation" and in "Height of Header Logo" put 110px instead of 50px.

Go to the templates of your styles and search for "ad_header". Now, add the following inside:
Code:
<div id="headerBox">
    <span>Your text here</span>
    </br>
    <a href="Your link here">Your text link here"></a>
</div>

Then, search for "EXTRA.css" and add this:
Code:
#headerBox
{
    float: right;
    background-color: #000;
    text-align: center;
    margin-top: 10px;
    padding: 30px 50px;
    border-radius: 3px;
}

#headerBox span
{
    color: #FFFFFF;
}

Screenshot_2.webp

This is just an example for you to understand, but now it's up to you to stylize. ;)
 
Not the position i wanted, as you have my forum link, could you please make the box next to to the left of the search box.

Thanks so much!
Yes, because you have a custom style, so it is difficult to make according to your needs. I need an account so that I can connect to the system of stylization.
 
I made a mistake in the HTML code. This is not:
Code:
<div id="headerBox">
    <span>Your text here</span>
    </br>
    <a href="Your link here">Your text link here"></a>
</div>

but:
Code:
<div id="headerBox">
    <span>Your text here</span>
    </br>
    <a href="Your link here">Your text link here</a>
</div>
 
Top Bottom