Customizing Widget Design And Look on Mobile and Desktop
Introduction
Changing the look and feel of your widget to ensure it looks great on both larger and smaller screens is straightforward. You have two different layouts to choose from, each optimized for different screen sizes.
Screen Layouts
Smaller Screens - The smaller screen preview shows how the widget will appear on mobile devices.
Larger Screens - The larger screen container preview demonstrates the widget's appearance on desktops and larger devices. - You can also force the smaller container size on larger screens by contacting our support team.
Troubleshooting
If your theme's CSS overrides widget styles or changes don't appear immediately, contact our support team for assistance. Changes may take a moment to reflect on your store due to caching.
Save Changes Once you are happy with your customizations, click on "save" to apply them.
Check on Store Verify the widget on both desktop and mobile devices to ensure everything looks and functions correctly.
Support
If you need further help customizing your widget or troubleshooting issues, reach out to our support team. We're here to help you optimize your widget and boost your sales.
Contact Support: Click the support button in the app or reach out via email at support@example.com.
Happy upselling and let's make you some more money! Woohoo!
<div class="dynamic-checkout__content" id="dynamic-checkout-cart" data-shopify="dynamic-checkout-cart"> <shopify-accelerated-checkout-cart wallet-configs="[{"name":"shop_pay","wallet_params":{"shopId":29900368,"merchantName":"The Shop Tinkerers","personalized":true}},{"name":"paypal","wallet_params":{"shopId":29900368,"countryCode":"US","merchantName":"The Shop Tinkerers","phoneRequired":false,"companyRequired":false,"shippingType":"shipping","shopifyPaymentsEnabled":true,"hasManagedSellingPlanState":null,"requiresBillingAgreement":false,"merchantId":null,"sdkUrl":"https://www.paypal.com/sdk/js?components=buttons\u0026commit=false\u0026currency=USD\u0026locale=en_US\u0026client-id=AfUEYT7nO4BwZQERn9Vym5TbHAG08ptiKa9gm8OARBYgoqiAJIjllRjeIMI4g294KAH1JdTnkzubt1fr\u0026intent=capture"}}]" access-token="501064acf5007febc8aacdcd65a58195" buyer-country="US" buyer-locale="en" buyer-currency="USD" shop-id="29900368" cart-id="a8442b622580be2e312ef74025150c18" enabled-flags="["2d75a54c"]" > <div class="wallet-button-wrapper"> <ul class='wallet-cart-grid wallet-cart-grid--skeleton' role="list" data-shopify-buttoncontainer="true"> <li data-testid='grid-cell' class='wallet-cart-button-container'><div class='wallet-cart-button wallet-cart-button__skeleton' role='button' disabled aria-hidden='true'> </div></li><li data-testid='grid-cell' class='wallet-cart-button-container'><div class='wallet-cart-button wallet-cart-button__skeleton' role='button' disabled aria-hidden='true'> </div></li> </ul> </div> </shopify-accelerated-checkout-cart> <small id="shopify-buyer-consent" class="hidden" aria-hidden="true"> One or more of the items in your cart is a recurring or deferred purchase. By continuing, I agree to the <span id="shopify-subscription-policy-button">cancellation policy</span> and authorize you to charge my payment method at the prices, frequency and dates listed on this page until my order is fulfilled or I cancel, if permitted. </small> </div>
Choosing a selection results in a full page refresh.