Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
fantasiummedia

Add a Checkout Button to Individual Product Page

Question

Hey All,

I am looking to add a "Checkout" button to each individual product page right next to the "Add to Cart" button. I was able to find a partial solution here, but the problem this is that the custom CSS does not load until after refreshing the page due to the Ajax functionality. It does not appear that my theme has an option to disable Ajax.

Here is a link to an example product: https://www.fantasiummedia.com/prints/mossy-bridge

Any suggestions? 

 

Share this post


Link to post

9 answers to this question

Recommended Posts

  • 0

@fantasiummedia Wrap CSS in Style tag, then insert to Site Header

The code will be

<style>
 .checkoutbutton {
   font-family: arial;
   font-size: 12px;
   color: #fff;
   font-weight: normal;
   font-style: normal;
   text-align: center;
   width: 250px;
   text-decoration: none;
   padding: 14px 18px;
   background-color: #292929;
 }
 .checkoutbutton:hover {
   color: #fff;
   background-color: #292929;
 }
</style>

 

Share this post


Link to post
  • 0

@fantasiummedia Try inline CSS, the code will be

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
     <script>
     $(function() {
       $("<a class='checkoutbutton' style='font-family:arial;font-size:12px;color:#fff;font-weight:normal;font-style:normal;text-align:center;width: 250px;text-decoration: none;padding: 14px 18px;background-color: #292929;' href='/link/'>CHECKOUT</a>").insertAfter(".sqs-add-to-cart-button-wrapper");   
     });
 </script>

 

Share this post


Link to post
  • 0

@tuanphan still no luck. Thank you so much for your help - huge discount code on a print coming your way if you're interested.

Just to confirm, you want me to have the first piece of code ( style - .checkoutbutton) in the Advanced --> Code Injection --> Header field, then use the script in there as well, just at the top? 

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...