Configurer l’apparence de sa mini-boutique

Vous êtes de plus en plus  nombreux à créer des minis-boutiques et on est bien content. Je vous laisse voir la liste des boutiques créés, certains d’entre vous se sont vraiment décarcassé.

Ce qu’il y a de bien avec les minis-boutiques c’est que vous pouvez les personnaliser au maximum. Je vais donc vous expliquer deux trois petit trucs pour personnaliser la votre à votre image.

Tout d’abord le jargon
Tout le monde ne parlant pas le langage informatique je me permets de faire une traduction des quelques termes se trouvant sur la page boutique.
Quand on vous parle de « header » il s’agit de ce qui se trouve tout en haut de la page.
Le « footer » est ce qui se trouve tout en bas.
Le ‘bloc info » est ce rectangle où vous pouvez laisser du texte ou des images pour expliquer un peu votre boutique.
Le CSS c’est la feuille de style qui vous permet de customiser l’ensemble.
Le « template » c’est le patron CSS que vous utilisez et que vous pouvez modifier à votre guise.

Ah, on me souffle à l’oreillette que du moment qu’on parle un peu anglais on a vite compris.

Charger des images
Il vous suffit d’aller dans la colonne de gauche et de cliquer dans la partie Médias sur « Gérer mes images ». Vous n’aurez qu’à charger les images qui vous serviront qu’à customiser le header, le footer, le bloc info et le background soit l’image de fond.

Vous verrez qu’au fur et à mesure les images chargées apparaissent en liste à droite comme sur l’exemple ci-dessous.

Intégrer les images sur votre mini-boutique
C’est facile : colonne de gauche dans la partie CSS, cliquez sur « template« . Il faut copier-coller le template par défaut que vous aurez téléchargé. C’est ensuite dans ce texte (qui vous semblera peut-être un peu chinois selon vos connaissances informatique) qu’il faudra intégrer les images.

Commant ? C’est tout simple. Lorsque vous cliquez sur une des images que vous avez chargé (et qui apparaisse en liste vous me suivez ?) il vous suffit de copier l’adresse de cette image qui se trouve dans la barre d’adresse et de la coller ou bon vous semble dans ce template CSS.

Par exemple voici le premier paragraphe du template par défaut :

body {
color: #F0E39E;
background: white;
padding:0;
margin:0;

Le voilà de nouveau customisé par nos soins. Nous avons changé entre autre la couleur et ajouté une image.
body {
background-image:url(http://shops.mandellia.fr/laboutiqueparis/upload/boutique-paris-fond.jpg);
background-color:black;
background-repeat:no-repeat;
background-position:top;

Cela suppose de connaître un peu le CSS, mais n’ayez pas peur sous ses airs un peu abrupte il ne mord pas, et puis comme toujours, nous allons améliorer l’interface et il deviendra de plus en plus simple de créer sa mini-boutique.

Est-ce assez clair pour vous ?