How to make logo bigger? Without disturbing design.

[DorkV]

Hello All,

 

I am building a new shop with free a free theme. I have uploaded the logo in the header in different size but it resizes automatically. I have found how to make the logo larger in the css file but then my shopping cart moves. And it don't look nice anymore.

 

In the attachment you wll find some samples.

 

Thanks in advance!

Edited November 8, 2014 by DorkV (see edit history)

[DorkV]

This one can be closed. Used another theme.

[saralaurence]

Making a logo design best tool for adobe Photoshop easy to make logo want you need i make so many custom logo design service use this tool. i am sure it is helpful for you.

[Juliette GARREAU]

Hi ! 

 

I am on Prestashop 1.7, the "in development version".

Thinking of all the people that will have the same problem as I did, I will offer my partial answer to this problem : 

 

I found a way of making the logo bigger by modifying CSS files "theme.css" in themes/my_theme_name/assets/css, on line 7960 :

#header .logo {
   max_width : 50%; /*modify the width by changing 50% into 750% or whatever you need */
}

But I found out this solution did exclude the main menu, that was under the new logo and not accessible. I spent a lot of time trying to figure out how to move down the top-menu and I found that the logo and the menu were in the same container on CSS files, and that moving one moved the other. There sure is a way to disable this, but I don't really do CSS and the shop I am working on is supposed to be easy to use and modify for people who are not comfortable around computers, so I wanted a very not intrusive way of doing it.

 

So, what I did is I made the max_width into 0%, and I went into the Modules. I put my logo on the Banner module, and in "Positions", I transplanted the Banner Module into displayTop. I put it higher than the main menu, and here we are ! 

[Logo Designs Company]

Hey!

You can go the menu by addition this style rule:

#top #hader .main_menu .menu{

right:0px;

top: 49px;

}

Modify the top and right value to your likings.

if you want extra room bellow the fullwidth logo you can set the container height manually:

#header .container.main_menu {

z-index: 101;

height: 200px;

}

last but not least create sure that the image you use is not larger than 930px, otherwise it wont appear centered.

Regards >> Smith Walson