Jump to content

Recommended Posts

Yep, I did say you would need to play with the css, all i did was make a quick test to make sure it loaded and ran. Just check your html to see what button id is beeing used and make the required changes.

I think for BS3 it will be bt1 for your shopping cart and bt2 for check out.

#btn1 {
    Background-color:blue!important;
    color:#fff;
} 

#btn1:hover {
    Background-color:lightblue!important;
    color:red;
} 

#btn2 {
    Background-color:green!important;
    color:#fff;
}
#btn2:hover {
    Background-color:lightgreen!important;
    color:red;
}

should give you this but it all depends on your store set up.

image.png.55eae6e1bcfcc322d4f551150978c4a2.png


 

Share this post


Link to post
Share on other sites

Changing the buttons to 1 and 2 results in no colors on the modal buttons in any circumstance.

Web inspector is recognizing those buttons in the modal as #btn3 and #btn4.

What's happening in the product listing page is, for example, you have a category with ten products in it.

When I use web inspector...every single one of those Buy Now buttons is being assigned a unique button number.

Btn1, Btn2, Btn3, Btn4....all the way down the category thru number 10. 

After I add an item to my cart and close the modal, the color for the Buy Now buttons on items assigned btn3 and btn4 change to the color assigned in the modal template.

It's very weird, but that's what is happening.

- Andrea

 

Share this post


Link to post
Share on other sites

So just make sure you have the same color for each button, as I said you need to change the css to suit your own site colors. Remove the css from the add-on and just use the default on your site.


 

Share this post


Link to post
Share on other sites

Still trying to sort out my modal buttons - the colors. 

Discovered a problem with your cm_footer_modal_cart.php file

