🎨 Thèmes completsGratuit · 0 NahnahPar NAHNAH
Thème Washi papeterie
Thème papeterie créative : bandes de masking-tape washi qui maintiennent les photos, fond quadrillé façon cahier, titres soulignés au surligneur. Pour carnets, stylos et loisirs créatifs.
Aperçu en direct
Données de démonstration (produits, menus, textes d’exemple) : dans ta boutique, ce sont les tiennes.
Photos : Unsplash / Pexels (exemples de l’aperçu, jamais inclus dans le code).
Code à copier
Fichier complet sections/nn-th-washi-papeterie.liquid (Liquid, CSS et JS inclus).
{%- comment -%} NAHNAH AI · Thème Washi papeterie {%- endcomment -%}
<div class="nn-theme-washi-papeterie" style="--nn-fond: {{ section.settings.couleur_fond }}; --nn-texte: {{ section.settings.couleur_texte }}; --nn-a: {{ section.settings.couleur_a }}; --nn-b: {{ section.settings.couleur_b }};">
<header class="nn-theme-washi-papeterie__entete"><a href="/" class="nn-theme-washi-papeterie__logo">{{ shop.name | escape }}</a><nav>{%- for l in linklists[section.settings.menu].links limit: 4 -%}<a href="{{ l.url }}">{{ l.title | escape }}</a>{%- endfor -%}</nav><a href="{{ routes.cart_url }}">Trousse ({{ cart.item_count }})</a></header>
<section class="nn-theme-washi-papeterie__heros">
<div><h1><mark>{{ section.settings.titre | escape }}</mark></h1>{%- if section.settings.texte != blank -%}<p>{{ section.settings.texte | escape }}</p>{%- endif -%}<a href="{{ section.settings.collection.url | default: '/collections/all' }}">{{ section.settings.bouton | escape }}</a></div>
<figure class="nn-theme-washi-papeterie__photo">{%- if section.settings.image != blank -%}{{ section.settings.image | image_url: width: 800 | image_tag: alt: section.settings.titre }}{%- else -%}{{ 'product-1' | placeholder_svg_tag }}{%- endif -%}<i class="nn-theme-washi-papeterie__tape nn-theme-washi-papeterie__tape--1"></i><i class="nn-theme-washi-papeterie__tape nn-theme-washi-papeterie__tape--2"></i></figure>
</section>
<section class="nn-theme-washi-papeterie__produits">
{%- for p in section.settings.collection.products limit: 4 -%}<a href="{{ p.url }}"><i class="nn-theme-washi-papeterie__tape"></i>{%- if p.featured_image -%}{{ p.featured_image | image_url: width: 500 | image_tag: loading: 'lazy', alt: p.title }}{%- endif -%}<span>{{ p.title | escape }}</span><strong>{{ p.price | money }}</strong></a>{%- else -%}{%- for i in (1..4) -%}<div><i class="nn-theme-washi-papeterie__tape"></i>{{ 'product-1' | placeholder_svg_tag }}<span>Choisis une collection</span></div>{%- endfor -%}{%- endfor -%}
</section>
<footer class="nn-theme-washi-papeterie__pied"><p>✎ Idées de carnets, chaque mois</p>{%- form 'customer' -%}<input type="hidden" name="contact[tags]" value="newsletter"><input type="email" name="contact[email]" placeholder="Ton e-mail" required aria-label="E-mail"><button type="submit">Noter</button>{%- endform -%}<small>© {{ 'now' | date: '%Y' }} {{ shop.name | escape }}</small></footer>
</div>
{% schema %}
{"name":"Thème Washi papeterie","settings":[
{"type":"link_list","id":"menu","label":"Menu","default":"main-menu"},
{"type":"text","id":"titre","label":"Titre","default":"Écris ta petite histoire"},
{"type":"textarea","id":"texte","label":"Texte"},
{"type":"text","id":"bouton","label":"Bouton","default":"Voir la papeterie"},
{"type":"image_picker","id":"image","label":"Photo du héros"},
{"type":"collection","id":"collection","label":"Collection"},
{"type":"color","id":"couleur_fond","label":"Papier","default":"#FDFCF7"},
{"type":"color","id":"couleur_texte","label":"Texte","default":"#2D2A32"},
{"type":"color","id":"couleur_a","label":"Washi 1","default":"#F7B2C4"},
{"type":"color","id":"couleur_b","label":"Washi 2","default":"#A8D8C9"}],
"presets":[{"name":"Thème Washi papeterie"}]}
{% endschema %}
{% stylesheet %}
/* Thème Washi : quadrillage, scotchs décoratifs */
.nn-theme-washi-papeterie{background:var(--nn-fond) linear-gradient(rgba(80,120,200,.12) 1px,transparent 1px) 0 0/22px 22px,linear-gradient(90deg,rgba(80,120,200,.12) 1px,transparent 1px) 0 0/22px 22px;background-color:var(--nn-fond);color:var(--nn-texte);font-family:"Segoe UI",system-ui,sans-serif;overflow:hidden}
.nn-theme-washi-papeterie a{color:inherit;text-decoration:none}
.nn-theme-washi-papeterie__entete{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 16px;font-size:14px}
.nn-theme-washi-papeterie__logo{font-family:"Segoe Print","Bradley Hand",cursive;font-size:24px}
.nn-theme-washi-papeterie__entete nav{display:flex;gap:14px;flex-wrap:wrap}
.nn-theme-washi-papeterie__heros{display:grid;gap:30px;align-items:center;padding:30px 16px}
.nn-theme-washi-papeterie h1{margin:0 0 14px;font-size:clamp(32px,7vw,64px);line-height:1.1}
.nn-theme-washi-papeterie mark{background:linear-gradient(transparent 55%,color-mix(in srgb,var(--nn-a) 70%,transparent) 55%) left/0 100% no-repeat;color:inherit;animation:nn-theme-washi-papeterie-surligne 1.2s .3s ease forwards}
.nn-theme-washi-papeterie__heros p{margin:0 0 18px;line-height:1.6}
.nn-theme-washi-papeterie__heros a{display:inline-block;padding:12px 22px;border:2px solid var(--nn-texte);border-radius:8px;font-weight:700;box-shadow:4px 4px 0 var(--nn-b)}
.nn-theme-washi-papeterie__photo{position:relative;margin:0 auto;width:min(380px,82vw);padding:12px;background:#fff;box-shadow:0 10px 24px rgba(0,0,0,.1);transform:rotate(2deg)}
.nn-theme-washi-papeterie__photo img,.nn-theme-washi-papeterie__photo svg{width:100%;aspect-ratio:1;object-fit:cover;display:block;background:#f1f1f1}
.nn-theme-washi-papeterie__tape{position:absolute;width:90px;height:26px;background:repeating-linear-gradient(45deg,var(--nn-a) 0 8px,color-mix(in srgb,var(--nn-a) 70%,#fff) 8px 16px);opacity:.88;-webkit-mask:linear-gradient(90deg,transparent 0 3px,#000 3px calc(100% - 3px),transparent 0),repeating-linear-gradient(#000 0 3px,transparent 3px 5px);mask:conic-gradient(#000 0 0)}
.nn-theme-washi-papeterie__tape--1{top:-12px;left:-18px;transform:rotate(-30deg)}
.nn-theme-washi-papeterie__tape--2{bottom:-10px;right:-16px;transform:rotate(-25deg);background:repeating-linear-gradient(90deg,var(--nn-b) 0 6px,color-mix(in srgb,var(--nn-b) 60%,#fff) 6px 12px)}
.nn-theme-washi-papeterie__produits{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;padding:30px 16px 40px}
.nn-theme-washi-papeterie__produits>*{position:relative;display:flex;flex-direction:column;gap:4px;padding:10px;background:#fff;box-shadow:0 4px 12px rgba(0,0,0,.08);font-size:14px;transition:transform .3s}
.nn-theme-washi-papeterie__produits>*:nth-child(even) .nn-theme-washi-papeterie__tape{background:repeating-linear-gradient(90deg,var(--nn-b) 0 6px,color-mix(in srgb,var(--nn-b) 60%,#fff) 6px 12px)}
.nn-theme-washi-papeterie__produits .nn-theme-washi-papeterie__tape{top:-12px;left:50%;margin-left:-45px;transform:rotate(-4deg)}
.nn-theme-washi-papeterie__produits>*:hover{transform:translateY(-5px) rotate(-1deg)}
.nn-theme-washi-papeterie__produits img,.nn-theme-washi-papeterie__produits svg{width:100%;aspect-ratio:1;object-fit:cover;background:#f2f2f2}
.nn-theme-washi-papeterie__pied{text-align:center;padding:30px 16px}
.nn-theme-washi-papeterie__pied p{font-family:"Segoe Print","Bradley Hand",cursive;font-size:20px;margin:0}
.nn-theme-washi-papeterie__pied form{display:flex;gap:8px;max-width:420px;margin:12px auto 16px;flex-wrap:wrap}
.nn-theme-washi-papeterie__pied input[type=email]{flex:1 1 180px;min-width:0;padding:12px;border:2px solid var(--nn-texte);border-radius:8px;background:#fff}
.nn-theme-washi-papeterie__pied button{padding:12px 18px;border:2px solid var(--nn-texte);border-radius:8px;background:var(--nn-a);font-weight:700;cursor:pointer}
@keyframes nn-theme-washi-papeterie-surligne{to{background-size:100% 100%}}
@media (min-width:750px){.nn-theme-washi-papeterie__heros{grid-template-columns:1fr 1fr;padding:40px}.nn-theme-washi-papeterie__produits{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (prefers-reduced-motion: reduce){.nn-theme-washi-papeterie mark{animation:none;background-size:100% 100%}.nn-theme-washi-papeterie__produits>*{transition:none}}
{% endstylesheet %}
Licence NAHNAH AI : utilisation libre dans tes boutiques (y compris commerciales), modification permise, revente de l’élément seul interdite.
Prompt à copier
À coller dans Claude ou ChatGPT avec le fichier téléchargé (ou le code copié) : l’assistant t’aide à l’installer et à l’adapter à ta marque.
Tu es un expert des thèmes Shopify Online Store 2.0. Aide-moi à installer puis à adapter à ma marque cet élément gratuit de la bibliothèque NAHNAH AI.
Élément : « Thème Washi papeterie » (Thèmes complets)
Description : Thème papeterie créative : bandes de masking-tape washi qui maintiennent les photos, fond quadrillé façon cahier, titres soulignés au surligneur. Pour carnets, stylos et loisirs créatifs.
Page de l’élément (aperçu en direct) : https://ai.nahnah.shop/bibliotheque-shopify/theme-washi-papeterie
Fichier : nahnah-theme-washi-papeterie.liquid (bouton « Télécharger » de la page) ou le code copié avec le bouton « Copier » : je te le joins ou je le colle après ce message.
Emplacement dans le thème : sections/nn-th-washi-papeterie.liquid (Liquid, puis {% stylesheet %} et {% javascript %}, dans ce seul fichier).
Étapes d’installation :
1. Dans Shopify : Boutique en ligne → Thèmes → bouton « … » du thème → Modifier le code.
2. Dossier « sections » → « Ajouter une section » (ou « Nouveau fichier ») → nomme-la « nn-th-washi-papeterie ».
3. Efface le contenu proposé, colle le code de l’onglet Liquid (fichier complet), puis Enregistrer.
4. Ouvre Personnaliser → Ajouter une section → choisis-la, règle les textes et les couleurs, puis Enregistrer.
Ce que j’attends de toi :
- Guide-moi pas à pas dans Shopify : Boutique en ligne → Thèmes → « … » → Modifier le code → dossier sections → Ajouter une section, puis Personnaliser → Ajouter une section.
- Propose-moi d’adapter les couleurs, les textes et les liens à ma marque : demande d’abord mes couleurs (codes hexadécimaux), mon ton et mes liens.
- Garde le bloc {% schema %} et tous ses réglages (identifiants, types, presets) : je dois pouvoir tout régler ensuite dans l’éditeur de thème.
- Rends-moi le fichier complet modifié, prêt à coller, sans faux avis, fausse urgence ni chiffre inventé.
Si tu as le connecteur NAHNAH AI (MCP), récupère directement le code exact avec l’outil obtenir_code_element (id : theme-washi-papeterie).Ajouter à ma boutique
En un clic, le thème arrive dans ta boutique Shopify connectée, en non publié : tu le publies quand tu veux.
Chargement de tes boutiques…
Installer dans Shopify
- Dans Shopify : Boutique en ligne → Thèmes → bouton « … » du thème → Modifier le code.
- Dossier « sections » → « Ajouter une section » (ou « Nouveau fichier ») → nomme-la « nn-th-washi-papeterie ».
- Efface le contenu proposé, colle le code de l’onglet Liquid (fichier complet), puis Enregistrer.
- Ouvre Personnaliser → Ajouter une section → choisis-la, règle les textes et les couleurs, puis Enregistrer.
Installer via le MCP
Depuis Claude, Claude Code ou ChatGPT connecté à NAHNAH AI, demande : « Donne-moi le code de l’élément theme-washi-papeterie de la bibliothèque NAHNAH AI et les étapes pour l’installer ». L’assistant récupère le code et les étapes (outil obtenir_code_element), gratuitement.
Boutique connectée à NAHNAH AI : l’assistant peut aussi l’installer directement (outil installer_element, ou appliquer_theme pour un thème).
Connecter le MCP