Jump to content

[SOLVED] Making logo bigger but not over lap on menu and search box


Recommended Posts

I'm new to Presta Shop and trying to make some small customizations to the default theme. One is making a bigger logo appear on the header section. Could someone give some insight on how to achieve this properly? By default it appears that a big logo will over lap onto the menu bar and search box. I've attached a picture to see what it looks like. Is there a smart way to add some padding so the search box and or menu bar will float around the bigger image size?


I've made a copy of the default theme and renamed it to my own.


The CSS code from gloabl.css I believe in question is:


#header {position:relative}
#header_logo {
    position: absolute;
    top: 30px;
    z-index: 1;

#header_right {
    float: right


Link to comment
Share on other sites

The search box need to be moved a little as well:

In /modules/blocksearch/blocksearch.css:  and find this blue named block of code

#search_block_top {

  position: absolute;

  right: 22%;              <- make a little smaller, from 26% to around 22%

  top: 34px;

and in same file, find the blue named code:
#search_block_top #search_query_top {

  padding: 0 5px;

  height: 23px;

  width: 230px;           <- change to smaller value, from 300px to say 230px

  border: 1px solid #666;

  border-right: 0 !important;

  color: #666;

  background: url(img/bg_search_input.png) repeat-x 0 0 #fff;

  float: left;





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...