Adding text to top of forum.

[LandyVlad]

And by top I mean where, once logged in, you see your avatar, name, my messages and alerts (on LHS) and search (on RHS)


Is it possible to add some text, centred in the gap between the two - for example the Forum name?

And if so, how please?

[Bigguy]

You mean in the top bar...the one I have stuck to the top.

[LandyVlad]

Yeah that one.

[Bigguy]

I'm sure it's possible. Let me get another coffee and I may play around a bit and see in a bit.

[Bigguy]

You can add text up there and with a bit of styling it would look ok. In your index.template.php file find this:

Code Select Expand

echo '

 <div id="top_section">
Below it add:

Code Select Expand

<div style="text-align:center;border:1px solid red">
This is some text in a div element!
</div>

Shows fine. It just needs some style.

This is just an example mind you.

[Bigguy]

If you gave the div an id, like this:

Code Select Expand

<div id="topcdiv">
This is some text in a div element!
</div>

Than in the css you could do this:

Code Select Expand

.topcdiv{
color:white;
text-align:center;
}

[SychO]

Flexbox is the answer !

look for

Code Select Expand

// In maintenance mode, only login is allowed and don't show OverlayDiv
 echo '
 <ul class="floatleft welcome">
 <li>', sprintf($txt['welcome_guest'], $txt['guest_title'], '', $scripturl . '?action=login', 'return true;'), '</li>
 </ul>';add after

Code Select Expand

echo '
 <div class="forumname">SMFHelper</div>
 <div class="top_forms">';look for

Code Select Expand

</div><!-- .inner_wrap -->replace with

Code Select Expand

</div>
 </div><!-- .inner_wrap -->
Add the following css code (in index.css)

Code Select Expand

.forumname {
 text-align: center;
 line-height: 34px;
}
#top_section .inner_wrap {
 display: flex;
}
#top_section .inner_wrap>* {
 flex: 1 1 auto;
}
last but not least to keep things pretty on mobile, in responsive.css look for

Code Select Expand

@media screen and (max-width: 720px) {Add after

Code Select Expand

.forumname {
 display:none;
 }

[LandyVlad]

@SychO

flexbox ?

What file are the first changes you suggest in please?

Oh and this code

Code Select Expand

</div>
 </div><!-- .inner_wrap -->

seems to have two /div s - are there nested ones here or is that a typo?

I'm not sure what that particular change does?

[SychO]

index.template.php

and no the additional closing div is no mistake, because I added a new div element in the first edit, I'm basically wrapping the search form and the language form together to make sure things display correctly.

[Bigguy]

Is this what you wanted @LandyVlad 

[LandyVlad]

I've yet to try it, but I will