Responsive Classic (built in to Zen Cart v1.5.5) [Support Thread]

Thank you Scott once again :clap:, that fixed it, the error log no longer comes up with this :)
I didn't know I needed to adjust these settings in the images section to be honest, thought they would be set to a default or something.
I will know from now on, lesson learned.

If you have anymore time for me, could you Please look into my post above and help guide me in the right way (#962) please?

Thanks,

rlexyd:

Great, that's it. Thank you :)
Is there a way to get that top banner to display correctly on Mobile view in the Header?! That's where I really would like it to show correctly.
It shows on the Header and Footer on PC browsers, but only shows on footer correctly on my mobile, the banner is half hidden behind the header in mobile view as per the following snapshot... (Please view photo: https://imgur.com/fHJgpLo)

Also, is there a way (in Mobile device view) to force additional images to display in 2 instead of one as I have they take too much space if I have a few images under each other. I tried to play with mobile css with no luck...(Please view photo: https://imgur.com/nKpsp5v)

Thank you VERY much once again.

I really need some help here... Is there anyone that can assist me with this?
I have played around with different things and still couldn't figure it out?!

Am I posting the above request in the wrong thread?! as I thought I might get some assistance by now :please:
I know there are a lot of requests for help from my fellow zencart users and limited mods available to offer help.
I just want to make sure it's even possible to do what I've asked for above otherwise if it can't be done and I get advised so, I will move on to my next problem, as I have posted a few post of different problems and not much luck getting responses with some of them.
Thank you as always Cindy & Scott for your help with the other problems :bow::thumbsup:

rlexyd:

I really need some help here... Is there anyone that can assist me with this?
I have played around with different things and still couldn't figure it out?!

I suspect a link to a live site might be needed. Perhaps if it's a dev site it could be installed in a temporary location (subfolder/domain) for Zenners to inspect.

Hi Simon,
Here is an image which displays my website URL for anyone needing it.
Thank you.

https://i.imgur.com/BmG0mAL.jpeg

rlexyd:

Great, that's it. Thank you :)
I finally managed to do it after spending days trying to figure it out, all I had to do was follow what you said.
Now is there a way to get that to display correctly on Mobile view on the Header?! That's where I really would like it to show correctly.
It shows on the Header and Footer on PC browsers, but only shows on footer correctly on my mobile, the banner is half hidden behind the header.
(Please view photo: https://imgur.com/fHJgpLo)

Also, while you are reading this, is there a way (in Mobile device view) to force additional images to display in 2 instead of one as I have they take too much space if I have a few images under each other. I tried to play with mobile css with no luck.
(Please view photo: https://imgur.com/nKpsp5v)

Thank you VERY much once again.

rlexyd:

Hi Simon,
Here is an image which displays my website URL for anyone needing it.
Thank you.

https://i.imgur.com/BmG0mAL.jpeg

Thanks for your URL. I'm not sure you can resolve these with just CSS, as you've probably found. It might need changes to the template files. Hopefully someone with a better knowledge of this template can chime in.

While it won't give 2 additional images per row on mobile you could try this to give three images (as you've defined in your admin configuration) per row:

in responsive_mobile.css, in the blank line after line#388 add,

.additionalImages.centeredContent.back {
    float: left;
}

although I see there is similar code commented out at that line so you may have already tried and discarded this.

Hi Simon, thank you so much for that, it did the trick :)
I did not notice that code in the CSS, it took someone a little more clever to pick it up right away :)
Thanks again.
Now, I hope we get the head banner problem sorted now, as it's a bit annoying as customers can't see the message on their mobiles which is my main customers right now.

rlexyd:

Hi Simon, thank you so much for that, it did the trick :)
I did not notice that code in the CSS, it took someone a little more clever to pick it up right away :)
Thanks again.
Now, I hope we get the head banner problem sorted now, as it's a bit annoying as customers can't see the message on their mobiles which is my main customers right now.

A bit more thought on this and I believe you need to add some padding to the <body> tag. So in responsive_mobile.css add:

body {padding-top:36px;}

