Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

Contact Us Page


Wizard25

Recommended Posts

Hello:

 

I would like to move everything on the contact page to the left.

I have attached two image files:

 

Contact 1 - as it looks now

Contact 2 - as I want it to look

 

I'm not good with css and so I am struggling with this.

Can someone walk me through the fix?

 

Thanks

 

Bill :)

post-339277-0-51786700-1464518981_thumb.jpg

post-339277-0-96056300-1464518981_thumb.jpg

Link to comment
Share on other sites

@@Wizard25

 

I would recommend you do some reading here and here. This will help you understand the way Bootstraps grid system works. Anytime you change something it might look good on a large screen but you have to check if it matches a smaller screen size too. (In firefox possible by pushing ctrl+shift+m) Bootstrap has XS, SM, MD and LG view port settings. (XS = extra small, SM = small, MD = medium, LG = large) So even if you would add some padding to move the input fields to the left it will cause problems at smaller screen sizes. Unless you define the screen size inside the css. (See custom.css as sample)

 

In your case, quick and dirty would be to open the contact_us.php file and change all col-sm-3 to col-sm-2 and find and change all col-sm-9 to col-sm-8.

That should move things a bit to the left. You also will need to move the other stuff like the required text and the button below.

Link to comment
Share on other sites

Thanks Tsimi

 

A few extra notes:

 

How to move "Required information" Text.

 

Find: <p class="inputRequirement text-right"><?php echo FORM_REQUIRED_INFORMATION; ?></p>

 

Change to: <p class="inputRequirement text-right"><?php echo FORM_REQUIRED_INFORMATION; ?></p>

 

 

 

How to move the "Continue" Button"

 

Find :  <div class="text-right"><?php echo tep_draw_button(IMAGE_BUTTON_CONTINUE, 'fa fa-send', null, 'primary', null, 'btn-success'); ?></div>
 

Change to: <div class="text-center"><?php echo tep_draw_button(IMAGE_BUTTON_CONTINUE, 'fa fa-send', null, 'primary', null, 'btn-success'); ?></div>

 

 

Note to OS Designers: I think The "Continue Button" should say "Send" - but that's just my opinion

 

 

Link to comment
Share on other sites

If you want to change the text in the button to send

 

change

 

<div class="text-right"><?php echo tep_draw_button(IMAGE_BUTTON_CONTINUE, 'fa fa-send', null, 'primary', null, 'btn-success'); ?></div>

 

to

 

<div class="text-right"><?php echo tep_draw_button(IMAGE_BUTTON_SEND, 'fa fa-send', null, 'primary', null, 'btn-success'); ?></div>

 

and add to your includes/languages/english.php

 

define('IMAGE_BUTTON_SEND', 'Send');

 

Button should change to send but work exactly the same.

REMEMBER BACKUP, BACKUP AND BACKUP

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...