Shopify themes, liquid, logos, and UX
Hello, I'm currently having a problem with dynamic checkout buttons (fast payment options like PayPal, Google Pay and Apple Pay). I have all those 3 enabled, I have had contact with shopify support about this aswell. My theme is DAWN and URL: Je winkelwagen – TrendBlend
So I want the dynamic checkout buttons to show in the cart under the green 'Afrekenen' button which means pay.
^ On phone at checkout it currently looks like this which is perfect! All 3 dynamic payment buttons show next to each other and it just looks good.
^ Then on desktop it looks like this, because it is not an iOS laptop which is also good.
^ But I'm having a problem in the cart with dynamic checkout buttons. They currently show like this on mobile phone. So the PayPal button is missing and PayPal is enabled as a payment method and is shown at checkout so it should actually show. I don't know why it is not showing. And I'm also having a problem with dynamic checkout buttons on desktop, on desktop Google Pay is the only dynamic checkout button showing. So Apple Pay is missing because the device is not iOS, but Paypal is missing once again... And again PayPal, Google Pay and Apple Pay are all enabled for checkout options. They also work on mobile phone so the problem is not that they are not enabled for checkout options, I think something in the design is messed up or something? If you know how to fix it please let me know! Thanks in advance
Solved! Go to the solution
This is an accepted solution.
Hi @TrendBlend,
I still see the Paypal button element present in the html document. That means your payment settings probably aren't the problem. I think maybe the Paypal button not showing up is caused by one of the applications you installed. Try closing all applications and re-visiting the shopping cart page to see how it goes. If the Paypal button appears, try re-enabling all applications and then disabling them one by one to see which application is causing the problem. If the above solution still does not work, can you kindly share your store link (with the password, if any) with us? We will check it and suggest you a solution if possible.
SIMICART: Mobile App Builder |Ironwork Theme - Coming Soon | Product Labels by BSS
Need help from our expert? Kindly share your request with us via community@bsscommerce.com
This is an accepted solution.
Hi, @TrendBlend. You can follow these steps:
Step 1: Access the theme editing section
In the admin panel, select "Online Store" from the left navigation bar. In the "Themes" section, you'll see your store's current theme. Click the "Customize" button to open the customization interface.
Step 2: Open the theme source code editor
In the top right corner of the Customize page, you'll see a button with a three-dot icon (⋮). Click on it. Select "Edit code" from the drop-down menu.
Step 3: Edit source code
The source code editor will open, allowing you to edit the theme files. Since you said your theme is "Dawn", select the "base.css" file and paste the CSS code below at the top:
#dynamic-checkout-cart ul {
display: flex;
flex-direction: row !important; /* Arrange list items horizontally */
justify-content: space-between; /* Distribute the space evenly between items */
padding: 0; /* Remove default padding of ul */
margin: 0; /* Remove default margin of ul */
list-style: none; /* Remove bullet points of ul */
gap: 10px; /* Space between list items */
}
#dynamic-checkout-cart ul li {
flex: 1; /* Make all list items the same size */
}
Step 5: Save changes
Click the "Save" button in the top right corner to save your changes.
The result will look like this:
If you have any more questions, don't hesitate to ask us.
SIMICART: Mobile App Builder |Ironwork Theme - Coming Soon | Product Labels by BSS
Need help from our expert? Kindly share your request with us via community@bsscommerce.com
This is an accepted solution.
Hi @TrendBlend,
I still see the Paypal button element present in the html document. That means your payment settings probably aren't the problem. I think maybe the Paypal button not showing up is caused by one of the applications you installed. Try closing all applications and re-visiting the shopping cart page to see how it goes. If the Paypal button appears, try re-enabling all applications and then disabling them one by one to see which application is causing the problem. If the above solution still does not work, can you kindly share your store link (with the password, if any) with us? We will check it and suggest you a solution if possible.
SIMICART: Mobile App Builder |Ironwork Theme - Coming Soon | Product Labels by BSS
Need help from our expert? Kindly share your request with us via community@bsscommerce.com
Hello, you were right it was an app causing the problem. But I would still like to make the Apple Pay visible for other devices than only IOs devices, do you know if this is possible? Because it currently does not look good there is still space next to the two buttons and it would look nice if Apple Pay just shows. Kind regards, Stef
@BSSCommerce-TA And do you maybe know if I can make the dynamic checkout buttons on the cart page to be next to each other like this (on checkout page)
it currently looks like this on the cart page but I think the buttons at the blue parts look good
This is an accepted solution.
Hi, @TrendBlend. You can follow these steps:
Step 1: Access the theme editing section
In the admin panel, select "Online Store" from the left navigation bar. In the "Themes" section, you'll see your store's current theme. Click the "Customize" button to open the customization interface.
Step 2: Open the theme source code editor
In the top right corner of the Customize page, you'll see a button with a three-dot icon (⋮). Click on it. Select "Edit code" from the drop-down menu.
Step 3: Edit source code
The source code editor will open, allowing you to edit the theme files. Since you said your theme is "Dawn", select the "base.css" file and paste the CSS code below at the top:
#dynamic-checkout-cart ul {
display: flex;
flex-direction: row !important; /* Arrange list items horizontally */
justify-content: space-between; /* Distribute the space evenly between items */
padding: 0; /* Remove default padding of ul */
margin: 0; /* Remove default margin of ul */
list-style: none; /* Remove bullet points of ul */
gap: 10px; /* Space between list items */
}
#dynamic-checkout-cart ul li {
flex: 1; /* Make all list items the same size */
}
Step 5: Save changes
Click the "Save" button in the top right corner to save your changes.
The result will look like this:
If you have any more questions, don't hesitate to ask us.
SIMICART: Mobile App Builder |Ironwork Theme - Coming Soon | Product Labels by BSS
Need help from our expert? Kindly share your request with us via community@bsscommerce.com
Thank you 🙂
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025