Hi
First of all apologies if this is the wrong section to post this request (admin please move if needed). First time I have posted here in yonks.
I am wanting to use the default Opencart 2.0.3.1 theme on my next project to avoid the ususal problems of extension compatability, plus the fact that the default theme is very cool. Anyhow, I would like to alter the top header area to change the position and length of the seach bar to above the cart button AND allow for a bigger Logo than the current 33.333% restriction. Any clever people show me how to do this please? Probably pretty basic to most of you but I can't for the life of me make it so!
See screen shot attached.
Thanks in advance
Robster
First of all apologies if this is the wrong section to post this request (admin please move if needed). First time I have posted here in yonks.
I am wanting to use the default Opencart 2.0.3.1 theme on my next project to avoid the ususal problems of extension compatability, plus the fact that the default theme is very cool. Anyhow, I would like to alter the top header area to change the position and length of the seach bar to above the cart button AND allow for a bigger Logo than the current 33.333% restriction. Any clever people show me how to do this please? Probably pretty basic to most of you but I can't for the life of me make it so!
See screen shot attached.
Thanks in advance
Robster
Attachments
new-header.jpg (95.64 KiB) Viewed 2278 times
I know my place...!
You could install viethemes excellent custom javascript form here:
http://www.viethemes.com/downloads/custom-javascript/
Once installed goto system/settings edit your store and you will see the new custom javascript tab.
Click on that and enter
into the box.
Save and refresh and all should be good
http://www.viethemes.com/downloads/custom-javascript/
Once installed goto system/settings edit your store and you will see the new custom javascript tab.
Click on that and enter
Code: Select all
<script>
$(document).ready(function () {
if ($(window).width() > 768) {
$('#search').insertBefore('#cart');
$('#logo').parent().removeClass('col-sm-4').addClass('col-sm-9').next().remove();
}
});
</script>
Save and refresh and all should be good
Thanks so much. That sounds a perfect solution except that when I click save I get:
Forbidden
You don't have permission to access /webshop/admin/index.php on this server.
Additionally, a 404 Not Found error was encountered while trying to use an ErrorDocument to handle the request.
Any ideas?
Robster
Forbidden
You don't have permission to access /webshop/admin/index.php on this server.
Additionally, a 404 Not Found error was encountered while trying to use an ErrorDocument to handle the request.
Any ideas?
Robster
I know my place...!
Just one other thing if you wouldn't mind. How do I alter your script slightly so that the logo is just 50% wide rather than 75% wide. I plan to use an image background in the header area with it's own clickable link between the logo and search box, etc. so don't want the logo area to extend that far across. Hope you understand.
See screenshot.
Again, thanks.
Robster
See screenshot.
Again, thanks.
Robster
Attachments
Screen_Shot_2017-03-19_at_16_36_48.png (23.76 KiB) Viewed 2215 times
I know my place...!
Hi,
Yes I did change that - I set it to col-sm-5 for example but the search bar and cart moved across too. Not quite there yet
See screenshot.
Robster
Yes I did change that - I set it to col-sm-5 for example but the search bar and cart moved across too. Not quite there yet
See screenshot.
Robster
Attachments
Screen Shot 2017-03-19 at 23.42.05.png (30.15 KiB) Viewed 2198 times
I know my place...!
Actually I have sorted it. I installed Viewthemes custom CSS (which is also very good) and added the following lines of code and all seems well:
I am not sure !important is necessary tbh but anyway that sorted it and it looks fine still in mobile view.
Thanks again for pointing me in the right direction, your kind help is gratfully appreciated.
Robster
Code: Select all
@media (min-width: 768px) {
.col-sm-3 {
float: right !important;
Thanks again for pointing me in the right direction, your kind help is gratfully appreciated.
Robster
I know my place...!
Who is online
Users browsing this forum: No registered users and 163 guests