PapyClic - Design

 La possibilité de pouvoir télécharger plusieurs photos lien,  permet de créer un article diaporama très facilement, mais la présentation reste à faire. Je vous propose donc de vous faciliter la tâche.

Dans l'espace de gestion de votre blog, ajoutez un nouvel article.

Quand vous cliquez sur HTML dans la fenêtre qui s'ouvre, vous collez le code ci-dessous. Ce code permet de voir directement dans le composeur la présentation des photos et également sur le blog.

Positionnez le curseur dans le deuxième paragraphe créé au début de l'article.

Maintenant vous pouvez télécharger les photos, vous cliquez sur l'icône "Images", puis vous recherchez les photos sur votre ordinateur, vous cliquez sur chaque photo en pressant la touche CTRL pour les sélectionnées.
Ensuite vous cliquez sur "Ouvir" ou vous pressez sur ENTREE selon votre système.

Patientez un peu que toutes soient téléchargées ... Vous devriez avoir le résultat suivant, cliquez sur l'image pour l'agrandir :

En cliquant sur l'une des photos le visiteur déclenchera le diaporama avec une navigation par des flèches en survolant la photo.

Vous pouvez également insérer pour ce diaporama, un titre et un descripttif au début de l'article, dans un paragraphe au-dessus des photos. 

Cliquez en dessous des photos vous avez une ligne qui a été créée automatiquement, ce qui vous permet d'insérer, un titre ou un descriptif à chaque photo, même un lien vers un autre article contenant un récit en rapport avec la photo. 

Pour vous donner une idée des positions des titres et descriptifs, cliquez sur l'image pour l'agrandir :

Vous avez remarqué certainement les coins arrondis et les bords ombrés des photos, ci-dessous le code complété pour réaliser ce bel effet, code accepté par les dernières versions des principaux navigateurs.

 

<style><!--
p img {
width: 600px;
margin: 50px auto 25px auto;
display: block;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 2px 4px 12px #666;
-moz-box-shadow: 2px 4px 12px #666;
box-shadow: 2px 4px 12px #666;
filter:progid:DXImageTransform.Microsoft.Shadow(color='#aaaaaa', Direction=135, Strength=12);
}
--></style>

***

Voilà de retour de vacances vous allez pouvoir nous faire profiter de tous les beaux paysages que vous avez admirez et tous les sites que vous avez visités. Sachez que vous pouvez compléter ces articles, ajouter des photos en insérant un paragraphe(pressez la touche ENTREE), puis la procédure de téléchargement de plusieurs photos.

De cette façon vous pouvez faire plusieurs articles "Diaporama" dans une catégorie comme dans mon exemple "Albums photos", que vous pourrez appeler dans la "Barre de navigation".

Si cet article vous a été utile, un petit J'aime me fera plaisir.

N'hésitez pas un mettre un commentaire, si vous avez apprécié cet article, mais également si vous n'êtes pas pleinement satisfait. 
Pour plus d'explications poster sur le forum

HautPrécédente