You'll need to add it to both the landscape and portrait sections of the stylesheet and adjust the value to suit. Showing the banner below the nav menu, rather than above, is the best I can do at the moment.

What a champion, that did the trick, Thank You very very much :bow:

Sorry Simon, there is another problem I'm having that you might be able to help me with.
I edited my (/includes/languages/english/modules/payment/dirbankaus.php) to include an image and help centre it as well.
The code I used was:

Now it displays well during the checkout, when using One Page Checkout and the regular zen checkout and the emails that get sent out, however checkout success page goes all funny, it goes black background and the bottom ezpage footer move all the way up.

When I change the code to the following:

Bank Deposit/Internet Transfer<div id="bankpayment"><img src="images/bankpayment.jpg" alt="" /></a></div>

The payment method displays correctly, althouh I cannot add the extra BOLD text.

I also added this to stylesheet.css... #bankpayment {text-align:center;}

Obviously I'm doing something wrong which is why it's ruining the checkout success page.

Here is 2 snapshots of the 1st code and the error it causes:
https://i.imgur.com/WHEXiqN.jpg
https://i.imgur.com/9GXD2gV.jpg

Here is 2 snapshots of the 2nd code which doesn't have an error (but I need to the extra line and make it bold but everytime I try it causes the above error.):
https://i.imgur.com/sNBHBx3.jpg
https://i.imgur.com/LbLIwdu.jpg

Just so you know, here is the full dirbankaus.php lines.

<?php

$id=$_SESSION['customer_id'];
$ln=$_SESSION['customer_last_name'];




  define('EMAIL_TEXT_NO_DELIVERY',
  '<p>No Delivery, see below:');
  define('MODULE_PAYMENT_DIRBANKAUS_TEXT_EMAIL_FOOTER', 
  "Please use the following details to transfer your total order value:\n\n" .
  "\nAccount No.:  " . MODULE_PAYMENT_DIRBANKAUS_ACCNUM .
  "\nBSB Number:   " . MODULE_PAYMENT_DIRBANKAUS_BSB . 
  "\nAccount Name: " . MODULE_PAYMENT_DIRBANKAUS_ACCNAM . 
  "\nBank Name:    " . MODULE_PAYMENT_DIRBANKAUS_BANKNAM .
  "\nSwift Code:   " . MODULE_PAYMENT_DIRBANKAUS_SWIFT . 
  "\nReference:    "  . $ln ."-" . $id . "-%s" .
  "\n\nSend Cheques/Money Orders To:    " . MODULE_PAYMENT_DIRBANKAUS_ADDRESS . 
  "\nCheques/Money Orders Payable To:   " . MODULE_PAYMENT_DIRBANKAUS_PAYABLE .
  "\n\nThanks for your order which will ship immediately once we receive payment in the above account.\n");


  define('MODULE_PAYMENT_DIRBANKAUS_HTML_EMAIL_FOOTER', 
  '<BR>Please use the following details to transfer your total order value:<br><pre>' .
  "\nAccount No.:  " . MODULE_PAYMENT_DIRBANKAUS_ACCNUM .
  "\nBSB Number:   " . MODULE_PAYMENT_DIRBANKAUS_BSB . 
  "\nAccount Name: " . MODULE_PAYMENT_DIRBANKAUS_ACCNAM . 
  "\nBank Name:    " . MODULE_PAYMENT_DIRBANKAUS_BANKNAM .
  "\nSwift Code:   " . MODULE_PAYMENT_DIRBANKAUS_SWIFT . 
  "\nReference:    "  . $ln ."-" . $id . "-%s" .
  "\n\nSend Cheques/Money Orders To:    " . MODULE_PAYMENT_DIRBANKAUS_ADDRESS . 
  "\nCheques/Money Orders Payable To:   " . MODULE_PAYMENT_DIRBANKAUS_PAYABLE .
  '</pre><p>Thanks for your order which will ship immediately once we receive payment in the above account.');


  define('MODULE_PAYMENT_DIRBANKAUS_TEXT_TITLE', '[B]<div id="bankpayment">Bank Deposit/Internet Transfer:<br><strong>Payment details will be included in your order confirmation email.</strong></br><img src="images/bankpayment.jpg" alt="Bank Payment" /></div>[/B]');
   define('MODULE_PAYMENT_DIRBANKAUS_TEXT_DESCRIPTION', 
  '<BR>Banking and Address details will be sent to your email once the order is confirmed.<br><pre>' . 
  '</pre><p>Thanks for your order which will ship immediately once we receive payment.');
