Comment Personnaliser les Notifications sur Shopify

Nous allons voir dans ce tutoriel comment personnaliser les notifications génériques de Shopify ! Avant toute intervention n’oubliez pas de sauvegarder chaque template pour éviter de faire des bêtises et d’avoir en cas de soucis une sauvegarde saine 🙂

Pré-requis pour suivre ce tutoriel Shopify ?

Attention vous devez avoir des bases en HTML et CSS pour pouvoir suivre ce tuto ! vous ne les avez pas ? Regardez cette vidéo puis la suivante 😉 voir la vidéo sur le HTML 

Ces modifications étant assez délicates à expliquer par écrit, je vais uniquement mettre les bouts de codes avec leur intitulé en vous invitant à visionner la vidéo ci-dessous:

video

Exemples de codes utilisés dans cette vidéo

Image

<img src="https://cdn.shopify.com/s/files/1/0059/9198/9282/files/Banner-1900-x-550-clean-Running-Street-Blended-sectioned.png?v=1614773566" alt=""  style="width:100%;max-width:100%;"/>

Tableau de 2 colonnes

<table width="100%">
<tr>
<td style="padding:10px;">test</td>
<td style="padding:10px;">test</td>
</tr>
</table>

Tableau de 2 colonnes avec textes centrés

<table width="100%">
<tr>
<td style="padding:10px;"><center>test</center></td>
<td style="padding:10px;"><center>test</center></td>
</tr>
</table>

Titre avec fond

 <h2 style="padding:10px;background:#FF6600;color:#FFFFFF;">Titre avec fond</h2>

Bouton

<table class="button main-action-cell">
        <tr>
          <td class="button__cell"><a href="https://google.fr" class="button__text">Texte du bouton</a></td>
        </tr>
      </table>

Texte centré

<center>Texte centré</center>

Ce tuto existe aussi en vidéo

Bon tuto à toutes & tous 😉