Personnalisez votre tiroir de panier dans Upcart à l’aide de HTML et de CSS via Settings > Custom HTML & CSS.

Bien qu’Upcart offre l’aide de notre assistant IA Fin, vous pouvez également utiliser des outils d’IA tiers pour créer du contenu personnalisé.

Bonnes pratiques

Utilisez uniquement du HTML en ligne — pas de balises <html>, <head> ou <body>.
Conservez tout le CSS dans la section Custom CSS.
Utilisez le menu déroulant d’emplacement HTML pour choisir exactement où votre extrait apparaîtra.
Si vous utilisez du JavaScript, il doit être soit :
- Un petit <script> en ligne (comme un compte à rebours)
- Soit placé dans la section « Scripts (Before Load) »
Envoyez à l’IA un lien vers la bibliothèque de sélecteurs CSS V2 d’Upcart et la bibliothèque d’emplacements HTML afin qu’elle génère du code utilisant les bons noms de classes pour votre version du panier.

Choses à éviter

Ne collez pas de pages web complètes (<html>, <head>, <body>) provenant d’outils d’IA ou de générateurs de code, elles casseront la mise en page d’Upcart.
Évitez de placer des styles dans des balises <style> à l’intérieur du champ HTML.
N’utilisez pas de polices externes ou de bibliothèques lourdes, sauf en cas de nécessité absolue.

Utiliser ChatGPT ou une IA similaire pour une aide supplémentaire

Utilisez ce prompt à copier-coller pour obtenir du code propre qui fonctionne avec Upcart :

I'm using a cart drawer app, Upcart, on my Shopify storefront. Please help me make design changes to the cart. Ensure to provide only the HTML to embed within the existing cart, rather than full HTML documents.   
  
**Do not include:**  
- `<html>`, `<head>`, or `<body>` tags  
- `<style>` tags (I will place CSS in a separate field)  
- Scripts unless they are very small and inline (or intended for the "Scripts (Before Load)" section)  
  
Here's a documentation page that lists all of Upcart's current CSS selectors: https://docs.aftersell.com/upcart/upcart_css_selector_library_v2
(If your cart is still on V1, use the V1 library instead: https://docs.aftersell.com/upcart/upcart_css_selector_library_v1)
  
Here's a documentation page that lists all of Upcart's current HTML locations: https://docs.aftersell.com/upcart/upcart_html_location_library  
  
Here’s what I want to build:  
[Insert what you want. e.g. A free shipping progress bar, a trust badge row, a message for international customers, etc.]  
  
Please return only the HTML snippet for the Custom HTML box and the corresponding CSS (if any) that I can paste into the Custom CSS box.

Getting Started

Cart Modules

Cart Settings

Sticky Cart Button

Multicart

Customizations

Analytics

Integrations & Compatibility

Billing & Account

Troubleshooting

Suggestions de prompts d'IA pour ajouter du code personnalisé à vos paramètres Upcart

Bonnes pratiques

Choses à éviter

Utiliser ChatGPT ou une IA similaire pour une aide supplémentaire

​Bonnes pratiques

​Choses à éviter

​Utiliser ChatGPT ou une IA similaire pour une aide supplémentaire

Bonnes pratiques

Choses à éviter

Utiliser ChatGPT ou une IA similaire pour une aide supplémentaire