Transcription
1. Comment créer un site Web personnel/portfolio - Introduction: Qu' est-ce qui se passe les mecs ? Dans la vidéo d'aujourd'hui, je vais vous montrer comment faire un site web personnel avec WordPress. Jetons un coup d'oeil au site que je vais vous montrer comment faire. J' ai conçu ceci pour être le design d'une page parfait pour un individu. Il a cet effet de parallaxe génial. Je vais aussi vous montrer comment changer toutes les polices et leurs couleurs, je vais vous montrer comment changer ces icônes et les rendre cliquables. Je vais vous montrer comment créer des boutons qui peuvent aller à différentes pages ou ils peuvent accéder à différentes zones de votre site Web. Je vais également vous montrer comment changer votre menu ici, comment faire cet en-tête transparent et je vais également vous montrer comment créer ce logo de signature pour votre site Web et vous n'avez pas besoin de logiciel pour le faire, vous pouvez le faire complètement pour gratuit, donc c'est vraiment cool. Je vais également vous montrer comment changer toutes ces différentes sections afin qu'il ne soit pas seulement des films, des photos ou du web design, vous pouvez les changer à ce que vous voulez. Je vais vous montrer comment créer une galerie de photos, mettre vos vidéos ici, lier votre Instagram,
YouTube et Facebook ou tout autre média social que vous possédez. Je vais également vous montrer comment créer cette liste d'icônes ici, ainsi que créer une page de contact complète où les gens peuvent vous envoyer des e-mails et vous avez également une carte ici et la meilleure partie est que j'ai
fait tout dans un modèle que je vous donne gratuitement. Vous pouvez le trouver en allant dans l'onglet Projet de classe et en regardant sous Ressources. Je suis passé d'un thème de plein air pour mon site web, mais vous pouvez le changer à tout ce que vous voulez. Cette mise en page du site comme super polyvalent, et je vais le tirer sur mobile, sur mon téléphone. Voilà à quoi ça ressemble. Impressionnant. C'est très beau sur
mon téléphone et je vais également vous montrer comment obtenir votre propre nom de domaine, comme je l'ai ici, et comment obtenir votre propre plan d'hébergement. Sans plus tarder, je m'appelle Dale M-c Ma nus, je fais des sites web et je vous montre aussi comment le faire étape par étape, chaque fois que vous êtes prêts, commençons ça.
2. Étape #1 : Procurez un nom de domaine et un hébergement: Très bien, donc l'étape numéro un, est de sécuriser un nom de domaine et un plan d'hébergement. Un nom de domaine est juste le nom de votre site website.com. Un plan d'hébergement est couvert par une société d'hébergement. Ils ont ces bâtiments pleins de tous ces serveurs, et les serveurs allument ou louent de l'espace sur Internet, le
remplissent avec toutes vos photos, vidéos et textes, etc., et ensuite ils passent en direct. Oui, vous pouvez faire un site web gratuit, mais vous allez être limité aux choses suivantes. Vous ne serez pas en mesure de monétiser un site web gratuit avec des annonces. Vous ne serez pas en mesure d'installer des plugins utiles. Vous n'avez pas un nombre illimité de thèmes que vous pouvez utiliser pour personnaliser votre site Web et vous ne possédez pas votre propre nom de domaine. Ce sera quelque chose comme votre nom de domaine, .WORDPRESS.COM. L' hébergement est nécessaire pour avoir un site web. Commençons. Allons sur hostgator.com. C' est leur page d'accueil, donc ce que nous allons faire est de passer à l'hébergement web. Vous pouvez voir qu'ils ont des plans différents ici. Le plan Hatchling est ce que je recommande le plus si vous venez de commencer, et le plan bébé est si vous prévoyez d'avoir un tas de noms de domaine. Si vous savez que vous voulez avoir comme dix noms de domaine différents, allez-y et obtenez le Baby Plan. Le plan d'affaires est vraiment seulement si vous
essayez de gagner une tonne d'argent avec votre site Web, comme je parle de centaines et de milliers de dollars et vous avez besoin de toutes ces cloches et de sifflets supplémentaires. Mais pour le bien de ce tutoriel, nous allons aller de l'avant et faire le plan Hatchling. Vous pouvez voir que c'est le plan le moins cher. Allons de l'avant et appuyez sur acheter maintenant, et voici où vous allez obtenir votre nom de domaine. C' est la partie amusante. Je recommande fortement de garder votre nom de domaine sous 15 caractères, et je recommande également de le garder aussi simple que possible. Pour cela, je vais faire un site web personnel. En fait, j'ai déjà acheté dalemcmanus.com, qui est mon nom. Je vais appuyer sur Entrée et il dira que c'est indisponible, parce que je l'ai déjà. Ce que je vais faire, c'est que mon deuxième prénom commence par un N. Donc je vais juste mettre un N
là-dedans et faire dalemcmanus.com et Enter et là nous allons. Cela vous donnera un tas de choses différentes comme, .club, .site, .net. Je recommande fortement de coller avec le .com. Nous voulons que vous soyez aussi légiste que possible. Cool. Allons jusqu'au bas et vous allez voir que Ajouter la protection de la vie privée de domaine est activée. C' est bien, parce que si vous n'avez pas cette vérification, vous serez bombardé d'appels de spam de personnes qui
demandent à construire votre site Web et vous offrir toutes ces choses si vous les payez. C' est odieux. J'ai fait cette erreur une fois au tout début quand j'ai fait mon premier site web, et c'était terrible. Je veux dire, mon téléphone a probablement sonné six à huit fois par jour avec des avocats, donc je recommande fortement d'ajouter cette protection de la vie privée du domaine. D' accord, ensuite, nous allons descendre et choisir notre plan d'hébergement. Nous avons choisi le plan Hatchling, ce qui est bon, et nous allons également choisir le cycle de facturation. Comme vous pouvez le voir, si vous faites 36 mois, vous aurez le moins cher par mois et au total, 275 par mois si vous vous engagez à 36 mois. Maintenant, 36 mois peuvent être beaucoup pour quelqu'un à s'engager. Ma prochaine recommandation est de faire les 12 mois parce que vous achetez votre nom de domaine pour 12 mois aussi, le plus logique de les faire correspondre et c'est toujours un plan assez bon marché. Si vous voulez, vous voulez juste l'essayer pendant un mois et juste voir si vous l'aimez,
peut-être que c' est votre premier site Web, alors vous pouvez aller de l'avant et cliquer un mois. Après avoir choisi votre cycle de facturation, nous allons créer un nom d'utilisateur. Je vais juste faire mon nom complet, qui est dalemcmanus et ensuite faire une épingle de sécurité. Ensuite, nous allons remplir nos infos de facturation. Je vais juste aller de l'avant et faire ça très vite. D'accord, cool. Une fois que tout est rempli, nous allons simplement ajouter des services supplémentaires, et à partir d'ici, vous avez un certificat SSL gratuit. Ce que cela signifie, c'est, disons que je vais sur Apple.com. Ce petit truc de sécurité. Il dit connexion à sécuriser, son petit symbole de serrure ici. C' est ce que c'est. Si vous vendez un produit sur votre site Web, comme s'il s'agit d'un magasin de commerce électronique ou quelque chose comme ça, alors je vous recommande d'obtenir ce certificat SSL. Il est inclus gratuitement ici. Laisse-le vérifier. Vous pouvez aller de l'avant et décocher pour protéger votre site contre les pirates, laisser, obtenir e-mail professionnel non coché. J' ai en fait une toute autre vidéo vous montrant comment faire cela
gratuitement , puis aussi décocher la sauvegarde de votre travail acharné. Il y a des façons de faire tout cela vous-même, vous n'avez pas besoin de les inclure dans votre colis. D' accord, voilà la partie amusante. Voici où vous allez économiser de l'argent. Dans la section Coupon, il est probablement dit Shared 3600 ou quelque chose de ce genre, allez-y et supprimez cela et nous allons juste mettre dans createaprowebsite, tout un mot. Ce que cela va faire une fois que vous appuyez sur Valider, vous pouvez voir bam, le prix vient de baisser. Au moment où j'enregistre ceci,
cela vous permettra d'économiser jusqu'à environ 60 % en fonction de la quantité d'un cycle de facturation que vous choisissez. C' est mon lien d'affiliation. Si vous l'utilisez, cela vous fait économiser de l'argent et cela me fait un peu pour que je puisse continuer à le faire tout le temps et fournir plus de tutoriels. C' est un gagnant-gagnant pour tout le monde. Mais si tu ne m'aimes pas et que tu ne veux pas l'utiliser, tu peux essayer d'en trouver un ailleurs. Je vous garantis que c'est la meilleure affaire que vous allez obtenir, parce que j'ai appelé Host Gator et mis au point cette offre spéciale uniquement pour mes téléspectateurs. Examinons simplement cela très rapidement. Vous pouvez voir que nous avons notre enregistrement de domaine depuis un an, qui a chuté de 15 à 5 dollars, ce qui est génial. Nous avons notre plan d'éclosion, qui était à l'origine 10,95$, qui est descendu à 7,67, puis nos ajouts sont juste notre protection de la vie privée, ce qui encore une fois, je recommande fortement. Passons à, désolé, on doit accepter les termes. Vous avez lu et accepté, puis vous pouvez cliquer sur le paiement maintenant. Une fois que cela sera terminé, il va juste tout mettre en place pour vous.
3. Étape #2 : Installer WordPress: Maintenant, nous passons à l'étape deux, qui consiste à installer WordPress. Et WordPress est fondamentalement juste un constructeur de site Web. Il alimente en fait environ 30% de l'Internet, ce qui est beaucoup de sites Web flippants. Et c'est assez facile à utiliser. Et je vais vous montrer étape par étape. Alors allons l'installer. D' accord, alors allez à l'onglet hébergement ici. Et puis ce que nous allons faire est de descendre à WordPress, installation en un clic. Alors allez-y et cliquez dessus. D' accord, donc à partir d'ici, nous allons juste choisir où nous voulons installer WordPress. Nous allons donc sélectionner votre domaine, et je vais sélectionner mon domaine. J' avais un tas d'options là-bas. Vous n'en aurez probablement qu'un. Alors il suffit de cliquer sur suivant. Bon, alors maintenant nous allons juste lui donner un titre et ce sera juste notre nom parce que ce n'est pas une entreprise. Il s'agit d'un site web personnel. Donc, si vous aviez une compagnie, vous pourriez y mettre le nom. Utilisateur admin, je vais juste faire mon nom et prénom, nom de famille. Encore une fois, beaucoup de noms excessifs pour cela est parce que c'est un site web personnel. Et puis Admin email. Alors faisons notre email. Cool. Et puis nous accepterons les conditions. Puis cliquez sur Installer. Maintenant WordPress est en train d'installer, génial. Et boum, comme ça, c'est fait. Donc, l'étape très importante ici est de sauvegarder les détails d'installation ici. Donc ce que je vais faire est de copier ces et puis je vais juste les coller partout où je sauvegarde des mots de passe normaux et des choses comme ça parce
que vous allez avoir besoin de ce mot de passe ridicule, ce S71 yada, yada. Mais pour commencer, nous allons avoir besoin de ce mot de passe fou. Alors assure-toi de sauvegarder ça. Et puis cliquez simplement sur login. Donc, vous êtes amené à cette page parce que Host Gator doit envoyer votre nom de domaine dans le monde entier qui doit se connecter à chaque serveur et dire, « Hé, ce nom de domaine existe », et ce processus est appelé propagation. Et ils disent que ça peut prendre jusqu'à 24 heures. Je n'ai jamais eu à prendre autant de temps. C' est généralement entre 20 minutes et 2 heures. Donc dans environ 20 minutes, reviens. Et si vous voyez une page qui ressemble à ceci, alors vous êtes prêt à partir et nous pouvons recommencer avec le tutoriel. Mais prenez-la comme une pause obligatoire, allez prendre une collation et revenez bientôt.
4. Étape #3 : Connectez et modifiez votre mot de passe: Très bien, donc une fois sur cette page, nous pouvons passer à l'étape 3, qui a une connexion et changer votre mot de passe. Parce que nous ne voulons pas avoir ce mot de passe fou ridicule qu'on a sauvé plus tôt. Alors allons de l'avant et au lieu de cliquer sur le petit bouton vert qui dit login admin, la façon dont vous devriez vous habituer à vous connecter est d'aller à votre nom de domaine et faire /WP- admin.En faisant cela, vous pouvez obtenir en tout temps parce que ce petit bouton vert ne sera pas là une fois que vous publierez votre site. Alors nous allons juste appuyer sur Entrée. Maintenant, nous pouvons nous connecter. Nous pouvons donc utiliser votre nom d'utilisateur ou votre adresse e-mail. Je vais juste faire mon nom d'utilisateur, qui était juste Dale alors je vais faire ce mot de passe fou. J' ai sauvé le mien, donc je vais juste le copier et le coller, puis appuyer sur login. Très bien, nous sommes dans le tableau de bord WordPress et il y a beaucoup de choses qui se passent ici, alors rendons plus facile à naviguer et à regarder un peu plus propre. Donc nous allons juste rejeter ça et nous allons frapper le X sur presque tout. Allons simplement rejeter. On veut que ça soit beau et propre comme ça. Ne voulez pas vous effrayer si c'est votre première fois dans WordPress. Bon, maintenant que nous avons ouvert une session et nettoyé notre tableau de bord, allons changer notre mot de passe. Donc, nous allons descendre aux utilisateurs, puis aller à tous les utilisateurs.Ensuite, il suffit de cliquer sur votre nom. Maintenant, nous allons aller jusqu'au bas et nous allons générer passe et ensuite supprimer celui
que nous ne voulons pas d'autre mot de passe fou, nous voulons faire le nôtre. Allons-y et mettons-nous le mot de passe que tu veux mettre. Maintenant, appuyez sur mettre à jour le profil et là vous allez. C' est comment changer votre mot de passe et maintenant vous pouvez vous connecter avec cela. Vous pouvez donc simplement utiliser votre nom comme
nom d'utilisateur et vous pouvez vous connecter avec votre nouveau mot de passe à tout moment. Et n'oubliez pas, faites votre nom de domaine /WP-Admin. C' est comment vous connecter à WordPress pour votre site.
5. Étape n 4 : personnaliser votre site Web: Très bien, donc la meilleure partie, étape numéro quatre, est de personnaliser votre site Web. Donc, d'abord nous allons obtenir notre thème, puis nous allons télécharger quelques plugins qui vont nous aider beaucoup, puis ensuite, je vais vous donner un modèle que vous pouvez utiliser qui va enlever beaucoup de travail dur. Donc, vous pouvez simplement glisser-déposer et remplacer les images que vous voulez et remplacer le texte et ainsi de suite. Je voulais que ça soit super facile pour vous les gars. Donc la première chose que nous allons faire est d'avoir notre thème. Notre thème va vraiment être utilisé pour notre en-tête et notre pied de page. Alors je vais te montrer ce que je veux dire. Je vais voir createaprowebsite.com, qui est mon site web. Nous allons juste obtenir le thème purement pour cet en-tête ici, cette partie blanche, puis le pied de page tout le chemin en bas. Ensuite, le Page Builder, qui est un plugin que nous allons obtenir, il s'appelle Elementor. C' est ce que nous allons utiliser pour concevoir l'ensemble de notre site Web. Mais le thème que nous voulons obtenir juste pour cet en-tête. Alors revenons en arrière et passons à l'apparence. Passons aux thèmes. Maintenant à partir d'ici, faites défiler vers le bas, et vous verrez ce signe plus qui dit « Ajouter un nouveau thème » il suffit de cliquer dessus. Alors, nous allons aller à « Rechercher des thèmes
», et nous taperons « Ocean WP » Ensuite, vous verrez ici, celui qui dit,
« Il suffit de le faire » Il suffit de cliquer sur « Installer », puis cliquer sur « Activer », alors maintenant que c'est activé, nous allons également installer quelques plugins. Le premier sera Ocean Extra, qui est juste un petit ajout, un petit bonus à notre thème Ocean WP. Ensuite, nous allons également installer un générateur de page appelé Elementor. Elementor est ce qui va nous permettre de glisser-déposer et simplement construire visuellement notre page. Donc, pour ce faire, continuons, et allons à « Plugins », puis aller à « Ajouter nouveau ». Ensuite, en haut, vous verrez probablement ce thème recommande le plugin suivant, Ocean Extra. Vous pouvez l'installer à partir d'ici, ou vous pouvez le rechercher dans la barre des plugins de recherche ici. Mais nous allons faire commencer l'installation du plugin ici. Nous allons juste faire l'installation. Ça dira qu'il installe Ocean Extra. Puis maintenant, il dit plugin activé avec succès. Revenons donc à « Plugins », puis allez à « Ajouter nouveau ». Maintenant, nous allons obtenir le générateur de page Elementor. Alors allons chercher des plugins, et nous allons juste taper Elementor si j'ai bien orthographié. Puis les constructeurs de pages Elementor, le premier ici, il y a plus d'un million d'installations actives. Alors allons de l'avant et cliquez sur « Installer maintenant » Puis cliquez sur « Activer » alors maintenant il vous amènera à cette petite page de démarrage. Vous pouvez regarder le tutoriel si vous voulez, mais nous allons juste sortir de cela. On n'a pas besoin de ça. Donc, avant de commencer à personnaliser réellement notre site Web, je vous ai fourni un modèle que nous allons installer maintenant. Donc, à partir de votre tableau de bord, vous verrez l'onglet Elementor ici. Il suffit de monter à « Mes modèles »,
puis au lieu de faire « Ajouter un nouveau modèle », c'est en fait la façon dont vous les créez, passez à la « Importer des modèles » en haut, et puis il dira « Choisir un fichier », nous allons simplement cliquer sur « Choisir Fichier », et le mien sont sur mon bureau. Mais si vous les téléchargez, ils sont probablement dans votre dossier de téléchargements. Alors passez aux modèles de site Web personnel, et nous ferons d'abord le site personnel. J' ai donc le modèle de site Web réel, puis j'ai le modèle de pied de page. Mais en ce moment, nous allons faire le modèle de site personnel et cliquez sur « Ouvrir » puis « Importer maintenant » Maintenant, revenons à « Importer des modèles » choisir le fichier et mettra également dans ce pied de page, « Ouvrir » et « Importer maintenant ». Maintenant, nous avons notre site Web et nos modèles de pied de page ici. Alors passons et faisons une page d'accueil. Alors il suffit de monter à l'onglet « Pages » et ensuite aller à « Ajouter nouveau ». Donc à partir d'ici, juste fermer ce petit monde merveilleux de blocs chose, juste fermer ça et appelons juste cette page d'accueil. Alors, sur la droite, allez simplement dans ces listes déroulantes ici et cliquez sur «
Attributs de page », puis changez le modèle par défaut en Elementou pleine largeur. C' est vraiment important. Donc, à partir d'ici, allez juste à « Publier » et il dira, « Êtes-vous prêt à publier ? » Personne ne regarde notre site. C' est juste notre façon de le sauver. Il suffit de cliquer sur « Publier ». Alors, allez à votre nom en haut à gauche et cliquez sur « Visiter le site » et ouvrez-le dans une nouvelle fenêtre. À partir d'ici, il suffit de cliquer sur « Personnaliser », et ce que nous voulons
faire c'est que nous venons de faire cette page d'accueil, mais notre thème, qui est Ocean WP, ne reconnaît pas cela comme la page d'accueil. Il nous montre toujours ce modèle de post monde bonjour, et nous voulons nous en débarrasser. Nous voulons donc faire le lien avec notre nouvelle page d'accueil que nous venons de créer. Alors descendez aux paramètres de la page d'accueil, puis cliquez sur « Une page statique », puis sous la page d'accueil, cliquez sur le bouton « Sélectionner », puis cliquez sur « Page d'accueil ». Donc, si vous avez cliqué sur « Enregistrer le brouillon » au lieu de « Publier », vous ne verrez probablement pas cela ici. Vous devez cliquer sur Publier pour que cette nouvelle page d'accueil s'affiche. Maintenant que nous avons sélectionné la page d'accueil, vous pouvez voir que nous avons cette page pleine largeur avec laquelle nous pouvons maintenant jouer, et nous pouvons maintenant y ajouter notre modèle. Donc, à partir d'ici, cliquez à nouveau sur « Publier », puis cliquez sur « X » et allons à « Modifier la page » Je vais réellement fermer de cette vieille fenêtre ici. Donc à partir d'ici, faisons « Modifier avec Elementor ». Donc, voici la partie amusante maintenant que nous pouvons commencer à personnaliser réellement. Donc, la façon dont Elementor fonctionne est, vous pouvez simplement cliquer sur ce nouveau bouton de section, puis sélectionner simplement une structure. Nous allons juste sélectionner le principal. Si vous cliquez sur ce petit Rubik's Cube à la recherche du symbole ici, vous pouvez maintenant faire glisser tous ces widgets. Ainsi, vous pouvez faire glisser une image si vous le souhaitez, ou un titre, qui est juste du texte, puis vous pouvez changer le texte. Je peux juste taper mon nom, par
exemple, et ensuite vous pouvez l'éditer, changer les couleurs, tout ça. Mais d'abord, ce que je vais faire est d'ajouter notre nouveau modèle pour que tout soit fait pour vous. Je voulais juste te montrer très vite comment ça marche. Donc, d'abord, passons à la « Ajouter un modèle
», qui est ce petit bouton de dossier, puis allez simplement à « Mes modèles » Ensuite, vous verrez nos deux modèles que nous avons importés. Donc, nous allons faire le site personnel un et puis il suffit de cliquer sur le bouton « Insérer ». Ensuite, il dira, « Voulez-vous également importer tous les paramètres de documents ? » Il suffit de cliquer sur « Oui ». Voilà, donc maintenant nous avons tous nos widgets que j'ai créés pour vous ici. Mais ça a ruiné notre mise en page complète. Alors revenons en arrière et changeons ça. Donc, sur le côté gauche ici, vous verrez « Mise en page » tout le chemin en bas. Si vous ne voyez pas cela, c'est sous l'onglet « Paramètres ». Il suffit d'aller à « Elementor Full Width », et maintenant il vient de mettre à jour à nouveau. Donc c'est à ça que ça doit ressembler, on va se débarrasser de ce petit titre ici. On va faire notre en-tête, tout ça. Mais d'abord, nous allons travailler sur ces sections principales. Donc j'ai tous ces exemples d'images ici pour toi, qui sont toutes en noir et blanc. On va tous les changer. Nous allons changer le texte et ainsi de suite. Ainsi, comme vous pouvez le voir, vidéos, section
photos, juste tout ce que vous avez besoin page de contact. Alors juste ici est en fait là où va aller notre formulaire de contact. Je te montrerai comment faire ça plus tard. Alors allons jusqu'au sommet et ouvrons cette petite barre latérale. C' est ainsi que vous l'ouvrez et le fermez. Il suffit de cliquer sur « Mettre à jour » maintenant que nous avons ce produit importé, et nous allons nous débarrasser de ce petit titre ici. Alors allons à ces trois petites lignes, ressemble à un hamburger, cliquez dessus, puis allez à « Quitter to Dashboard ». Ensuite, montez pour visiter le site à nouveau. Vous n'avez pas besoin de l'ouvrir dans une nouvelle fenêtre cette fois, puis cliquez simplement sur Personnaliser. Cet onglet Personnaliser est la façon dont nous personnalisons notre thème
, puis l'édition avec l'onglet Elementor est la façon dont nous personnalisons notre page principale. En ce moment, ce titre fait partie de ce thème, donc nous voulons nous en débarrasser. Passons à l'onglet Options générales, puis à partir de là, allez au titre de la page. Ensuite, nous allons juste passer sous le style et c'est sur défaut en ce moment, nous allons changer cela en caché. Maintenant, c'est parti, ce qui est génial. Cliquez sur « Publier », puis cliquez sur le X et revenons à éditer avec Elementor. Allons de l'avant et changeons cette image principale ici pour l'une des nôtres. Si vous suivez avec moi, j'ai également fourni un dossier plein d'images de suivi pour vous,
que vous pouvez trouver en allant dans l'onglet Projets et en regardant sous Ressources. Les seuls qui ne viennent pas avec ce sont des photos de moi parce que c'est mon site web, donc vous allez vouloir mettre une photo de vous-même dans cette section. Pour ce faire, cliquez avec le bouton droit de la souris, puis cliquez sur Modifier la section, puis si nous passons au style, vous verrez l'onglet d'arrière-plan. S' il est fermé, il suffit de l'ouvrir et vous pouvez voir les images ici. Si vous n'avez rien ici, il ressemblera probablement à quelque chose comme ça et vous pouvez simplement cliquer sur « Classique », « Type de fond », puis aller à l'image. Nous allons télécharger notre propre image. De là, vous avez votre médiathèque, qui n'a rien dedans en ce moment. En fait, il y a les exemples de photos que j'ai donnés avec toi, donc tu peux les garder là-dedans. On a notre échantillon de chèvre ici. Revenons à télécharger des fichiers et nous allons télécharger une photo de nous-mêmes ici. Mes images, et puis je vais juste sélectionner celui-ci de moi-même et cliquez sur « Ouvrir ». Cliquez ensuite sur « Insérer un média ». Une chose à noter à propos de mettre des photos sur votre site Web est que s'il y a beaucoup trop de qualité, cela peut sembler fantastique, mais votre site Web va prendre une éternité à charger, ce que nous ne voulons pas. Nous voulons qu'il se charge dans une seconde ou deux. Pour résoudre ce problème, ce que vous pouvez faire est d'aller à Optimizilla. Ici, on va optimizilla.com, il y a ce vieux dinosaure. Vous pouvez simplement cliquer sur « Télécharger des fichiers », puis sélectionner votre image et l'ouvrir et ce que le site fera est de compresser votre image. Il fera une compression automatique pour vous et si vous faites défiler vers le bas, vous pouvez voir la différence. Ils ont l'air assez similaires en ce moment, si
je voulais vraiment le compresser, je pourrais le ramener à 45 et vous verrez probablement un peu plus de différence, voilà. Vous pouvez voir qu'il est un peu plus pixelisé, mais ce que cela fait est d'économiser beaucoup d'espace dans le fichier et il se chargera beaucoup plus rapidement. Je ne vais pas y aller autant. Je dirais qu'un 70 est une bonne compression, quelque part autour de 70, puis cliquez sur « Appliquer » et puis téléchargez simplement cette image. Maintenant, cette image que j'ai déjà compressée, donc je vais juste laisser cela dans mes téléchargements. Retournons à Elementor. Encore une fois, celui-ci était déjà compressé, il devrait
donc se charger correctement. Ce que vous pouvez faire pour changer votre position de votre image, vous pouvez voir que je suis au centre en ce moment, vous pouvez faire du haut au centre et cela va déplacer les choses un peu vers le bas. Tu peux faire le centre en bas, me
met un peu plus haut. Si je regarde la page comme ça, j'ai choisi center-centre à l'origine parce qu'il semble juste le meilleur. Ensuite, nous avons cet effet de parallaxe en cours en ce moment. Chaque fois que je fais défiler l'image elle-même ne bouge pas. Si vous vouliez qu'il se déplace, vous pouvez cliquer sous Pièce jointe et la modifier pour faire défiler et cela va maintenant se déplacer avec cette page. J' adore l'effet de parallaxe, donc je vais revenir à ça et cliquer sur « Fixe ». Vous pouvez également changer la taille, maintenant il est réglé pour couvrir. Vous pouvez faire contenir, ce qui semble ridicule parce que vous êtes juste répéter l'image. D' après mon expérience, la couverture est la meilleure façon de procéder. Maintenant, si vous ne vouliez pas que ce bloc d'image soit si large, ce que vous pouvez faire est d'aller sur l'onglet de mise en page, puis vous verrez la hauteur, qui est définie sur la hauteur minimale. Si c'est par défaut, changez-le à hauteur
minimale et maintenant je l'ai réglé sur un 780. Vous pouvez ramener ça à quelque chose comme ça et vous pouvez voir qu'il est beaucoup plus petit maintenant si vous voulez ce style. J' adore cette grande première image, c'est ce qui en dit le plus sur toi. Je suis plutôt en plein air, donc j'ai une photo de moi à l'extérieur. Je vais juste revenir en arrière et changer ça en 780, je l'ai aimé comme c'était. Maintenant, je vous ai montré comment éditer cette image principale. Si vous vouliez, ou disons que vous vouliez que ces mots se démarquent un peu plus, ce que vous pouvez faire est d'aller dans l'onglet style, puis fermer l'onglet d'arrière-plan, puis d'aller à la superposition d'arrière-plan. Ce que vous pouvez faire est de définir une couleur pour cela ou cliquez sur le « Classic », qui est un peu pinceau. Cliquez sur « Couleur » dans cette petite boîte ici et ce que vous pouvez faire est de changer la couleur de superposition. Ce que vous pouvez faire est d'aller jusqu'au noir si vous voulez, puis l'opacité est à quel point l'obscurité ou la lumière que vous voulez que cela soit. Un est comme un 100 pour cent, puis un zéro est évidemment zéro pour cent. Si tu voulais, tu pourrais le faire. J' aime que cette image principale soit limpide. Je peux déjà voir les mots totalement bien. Je vais ramener cela à une superposition d'arrière-plan transparente et fermée. On va faire ça pour ces sections ici. Ceux-ci ont déjà des superpositions d'arrière-plan sur eux. Mais pour celui-là, j'aimerais bien. Changeons nos textes. Assez simple. Il suffit de double-cliquer et vous pouvez soit l'éditer juste là sur la page. Je pourrais mettre mon nom et je fais tous les casquettes, j'aime être grand et audacieux et important. Ou vous pouvez le changer ici, sous le titre ou si vous le vouliez aussi vous pouvez tout mettre sur la gauche ou vous pouvez le mettre sur la droite et ainsi de suite en changeant l'alignement. Ce qu'il y a en dessous, c'est un séparateur. Je voulais juste ce petit espace entre mon nom et ce que je fais. Le diviseur, si vous cliquez dessus, je vais voir si je peux faire défiler pour obtenir ça dans un meilleur endroit, nous y allons. Si vous cliquez dessus, vous pouvez changer la largeur de celui-ci. ce moment, il est à 41, vous pouvez le faire jusqu'au bout. Vous pouvez en faire une très petite ligne si vous voulez. Je vais juste retourner au 41. Vous pouvez changer le poids. Je l'ai mis à deux. Vous pouvez le rendre très épais si vous voulez. J' aime la ligne mince. Ensuite, remplacons ce texte par des trucs cool que nous faisons. J' ai cet ensemble en italique, donc il semble un peu différent de notre rubrique principale. Mettons ça en tant que vidéaste. J' ai une formation en vidéo et en photographie. J' aime voyager et faire des films et des trucs, alors je vais mettre une partie de ça sur mon site web. Je vais faire le vidéaste, changer ça en photographe. Et bien sûr, ce que je fais en ce moment, développeur web. Et si ce n'est pas en italique, ou peut-être que vous voulez le changer d'italique, vous pouvez tout sélectionner. Et puis ce petit menu apparaît et vous pouvez soit cliquer
dessus , soit le décliquer, si vous le souhaitez. J' aime ça en italique. Donc, si vous voulez changer la police, j'ai un peu oublié cette partie, pour l'en-tête principal réel. Disons que vous ne voulez pas de cette police. Double-cliquez dessus, ou en fait, vous pouvez simplement sélectionner l'ensemble du widget lui-même en cliquant sur cet outil de stylo. Ensuite, allez au style, puis allez à la typographie, et vous verrez à nouveau ce petit outil de stylo. Cliquez dessus, et vous pouvez changer la famille de polices à ce que vous voulez. Donc, je l'ai défini sur la valeur par défaut. Je vais juste en sélectionner un au hasard. Faisons ça. Donc, vous pouvez changer la police, mais je vais revenir à la valeur par défaut. Et puis vous pouvez changer la taille aussi. Donc, c'est un 60. Vous pouvez le rendre énorme, vous pouvez faire un plus petit, pensé 60 était un assez bon point pair. Et puis vous avez vos paramètres habituels d'édition de texte ici. Alors, allons en bas et travaillons sur cette section à propos de moi. Alors, cliquez sur cette section. Donc la partie délicate ici est, vous avez une section qui est le bleu, qui est la section entière. Et dans cette section, vous avez deux colonnes. Et ces deux colonnes sont définies sur pleine largeur. Il peut donc être un peu difficile de sélectionner l'un ou l'autre. Alors je vais te montrer un petit tour. Si vous voulez sélectionner la section réelle, vous pouvez cliquer avec le bouton droit de la souris dans la zone bleue et cliquer simplement sur Modifier la section. Si vous voulez sélectionner la colonne, vous verrez ce petit symbole gris. On dirait deux colonnes. Vous pouvez simplement cliquer avec le bouton droit sur cela et cliquer sur Modifier la colonne. Donc maintenant que nous avons fait cela, nous voulons vraiment que la colonne soit sélectionnée, passer au style, et ensuite nous pouvons changer l'arrière-plan. Supprimons donc celui-ci, et ajoutons un nouveau. Donc, je vais revenir à télécharger des fichiers, sélectionner des fichiers, puis je vais juste sélectionner cette photo de moi. Encore une fois, ce sont les deux seules photos que vous n'avez pas avec vous. Tu devrais mettre un de toi-même. Alors cliquez sur Ouvrir. Et encore une fois, n'oubliez pas de compresser vos images. Alors passons à insérer des médias. Nous y sommes. Et puis à partir d'ici, nous allons cliquer sur cette colonne, sorte que vous pouvez soit cliquer dessus ou cliquer avec le bouton droit et appuyer sur Modifier la colonne. Revenons au style, et nous changerons aussi ce fond. Donc supprimez cela. Et ajoutons un nouveau. Allez à télécharger des fichiers, sélectionnez des fichiers, puis suivez les images. Nous allons double-cliquer dessus. Et je vais ajouter celui de ce désert, j'aime celui du désert. Donc je vais aller avec ce thème extérieur, et je vais faire un peu de contrastes chauds et froids. Je vais avoir beaucoup de photos du désert mélangées à des photos de neige. Donc, à partir d'ici, nous allons simplement cliquer sur insérer le média. Et vous pouvez voir que cela a maintenant une superposition d'arrière-plan au-dessus de lui. Alors fermons ça. Et si vous vouliez modifier cela, allez
simplement à la superposition d'arrière-plan. Et puis vous pouvez changer l'opacité. Donc, je pourrais l'avoir plus léger, plus sombre, et ainsi de suite. Et si jamais tu fais quelque chose et que tu es genre, oh merdique, je dois annuler ça. Il suffit de frapper le contrôle z. et vous pouvez annuler. Et encore une fois, vous pouvez changer la couleur de cette superposition. D' accord. Alors modifiez ce texte de la même manière, vous pouvez simplement double-cliquer. Si vous passez au style, vous pouvez changer la police et ainsi de suite et la couleur du texte. Je t'ai déjà montré tout ça. Donc ici, vous ajoutez juste ce que vous vouliez de vous-même. Je vais juste le laisser. Et maintenant, notre bouton. Donc, c'est une partie amusante. Donc, si vous cliquez sur le petit symbole de la plume ici, ou cliquez avec le bouton droit et ne modifier. Ça nous mènera à l'endroit où on peut changer le bouton. Donc, j'ai écrit voir portfolio ici. Et vous pouvez mettre n'importe quel lien pour cela que vous voulez y mettre. Donc, si vous avez un lien séparé vers votre portefeuille, vous pouvez le mettre ici. J' ai cette configuration comme point d'ancrage, pour aller à ma section de films ou de vidéos qui, si j'appuie sur le bouton, il sauterait en fait vers cette section. Donc, je vais vraiment laisser ça et je vais vous montrer comment créer ces ancres un peu plus tard. Mais c'est là que vous mettrez dans votre URL. Et si vous voulez tout changer sur le bouton, comme le style et ainsi de suite, il suffit de passer au style. Vous pouvez modifier le texte du bouton en cliquant sur la typographie. Et vous pouvez changer la couleur du texte, la couleur de fond. Ainsi, la couleur du texte est automatiquement définie sur le blanc. Si je veux changer la couleur de fond, je peux. Donc si je veux me souvenir de cette couleur, je vais juste copier ça. Alors maintenant, je peux le changer. Donc si je veux qu'il soit vert et ainsi de suite. Pour les boutons, je recommande des trucs comme l'orange. Je recommande une sorte de bleu clair et un vert. Ils se distinguent vraiment bien, parmi tout le reste. Et vos boutons sont votre plus grand appel à l'action sur votre site Web. Donc, si vous vendez quelque chose ou si vous voulez que les gens cliquent sur votre portfolio, avoir ces jolis boutons gras est une excellente idée. Donc, je vais juste revenir à ma couleur orange originale. Et puis je fermerai ça. Et puis la couleur du survol, si vous cliquez sur l'onglet survol, c'est un orange plus foncé. Donc, chaque fois que je le passe, vous pouvez voir que je l'ai grandit et, je l'ai un peu plus sombre. Donc disons que je veux rendre ça encore plus sombre. Je vais juste faire tomber ça comme ça. Et vous pouvez voir maintenant que c'est un peu brunâtre, orangé. Alors fermez cela, puis l'animation de vol stationnaire est définie pour croître. Pour que tu puisses faire tout ce que tu veux. Disons que pivoter, tout le bouton va tourner un peu, de
sorte que vous pouvez choisir ce que vous voulez là-bas. J' aime juste la croissance régulière, agréable et simple. Et une fois que vous avez créé tous ces éléments, peu importe s'il s'agit d'une section entière, ou simplement d'un bouton. Ce que vous pouvez faire est, cliquez avec le bouton droit de la souris ici, puis cliquez simplement sur duplicate. Et puis vous pouvez faire glisser ce nouveau bouton partout où vous le vouliez. Donc si je voulais le mettre ici, je pourrais. Donc c'est génial. Donc je vais contrôler z. se débarrasser de ça. D' accord. Allons donc remplacer cette chèvre. Il faut se débarrasser de notre échantillon de chèvre. Donc, si vous faites un clic droit sur cette zone et faites modifier la section, allez dans le style, supprimez-le. Mettons notre nouveau. Alors allez à télécharger des fichiers, sélectionnez des fichiers. Et je vais sélectionner le désert deux. J' aime cette photo épique. C' est en fait une photo que j'ai prise, au Pérou, de mon pote Alex debout sur les dunes. Donc c'est cool. Donc, nous allons insérer des médias. Et on y va. C' est aussi parallaxe, donc c'est cool. Ça vient de cette photo de moi et puis, bam à lui. Donc personne ne le saura, ce n'est pas moi. Donc je vais juste faire semblant que c'est moi. Encore une fois, si vous voulez le rendre plus petit, allez dans l'onglet Mise en page, puis changez la hauteur minimale vers le haut ou vers le bas, comme vous le souhaitez. D' accord. Donc, j'ai ces icônes ici. Alors, changeons ça. Donc, la façon dont j'ai eu ça, c'était de
remonter à ce Rubik's Cube qui ressemble à un symbole. Et ce sont juste des icônes régulières, ce sont des boîtes d'icônes en fait. Donc, si vous faites glisser cela, c'est comme ça que vous les créez. Alors, changeons ça. Alors, cliquez sur ce bouton ou à droite. Il va continuer à me dire, si je sais comment faire un clic droit, il suffit de cliquer. Je l'ai eu. Quoi qu'il en soit, modifier la zone d'icône et vous pouvez changer le texte. Vous pouvez changer le petit titre ici. Alors changeons ça en films. Si je peux l'épeler correctement, on
y va, les films. Et vous pouvez changer l'icône. Donc je vais juste cliquer dessus. Dactylographions un film. Et on aura cette petite bande de film. Il y a un million d'icônes ici. Pas vraiment un million, mais il y en a beaucoup. Vous pouvez choisir toutes sortes de différentes. Et j'ai aussi ce vol stationnaire réglé pour devenir bleu et grandir. Donc, si vous vouliez changer cela, allez au style, puis passez au survol. Et vous pouvez changer cette couleur et l'animation. Et si vous êtes sur l'onglet normal, vous pouvez modifier la taille de l'icône, si vous le souhaitez, ainsi que la couleur sous la couleur primaire. Alors changeons celui-là en photos. Et on va juste faire un symbole de caméra. Et nous allons changer celui-ci en design web. Et puis change-le pour un ordinateur portable. Maintenant, si vous voulez les lier à des choses. Donc maintenant, si vous passez la souris sur eux, c'est comme ooh, je peux cliquer dessus. Donc, si vous voulez vraiment l'avoir aller à un lien, il y a un petit bouton qui dit lien vers, ou désolé, petite section qui dit lien vers. Et vous pouvez simplement mettre votre URL là. Et encore une fois, vous pourriez le faire comme un bouton de saut à un autre endroit, que je vais vous montrer bientôt. En fait, non, je vais te montrer tout de suite. Alors faisons le hashtag. Donc, vous devez toujours faire hashtag si vous liez à une autre partie de la même page. Alors faisons des films de hashtag. Et ce que nous voulons faire, c'est juste faire ce saut jusqu'à cette section. Et nous voulions atterrir comme ça. Donc tu n'as pas à régler ça. Tout ce que vous avez à faire est de choisir la section. Donc, si je fais un clic droit dans cette zone bleue ici, et que je fais la section d'édition, ce que nous allons faire est passer à avancé, et c'est là que nous allons créer un ID de classe. Donc on va juste appeler ça des films, sans hashtag. Et ce que ça fait,
c'est dire , c'est la section du film. Pour que chaque fois qu'on appuie sur ce bouton, ça va aller, oh, je sais ce que c'est et ensuite on y passe. Laisse-moi te montrer de quoi je parle. Cliquez donc sur la mise à jour. Et puis je fermerai ça et je te montrerai. Donc si je devais cliquer sur ce bouton, boum, on y va. Donc, c'est comment créer un bouton de saut. Vraiment cool. J' adore les dessins d'une page. Les boutons de saut sont comme mon meilleur ami. Alors allons ouvrir cette sauvegarde et faisons les photos un aller à #photos et le web design ira à #web design. Et je vais descendre et changer ça aussi. Donc, la section photo, assurez-vous que vous êtes sur la section principale, pas seulement une de ces colonnes ou widgets. Section principale, allez à avancé, ID de
classe, appelons-le Photos. Et cela doit correspondre parfaitement à ce que vous mettez en tant que hashtag. Et passons à la conception web, clic
droit, conception avancée, web. Et pendant que nous sommes là, allons changer de contact aussi. Donc, cliquez avec le bouton droit avancé
et contact, et cliquez simplement sur mise à jour. Maintenant, si je devais cliquer sur l'un de ces trucs, boum, me fait tomber. Ils travaillent tous. Changeons nos titres. Je ne veux plus que ça enregistre des vidéos. Je vais double-cliquer dessus et je vais enregistrer Films. J' ai cet ensemble où il ne montre que deux vidéos. Ce que j'ai fait pour obtenir ces vidéos est d'aller au symbole Cube de ce petit Rubik, et puis il est juste le widget vidéo et puis vous venez de les faire glisser ici.Mais j'ai déjà deux ensemble ici. Disons que vous en vouliez quatre. Ce que vous voudriez faire est d'avoir deux colonnes, la façon dont nous l'avons, et ces colonnes ont des widgets à l'intérieur d'elles. Il y a la section principale, une colonne, puis un widget, est celui-ci. Si je voulais, je pourrais cliquer avec le bouton droit de la souris et dupliquer ça. Il va maintenant en créer un ci-dessous et je pourrais faire la même chose ici. Maintenant, j'en ai quatre et ma page s'ouvre automatiquement pour créer cet espace. Mais je veux en laisser deux, donc je vais les supprimer. Je veux juste te montrer comment faire ça. Je vais changer. Juste avant de changer ces vidéos, je vais changer ce bouton. Je vais cliquer dessus ou cliquer avec le bouton droit de la souris. Alors je veux m'assurer que j'ai le bon lien ici. En ce moment, il a le lien vers ma chaîne YouTube. Si je devais cliquer dessus, il s'ouvrira dans une nouvelle fenêtre. Il va à mon Travel Channel. Comme je l'ai dit, j'aime faire des vidéos et j'aime voyager, donc je viens de les assembler et de faire cette autre chaîne YouTube, n'a pas beaucoup d'abonnés, mais maintenant si vous voulez vous y abonner, allez-y. Revenons en arrière et assurez-vous que ce lien est changé.Ensuite, si nous voulons changer ces vidéos, suffit de cliquer avec le bouton droit sur « Modifier la vidéo », puis mettre dans une nouvelle URL. Je vais supprimer l'automatique qu'ils ont là pour moi.Je vais retourner à ma chaîne YouTube et je vais juste prendre une vidéo.Ce Pérou est mon plus populaire. Je vais cliquer dessus et je vais saisir l'URL en haut. Retournons et mettons-le, puis on y va. Il y a ma vidéo là-dedans. Vous pouvez modifier un tas de paramètres ici. Vous pouvez le faire jouer automatiquement. Vous pouvez vous débarrasser des contrôles du joueur, vous pouvez le faire boucle, et ainsi de suite. La taille de la vidéo dépendra de l'espace dans lequel elle se trouve. Disons que j'avais juste une colonne au lieu de deux, et cet espace était deux fois plus grand. Il est descendu par ici. Cette vidéo aurait l'air deux fois plus grande. Il est réactif pour s'adapter à certains espaces. Gardez ça à l'esprit. Changeons celui-là. Faites un clic droit sur le petit stylo, « Modifier la vidéo ». Supprimons ça et allons prendre une autre vidéo. Je vais faire ma vidéo sur le Nicaragua. On y va. URL, copiez et mettons-le dans. Impressionnant. Aller à l'avant, photos, même chose. Vous pouvez modifier cela de la même manière. Si nous voulons changer ces photos. Vous pouvez voir maintenant nous avons une grande colonne et la raison est parce que c'est en fait une galerie. Au lieu de cliquer sur une image individuelle, j'ai cette configuration comme une galerie qui est son propre widget. Si nous cliquons sur « Modifier la galerie d'images », nous pouvons éditer l'ensemble du widget et nous avons quatre images différentes ici. La raison pour laquelle je n'ai pas mis en place de cette façon est parce que si vous cliquez sur un, il va tirer vers le haut dans ce petit truc de boîte à lumière. Ça rendra le reste de votre site plus sombre. Vous pouvez cliquer sur les flèches et faire défiler les images, ce qui est vraiment cool. Allons les éditer. Retournons en arrière. « Modifier la galerie d'images. » Permet d'effacer ces images. Ça dira : « Réinitialiser la galerie. » On va juste dire, « Supprimer ». Nous allons aller à « Ajouter des images ». Ensuite, nous allons à, « Télécharger des images » « Sélectionner des fichiers. » Prenons Machu Picchu, nous prendrons la cathédrale, le désert et la cascade. Ce sont en fait toutes les images que j'ai prises lors de mes voyages. Vous pouvez tous avoir ça. Veuillez ne pas les revendre. Si vous le faites au moins, donnez-moi une coupure de l'argent. Assurez-vous qu'ils sont tous sélectionnés. Les quatre d'entre eux sont sélectionnés. Faisons « Créer une nouvelle galerie ». Ensuite, vous pouvez sélectionner l'image que vous voulez en premier. Je vais juste montrer que vous pouvez changer ça. Faisons le Machu Picchu d'abord. Allons à l'intérieur de la galerie. On y va. Maintenant, nous avons les quatre images ici. Maintenant, si vous remarquez, qu'est-ce que c'est plus grand que l'autre ? Il est jeté de tout le look. Ça n'a pas l'air bien. Allons réparer ça. Si vous revenez à « Ajouter des images », puis passons à « Modifier la galerie ». Cliquez sur cette image de cascade. C' était celui qui était plus grand. En fait, cliquez sur l'un d'entre eux afin que vous puissiez voir la taille est 1920 par 1080, et la cascade est 2048 par 1365. Changeons ça. Allons à « Modifier l'image ». Nous allons passer à « Aspect ratio » et nous allons changer ça en 1920 d'ici 1080. Alors ce qu'on va faire, c'est juste traîner. Vous allez juste cliquer n'importe où ici et faire glisser ça vers le haut. Maintenant, il y a un rapport d'aspect de 1920 parfait, puis il suffit de sélectionner le coin et de le faire glisser pour qu'il soit pleine largeur et assurez-vous juste qu'il est positionné là où vous le voulez. Je vais juste dire quelque chose comme ça. Ensuite, cliquez à nouveau sur le petit outil Recadrer l'image. Maintenant, nous venons de recadrer notre image. Touchons sur « Enregistrer ». Il y a quelques clics pour faire ça. C' était déroutant la première fois que je l'ai fait, alors assurez-vous de faire toutes ces étapes. Maintenant, faisons simplement « Insérer la galerie » et maintenant cette image est corrigée. Donc maintenant, il a l'air beau et propre. Encore une fois, si nous cliquons sur ces derniers, nous pouvons simplement passer en revue tous. Cool. Passons à la section suivante, « Conception du site Web ». Assurez-vous de modifier ce bouton. J' ai cet ensemble est bleu. Ça va à mes contacts. J' en ai eu une copie. Disons que quelqu'un voulait que je fasse son site, je voudrais juste que ça saute jusqu'à ma page de contact. Encore une fois, je vais vous montrer comment faire un formulaire de contact. Assurez-vous de modifier cela et si nous le voulons, afin que vous puissiez voir ce sont tous des particuliers. Ce sont toutes des zones d'icônes. Si je vais au cube du petit Rubik et j'ai d'abord traîné dans la boîte d'
icônes et ce que j'ai fait était au lieu d'avoir,
être de haut en bas comme ça, j'ai fait la composition des yeux et je l'ai fait partir et c'est comme ça que je l'ai fait ressembler à ça. Vous pouvez également faire correctement si vous voulez le mettre sur le côté droit de l'écran. Mais supprimons ça. Je voulais juste te montrer comment j'ai fait ça. Je peux également créer des liens vers tout cela. En ce moment, j'ai juste ces symboles pour vous montrer ce que je fais et tout ça. Je peux écrire une petite description. Mais si je le voulais, je pourrais en fait les faire lier à différentes sections en mettant un lien ici. Ensuite, dans cette colonne est juste où j'ai des
exemples d'autres sites que j'ai fait qui si vous êtes quelques-uns de mes suivants, qui me suit depuis un petit moment, sont en fait de vieux tutoriels que j'ai fait. Vous pouvez également les changer en cliquant
là, puis en faisant « Choisir l'image » et en mettant vos propres images. En fait, j'ai déjà oublié, je n'ai pas changé les arrière-plans ici, alors revenons à la « section Film » et faisons « section Modifier », allez dans l'onglet « Style ». Changeons juste ce contexte. Supprimez celui-là. Faisons une photo de montagne. Vous voulez le mélanger un peu et aussi avoir cet ensemble sur Fix, qui est notre parallaxe. Allons à la section photo, changez ce fond pour aller au style, débarrassez-vous de l'échantillon de chèvre. Ensuite, il suffit de sélectionner le désert et de faire « Insérer un média ». Ensuite, nous allons descendre à « Conception de site Web » et ensuite nous allons faire « Modifier la section ». Changez celui-ci pour aller à « Charger les fichiers », sélectionnez les fichiers et faisons le Space. Cliquez sur « Ouvrir », « Insérer un média » et maintenant nous avons notre espace, ce qui est cool. Ensuite, enfin, nous allons contacter, « Modifier la section », échantillon de chèvre et nous allons télécharger notre dernière. Qu' avons-nous pas encore sélectionné ? Les dunes. Faisons ça. Cliquez ensuite sur « Insérer un média ». On y va. Avant de passer à mettre dans notre formulaire de contact, je veux juste vous montrer si vous voulez changer les couleurs de toutes ces différentes petites sections de titre, juste un clic droit, aller à « Style », puis aller à « Couleur ». J' ai cet ensemble comme un gris très foncé. Full black est quelque chose que vous ne voulez pas mettre sur vos sites Web. Plein noir, n'a tout simplement pas l'air aussi professionnel qu'un gris foncé, donc beaucoup d'entreprises vont faire gris foncé. Encore une fois, avec un blanc, vous pouvez faire un blanc complet ou vous pouvez faire un gris clair cassé et ensuite vous pouvez changer votre titre en noir. Il faut juste changer les couleurs de ces sections. Encore une fois, si je veux faire quelque chose de vraiment sombre, je fais juste 1_c, 1_c, 1_c. C'est juste un gris très foncé.
6. Étape n 5 : Configurez votre formulaire de contact: Étape numéro 5 consiste à configurer notre formulaire de contact. Pour obtenir notre formulaire de contact, laissez-nous simplement mettre à jour ceci et ensuite nous allons aller à ce petit symbole de hamburger et ensuite aller à Quitter to Dashboard. Ensuite, descendez à Plugins, puis allez à Ajouter nouveau et puis nous allons juste aller à plugins de recherche et nous taperons dans Formulaire de contact 7 élémentor et puis si nous descendons, vous verrez le widget Formulaire de contact 7 pour élémentor page builder. C' est celui que nous voulons, il suffit de cliquer sur Installer maintenant, puis sur Activer. Maintenant que l'un est activé, nous allons revenir à Ajouter nouveau, et nous allons obtenir le plugin Formulaire de contact 7. L' un était juste le widget pour elementor et l' autre est le plugin formulaire de contact réel alors faites Installer maintenant sur le formulaire de contact 7 plugin puis activer.Okay cool. Maintenant que cela est fait, allez juste sur ce côté gauche et vous verrez la section contact. Il suffit de cliquer sur le formulaire de contact et puis vous verrez
que nous avons des formulaires de contact 1, ce qui est très bien alors il suffit de cliquer sur ce qui est très bien alors il suffit de cliquer surcela et vous pouvez changer le nom si vous voulez donc je vais juste appeler ce formulaire de contact de Dale et ce que nous allons à faire est d'aller dans l'onglet Courrier, puis à partir de là, vous pouvez changer l'adresse e-mail à laquelle vous vouliez aller. En ce moment, il va à mon site créatif Pro Gmail donc cela devrait automatiquement mettre votre e-mail dans. Mais si ce n'est pas le cas, allez-y et mettez votre e-mail, puis
allez dans l'onglet Messages et à partir de là, vous pouvez changer ce que disent tous les messages. Chaque fois qu'ils en envoient un avec succès, il vous dira : « Merci pour votre message a été envoyé. » Je ne sais pas. Il a été envoyé sonne comme Dwight astucieux du bureau. C' est un peu trop formel, alors rendons ça un peu plus amusant. Disons : « Votre message a été reçu » Point d'exclamation. Wow, je ne sais pas épeler. On y va. Votre message a été reçu cool et n'a pas pu être envoyé. Une erreur s'est produite lors de l'envoi de votre message. Veuillez réessayer. Nous ne voulons pas qu'ils réessayent plus tard, je vais juste entrer dans Veuillez réessayer. donc vous pouvez à peu près éditer tous ces éléments comme vous le souhaitez. Une fois que vous faites cela, passons maintenant à enregistrer et laissez-nous entrer et ajouter cela à notre page. Allons à Notre nom et ensuite aller à
Visiter le site et ensuite nous irons à Éditer avec elementor. Allons maintenant jusqu'au bas et c'est là que nous allons l'ajouter. Donc, si vous allez à vos widgets ici et vous faites défiler tout le chemin vers le bas. Vous devriez maintenant voir le formulaire de contact annulé 7 et il suffit de le faire glisser et puis il dira sélectionner Formulaire de contact et nous allons simplement sélectionner formulaire de contact de
Dale ou quel que soit votre formulaire de contact. Cool. Il vient de l'ajouter et c'est transparent donc je ne peux pas vouloir corriger cela. Je voulais avoir des arrière-plans blancs ici dans ces lignes. Ce que nous allons faire est de passer au formulaire de contact Style et ensuite vous
allez voir toutes ces petites sections où vous pouvez mettre du code court. Mais nous allons ignorer tous ces éléments sauf pour la zone de texte,
CSS, et le texte de type Input. D' ici, vous pouvez voir qu'il a cette petite suggestion. Il dit Background est rouge, il dit que c'est ce que vous pouvez mettre en changer la couleur de l'arrière-plan. Si vous suivez simplement ce qu'il dit, c'est assez simple, alors il suffit de taper fond, deux-points, et disons simplement blanc, puis boom, notre fond est blanc, ce qui est cool. Je vais juste copier cela et je vais coller cela dans celui-ci aussi,
qui est la zone de texte, qui est la zone de texte, qui est aussi l'endroit où vous mettez votre message. Voilà, tout est blanc. Ce n'était vraiment pas un codage n'était pas trop effrayant. Donc, cliquez sur Mise à jour afin que nous voulons nous assurer que nous économisons une fois et une fois et si vous voulez changer la couleur du bouton, nous pouvons le faire ici aussi. Si vous faites défiler vers le bas et vous allez sur le bouton Soumettre, vous pouvez également changer cette couleur d'arrière-plan ainsi nous allons juste changer ce vrai rapide afin que je puisse vous montrer afin que nous allons faire l'arrière-plan. Disons que le rouge, il changera en rouge. Tu peux faire du bleu et ça ne devient pas bleu foncé. Je vais faire du bleu clair et il restera aussi bleu clair. Le bleu clair est la valeur par défaut et vous pouvez également faire le survol du bouton, qui est juste en dessous. Mais encore une fois, je vais laisser ça comme ça. Maintenant, nous pouvons aller ici et vous pouvez juste faire un clic droit sur ce widget, qui est votre liste d'icônes et vous pouvez modifier votre numéro de téléphone, votre e-mail et votre adresse. Cette liste d'icônes vous pouvez changer tous les symboles afin que vous puissiez changer votre numéro de téléphone et ensuite vous pouvez le
changer pour le symbole que vous voulez,
peut-être que vous voulez le formulaire avec le carré dedans, et ainsi de suite. Fonctionne comme toutes les autres icônes et vous pouvez changer leur couleur en allant dans Style, puis en allant à Icône. Mais je vais les laisser comme ils sont et ensuite la carte, si nous éditons Google Maps,
nous pouvons mettre n'importe quelle adresse donc je viens de mettre dans la Silicon Valley, ne vit pas vraiment là-bas et ne jamais y être allé. C' est pour ça que j'ai jeté ça là-dedans. Mais vous pouvez indiquer votre adresse professionnelle ou si vous ne voulez même pas cette chose, vous pouvez simplement la supprimer complètement. Mis à part l'en-tête et le pied de page, ce site est fantastique. peu près tout fonctionne correctement. Tous les boutons sont branchés. Nous avons mis nos ancres de sorte que lorsque nous en avons besoin, nous pouvons simplement cliquer sur quelque chose et cela nous mènera là où nous devons aller.
7. Étape #6 : Ajoutez votre entête et votre pied de pied: Maintenant, nous pouvons passer à l'étape numéro six, qui est d'ajouter votre en-tête, et votre pied de page. D' accord, alors passons à la mise à jour, et ce qu'on va faire, c'est aller à la petite icône de hamburger et aller à, sortir sur le tableau de bord. En fait, revenons à visiter le site. Désolé pour ça, et nous allons passer à Personnaliser. Cool, donc voici votre en-tête, c'est super vide et ennuyeux en ce moment. Alors, changeons ça. Donc, passons d'abord à la barre supérieure, et allons à Général, et nous allons juste décocher, activer la barre, c'est cette petite barre en haut de l'en-tête, dit, « Placez votre contenu ici. » Nous voulons nous débarrasser de cela, donc c'est parti, et revenir en arrière, puis passons à l'en-tête, et puis nous allons juste passer à Général, et puis vous pouvez changer le style de votre en-tête. Donc, si vous voulez, vous pouvez faire un en-tête transparent, ce que je pense que je vais aller chercher. Donc maintenant, vous pouvez voir que cela a disparu, il est entièrement transparent, et ce que vous pouvez faire si vous voulez, c'est que vous pouvez descendre en bas où il est dit, les paramètres d'en-tête
transparents et sélectionner la couleur d'arrière-plan, puis faites défiler vers le bas et juste choisir n'importe quelle couleur aléatoire disons juste noir, je ne vais pas vraiment choisir, mais si vous allez au petit curseur d'opacité ici, il dit un 100, vous pouvez faire glisser ça tout le chemin, et vous pouvez maintenant changer la transparence, ce qui est vraiment cool, mais je vais effacer cela, je veux juste le laisser à la transparence totale par défaut. Ce qu'on va faire, c'est changer mon nom ici. Donc, beaucoup de gens ont mis un logo ici s'ils ont une entreprise. Ce que je vais faire, c'est mettre une signature ici , mais si vous avez un logo que vous avez pour votre propre marque personnelle, je vais vous montrer comment le mettre ici aussi. Tout fonctionne de la même manière, mais je vais vous montrer comment faire une signature et mettre ça. Donc, pour ce faire, allez dans un nouvel onglet et tapez Sketch.io,
et appuyez sur Entrée, puis sélectionnez simplement l'anglais, ou quelle que soit la langue que vous parlez. Donc, vous serez amené à une page qui ressemble à ça, et normalement vous pouvez dessiner ici avec un stylo noir et obtenir une signature, mais nous voulons que notre signature apparaisse en blanc. Donc, ce que je vais faire en premier, c'est de passer à ce petit panneau de calques ici, et je vais juste supprimer cet arrière-plan, donc je vais sélectionner ces trois petits points et je vais dire supprimer. Donc, c'est parti. Ce qu'on veut faire, c'est voir ce qu'on fait. Si on écrit du blanc sur ça, on pourra le voir, mais ce ne sera pas si clair. Donc, nous allons passer à ce petit signe plus, il dit Nouveau, et ajoutons juste un arrière-plan de plan, mais nous allons finir par le supprimer, ne vous inquiétez pas. Alors maintenant il suffit de monter sur le bouton Outils ici en haut à gauche, et de coller avec le stylo de calligraphie, et il est déjà en blanc, si c'est en noir, vous pouvez simplement le sélectionner et le changer en blanc. Donc, gardez simplement le stylo par défaut et dessinez simplement votre signature. Je vais juste faire une signature approximative ici, vous devrez peut-être le faire quelques fois. Ce n'est pas le meilleur, mais on va le garder. Bon, donc maintenant, ce que nous allons faire est de revenir sur le panneau des calques, et je vais juste supprimer cet arrière-plan à nouveau. Je le voulais juste là pour voir ce que je faisais. Donc, supprimez simplement, et maintenant que c'est fait, je vais passer à la petite icône d'exportation, ressemble à une disquette, votre symbole de sauvegarde standard, et nous voulons enregistrer en PNG. La raison pour laquelle nous voulons PNG va avoir ce contexte transparent. Donc, si vous avez un JPEG par exemple, ce même symbole finira par sortir avec un fond blanc, donc ce qui va se passer est que nous allons juste avoir ce gros bloc blanc, qui ressemble à rien. Donc un PNG, sans arrière-plan, va être notre meilleur pari. Donc, il suffit de cliquer sur Enregistrer PNG, puis cela ira dans votre dossier Téléchargements, et ce que je veux aussi faire est d'obtenir une version noire de mes initiales, et je vais vous montrer pourquoi en seulement une seconde. Donc, d'abord, passons aux calques, et supprimons, tous ces calques que j'ai créés pour ma signature, et revenons aux outils, et changeons notre contour en noir, et si je veux, Je peux augmenter un peu la taille, rendre agréable et épaisse, et je vais juste créer un DM, pour Dale McManus, juste comme ça, et maintenant aller à l'exportation et ensuite enregistrer en PNG. Cool. Donc maintenant, nous pouvons sortir de cela, et nous allons revenir de Général, et nous allons aller à Logo, puis nous allons à Sélectionner le logo, et nous allons aller à Télécharger les fichiers, puis sélectionner les fichiers, puis puis allez simplement à vos téléchargements, puis sélectionnez simplement, votre signature, cliquez sur Ouvrir, accord, voilà, puis cliquez sur Sélectionner, et il vous demandera si vous voulez recadrer, nous ne pouvons pas réellement le voir. Il y avait un peu d'espace sur le mien, donc je vais juste faire glisser ça dans un peu, mais si vous voulez, vous pouvez aussi appuyer sur le bouton sauter de rognage, mais je vais juste recadrer ce petit bout de fin là-bas, donc maintenant vous pouvez voir que nous avons une signature, et c'est là. C' est énorme. Donc on va faire tomber ça. Donc, allons juste à Max Width, et amenons ça pour dire ,188, quelque part là-bas, peut-être 180, si vous voulez être juste sur le point. Impressionnant. Donc, Maintenant, si vous voulez ajouter un symbole ici où cette petite icône de page est, cela s'appelle un favicon ou une identité de site. Donc, je vais vous montrer comment ajouter ça très rapidement, alors revenons en arrière, puis revenons une fois de plus, puis allez à l'identité du site, et voici où vous pouvez mettre cette image. Donc, nous pouvons simplement descendre à Select image, puis je vais aller à Upload Files, Select Files, puis je vais obtenir mes initiales noires, puis appuyez sur Select, et puis nous vous demanderons de recadrer, et si vous voulez, vous pouvez le faire glisser vers le bas. Donc, je vais faire quelque chose comme ça, puis appuyer sur Crop Image, et puis, il y a mes initiales en haut là. C' est donc cool, et pendant que nous sommes ici, nous voulons aussi changer le titre de notre site et notre slogan. Donc maintenant, si nous survolons ça, ça dira « Dale McManus - Juste un autre site Wordpress « , c'est ennuyeux. Nous voulons qu'il dise, « Dane McManus ». Et nous pouvons mettre, vidéographe.photographe.développeur web. Donc maintenant, si nous cliquons sur Publier, cela va changer. Donc revenons en arrière, et si vous voulez voir à quoi cela ressemble complètement, vous pouvez simplement descendre à Masquer les contrôles, et c'est à quoi cela ressemblera, annulons ces téléchargements. J' adore l'en-tête transparent, mais il manque quelque chose. Ce dont nous avons besoin, c'est d'un menu parce que nous avons besoin de boutons en haut à droite, où nous pouvons cliquer dessus et sauter à différentes parties de notre site Web. Donc, ce que nous allons faire est de retourner à cette petite flèche pour ouvrir notre personnalisateur, puis juste appuyer sur la flèche arrière, flèche
arrière à nouveau, et ensuite nous allons aller à Menus. Ensuite, nous allons créer un nouveau menu. Cliquez sur cela et nous allons juste l'appeler
Menu principal et puis il dira où voulez-vous que ce menu apparaisse ? Nous désactivons la barre supérieure, ce que nous ne voulons pas. On veut le Main. Vérifiez simplement Main, puis faites défiler vers le bas et appuyez sur « Bouton Suivant ». Maintenant, ajoutons quelques éléments à ce menu. Cliquez sur le bouton « Ajouter des éléments », et ajoutons des liens personnalisés. Si vous aviez des pages différentes, disons que
vous aviez une page séparée pour les contacts avec un formulaire de contact, vous trouverez vos pages ici dans cette liste déroulante. laquelle il revient automatiquement. Mais je vais fermer ça et je vais juste faire un lien personnalisé et à partir d'ici, je vais mettre dans un hashtag films. Parce que rappelez-vous que j'avais cette ancre sur ma section de vidéos qui s'appelait des films. On veut sauter à ça. Je veux que le texte dise des films et je vais l'ajouter au menu et en faire un autre. Ce sont des photos et nous allons faire des photos hashtag. Oups, j'ai oublié le hashtag et le p. Ajouter au menu et ensuite nous ferons, qu'est-ce qu'on a d'autre ? Conception Web. Nous allons faire la conception Web hashtag et puis nous allons juste dire la conception Web, Ajouter au menu et puis nous allons également faire contact et puis nous allons faire le lien texte est contact, puis Ajouter au menu et en fait, allons faire un sur moi pendant que nous sommes ici aussi. Laissons juste faire hashtag sur. On l'appellera A propos de moi et
il faudra vraiment y retourner et créer cette ancre pour cette section. On ne peut pas oublier ça. Il suffit de faire Ajouter au menu. Cool. Maintenant, si vous cliquez dans cette zone, vous pouvez voir que nous avons ces nouveaux boutons ici, ce qui est cool. Si vous cliquez sur « Films »,
boom, saute vers le bas à Films. Fonctionne parfaitement. Maintenant, si vous voulez changer l'apparence de ces boutons, je vais vous montrer comment faire ça. Il suffit de revenir en arrière et de revenir en arrière une
fois de plus et ensuite nous allons en fait descendre à l'en-tête. Au lieu de la section Menu, nous allons être dans En-tête, puis nous allons aller à Menu, qui se trouve dans la section En-tête. Un peu déroutant. Mais descendons et faisons les couleurs. Link Color, on peut changer ça. Disons que je vais en faire un violet juste pour que vous puissiez voir de quoi je parle. Maintenant, le texte réel a changé en violet. Vous pouvez sélectionner n'importe quelle couleur de votre choix. Disons, un blanc. Personnellement, je ne pense pas que le blanc se démarque très bien. J' ai vraiment aimé la valeur par défaut. Je vais le laisser par défaut. Mais vous pouvez également modifier la couleur de couverture du lien. Disons que je voulais que ça soit plus orange. Je vais sélectionner ça et nous allons juste colorer un rougeâtre orange. On y va, ce qui est plutôt cool. Ça correspond un peu à mes antécédents. Je vais laisser ça. Mais maintenant que c'est fait, je vais cliquer sur « Publier » pour que nous puissions sauver notre travail et allons gifler dans notre pied de page. Si nous allons jusqu'au bout, ça se termine et ça dit tout ce thème OceanWP de Nick. On va s'en débarrasser. Revenons en arrière et nous allons revenir en arrière et ensuite descendre au bas du pied de page, puis ce que nous allons faire est juste de décocher le bas du pied de page activé. On va juste se débarrasser de tout ça ensemble et on y va. arrière et puis nous allons aller à Footer Widgets et c'est là que nous allons ajouter notre modèle que je vous ai donné. Si vous allez à Select Template, vous verrez qu'il n'y a rien. Qu' est ce que diable ? Où est notre modèle ? On l'a importé. Eh bien, vous devez l'ajouter à la version Ma bibliothèque du panneau thématique. Un peu déroutant. Je vais te montrer de quoi je parle. Cliquez simplement sur « Publier » si vous ne l'avez pas déjà fait, puis cliquez sur le « X », puis revenez au tableau de bord et puis vous
verrez cette petite roue qui dit Panneau de thème et si vous n'avez pas installé Ocean Extra au début comme nous l'avons fait, alors vous ne verrez pas ça. Assurez-vous qu'il est installé, puis accédez à Ma bibliothèque, puis allez simplement à Ajouter un nouveau. Nous allons juste appeler ce pied de page, puis aller à Template et nous allons juste faire Elementor Full Width, comme nous l'avons fait la première fois. Ensuite, cliquez sur « Publier », puis nous allons aller à Modifier avec Elementor. Ce que nous faisons est juste de construire une page séparée juste pour notre pied de page. Ensuite, nous allons mettre ça sur notre page principale. Tout d'abord, passez à ce petit dossier et nous avons déjà importé ce modèle plus tôt. Nous pouvons simplement aller à Mes modèles et vous verrez le pied de page que nous avons mis plus tôt. Il suffit de cliquer sur « Insérer » et dire « Oui », nous voulons mettre dans tous les paramètres de documents, et boom, il y a notre pied de page. Si elle redevient cette mise en page carrée, à nouveau, allez
simplement à Mise en page, puis allez à Elementou Full Width. Ensuite, cliquez sur « Mettre à jour ». Maintenant que c'est pleine largeur, nous pouvons éditer cela comme nous le voulons. Ce que nous pouvons faire est de cliquer sur ce petit bouton ici et changer ceci à votre nom si vous voulez. C'est le mien. Vous pouvez également modifier ces boutons. Si nous allons à ce widget, cliquez avec le bouton droit sur « Modifier les icônes sociales ». Tu peux les changer pour les vôtres. Je les ai actuellement comme mon YouTube, et Facebook, et Instagram. Puis avant de partir,
ce bouton de retour en haut,nous ce bouton de retour en haut, allons simplement cliquer sur le bouton « Modifier ». Comme vous pouvez le voir, j'ai un hashtag haut. Ce sera un bouton de saut qui remontera jusqu'au sommet. Revenons à notre site principal et ajoutons dans ce pied de page. Cliquez sur « Mettre à jour », puis jusqu'à ce petit hamburger, puis cliquez sur « Quitter to Dashboard ». Ensuite, revenons à notre site principal. Cliquez sur « Personnaliser », puis faisons défiler tout le chemin vers le bas à nouveau afin que nous puissions voir notre pied de page. Revenons à Widgets de pied de page, puis allez à Select Template à nouveau et vous devriez le voir là et cliquez simplement sur « Pied de page ». Maintenant, notre pied de page est là-dedans, mais ça a l'air un peu funky. Allons le réparer. Tout d'abord, notre rembourrage, allons juste nous assurer que cela est réglé sur zéro tout le chemin. Ça va resserrer un peu les choses. Ensuite, pour se débarrasser de cet endroit sur le côté, il suffit de cliquer sur le « Ajouter un conteneur » pour se débarrasser du conteneur invisible autour d'elle. Maintenant, c'est un pied de page pleine largeur. Maintenant, nous pouvons tester tous ces liens si nous le voulons. Assurez-vous que ce bouton fonctionne, ce qu'il fait. Si vous n'avez pas supprimé cette section principale ici pour créer la vôtre, je l'avais déjà avec un ID de classe appelé Top. Je vais te montrer ce que je veux dire. Ouvrons cela et je vais cliquer sur « Publier », enregistrer notre travail et nous allons frapper le « X ». Nous allons aller à Modifier avec Elementor. Ce que nous pouvons faire est un clic droit dans cette section, aller à Modifier la section, onglet
Avancé en haut et vous pouvez voir l'ID de classe dit « haut ». Chaque fois qu'on appuie sur notre bouton en bas et sur notre pied de page, il va sauter en haut. Tant que vous n'avez pas supprimé cela, cela devrait déjà être de cette façon.
8. Étape #7 : Édition pour Mobile: Maintenant, l'étape sept est d'éditer pour mobile. Ainsi, 52% du trafic mondial en ligne provient d'un appareil mobile, donc plus de personnes sont sur Internet sur leurs téléphones que sur leurs ordinateurs de bureau, un peu plus. Donc, il est vraiment, vraiment important que nous éditons ce site pour mobile aussi bien. Nous voulons qu'il soit réactif pour les téléphones et les tablettes. Donc, ce que nous allons faire est d'ouvrir cette sauvegarde, et nous allons juste nous assurer que tout va bien sur mobile. Il suffit donc de descendre à ce petit symbole Ordinateur de bureau, puis de cliquer sur Mobile. Donc maintenant on peut le regarder,
on peut faire défiler jusqu'au bas. Ça a l'air plutôt bien. Si vous vouliez rendre ce texte plus petit, vous pouvez. Donc, vous pouvez simplement cliquer dessus, puis si vous allez à Style, allez à Typographie. Vous pouvez donc voir ces petits symboles. Si vous êtes en mode Bureau, ce paramètre sera différent de celui sur mobile. Donc si tu voulais, tu peux changer ça à ce que tu veux. Mettons-le à 50. Donc, quoi que vous fassiez sur un paramètre ne sera pas modifié sur un autre. Alors continuons à faire défiler vers le bas et assurez-vous que tout va bien. Ignorez cette petite boîte ici, personne ne peut vraiment le voir. Et ça a l'air plutôt bien. Donc notre bouton est un peu là. Si nous le voulions, nous pouvons cliquer dessus, puis changer l'alignement à gauche, donc c'est un peu en ligne. Cool. Alors continuons à descendre, assurez-vous que tout a l'air bien, ce qu'il fait. air bien, elle est belle. Rien n'a l'air funky. Si vous le vouliez, si quelque chose semble plutôt funky, peut-être qu'il est trop large, il prend trop de place, ce que vous pouvez faire est juste un clic droit sur cette section, allez à Avancé et donnez-lui juste un peu de rembourrage. Donc ça va amortir les choses dans un peu, comme ça. Donc, je lui ai donné un total de 15 en haut et en bas. Disons que je veux un peu plus d'espace ici, je peux décocher ce petit lien, et sous le haut, je peux le donner, disons plus comme un 30. Je vais donner au fond un 30, ce qui donne un peu plus de place sur le haut et le bas. C' est ainsi que cela fonctionne au cas où vous auriez besoin de réparer quelque chose. Alors continuons à descendre. Tout a l'air bien. Génial. Alors maintenant, nous allons nous assurer que tout a l'air bien sur la tablette. Alors allez sur Tablette. Alors vérifions simplement. Tout a l'air assez bien. Honnêtement, je pense que tout va bien. Revenons à Desktop. Et avant que j'oublie, revenons à la section À propos de moi et veillons à ce que nous cliquons avec le bouton droit , la section
Modifier, aller à Avancé, puis aller à l'ID de classe, et nous dirons, « à propos », parce que nous voulions ce bouton à la , alors cliquez sur Mettre à jour. Nous voulions que ce bouton en haut aille à notre page À propos. Alors allons nous assurer que ça marche. Assurez-vous de cliquer sur Mise à jour, puis de descendre à Aperçu des modifications, et maintenant nous sommes sur notre site. Donc, si nous cliquons sur À propos de moi, il va à notre section À propos de moi, ce qui est génial.
9. Étape 8 : Publiez votre site Web !: Salut les gars. Donc, dernier point et non des moindres, étape numéro huit est de publier votre site Web. Revenons au tableau de bord, puis d'ici en haut, vous verrez que votre site affiche actuellement une prochaine page. Une fois prêt à être lancé, cliquez ici. Allons-y et cliquez ici. Donc c'était comme ça de créer un site web personnel. J' espère vraiment que vous avez apprécié ce cours. Si vous voulez plus gratuit, et des conseils de site Web impressionnants et des tutoriels, alors s'il vous plaît me suivre sur le partage de compétences et vérifier ma page de professeur pour plus de cours. En outre, les évaluations et les commentaires vont beaucoup de chemin pour moi en tant qu'instructeur. Mais si tu choisis de ne pas en laisser un, c'est tout à fait correct. Merci de regarder créer un site web pro et je vous verrai sur la prochaine vidéo.