Jump to content

[solved] Move logo in the center of the header


Recommended Posts

Hello, i use prestashop 1.5.4.1, i have tried to put a image in the center of the header but i'm not able in any way so i'd like to put the logo in the center. Is it possible?

 

Thank you

 

Lucio

 

hello, as i said in other thread where we talk about that, it all depends on your logo size. If it is possible - please paste the url to your store. Without url it might be problematic to say what you have to do.

Link to comment
Share on other sites

Yes perfect! But i see that you are a very good prestashop expert and maybe you can help me with my first idea...

Is it possible, with this version of prestashop, to leave the logo where it is now and add a picture in the middle where you put the logo?

Link to comment
Share on other sites

Yes perfect! But i see that you are a very good prestashop expert and maybe you can help me with my first idea...

Is it possible, with this version of prestashop, to leave the logo where it is now and add a picture in the middle where you put the logo?

 

yes it is possible to insert image there

all you have to do is to edit header.tpl file.

 

go to the themes / your_theme / header.tpl and add:

 

<div style="position:absolute; left:400px; top:0px;">
<img src="FULL_PATH_TO_YOUR_IMAGE" />
</div>

 

you have to add this before the code i pasted below:

<a id="header_logo" href="{$base_dir}" title="{$shop_name|escape:'htmlall':'UTF-8'}">

Link to comment
Share on other sites

It works!!! :D

I have only the last question.

I've tried to put

top: 10px;

because right now the image is attached to the top of the screen but it doesn't work...

Why?

 

Sorry i'm stupid!

i didn't saw the first line.

 

Thank you very much for all

Edited by ConteVlad (see edit history)
Link to comment
Share on other sites

I'm very very happy! :D :D :D

I have seen a lot of post and tried a lot of solution but every solution was for a previus version.

 

Thank you so much

 

You're welcome :-)

So, Now i can mark this thread as solved :-)

 

You can also mark own threads as solved, i will be gratefull if you will follow steps below in other your threads:

 

f, after posting a topic, you find a solution to your problem, please indicate it in your post and describe the solution.

There is nothing more frustrating for users with the same issue who come across your post "all is good, I fixed it..." without an explanation of how to fix it.

 

Furthermore if you are the author of the topic for which a solution has been found, please edit your topic title to mark it as [sOLVED].

 

To mark a topic as [solved] :

- Edit the first post of your topic by clicking on the "Edit" button,

- Click on the "Use full editor" button,

 

- Add the "[solved]" string at the beginning of your topic title and click on the "Submit Modified Post" button.

Link to comment
Share on other sites

  • 9 months later...

yes it is possible to insert image there

all you have to do is to edit header.tpl file.

 

go to the themes / your_theme / header.tpl and add:

 

<div style="position:absolute; left:400px; top:0px;">
<img src="FULL_PATH_TO_YOUR_IMAGE" />
</div>
you have to add this before the code i pasted below:

<a id="header_logo" href="{$base_dir}" title="{$shop_name|escape:'htmlall':'UTF-8'}">

 

hye, which line i should add this?

in the end of the file?

or?

thank you

Link to comment
Share on other sites

ni this case you have to modify css styles of 

#header_logo {
position: absolute;
left: 0;
top: 30px;
z-index: 1;
}

increase / decrease values of left:0; and top:30px; values to change logo position

for example:

#header_logo {
position: relative;
left: 300px;
top: 30px;
z-index: 1;
}

you can find this code in global.css file

effect:
MJGZpx5.png

Link to comment
Share on other sites

ni this case you have to modify css styles of 

#header_logo {
position: absolute;
left: 0;
top: 30px;
z-index: 1;
}

increase / decrease values of left:0; and top:30px; values to change logo position

for example:

#header_logo {
position: relative;
left: 300px;
top: 30px;
z-index: 1;
}

you can find this code in global.css file

effect:

MJGZpx5.png

thank you Vekia..

it works great ! =D

 

can i ask for something please?

how to make the size of the logo same as the search bar length?

thank you =D

Hi.

 

You want to display the logo only in one row in the center?

 

Regards.

 

Robin.

 

The CartExpert Team

thats also a good ideas..

how to do it please? =D

Link to comment
Share on other sites

  • 1 year later...

Hi!

I have this same problem. I want to display the logo only in one row in the center.

 

I've try many thigs, also code below..
 

 

#header_logo {
position: relative;
left: 300px;
top: 30px;
z-index: 1;
}

 this code works good but effect don't look good no smatrphones - logo is out of the screen.

Responsive themes dosn't work with that.


link: http://test12392.futurehost.pl/sklep

 

BTW I wat to move cart bar to the right border

Can you help me?

( I hope you understand my english ;)  )

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...