ajensen27 Posted April 17, 2013 Share Posted April 17, 2013 Hello, I have a slightly modified default theme and I would like to create a small fixed header at the top of the page (about the size of the navigation bar) and place my ajax cart up there. That way the car is always visible up top. I feel like this would be a nice update for a lot of people. Is this a hard thing to do or pretty simple? If it's pretty hard, I'll just find a developer to do this for me. Thanks! Link to comment Share on other sites More sharing options...
vekia Posted April 17, 2013 Share Posted April 17, 2013 Hello ajensen27, i think that solution depends on the modification, it is necessary to know something more about the theme, like css styles, blocks order etc. can you please provide the url if it is possible? Or maybe you want solution for "clean" default theme? Link to comment Share on other sites More sharing options...
ajensen27 Posted April 17, 2013 Author Share Posted April 17, 2013 Hi Vekia, Yes a solution for a clean default theme would be nice. I use the default theme, just slightly modified. My test site however is www (dot) incontishop (dot) com Thanks! Alex Link to comment Share on other sites More sharing options...
ajensen27 Posted April 17, 2013 Author Share Posted April 17, 2013 This is what I'm thinking except that it's fixed to the top of the page. http://www.templatemonster.com/demo/43475.html Link to comment Share on other sites More sharing options...
vekia Posted April 17, 2013 Share Posted April 17, 2013 Well, basic fixed mode for header is easy to configure, take a look: themes/mytheme/header.tpl to the <div id="header" class="grid_9 alpha omega"> i added style="", like: <div id="header" class="grid_9 alpha omega" style="position:fixed; background:#FFF; margin-top:0px; padding-top:0px;"> and to the: <div id="columns" class="grid_9 alpha omega clearfix" > i added style="", like: <div id="columns" class="grid_9 alpha omega clearfix" style="Position:relative; top:150px;"> you also need to add style="postion:relative; top:150px;" to the #footer div, just open the footer.tpl file and change <div id="footer> for: <div id="footer" class="grid_9 alpha omega clearfix" style="position:relative; top:150px"> and that's all. But as i said it is basic configuration. If you want some other changes in this case you of course need to modify modules attached to header section etc. hope all is clear, if you've got any other questions - feel free to write im going to write article about that :-) article ready: how to create fixed prestashop header regards Link to comment Share on other sites More sharing options...
ajensen27 Posted April 18, 2013 Author Share Posted April 18, 2013 Thanks for the response Vekia! I just saw your tutorial and it's not exactly what I was looking for but close. I basically just wanted to create a separate "bar" at the top of the page that would be fixed and contain the shopping cart and that is all. Seems like it might be a little more difficult then something I can take on so I'll probably just hire a developer. Thanks! Link to comment Share on other sites More sharing options...
vekia Posted April 18, 2013 Share Posted April 18, 2013 in this case you have to edit both header.tpl file and blockuserinfo module. Well, first necessary step is change positon of blockuserinfo - move it to the top of the hook - it must be first on list. next you need to create new styles for #header_user (block user info) where you must add: width:100%; position:fixed; and other params like height:20px; in header tpl you must define margin-top (or position:relative; top:20px) for whole content, because fixed cart will be overlaping content of the page Link to comment Share on other sites More sharing options...
generalexperts Posted January 19, 2014 Share Posted January 19, 2014 Vekia, I tried the solution you posted on 17 April 2013, it definitely kept the header from moving. But the header is to the far right and cut off and I would need it centered like it normally is in a website. Any ideas? Thank you! Link to comment Share on other sites More sharing options...
vekia Posted January 19, 2014 Share Posted January 19, 2014 and what ps version you use? the same as Ajensen uses? with the same theme? Link to comment Share on other sites More sharing options...
generalexperts Posted January 19, 2014 Share Posted January 19, 2014 I'm using Prestashop 1.5.4.1. And using the responsive html5 theme... Link to comment Share on other sites More sharing options...
vekia Posted January 19, 2014 Share Posted January 19, 2014 so your non default theme causing problems you've got. solution pasted above is related to default theme or themes based on "default" theme engine. unfortunately, without more informations (and without link) it's almost impossible to help Link to comment Share on other sites More sharing options...
generalexperts Posted January 19, 2014 Share Posted January 19, 2014 (edited) Let me know what else you need, thanks! Edited October 29, 2014 by generalexperts (see edit history) Link to comment Share on other sites More sharing options...
vekia Posted January 20, 2014 Share Posted January 20, 2014 your website is totally messed, no columns, so i think that you should fix it, or maybe you want to have theme without columns? Link to comment Share on other sites More sharing options...
generalexperts Posted January 29, 2014 Share Posted January 29, 2014 Vekia, so I got the website fixed, now back to trying to get a fixed header. Do you have a solution that will work for me? Thanks! Link to comment Share on other sites More sharing options...
vekia Posted January 29, 2014 Share Posted January 29, 2014 so you want whole header to be fixed? also with menu and cart etc? Link to comment Share on other sites More sharing options...
ajensen27 Posted January 29, 2014 Author Share Posted January 29, 2014 That's what I was looking for originally Vekia and I am still a little interested. Thanks! Link to comment Share on other sites More sharing options...
vekia Posted January 29, 2014 Share Posted January 29, 2014 i tried to open website, but i saw something weird: Link to comment Share on other sites More sharing options...
ajensen27 Posted January 29, 2014 Author Share Posted January 29, 2014 ahhh that was our test domain for when we were developing our PS store... We are now live www (dot) llmedico (dot) com Link to comment Share on other sites More sharing options...
generalexperts Posted January 29, 2014 Share Posted January 29, 2014 Yeah I'm looking to have the header fixed with the horizontal menu bar, horizontal logo (small and right above the menu), search bar (to the right), account login (upper right), cart (upper right), and possibly facebook, twitter buttons (to the lower right of the fixed header). Thanks Link to comment Share on other sites More sharing options...
generalexperts Posted January 30, 2014 Share Posted January 30, 2014 I was able to get the header fixed from the solution posted on April 17th! Now I'm trying to get the margins spaced correctly, as the header now is pretty big. Thanks! Link to comment Share on other sites More sharing options...
eduard02 Posted August 12, 2014 Share Posted August 12, 2014 Hello again Vekia I set homeslider on top with your great module. Now I set header to be fixed, but also homeslider remains blocked. Any solution for this? Thank you. Well, basic fixed mode for header is easy to configure, take a look:themes/mytheme/header.tplto the <div id="header" class="grid_9 alpha omega"> i added style="", like: <div id="header" class="grid_9 alpha omega" style="position:fixed; background:#FFF; margin-top:0px; padding-top:0px;"> and to the: <div id="columns" class="grid_9 alpha omega clearfix" > i added style="", like: <div id="columns" class="grid_9 alpha omega clearfix" style="Position:relative; top:150px;"> you also need to add style="postion:relative; top:150px;" to the #footer div, just open the footer.tpl file and change <div id="footer> for: <div id="footer" class="grid_9 alpha omega clearfix" style="position:relative; top:150px"> and that's all. But as i said it is basic configuration. If you want some other changes in this case you of course need to modify modules attached to header section etc.hope all is clear, if you've got any other questions - feel free to writeim going to write article about that :-)article ready: how to create fixed prestashop headerregards Link to comment Share on other sites More sharing options...
vekia Posted August 13, 2014 Share Posted August 13, 2014 in cases like that it will be great if you will share url to see how it looks like in real shop it's hard to imagine what's going on there :-) Link to comment Share on other sites More sharing options...
eduard02 Posted August 15, 2014 Share Posted August 15, 2014 (edited) in cases like that it will be great if you will share url to see how it looks like in real shop it's hard to imagine what's going on there :-) electrice-cabluri.ro with home slider on top header will keep slider fixed. no solution for me on this. thank you. Edited August 19, 2014 by eduard02 (see edit history) Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now