Two instances where tep_href_link('product_info',  needs to be changed to product_info.php

Otherwise, the text and image links in the modal lead to a 404 page

The newest template you uploaded is not working for me.  I cannot close the modal box after it appears.  The only way out of it is to click on the Shopping Cart or Checkout buttons.  So, I'm back playing with the original template.  That one functions fine for me. 

- Andrea

 

Share this post


Link to post
Share on other sites
24 minutes ago, puggybelle said:

Two instances where tep_href_link('product_info',  needs to be changed to product_info.php

Good catch did not spot that, silly copy paste error . It's been fixed and uploaded

31 minutes ago, puggybelle said:

I cannot close the modal box after it appears.

No idea why compare the 2 files and see if you have a duplicate issue with js scripts. Phoenix uses the site wide hooks but for BS3  your adding it to the template file you need to be sure you dont have it already in another add-on or in stock files template_top.php or template_bottom.php

This is my template file from my Frozen BS3 site and closes ok.

tpl_cm_footer_modal_cart.php


 

Share this post


Link to post
Share on other sites

Thanks, that one is working for me. 

However, I am unable to achieve any color changes in the buttons without affecting other buttons in the website. 

Any way to make those buttons like the Close button? 

<button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>

I'm playing around with it but the additional code involved is tripping me up. 

Other than that, I really like this add-on and fully intend to use it - Thanks!

- Andrea

 

Share this post


Link to post
Share on other sites
42 minutes ago, puggybelle said:

Any way to make those buttons like the Close button? 

The other 2 are using osC tep_draw_button so are produced by html_output function so use the button set in that, It also assigns the id's for the buttons. The close button is part of the modal and we can set it's color. If you set a color for the other two it will affect all the buttons using that id as you first found.


 

Share this post


Link to post
Share on other sites

You can try replacing line 14 in the template file with this, as you will see we have added a overiding button class to the code. It should work depending on what other mods you have done.

<button type="button" class="btn btn-danger" data-dismiss="modal">Close</button><?php echo tep_draw_button(MODULE_CONTENT_FOOTER_MODAL_CART_HEADING_TITLE . ($cart->count_contents() > 0 ? ' (' . $cart->count_contents() . ')' : ''), 'cart', tep_href_link('shopping_cart.php', '', 'SSL'), 'primary', NULL, 'btn-info') . tep_draw_button(IMAGE_BUTTON_CHECKOUT, 'fas fa-angle-right', tep_href_link('checkout_shipping.php', '', 'SSL'), 'primary', NULL, 'btn-success'); ?>
            

 


 

Share this post


Link to post
Share on other sites

That works, thank you!

Is there no way to have two separate button colors for Cart and Checkout?

I tried changing the last one from 'primary' to 'success' with no luck.  The colors remain identical.

- Andrea

 

Share this post


Link to post
Share on other sites
7 hours ago, puggybelle said:

Is there no way to have two separate button colors for Cart and Checkout?

That's down to your site settings as they do have 2 colors for Cart and Checkout?

image.thumb.png.3ce54529066fdd86263a06c4e4ac7ee6.png


 

Share this post


Link to post
Share on other sites
7 hours ago, puggybelle said:

I tried changing the last one from 'primary' to 'success' with no luck.

I think your geting things mixed up, the buttons are already set as 'btn-info' and 'btn-success'

NULL, 'btn-success'); ?>

 

Share this post


Link to post
Share on other sites

Mixed up ain't the half of it - this is what happens when I spend too long in one place.

I had some issues to sort out in my user.css file - just needed to walk away and try another day.

All is well now!  Thank You for this wonderful add-on!

- Andrea

Share this post


Link to post
Share on other sites

Hi Zahid,

Great contribution, thank you!

One observation and question: when you activate the modal, the screen scrolls to the top, which undermines its utility, assuming it is to prevent losing one's place. Do you know of any way to stop this? My google searches revealed this to be a common issue with modals and I could not get any of the recommended solutions to work.

Regards,,

Peter


PROUDLY PASSIONATE PHOENIX SUPPORTER

Full-time I am a C-suite executive of a large retail company in Australia. In my spare time, I enjoying learning about web-design.

Download the latest version of CE Phoenix from gitHub here

Join the Phoenix Club. Become a Phoenix Supporter.  Gain access to special codes and modules and help the project thrive. Read here

 

Share this post


Link to post
Share on other sites
2 hours ago, peterpil19 said:

activate the modal, the screen scrolls to the top,

I'm not sure about that, had a quick look ( sorry 2 items in basket 🙁) it looks to be doing the same on my site i've never noticed before. I think it scrolling to top just before the actual modal is triggered.  It must be somthing setting <body> back  to 100% , The modal is an overlay with background image so should not affect the main page.

I see it's not doing this on the modal login try it on my test site will need  look into it a bit more.


 

Share this post


Link to post
Share on other sites
2 hours ago, peterpil19 said:

My google searches revealed this to be a common issue with modals

Yes you are right it's a boostrap problem, none of the fixes work!  I think will have to just live with it untill boostrap find a fix. I know some have said edit modal.scss but as I pull from a CDN not posiable and adding overide to user.css is not working.

When the modal is open, the class modal-open is added to the body element.

In _modal.scss, the style .modal-open { overflow: hidden; } removes the scrollbar of the body element. Removing the scrollbar on the body is forcing the scroll to the top.

Edit:

Add the following line to your custom.css:

.modal-open {
    overflow: initial;
}

 

Share this post


Link to post
Share on other sites

Ok I was wrong it's not a Boostrap problem, after a bit of reading it looks like it's normal behavior for a normal boostrap button as in osC the product buy buttons all work in forms when a button is used in a form as submit a page refresh is automaticly done. There are a number of work round but all will require changes the stock buy button, you could replace them with Ajax button or use some js to listen for the click and disable the refresh, all a bit much to just prevent scroll up to top of page.


 

Share this post


Link to post
Share on other sites

Thanks for replying and checking.

Shame it is not a simple solution!

Peter


PROUDLY PASSIONATE PHOENIX SUPPORTER

Full-time I am a C-suite executive of a large retail company in Australia. In my spare time, I enjoying learning about web-design.

Download the latest version of CE Phoenix from gitHub here

Join the Phoenix Club. Become a Phoenix Supporter.  Gain access to special codes and modules and help the project thrive. Read here

 

Share this post


Link to post
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now

×