?>

rlexyd:

<div id="bankpayment">Bank Deposit/Internet Transfer:<br><strong>Payment details will be included in your order confirmation email.</strong></br><img src="images/bankpayment.jpg" alt="Bank Payment" /></div>

It looks as though the </strong></br> is causing the problem, you should be using </strong><br>

Whenever I get a screwy layout, I first check the HTML code (and perhaps CSS) for errors - use https://validator.w3.org

Thanks Simon, I've removed the / from br but made no difference :(

rlexyd:

Thanks Simon, I've removed the / from br but made no difference :(

Have you validated the HTML? The validator (https://validator.w3.org) won't be able to scan your checkout success page but you can paste the source code of the page in to the 'Validate by Direct Input' tab.

That's all I have I'm afraid.

doing it now but not sure what is actually causing this problem..
https://i.imgur.com/FRqMftN.png
https://i.imgur.com/2fEoB3J.png
https://i.imgur.com/acVJmSu.png
https://i.imgur.com/MwLOLyw.png

Am I supposed to be deleting all the yellow codes??

rlexyd:

doing it now but not sure what is actually causing this problem..
https://i.imgur.com/FRqMftN.png
https://i.imgur.com/2fEoB3J.png
https://i.imgur.com/acVJmSu.png
https://i.imgur.com/MwLOLyw.png

Am I supposed to be deleting all the yellow codes??

No, the yellow is just highlighting the location of the error. From those screeshots there are quite a few HTML errors, you will need to resolve them I'm afraid. Just work through them one at a time. A quick and dirty method of viewing these is to view the page source code in Firefox and the errors (most of them anyway) will be helpfully highlighted in red. That gives a clue of where to look in your template php files.

Thanks for that, will do.
However the problem with the checkout success page only occured when I added those text to the dirbankaus.php, the others obviously have been there but at least did not interfer with the success page.
Just wondering would there be a limit to how many text charachters can fit in the part that displays the payment module?! I have a feeling that might be it as when I type the full message I want with the image code, the text gets cut off and doesn't in full which is weird and it even cuts the word in half (where there isn't any code or errors there), so why would it only display half the word and not show anything after that!
I hope you get what I mean.

rlexyd:

Thanks for that, will do.
However the problem with the checkout success page only occured when I added those text to the dirbankaus.php, the others obviously have been there but at least did not interfer with the success page.
Just wondering would there be a limit to how many text charachters can fit in the part that displays the payment module?! I have a feeling that might be it as when I type the full message I want with the image code, the text gets cut off and doesn't in full which is weird and it even cuts the word in half (where there isn't any code or errors there), so why would it only display half the word and not show anything after that!
I hope you get what I mean.

Sounds like there might be a limit somewhere, and that cut-off code will probably be the cause of some of your HTML errors.

Ok I fixed some of the errors from my doing, the rest are javascript stuff which must be part of zen cart.
As for the payment info I could NOT figure out a way to add that text...
Do you know if Payment Module names have a character name count?
The only way I could add what I wanted was to replace the name of the module which was effecting the checkout success page.
I really would prefer to add the text instead of adding the text in a photo to fit it which isn't ideal or good quality but unless someone can advise how to I have to do the text image root.

Another issue I'm having is when I'm checking out using mobile view on an iPhone 7, the checkout (TICK on the top right goes down to another line when logged in and have something in cart which customer can't see if background is white - please view snapshot link..)
https://i.imgur.com/mORz9fv.jpg
Anyway to move the top icons to the left so it fits next to the shopping cart icon as it does when viewing via landscape?
Also, anyone know how to adjust the payment image and text to center on mobile view?
I've put a div on the payment logo but it doesn't seem to center on mobile view?!
Thank you for your help.