Ajoutez une section Vidéos à une page pour y intégrer facilement vos vidéos YouTube/Vimeo qui seront diffusées directement sur celle-ci. C'est un excellent moyen de fidéliser les visiteurs de votre site web.
Pixpa prend en charge l'intégration de vidéos de YouTube ou Vimeo. Vous ne pouvez pas télécharger directement une vidéo sur votre site Web. En dehors de cette section, vous pouvez également ajouter vos vidéos à Galerie Banner.
Pixpa vous permet de partager votre profil YouTube ou Vimeo dans le Liens sociaux. Vous pouvez également ajouter vos fichiers musicaux hébergés sur Soundcloud dans la section Musique.
Points à noter:
- Vous pouvez télécharger un fichier .gif partout où les vidéos sont prises en charge.
- Si la vidéo que vous avez ajoutée se charge beaucoup, cliquez sur le bouton de lecture et mettez-la en pause pendant quelques minutes. Ensuite, reprenez la vidéo. De cette façon, il se charge mieux avec moins de mémoire tampon.
Dans cet article :
- Qu'est-ce que la section Vidéos ?
- Ajouter une section vidéo
- Ajouter et modifier des éléments de liste
- Éléments de la liste de séquencement
- Suppression d'éléments de la liste
- Gérer les éléments
- Modification de la disposition des sections
- Options de style
- La carte complète et la carte texte
Section Vidéos
La liste de vidéos est une collection de vidéos où vous pouvez ajouter une description de la vidéo et ajouter un lien ou un bouton pour connecter la liste de vidéos à n'importe quelle autre page du site Web ou à tout autre lien.
Section Ajouter des vidéos
- Une section peut être ajoutée à une page. Vous pouvez soit ajouter une section à une page déjà existante, soit créer une nouvelle page au sein de votre site Web.
- Sur ta page, Cliquez sur le bleu + icône ajouter un Nouvelle section à votre page.
- Vous verrez maintenant le catégories de rubriques sur le côté gauche.
- Cliquez sur le Contenu (1) option et Vidéo (2) onglet.
- Maintenant, vous verrez différentes mises en page du système Section Vidéos (3).
- Choisissez n'importe quelle disposition de section et cliquez dessus pour l'ajouter à votre page.
Ajouter et modifier des éléments de liste
Ajouter un élément de liste de vidéos
Une fois que vous avez ajouté la section
- Cliquez sur le Modifier le contenu (1) pour ouvrir le panneau des éléments de liste.
- Cliquez sur Ajouter un item (2) bouton pour ajouter un nouvel élément de liste.
- Vous aurez l'option de Dupliquer et supprimer (3) les éléments de la liste.
Modifier l'élément de la liste de vidéos
Cliquez sur l'élément de liste que vous souhaitez modifier. Il ouvrira les options d'édition d'éléments de liste particuliers.
- Ajouter votre lien vidéo YouTube/Vimeo (1).
Pour ajouter une vidéo à votre site web Pixpa, vous devez la télécharger sur YouTube ou Vimeo et saisir son URL ici.
- Réglez la vidéo pour qu'elle soit lue dans un lightbox ou sur la page uniquement (2).
- Télécharger ou supprimer (3) l'image miniature de l'élément de liste.
- Ajouter un Objet (4), Sous-titre (5), et Description (6) de l'élément de liste. Vous ne trouverez peut-être pas l'option de sous-titre et de description dans des éléments de liste particuliers en fonction de la mise en page que vous choisissez.
7. Action au clic
Vous pouvez personnaliser le comportement de clic des éléments individuels dans le Liste de vidéo section. Vous trouverez ci-dessous les options disponibles :
- Accéder à un lien
La sélection de cette option ouvre la Créateur de liens, vous permettant d'ajouter un lien hypertexte vers cet élément. Le lien peut diriger les utilisateurs vers une autre page de votre site Web ou vers une URL externe. En savoir plus à propos Créateur de liens. - Pas d'action
Choisissez cette option pour rendre l'élément non cliquable. Lorsque cette option est sélectionnée, cliquer sur l'élément ne déclenchera aucune action.
8. Ouvrir le lien dans une nouvelle fenêtre : Définissez le lien pour qu'il s'ouvre dans un nouvel onglet ou dans le même onglet. Cela ne sera visible que lorsque Accéder à un lien l'option est sélectionnée sous le Action au clic menu.
9. Boutons et liens : Ajoutez n'importe quel type de Lien à l'élément de la liste. Vous pouvez ajouter un bouton/un lien image/une icône sociale/un lien texte. Apprendre encore plus.
10. Remplacement du style de carte
Vous pouvez remplacer les paramètres de style de carte globaux à partir de la section Paramètres de style et personnalisez la fiche de chaque élément dans la section Liste des vidéos. Cela vous permet d'appliquer des styles uniques à chaque élément de la liste pour une meilleure personnalisation.
Apprendre encore plus à propos de l'option Cartes dans les sections dynamiques.
11. Remplacement du style de forme
Utilisez l'option Remplacer pour attribuer une forme différente à chaque miniature individuellement dans la section Liste des vidéos, vous donnant ainsi un meilleur contrôle sur le style visuel de chaque élément. Apprendre encore plus à propos de Shape Mask.
12. Sauvegardez : Après avoir effectué les personnalisations, enregistrez les modifications.
Voir la modification d'un élément de liste de vidéos en action :
Éléments de la liste de séquence
- Vous pouvez facilement faire glisser et déposer les éléments de la liste pour modifier la séquence.
Supprimer un élément de liste
Une fois que vous avez ajouté un élément de liste, vous pouvez le modifier et le supprimer.
- Cliquez sur le Supprimer à côté de l'élément de la liste des vidéos.
- Cliquez sur le Supprimer bouton dans la fenêtre de confirmation.
- Enregistrer vos changements.
L'élément de liste une fois supprimé ne peut pas être récupéré.
Gérer les éléments de la liste vidéo
La section Liste des vidéos comprend une Onglet Eléments qui vous permet de gérer facilement la visibilité des différents éléments de la section. À l'aide de simples commutateurs à bascule, vous pouvez activer ou désactiver des éléments spécifiques sans avoir à supprimer ou modifier les éléments eux-mêmes.
- Cliquez sur le Modifier le contenu (1) bouton.
- Choisissez le Éléments (2) onglet.
- Après avoir effectué les modifications, appuyez sur le bouton Enregistrer (3) bouton.
Options des sections
- Afficher le titre: Activez ou désactivez la visibilité du titre pour la section Liste des vidéos.
- Afficher les boutons: Contrôlez si les boutons sont affichés au niveau de la section.
Options des articles
- Afficher la vidéo: Basculer la visibilité des vidéos.
- Montrer le titre: Contrôle si le titre est affiché.
- Afficher le sous-titre: Activer ou désactiver les sous-titres.
- Montrer la description: Gérer la visibilité des descriptions d'articles.
- Afficher les boutons:Décidez si les boutons des éléments individuels doivent être affichés.
Disposition des sections
- Cliquez sur le Modifier le contenu (1) pour ouvrir le panneau d'édition de la liste de vidéos.
- Choisissez le Mise En Page (2) onglet.
- Sélectionnez la mise en page de votre section et Enregistrer (3) vos modifications.
Stylisez votre section
- Cliquez sur le Modifier le contenu (1) pour ouvrir le panneau d'édition de la liste de vidéos.
- Choisissez le Style (2) option.
- Modifiez le style des éléments de section et Enregistrer (3) vos modifications.
Vous aurez plusieurs options de style pour la section :
Écran
- Choisissez d' Afficher les éléments in lignes et colonnes or carrousel
- Si vous avez choisi le lignes et colonnes option, les éléments de la liste seront disposés en lignes et en colonnes. Dans ce cas, vous devez spécifier le nombre de lignes et de colonnes.
- Si vous avez choisi le carrousel option, les éléments de la liste seront présentés sous forme de diaporama. En savoir plus.
- Mettez le Le nombre de colonnes pour la liste des vidéos. Vous pouvez choisir de 1 à 10 colonnes.
- Spécifie le Espace entre les colonnes des éléments de la liste.
- Spécifie le Espace entre les lignes des éléments de la liste.
Si l'option Carrousel est sélectionnée à l'étape 1, vous verrez les options supplémentaires suivantes :
- Activer le défilement fluide:Permet le défilement continu des éléments dans le carrousel pour une expérience fluide et visuellement attrayante.
- Glissement automatique: Fait pivoter automatiquement les diapositives sans interaction de l'utilisateur.
- Afficher la progression de la lecture automatique: Affiche un indicateur de progression pendant que la lecture automatique est active pour une meilleure visibilité.
- Délai de lecture automatique: Définit l'intervalle de temps entre chaque transition de diapositive lorsque la lecture automatique est activée.
- Boucle du carrousel: Permet une boucle continue des diapositives, de sorte que le carrousel redémarre de manière transparente après la dernière diapositive.
- Commandes du carrousel: Choisir la Commandes de navigation. Vous pouvez choisir entre Aucun contrôle, Flèches – En bas au centre/En haut à droite/En bas à droite, Chevron, Points et Défilement horizontal.
Affichage mobile
- Réglez le nombre de Colonnes de la grille pour les appareils mobiles. Vous pouvez le définir sur un maximum de 3 colonnes.
- Définir la espacement entre les grilles (en pixels).
Disposition des colonnes spécifique à l'appareil basée sur les paramètres du studio :
Alignement
- Aligner le contenu horizontalement dans la liste des vidéos. Vous pouvez les régler pour qu'ils soient alignés à gauche, à droite ou au centre.
- Aligner le contenu verticalement dans la liste des vidéos. Vous pouvez les définir pour qu'elles soient alignées en haut, au centre et en bas.
- Choisissez le Ordre du contenu c'est-à-dire les images des éléments de la liste à afficher en premier ou le texte associé.
Taille du texte
- Cliquez sur le Modifier le style de texte bouton pour visiter le Design section et gérer vos tailles et styles de police.
- Mettez le Objet style de police pour les éléments de liste de la section.
- Mettez le Sous-titre style de police pour les éléments de liste de la section.
- Définir la valeur par défaut Description style de police pour les éléments de liste de la section.
- Activez cette option pour animer n'importe quels nombres Présent dans le Objet et Sous-titre Lorsque cette option est activée, les valeurs numériques s'affichent avec une animation de comptage dynamique, ce qui les rend plus attrayantes visuellement.
espacement
- Spécifie le Largeur de l'image pour les éléments de la liste.
- Spécifie le Largeur du contenu pour les éléments de la liste.
- Spécifie le Espace sous le titre de la section en px.
- Spécifie le Espace sous les images des éléments de la liste (en %).
- Spécifie le Espace sous les titres des éléments de la liste (en %).
- Spécifie le Espace sous les sous-titres des éléments de la liste (en %).
Titre de la section
- Aligner horizontalement le texte du titre de la section. Vous pouvez le définir à gauche, au centre et à droite.
- Activer/désactiver le Cloison entre le titre de la section et le contenu de la section.
- Mettez le épaisseur du diviseur (en px).
- Spécifie le Couleur du séparateur du sélecteur de couleurs.
- Choisissez un Style de séparation de la liste déroulante.
- Mettez le Largeur du titre pour définir la largeur du titre de la section, à partir d'un minimum de 50 %.
Options d'image
- Choisissez le recadrage d'image pour les éléments de la liste. Vous pouvez définir les images sur Carré, Cercle, Paysage, Portrait et Dynamique.
- Choisissez d'avoir un rayon d'angle commun ou un rayon d'angle différent pour chaque côté des éléments de la liste et définissez un nombre (en px) pour le rayon de coin des images des éléments de la liste. En savoir plus.
Astuce
Le rayon de coin , vous pouvez créer différentes formes d'images d'éléments de liste. Si vous spécifiez 500 px ici, les images s'afficheront en forme de cercle.
- Si vous avez choisi des coins divisés, vous pouvez définir un rayon de coin différent pour chaque coin.
Masque de forme
- Masque de forme : Activez cette option pour appliquer un masque de forme aux vignettes vidéo de la section Liste des vidéos. Une fois activée, la forme sélectionnée ajustera visuellement la vignette à cette forme.
- Sélectionnez la forme : Choisissez parmi différentes formes prédéfinies pour vos vignettes. Vous pouvez ainsi personnaliser votre contenu en affichant des images aux formes uniques : arrondies, en losange, en goutte, etc.
- L'option Masque de forme dépend de la disposition – Il peut ne pas apparaître dans les mises en page où du texte comme un titre ou un sous-titre est affiché sur l'image.
- Le paramètre Stretch dépend de plusieurs facteurs - Y compris taille de l'image, alignement et paramètres de recadrage défini sous l'onglet Style.
- Si le recadrage de l'image est défini sur Original, les dimensions réelles de l'image détermineront si elle sera étirée verticalement ou horizontalement.
Options de survol d'image
- Choisissez le Couleur de survol de l'image à l' couleur d'accentuation ou être spécifié. Si vous avez choisi le couleur d'accentuation, puis spécifiez le opacité. Vous pouvez spécifier la couleur d'accentuation pour chaque élément à partir de Modifier l'élément panneau.
- Si vous avez choisi le spécifier la couleur puis définissez l'option Couleur et opacité de superposition.
- Mettez le Couleur du texte superposé qui apparaît au survol.
- Choisissez d' Animer les images des éléments de liste au survol en cliquant sur Oui. Vérifiez cette fonctionnalité sur une page en direct.
- Choisissez un Style d'animation pour les images lorsque le curseur les survole.
Bordure d'image
- Activer/Désactiver la bordure autour des images en basculant la bascule.
- Choisissez d'avoir un frontière commune de tous les côtés des images ou vous pouvez spécifier le frontières séparément pour chaque côté.
- Spécifie le largeur de la frontière. S'il est défini sur 0, la bordure n'apparaîtra pas. Vous avez également la possibilité de définir la largeur de la bordure individuellement pour chaque côté de l'image.
- Sélectionnez le Couleur de la bordure du sélecteur de couleurs.
- Sélectionnez un préféré Style de bordure de la liste déroulante.
- Détermine le largeur de bordure pour mobile appareils, en l'alignant sur la largeur choisie pour le bureau.
Options de cartes
- L'entreprise pour gérer les cartes.
Options d'ombre
- Écran – Choisissez d'afficher toujours l'ombre derrière les éléments de la liste ou uniquement au survol.
- Style – Choisissez parmi les préréglages existants ou créez une ombre personnalisée.
Si vous avez choisi l'option personnalisée, visitez ce Générateur d'ombre de boîte pour créer une ombre personnalisée. Enfin, copiez et collez le boîte ombre CSS. - Si vous avez choisi l'option de préréglages, alors Choisissez les styles d'ombre de la liste déroulante.
Boutons et liens
- L'entreprise gérer le style de Boutons et liens.
- Enregistrer tous les changements de style.
La carte complète et la carte texte
Lorsque vous allumez le Carte complète/texte sur votre liste de vidéos, les éléments de la liste auront un contour et un arrière-plan avec la couleur de la carte que vous avez sélectionnée dans le Design .
Regarde aussi: Couleurs et espacement du site Web.
Carte complète
Lorsque l'option de carte complète est sélectionnée, la couleur de la carte est appliquée à l'ensemble de la carte, c'est-à-dire à la vignette de la vidéo et au texte qui l'accompagne.
Jetez un oeil:
Carte texte
Lorsque l'option de carte de texte est sélectionnée, la couleur de la carte est appliquée uniquement au texte présent avec la vignette vidéo.
Jetez un oeil:
