Adding Text Into The Header

[MCS_Computers]

Hey Zenners

Could someone please assist me in a small query.

I am wanting to add some text into the header of a website I`m doing for a friend. Please see the picture below ...



I would like to add some text in the area above the links in the top right as seen in the pic.

Now I have identified that the file I need to add the code to is the tpl_header.php file, the issue is I have no idea where or what to put. I have been experimenting and can get text to show but not in the right place or position, all I did was insert the word TEST and then looked at the webpage to see what happened.

Any assistance on this would be appreciated, I`m hoping to add 2 lines of text if possible.

Many thanks in advance.

[mc12345678]

Position of text displayed to the browser is controlled through CSS. This is generally made possible by including <span or <div tags around the text such as:

<span class="test-text" >TEST</span>

Or similar with div. A class would be used if you want to do the same thing with multiple objects, where if you wanted to do something to a specific item you would using a unique id instead. It is bad html form for two objects to have the same id.

Then in the css file applicable to the page(s) in question, the applicable formatting is applied. As to "sequence" within the file, generally, things to be above other objects are displayed before the follow on item(s). They will be moved according to the css rules applied to them.

Once the applicable/desired tags are around the text, you can with a pc press f12 and be presented with a browser tool that will let you make up/modify the css before attempting to make it a permanent part of the site. This is something that others can help you do if you provide a link to the site (or hopefully a test version of the site). Otherwise, general/generic suggestions can only be provided and the desired result more than likely not to appear. Also, once such additional text is included, if the template is in some way responsive or mobile friendly, testing should be done to see the effects through as many browser arrangements as possible and the applicable css incorporated.

[MCS_Computers]

The web address in question is:

www.jmdelisupplies.co.uk/index.php (index.php needed otherwise you see a holding page)

Being a novice I kind of half understand what your saying (sorry)

As I explained in my first post, when I altered the PHP file I saw the text on the page but it was not in the right place. Are you saying that the text should go in the PHP file but then I need some coding in a CSS file to control it`s position.

You have to bare in mind that I entered the word TEST on its own in a PHP file, that should give you an idea of my knowledge LOL

Thanks in advance

[MCS_Computers]

Okay I`ve tried all sorts, scoured the forums and the internet with no luck. Can anyone please offer me some help, I would be very grateful.

Thanks in advance ..

[dbltoe]

You should have a file on your computer at includes/templates/responsive_sheffield_blue/common/tpl_header.php. If it's not there, copy it from the includes/templates/template_default/common/tpl_header.php.
Once you've got it in the right directory, look for a line that starts with

<div id="logo">

That starts the instruction for inserting the logo. That line should end with a </div>. It may de several lines down before you find the closing </div>. I don't have a copy of the template file or I could be more specific. Post yours if you want a more accurate answer.
What you want to add after that code is a line to tell the code what text you want and where to put it. Adding something like

<div class="logoText"><?php echo 'This is my text.'; ?></div>

right after the first line will get the text to appear.
Then, you'd use your includes/templates/responsive_sheffield_blue/css/stylesheet.css to tell the text where to go. Probably just needs to have a line added at the end of the css file like

.logoText {float:right;}

Again, if you post your tpl_header.php, we can be more specific.

[MCS_Computers]

You should have a file on your computer at includes/templates/responsive_sheffield_blue/common/tpl_header.php. If it's not there, copy it from the includes/templates/template_default/common/tpl_header.php.
Once you've got it in the right directory, look for a line that starts with

<div id="logo">

That starts the instruction for inserting the logo. That line should end with a </div>. It may de several lines down before you find the closing </div>. I don't have a copy of the template file or I could be more specific. Post yours if you want a more accurate answer.
What you want to add after that code is a line to tell the code what text you want and where to put it. Adding something like

<div class="logoText"><?php echo 'This is my text.'; ?></div>

right after the first line will get the text to appear.
Then, you'd use your includes/templates/responsive_sheffield_blue/css/stylesheet.css to tell the text where to go. Probably just needs to have a line added at the end of the css file like

.logoText {float:right;}

Again, if you post your tpl_header.php, we can be more specific.

Mate you are a legend, that worked a treat and is exactly what I want.

Just a couple of questions to add on to this issue, I was hoping to have more than 1 line of text, please don`t laugh but I thought that if I used your coding again under the first line of text but change the logotext to logotext2 in both the php and css files it would give me a 2nd line of text but it didn't it just kept it on the same line.

Secondly is there an easy way to align my line of text with the row of icons underneath ??

Website is www.jmdelisupplies.co.uk/index.php again index.php needed or you will see the holding page.

Many thanks again in advance

[mc12345678]

Something needs to tell the browser that a new line is involved for the second "line". Typically can add <br /> after the first line/before the second.

My current browser doesn't allow me to play with the html to test this against your site to see what greater effect it will have as compared to using a paragraph parameter or other css commands.

[lat9]

... or you could simply update your stylesheet.css file (around line 565), adding:

margin-right: 1em;

to the styling of your newly-added .logoText selector.

[MCS_Computers]

... or you could simply update your stylesheet.css file (around line 565), adding:

margin-right: 1em;

to the styling of your newly-added .logoText selector.

The line originally read ...

.logoText {float:right;}

So I changed it to ..

.logoText {float:right;margin-right: 1em;}

Worked a treat mate, thank you very much

[dbltoe]

Actually, since the text is in a PHP echo, you would use \n instead of the HTML <br />. You could also split the lines in the echo by using

<div class="logoText"><?php echo 'This is my text1' . PHP_EOL . 'This is my text2'; ?></div>

You can see why the \n is generally used. Less confusion or chances for mistakes.
Just for appearances, I'd add a margin-right:20px; to the stylesheet to make it

.logoText {float:right;margin-right:20pc;}

This gets the text more in line with that below it.
I do find it interesting that the text disappears in mobile view.

Most of this was on hold while getting a snack. Too slow as usual.