AbanteCart Community
Shopping Cart Operations => Support => Topic started by: everchanging on February 14, 2018, 04:03:09 PM
-
Hi guys :)
I have the following question:
Whatever I do the fallback static banner does not work properly (as it is doing in the demo of abantecart).
Please note that I did change the banner with one of my own... but I did follow all instructions (image size is 940X351 px).
Also, I already have read through all documentation about it...
Any ideas something like that can be fixed?
I thank you in advance
-
Hi, what exactly is not work for you?
-
Hi Basara and sorry for the delayed reply...
When I resize the window to observe how the store responses to the various screen sizes... when I reach the size of a mobile, instead of the fallback banner to kick in (as it happens in your demo), it just does not happen...
No fallback banner appears and that part appears to be messed-up somehow... although I also did follow the instructions of the documentation...
On top of that, it shows as a 6th main banner...???
-
And I did pm you the link to the store directly to check it out ;)
-
You have a third-party template. Please contact developer
-
ok... I see thank you
-
One question through...
Is there a way when somebody uses his/her PC to have the main banners active but once someone switches to let us say, mobile screen, for these banners to be deactivated?
-
Yes, this is very simple to archive with CSS media queries. Hide a div with banner for specific resolution
@media only screen and (max-width: 500px) {
#mybanner-div-id {
display:none;
}
}
-
OK.. so basically I enter the CSS (style.css or response.ccs ?) file add this section below the banner section (?) and it should do the trick?
edit:
I went into storefront/view/default/stylesheet/style.css
added the code at the end of the stylesheet and saved it.
If I have understood you correctly and done it correctly; it is a matter of propagation now... so once the change appears I will keep you posted.
If on the other hand, I did something wrong please let me know.
I thank you :)
-
so far nothing...
for the records, I did end the code you wrote at the end of both css files (namely, style.css or response.ccs)
am I missing something? :-/
-
IMO as you are using different template you need to put code that style.css file not the one you have in storefront. Locate files for template under extension folder and then add these line inside its style.css
-
Hi Sam,
thanks for the reply... yes I realized that after a couple of minutes and did that exactly... but still the same problem remains...
the link below is the one that leads to the css file(s):
/extensions/si_orange_theme/storefront/view/si_orange_theme/stylesheet
-
Basara, what I did add at the end of the css was the following:
@media only screen and (max-width: 500px) { #banner_slides { display:none; }}
I did send you the link...
did I do something wrong here?
also:
the link below is the one that leads to the css file(s):
/extensions/si_orange_theme/storefront/view/si_orange_theme/stylesheet
-
Hello. Did you clear browser cache?
-
Hi..
yes I did but so far I accomplished nothing... :-\
-
Please use browser inspector tool to check is this rule work for you or not. I think you apply to the wrong element
section.slider {
display: none;
}
-
Hi,
I did indeed use the inspector of google to get the div id... (but according to what you posted... it appears that I did see the wrong id? frankly... I do not know)...
Now, what I did was to insert at the bottom of the extension's css file the following:
@media only screen and (max-width: 500px) {
section.slider {
display: none;
}
}
similarly I did apply the code at the end style.response.css and the onebyone.css
No need to do that? I guess... what I am quite positive that one of these three css file are affecting the slider...
I did clear the cache of firefox... but nothing so far...
I guess I will have to wait for a while for probagation to do its thing? I don't know...
-
Hi Basara,
i checked it in firefox and google and so far it appears to be working!! :)
I truly want to thank you for helping me out here... so thank you :)
-
Try this
@media only screen and (max-width: 500px) { #banner_slides { display:none!important; }}
I think it is overwritten somewhere . can you see all the CSS applied to this ID.
Can you share the url?
-
Hi Sam_78,
thank you for your concern and your suggestion.
Basara's suggestion did work and so far everything is OK...
I will PM you the link (just keep in mind I am still adding products and are working on the shipping etc... well, the store is meant to officially launch sometime coming month)...
Once again I truly thank you :)