Transcription
1. Intro: Je suis Maya Favor et je suis un dessinateur de surface de Stockholm, en Suède. C' est une classe pour les créateurs qui veulent faire un site de portefeuille simple. Votre site web est la base de votre marketing en ligne, et d'avoir un site web agréable et
fonctionnel pour présenter votre travail est un must de nos jours. Créer un site Web peut ressembler à une tâche énorme, mais je suis là pour vous montrer qu'il n'a pas besoin d'être comme ça. Vous n'avez pas besoin de passer des mois à créer un site Web, vous pouvez en fait prendre quelques jours une fois que vous en avez le coup. Dans cette classe, nous utiliserons l'espace Square comme plate-forme pour construire un site Web de portefeuille simple. Il sera basé sur un modèle, mais je vais vous montrer comment vous pouvez modifier et personnaliser un modèle si vous le souhaitez. Vous n'avez pas besoin de vous inscrire à un plan payant de Square Space pour suivre ce cours car vous obtiendrez 14 jours d'essai lorsque vous vous inscrivez, ce qui est beaucoup de temps pour suivre la classe et essayer Square Space comme une plate-forme avant de décider de commencer payer pour le service. C' est une classe pour vous qui voulez apprendre à créer un site Web de portefeuille simple. Vous n'avez pas besoin d'être averti de la technologie, nous n'utiliserons aucun codage. Vous pouvez être un débutant complet et vous n'avez pas besoin d' expérience antérieure dans la création de sites Web pour suivre ce cours.
2. Ce que vous apprendrez: Avant de commencer avec les parties pratiques de ce cours, je veux juste prendre un moment pour parler de ce que vous apprendrez dans ce cours et de ce que vous n'apprendrez pas. Dans cette classe, vous apprendrez à créer un site Web de portefeuille simple dans Squarespace. Je vais vous apprendre les étapes que vous devez prendre, pour créer votre site web. Mais je ne vous montrerai pas tout sur Squarespace. C' est une classe pour les débutants, et donc, je vais garder tout vraiment simple, sorte que vous serez en mesure de suivre, sans aucune connaissance préalable sur la création de sites Web. Si vous voulez connaître des fonctionnalités plus avancées, et des fonctions au sein de Squarespace, ils disposent d'un excellent centre d'aide avec tout, des articles, des webinaires, et même du support client, par chat
et par e-mail, qui est libre de charge. Je ne suis pas un centre de support Squarespace, et je ne peux donc pas répondre à toutes vos questions sur Squarespace. Je suis ici pour vous montrer comment vous pouvez construire un site Web de portefeuille simple, sans codage basé sur un modèle dans Squarespace. Je vais vous montrer un peu comment vous pouvez modifier et personnaliser votre modèle. Mais je tiens à mentionner que même si vous pensez que vous avez besoin de prendre beaucoup de chapeaux dans votre entreprise créative, vous n'avez pas besoin d'être un concepteur web, pour créer un site Web de portefeuille très simple. Il est normal de créer le site directement à partir d'un modèle sans le modifier. Le but de votre site Web est de montrer ce que vous créez, votre photographie d'art ou le métier que vous faites. Le site Web n'est pas conçu pour montrer vos compétences en matière de conception Web. Cela dit, je pense qu'il est important d'avoir un site Web à la recherche professionnelle, qui reflète vous et votre entreprise. C' est pourquoi j'ai choisi l'espace carré comme plateforme pour créer mes sites web. Vous obtenez un site web professionnel, avec tout ce qui est inclus dans une seule facture. C' est pourquoi je pense que Squarespace est un excellent outil. C' est facile à comprendre, tout est inclus, et vous obtiendrez tout ce dont vous avez besoin dans une seule plate-forme. Nous allons créer un site Web de portefeuille simple avec seulement quelques pages. Cependant, nous ne créerons pas une boutique en ligne et une lettre d'information abonnements, ou aller plus loin dans cette classe, puis les pages de base dont vous avez besoin sur un site de portefeuille. Nous ne ferons aucun codage, ni aucune fonctionnalité avancée dans Squarespace. Il s'agit d'une classe sur la façon de créer un site Web de portefeuille d'une manière rapide et facile. Ce n'est pas un test de conception Web avancé. Une chose qui semble commune, quand les créatifs sont sur le point de créer des sites Web, est de trop penser. Peut-être que vous planifiez des mois, et comment votre site Web est censé regarder et d'une manière ou d'une autre, vous n'avez pas l'air de faire tout cela arriver. Je suis là pour te dire que ça n'a pas besoin d'être comme ça. En fait, je vous exhorte à créer un site Web de portefeuille très simple, dans un processus rapide, à le publier, et ensuite vous pouvez le modifier, et apporter des changements plus loin. Avec les sites Web de portefeuille personnel, je pense que vous devez l'essayer avant de savoir ce qui fonctionne. N' essayez pas de créer un site Web vraiment complexe au début. Optez pour un simple, comme celui que je vais vous apprendre à créer dans cette classe. Avec le temps, vous pouvez rendre votre site web plus personnel, et plus complexe si vous le souhaitez.
3. Votre projet: Votre projet dans cette classe est de créer votre propre site de portefeuille à Squarespace. Vous pouvez partager un lien vers vos sites publiés, si vous publiez votre site lorsque vous suivez ce cours, ou vous pouvez prendre quelques captures d'écran sur votre site d'évaluation et le partager en JPEG.
4. Faites un plan: Commençons donc par faire un plan rapide de ce qu'il faut inclure sur votre site Web. Lorsqu' un concepteur Web travaille avec un site Web, il crée des trames filaires et conçoit tout le côté de la ligne avant de commencer à le construire. Nous ne fonctionnerons pas comme ça dans cette classe parce que nous avons des modèles pré-fabriqués, ce qui rendra tout cela beaucoup plus facile et économisera beaucoup de temps. Alors, qu'est-ce qu'on planifiera dans cette leçon ? Nous planifierons le contenu. Jetons donc un rapide coup d'œil à mon site web et à mon contenu, afin que nous ayons quelque chose à comparer. J' ai un tas de contenu sur mon site Web de nos jours, car je travaille avec de nombreuses branches dans mon entreprise, mais le premier site Web que j'ai créé ressemblait davantage au site Web de portefeuille simple que nous allons créer dans cette classe, puis j'ai ajouté du contenu à mon site Web au cours des années où mon entreprise s'est développée. Donc, pour un site Web de portefeuille simple que nous allons créer dans cette classe, je pense que vous devriez avoir une page d'accueil, qui est la page de départ de votre site. Vous devriez certainement avoir une page de portefeuille, cela peut être une page de démarrage ou cela peut être une page séparée avec votre portefeuille. Vous devriez avoir une page à propos et une page de contact. C' est vraiment juste trois ou quatre pages au total que vous avez besoin sur votre site. Dans cette classe, nous allons également ajouter un blog à votre site Web, car je suppose que beaucoup d'entre vous veulent avoir quelque part sur votre site, où vous pouvez publier comme du contenu digne d'intérêt pour les nouvelles. Pour pouvoir créer ces pages, vous avez besoin de texte et d'images. abord, prenez un certain temps pour réfléchir à qui seront les visiteurs de votre site. Sera-t-il, par exemple, des clients possibles ? Vous devez toujours viser votre contenu vers votre groupe cible Assurez-vous
donc que le texte que vous écrivez et les images que vous utilisez correspondent à ce qui intéresse votre groupe cible. Tout autre secret est que je n'ai jamais fait un énorme plan avant de commencer à construire mes sites Web. J' aime travailler plus intuitif et j'écris le texte et ajoute des images au fur et à mesure que je crée un site. Je trouve ce qui convient à une certaine page et j'écris un texte et j'ajoute des images qui correspondent à cela. Si vous voulez planifier un peu plus que moi, vous pouvez simplement écrire un document texte simple avec des titres sur différentes pages et écrire le texte que vous voulez inclure sur ces pages. Vous pouvez rassembler des images que vous souhaitez utiliser sur votre site, vous ne savez peut-être pas à l'heure actuelle dans quelle taille vous avez besoin des images mais vous pouvez simplement rassembler des images dans un dossier et les modifier plus tard. Une chose importante à mentionner est que vos images doivent être en mode couleur
RVB pour être visualisées correctement en ligne. Pour en savoir plus sur les modes de couleur, vous pouvez consulter mes autres classes sur skillshare, préparer vos fichiers pour l'impression et apprendre à changer vos fichiers en mode couleur RVB. Pour ce site Web de portfolio simple, vous avez besoin de quelques images de votre œuvre et je vous suggère d'avoir une photo portrait de vous-même à ajouter à votre site Web et si vous avez un logo, je préparerais un fichier de logo PNG à ajouter à votre site Web. Si vous n'avez pas encore de logo, pas de soucis, vous pouvez toujours écrire votre nom ou votre nom de marque comme titre de site sur votre site Web. C' est en fait tout ce dont vous avez besoin pour planifier de commencer avec cette classe et de commencer à construire votre site Web de portefeuille simple.
5. Premiers pas avec Squarespace: Commençons avec Squarespace. Allez sur Squarespace.com et nous finirons par commencer avec un site avec un essai gratuit. Mais d'abord, jetons un coup d'oeil aux autres fonctionnalités qui sont incluses dans Squarespace. Si vous faites défiler vers le bas, vous pouvez accéder à la liste des fonctionnalités sous Produits. Vous trouverez ici tout ce qui est inclus et ce que la plateforme Squarespace peut faire pour vous. Je ne parlerai pas de tout ça pour toi. Vous pouvez lire à ce sujet vous-même. Mais fondamentalement, pourquoi j'utilise Squarespace est parce que tout est inclus. Tout, de l'hébergement Web à la grande qualité de votre site Web. Vous pouvez avoir un magasin, vous pouvez avoir un e-mail connecté avec Gmail. n'y a pas de codage nécessaire. Il y a un design réactif, ce qui signifie que votre site Web fonctionnera sur toutes sortes d'appareils. Ils offrent un outil d'édition glisser-déposer très facile pour créer vos sites. Fondamentalement, il serait juste de vous donner un site vraiment de haute qualité. Vous n'avez pas besoin d'être un concepteur web professionnel pour créer le site Squarespace. Cela peut paraître vraiment bon si vous utilisez simplement les modèles pré-faits et si vous le souhaitez, vous pouvez même ajouter du code personnalisé pour les rendre vraiment personnels. Cliquez simplement sur les prix et les produits pour voir ce que tout cela vous coûtera. Certaines personnes pensent que Squarespace est un peu plus cher que d'autres plateformes et outils similaires. Mais je pense qu'avec tout ce que vous obtenez inclus et aussi que vous savez que vous obtenez un site de haute qualité ou vous n'aurez pas de problèmes avec votre site. Je pense en fait que cela vaut
la peine de l'argent supplémentaire parce que c'est si simple et il est possible de
créer un petit site Web au début, puis de l'agrandir autant que vous le souhaitez. Nous allons juste jeter un coup d'œil sur le coût et le type de plan que vous devriez utiliser. Mais dans cette classe, nous allons commencer un essai gratuit. Vous n'avez pas besoin de vous inscrire à quoi que ce soit avant d'essayer de créer votre site et de vous assurer qu'il s'agit d'un outil que vous souhaitez utiliser. Vous pouvez même créer tout votre site Web avant de vous inscrire. Défilons vers le bas et jetons un coup d'oeil. Habituellement, le salaire annuel est un peu meilleur que le salaire mensuel. Si vous payez annuellement, vous économiserez 30 pour cent. Je le recommande certainement et vous pourriez commencer avec un plan personnel. Surtout si vous n'avez pas
encore commencé avec l'entreprise et peut-être que vous n'avez pas d'entrants dans les affaires. Le plan personnel peut être le meilleur pour vous, car vous pouvez toujours mettre à niveau quand vous le souhaitez. Mais si vous avez une entreprise en cours ou si vous pensez que vous
pouvez vous permettre le supplément de 4$ par mois, alors je recommanderais certainement le plan d'affaires. Vous pouvez lire tout à ce sujet ici, ce que vous obtenez en plus. Il s'agit d'un e-mail personnel avec Google d'une analyse avancée et d'un e-commerce entièrement intégré. Si vous souhaitez démarrer une boutique à l'avenir, c'est génial et tout est juste plus disponible sur le plan d'affaires. Le plan de commerce de base et de commerce avancé est pour vous qui créez des boutiques en ligne. Si vous créez un site Web de portefeuille comme nous le faisons dans cette classe, et que vous pensez que vous pourriez vouloir développer une boutique à l'avenir, je recommanderais certainement le plan d'affaires. Mais vous pouvez tout lire sur ces différents types de plans vous-même et décider lequel vous voulez vous inscrire plus tard. Parce que dans cette classe, nous allons créer un site d'essai. Retournons à la page de démarrage et cliquez sur « Get Started ». Ici, vous serez redirigé vers une page, nous pouvons sélectionner le modèle et commencer par votre page. Mais je vais passer par ce qu'il faut penser quand choisir un modèle et un peu plus sur les modèles dans la prochaine leçon. Commençons simplement par créer un compte dans cette leçon. Cliquez sur « Se connecter » dans le coin supérieur droit et « Créer un compte ». Si vous le souhaitez, vous pouvez cliquer sur « Je ne veux pas recevoir d'e-mail sur les nouvelles fonctionnalités et produits ». Ensuite, vous pouvez continuer à créer un compte avec Google, avec Apple ou avec e-mail. Allons juste pour l'e-mail, donc il suffit d'écrire votre nom et votre
adresse e-mail et de créer le mot de passe. Appuyez sur « Continuer ». Maintenant, nous avons créé un compte de Squarespace et nous pouvons commencer avec notre essai gratuit. Passons à la leçon suivante où nous allons choisir au modèle pour commencer.
6. Sélectionnez un modèle: Alors choisissons un modèle pour notre site. Tous les sites Squarespace ont un modèle pour commencer, mais ce qui est bon de savoir dans cette nouvelle version de Squarespace, ce 7.1, qui est ce que nous allons construire notre site, c'est que tous ces modèles sont en fait un modèle maître. Vous pouvez fondamentalement reconstruire tous les modèles pour les faire ressembler les uns aux autres. modèle que vous choisissez aujourd'hui dans la
version Squarespace 7.1 compte beaucoup moins que dans la version précédente de Squarespace, où les modèles avaient des fonctions différentes. Parce que maintenant tous les modèles ont la même fonctionnalité de base. Vous pouvez vraiment penser à eux comme un point de départ et choisir un modèle que vous aimez. Il y a tellement de choix, donc il peut être difficile de choisir un modèle. Dans cette classe, nous allons créer un site Web de portefeuille de base. Je pense qu'il est plus important que vous appreniez comment fonctionne Squarespace. Je construirais un site Web de portefeuille de base, afin que vous puissiez plus tard explorer plus avec Squarespace lorsque vous avez appris la base de la façon de construire votre site Web de portefeuille. Sélectionnons simplement un modèle que nous aimons. Dans le menu de gauche ici, vous pouvez parcourir par conceptions populaires, photographie de
portefeuille, les magasins en ligne, et tout cela. Vous pouvez opter pour un portefeuille alors que nous créons un site Web de portefeuille. Mais pour rendre cette classe aussi logique que possible, j'ai trouvé un modèle qui, je pense, fonctionne vraiment bien pour notre but. Je vais cliquer sur la photographie et nous sélectionnerons les modèles TALVA. Vous pouvez cliquer sur « Aperçu TALVA », si vous voulez voir à quoi ressemble ce modèle. Rappelez-vous que vous pouvez changer fondamentalement tout avec ce site, mais vous avez un modèle pour commencer qui le rend beaucoup plus facile. Cliquez sur « Commencer avec cette conception ». Ici, ils vous demandent ce qu'il faut appeler votre site. Tapons simplement le nom de votre marque et appuyez sur « Continuer ». Ensuite, vous obtiendrez quelques instructions sur la façon de créer et de styliser vos pages, mais nous pouvons simplement cliquer sur sauter ici, car cela vous montrera tout. Tu peux arrêter l'assistant si tu en as un. Comme vous pouvez le voir en bas, vous êtes la fin de l'essai dans 14 jours. Lorsque vous avez créé votre site Web, vous pouvez le mettre à niveau pour le rendre public et commencer à payer pour un plan sur Squarespace, mais dans cette classe, nous allons construire un site avec juste une période d'essai. Ok, super. Maintenant, vous avez choisi un modèle et avez commencé avec votre site. Passons à la leçon suivante, où je vais vous montrer comment faire certains des paramètres généraux de votre site.
7. Aperçu et paramètres: Dans cette leçon, je vais vous guider à travers certains paramètres généraux de votre site Squarespace et comment fonctionne la plate-forme, et comment vous créez des paramètres différents. Si vous avez un coup d'oeil à votre menu de gauche, nous pouvons commencer en haut à Pages. Pages est où nous allons ajouter des pages et construire nos sites, donc je vais passer par cela beaucoup plus, à
fond dans les leçons où nous construisons différentes pages. Le design est l'endroit où vous définissez les styles de conception de votre site. Je vais passer en revue beaucoup de ces options plus tard en classe, donc je ne vais pas passer par ça plus maintenant. Le commerce est si vous avez une boutique en ligne, donc nous n'allons pas passer par cela du tout dans cette classe. Si vous voyez ce petit symbole, cela signifie qu'il s'agit d'une fonctionnalité premium. Donc, si vous choisissez de vous inscrire au plan d'affaires, vous obtiendrez certaines de ces fonctionnalités. Le marketing est l'endroit où vous définissez les paramètres de toutes les campagnes par e-mail, que nous pouvons créer à l'intérieur de Squarespace. SEO, quelques choses de promotion. Histoires Instagram, Produits sur Instagram, et aussi Pop-Up promotionnel, qui est l'une de ces choses, et la barre d'annonce. Les deux pop-up promotionnel et la
barre d'annonce sont disponibles sur le plan d'affaires
et de commerce, et je ne vais pas passer par cela plus dans cette classe, mais ceux-ci sont vraiment super pour attirer l'attention de votre visiteur sur votre site. C' était un peu à propos du marketing. Vous pouvez explorer cela plus loin par vous-même. planning, je ne vais pas passer du tout dans ce cours. C' est si vous avez une entreprise où vous planifiez rendez-vous avec vos clients. Vous pouvez ajouter cette extension qui est alimenté par Acuity, mais je ne vais pas passer par cela plus dans cette classe. Analytics est l'endroit où vous obtiendrez vos analyses de votre site. Ainsi, vous pouvez tout voir, depuis les ventes si vous vendez des produits, jusqu'au trafic, d'où provient votre trafic ; quelle partie du monde ? Sources de trafic, Mots-clés de recherche Contenu
populaire sur votre site, et toutes ces choses. Analytics est inclus dans Squarespace, et pour moi, c'est toutes les analyses dont j'ai besoin sur mon site. Je ne vais pas passer par cela plus dans cette classe parce que vous devez publier votre site et aussi le faire fonctionner pendant un certain temps avant de commencer à voir les analyses. Mais il est vraiment facile de lire ces analyses et vous pouvez en trouver plus à leur sujet dans l'aide de Squarespace. Les paramètres sont l'endroit où vous pouvez définir des paramètres généraux sur votre site, comme la disponibilité du site. Maintenant, nous sommes définis sur privé parce que nous sommes sur une période d'essai, mais vous pouvez également le définir sur protégé par mot de passe, et lorsque vous mettez à niveau votre site, vous pouvez le définir sur public. Langue et région est l'endroit où vous définissez votre heure normale, votre pays, votre langue et toutes ces choses. Informations commerciales est l'endroit où vous indiquez votre numéro de téléphone si vous souhaitez l'afficher sur votre site, e-mail de
contact, et votre emplacement si vous le souhaitez, et si vous avez des heures d'ouverture, vous pouvez les mettre ici. Je ne passerai pas ça plus dans cette classe. Liens sociaux est les liens qui sont attachés à vos symboles sociaux sur votre site. En standard, Squarespace a tapé leurs liens sociaux, mais ici vous devez ajouter vos propres liens sociaux. Donc, je vais juste taper ma chaîne Instagram, Facebook et YouTube, puis je vais supprimer les liens Squarespace, donc je vais juste cliquer sur les liens et appuyer sur Supprimer. Maintenant, j'ai trois liens sociaux différents avec mon Instagram, Facebook et YouTube. Connected Accounts est l'endroit où vous pouvez ajouter des comptes
sociaux pour envoyer et extraire des données sur votre site. Si vous, par exemple, voulez afficher votre flux Instagram, vous pouvez connecter Instagram. Appuyez sur Connect Account
et Instagram, et je suis déjà automatiquement connecté à Instagram sur mon ordinateur dans mon navigateur, mais si vous ne l'êtes pas, vous suffit de taper votre login, puis de cliquer sur Enregistrer. Vous pouvez également connecter vos comptes Pinterest, Facebook ,
Twitter et tous ces comptes. Pour cette classe, je vais seulement vous montrer comment utiliser le compte connecté à Instagram-. Nous n'utiliserons aucune extension dans cette classe, mais vous pouvez en explorer plus ici. Les autorisations sont si vous voulez avoir plus de contributeurs à votre site et vous pouvez même transférer votre propriété de votre site à une autre personne. Je ne passerai pas ça plus loin non plus dans cette classe. Domains est l'endroit où vous pouvez obtenir un domaine sur votre site Web à l'intérieur de Squarespace, ou vous pouvez utiliser un domaine que vous possédez déjà. La meilleure chose est d'obtenir un domaine à l'intérieur de Squarespace si vous ne possédez pas déjà un domaine, car alors vous avez tout inclus dans votre plateforme Squarespace et vous n'obtiendrez qu'une seule facture pour tout. Vous pouvez également utiliser un domaine que vous possédez, et si c'est le cas pour vous,
vous pouvez cliquer sur En savoir plus et en savoir plus à ce sujet. Si vous voulez obtenir un domaine à l'intérieur de Squarespace, il
vous suffit de taper un domaine, et ici vous pouvez voir
quels domaines sont gratuits, ce qu'ils coûtent à l'intérieur d'un Squarespace, et vous pouvez ajouter un domaine à votre site. Dans cette classe, je vais vous montrer comment construire votre site Web de portefeuille, je ne vais pas vous montrer comment transférer un domaine ou comment ajouter un domaine, mais c'est vraiment simple et vous pouvez en lire plus à ce sujet dans le Centre d'aide de Squarespace. Donc, je suggère que vous le faites à la fin lorsque vous avez construit votre site entier, et que vous êtes prêt à obtenir un domaine ou utiliser un domaine que vous possédez déjà. Mais je ne vais pas passer par ça plus dans cette classe. Email & G Suite est l'endroit où vous pouvez connecter une adresse e-mail à votre site. Vous obtenez d'abord un domaine, puis vous pouvez connecter une adresse e-mail à ce domaine. Je ne vais pas passer par ça plus dans cette classe non plus, mais c'est vraiment une bonne chose à inclure. Je crois que cela a été inclus dans le plan d'affaires. Donc, si vous avez le plan personnel, vous ne pourrez pas le faire, mais si vous avez un plan d'affaires, vous pourrez avoir un e-mail qui se termine par votre nom de domaine. Par exemple, hello@mayafavorite.com, qui est mon adresse e-mail. Facturation et compte est l'endroit où vous définissez les paramètres de votre forfait. Ici, il vous reste combien de jours de votre procès il vous reste. Vous pouvez voir vos futures factures ici, et vous pouvez même supprimer votre site. Mobile Information Bar est une fonctionnalité premium qui est disponible sur le plan commercial et commercial, et je ne vais pas passer par cela plus dans cette classe. Cookies & Visitor Data est une bonne fonctionnalité. Vous pouvez activer une bannière de cookies sur votre site, qui indique essentiellement qu'en utilisant ce site, le visiteur accepte votre utilisation de cookies. Je ne vais pas suivre la classe de ce lundi, mais si vous n'en savez pas plus à ce sujet, je vous suggère simplement d'utiliser ce texte par défaut, afin que vous informiez vos visiteurs que vous utilisez des cookies. Vous pouvez en savoir plus à ce sujet dans le Centre d'aide Squarespace et Google plus sur les cookies. Pour l'instant, je ne peux pas la bannière des cookies. Blogging, nous allons passer par plus tard dans la classe où nous créons notre page de blog. Advanced est essentiellement des fonctionnalités plus avancées que vous n'avez pas besoin d'utiliser, en fait, jamais, lorsque vous créez un site Web simple dans Squarespace. Donc, c'est si vous voulez ajouter du code et des choses comme ça. Donc tu n'as pas besoin de t'inquiéter pour ça. C' était tous les réglages. Certains paramètres que je vais passer plus tard en classe, et d'autres je ne vais pas passer plus loin parce que je ne pense pas que vous avez besoin d'en savoir plus sur ces paramètres pour construire votre site Web. Mais la bonne chose est que vous pouvez trouver toute l'aide
dont vous avez besoin dans le centre d'aide Squarespace. Il y aura une leçon complète plus tard en classe, où je vais vous montrer comment fonctionne ce centre d'aide parce que je ne suis pas un support Squarespace, et il y a tellement de choses à savoir sur Squarespace et qu'ils ont vraiment un bon soutien pour vous. Donc pour l'instant, je vais arrêter ça et y retourner. La dernière chose que je veux vous montrer est que si vous cliquez sur votre compte en bas,
vous accédez à un tableau de bord. C' est la première chose que vous verrez lorsque vous vous connectez à Squarespace. Ce sont vos sites Web, et plus tard, vous pourrez voir vos domaines ici également. Pour accéder à votre site Web et pouvoir le modifier, cliquez sur Modifier le site. C' est tout ce que je voulais vous montrer dans cet aperçu des paramètres et options de Squarespace, passons à la prochaine leçon où nous allons réellement commencer à construire notre page d'accueil.
8. Page : Accueil: Commençons par construire notre page d'accueil. La première chose que vous ferez est de cliquer sur Pages, et c'est là que nous construisons toutes les pages de notre site. Lorsque vous commencez avec un modèle, vous verrez qu'il est dit Demo, sur les pages. Ce que vous devez faire est de cliquer sur la page. Cela en fera une page que vous pouvez construire au lieu d'une page de démonstration. Habituellement, quand je commence avec un modèle, je commence par les pages de base qui sont incluses dans le modèle, puis si je veux changer quelque chose ou ajouter des pages, je le fais à partir de là. abord, je vais vous montrer comment construire la page d'accueil basée exactement sur ce modèle. Nous allons simplement ajouter nos propres images ici. Je pense que cette page d'accueil est vraiment bon pour un site de démarrage Portfolio. Vous pouvez créer tous les sites de portefeuille. Je vais vous montrer comment vous pouvez modifier votre page d'accueil et toutes les autres pages, mais commençons simplement par le modèle que nous avons et ajoutez notre propre contenu. Vous pouvez facilement voir quelle page est la page d'accueil par le symbole de petite maison, à gauche de votre page. Si vous passez la souris sur la page, vous pouvez cliquer sur le petit symbole de paramètres. Faites défiler vers le bas, vous pouvez voir qu'il est écrit : « Ceci est défini comme votre page d'accueil. » Vous pouvez facilement choisir une autre page comme page d'accueil si vous le souhaitez. Vous avez quelques paramètres que vous pouvez modifier ici, par exemple, je pense que Accueil, est un bon titre pour la page dans la navigation. L' URL Slug devrait également être Home. Vous pouvez ajouter un mot de passe à votre page. Je vais vous montrer comment le faire lorsque nous créons la page du portefeuille
protégé par mot de passe plus tard dans la classe. Vous pouvez même dupliquer la page si vous souhaitez créer une copie exacte de la page que vous avez créée. Si vous cliquez sur SEO, vous verrez comment votre site sera consulté dans les résultats de recherche. Je ne vais pas passer par le référencement beaucoup dans cette classe parce que ce serait une classe entière sur lui-même. C' est tellement d'informations. L' espace carré rend certains paramètres SEO automatiques à votre site. En tant que débutant et sur votre premier site, je dirai que le référencement est quelque chose que vous pouvez faire à l'étape suivante lorsque vous publiez le site et que vous voulez travailler plus avec le développement. Social Image est la façon dont votre site est affiché sur les réseaux sociaux. Vous pouvez ajouter une image spécifique à cette page. Advance est disponible dans le
plan commercial et commercial et c'est là que vous pouvez injecter des codes personnalisés , des scripts, et toutes ces choses. Vous n'avez pas besoin de le faire pour un site de portefeuille de base. Appuyez sur Enregistrer, car nous avons changé le titre en Accueil, à la
fois le titre de la page, le titre de navigation et l'URL Slug. Le titre de la page, j'ai oublié de mentionner, c'est le titre qui apparaît en haut de la fenêtre du navigateur. Appuyez sur Enregistrer, et maintenant nous changeons le nom de notre page d'accueil en Accueil. La prochaine chose que nous ferons est d'éditer cette page. Si vous regardez dans le coin supérieur gauche, vous avez un petit bouton qui dit Modifier, donc nous cliquons dessus. Ici, vous allez entrer en mode d'édition. Si vous survolez les différentes parties du site, vous pouvez modifier toutes les barres. Commençons par ajouter nos propres images à cette galerie. Cliquez sur le petit symbole d'image, et je vais supprimer toutes ces images. Maintenez la touche Maj enfoncée, cliquez sur pour tous les sélectionner, puis appuyez sur Supprimer. Ensuite, vous cliquez sur le petit signe Plus et téléchargez des images. J' ai enregistré un tas d'images de deux de mes collections de motifs que je vais utiliser comme exemple sur ce site. Pour cet exemple, je n'utilise qu'une collection sur cette page d'accueil. Mais je vous suggère de montrer une gamme de vos œuvres d'art ou ce qui est inclus dans votre portfolio afin que les visiteurs puissent voir une variété de votre portfolio. Mais pour cet exemple, comme je l'ai dit, je vais juste ajouter une de mes collections, quelques maquettes, et quelques modèles. Je cliquerai sur Ouvrir lorsque j'aurai sélectionné quelques images. Cela peut prendre un peu de temps pour télécharger des images ou accélérer un peu pour vous. J' utilise des images carrées ici, mais vous pouvez utiliser n'importe quel type d'images. Vous pouvez les déplacer en cliquant et en faisant glisser. Parfois, il est un peu désactivé, donc vous devez vraiment cliquer, maintenir la touche enfoncée et le faire glisser vers l'image suivante à l'intérieur de celui-ci. Je vais essayer de faire une belle variété entre ces maquettes et les motifs, en cliquant et en les faisant glisser vers de nouveaux endroits. Maintenant, nous avons ajouté nos propres images. Si vous le souhaitez, vous pouvez ajouter une description à vos images et vous pouvez même ajouter un lien où vous allez si vous cliquez sur l'image. Vous pouvez choisir une adresse web, une page sur votre site, nous n'avons pas encore beaucoup de pages. Vous pouvez choisir un lien e-mail, un numéro de téléphone ou un fichier. Dans la leçon suivante, je vais vous montrer comment créer une page de portefeuille avec des images
cliquables qui vous amène à une autre page de votre site Web. Pour l'instant, je vais fermer celui-ci et fermer la galerie. Ici, nous avons nos images ajoutées à la galerie. Si vous survolez, vous verrez un petit symbole de stylo. Cliquez dessus, et ici vous avez quelques modifications que vous pouvez apporter à votre galerie. Vous pouvez choisir si vous voulez la pleine largeur, plein fond perdu qui le fera perdre jusqu'aux bords de vos sites ou à l'encart. Essayons l'encart pour l'instant. Vous pouvez sélectionner l'Espacement entre vos images Je pense que 30 semble bien, Row Heights, si vous voulez ajouter les Légendes,
les descriptions que nous mettons sur les images, les chats motif sous les images, je ne ferai pas ça pour cette page d'accueil. Si vous voulez qu'une animation se produise, pas de décoloration de l'animation ou de mise à l'échelle, je pense que la mise à l'échelle semble bonne. L' animation se produira lorsque votre visiteur visite votre page la première fois parce que si vous voulez une boîte lumineuse, ce qui signifie que lorsque vous cliquez sur une image, il sera plus grand, ce qui pourrait être une fonctionnalité agréable. Vous pouvez choisir le type de galerie. Par exemple, c'est Strips. Essayons la grille simple. Ici, vous avez d'autres options que vous pouvez explorer. Par exemple, la mise en page, nombre de colonnes que vous voulez, et toutes ces choses. Essayons une autre mise en page. Vous pouvez choisir d'avoir un diaporama, ainsi que la hauteur du diaporama, et toutes ces choses. Allons pour les bandes que nous avons depuis le début et l'espacement 30. Ils sont tous de la hauteur 360. Vous pouvez essayer ça pour voir si vous voulez changer quelque chose, mais je pense que 360 était bon. Si vous voulez un numéro spécifique ici, vous pouvez double-cliquer et taper 360. Sous couleurs, vous pouvez sélectionner un thème. Je vais vous montrer plus tard en classe comment changer ces thèmes. Faisons par exemple, Dark Minimal. Vous pouvez voir que l'ensemble de votre arrière-plan change en couleur foncée. Light Minimal et il change à une couleur plus claire. Donc, nous allons juste appuyer sur White Minimal pour l'instant, puis vous cliquez en dehors de la zone de paramètres, et ici vous avez fait votre page d'accueil. Pour enregistrer ce survol sur Terminé, puis cliquez sur Enregistrer. Dans le coin supérieur droit, vous pouvez voir à quoi ressemblera le site sous vue
mobile et si vous cliquez sur la flèche, vous obtiendrez une vue plein écran. Décliquez sur l'aperçu mobile et cliquez sur l'affichage plein écran. Maintenant, vous avez fait une page d'accueil de base à votre site.
9. Modifier la page d'accueil: Maintenant que nous avons fait une page d'accueil, je vais vous montrer comment modifier la page d'accueil si vous le souhaitez parce que, comme je l'ai dit précédemment, tous les modèles que vous choisissez sont en fait un modèle maître. Ainsi, vous pouvez les faire ressembler les uns aux autres et ajouter sections
différentes à toutes les pages de votre site Web. Dans cette partie de la classe, je ne vais pas modifier la navigation,
qui est en haut, ou le pied de page, qui est en bas. Ce seront des leçons séparées plus tard. Mais pour l'instant, concentrons-nous sur le milieu de la page. Voici à quoi ressemble notre page pour le moment, mais disons que je veux ajouter peut-être quelques textes au-dessus de mes images. Tout ce que je dois faire est d'aller en mode édition et de cliquer sur le petit signe plus qui apparaît, et ici vous pouvez ajouter des sections. Cela rend la nouvelle squarespace 7.1 vraiment flexible. Vous pouvez faire en sorte que tous les modèles se regardent uns les autres car ils font tous partie d'un modèle maître. Juste à titre d'exemple, je peux vous montrer comment ajouter un titre. Ajoutons simplement celui-ci et cela rendra votre page complètement différente. Vous pouvez créer vos pages à partir de zéro avec ces sections. Peut-être après le titre, vous voulez avoir du texte et ensuite vous pouvez simplement continuer à construire votre page comme ceci. Explorer cela en ajoutant des sections à votre site est quelque chose que je vais vous laisser plus. Dans cette classe, nous nous concentrerons sur la construction notre site en fonction du modèle que nous avons choisi. Parce que je pense que c'est un bon début quand vous commencez à construire votre premier site Web, et quand vous êtes nouveau sur squarespace, sinon cela aurait trop de sens à apprendre. Supprimons simplement cette première section. Cliquez sur le petit symbole « Supprimer » et supprimez, et supprimez cette section aussi, et peut-être que je vais juste ajouter un titre pour modifier un peu cette page. Ici, je voudrais peut-être dire quelque chose sur moi, et je peux changer le format de l'en-tête à différents en-têtes prédéfinis, ou paragraphes, ou tout ce que je veux. Mais choisissons l'outil de titre, et allons dans l'outil d'édition, et ici vous pouvez changer la hauteur de votre section, la largeur, allons-y pour petit, et comment votre contenu sera aligné, donc nous 'll pour le centre, vous pouvez opter pour un fond perdu complet et à la place, vous pouvez choisir d'avoir un arrière-plan à l'arrière de votre texte et la couleur est la même. Vous les modifiez en fonction des thèmes prédéfinis. Donc, nous allons aller pour blanc, minimal, cliquez en dehors de la boîte d'options. C' est une façon de modifier cette page, par exemple. Avec tous les paramètres de conception, comme la police, et les couleurs, et tout cela, je vais passer en revue plus tard en classe, donc à cette partie de la classe, je vais construire les pages,
nous ne dérangerons pas la police, les couleurs ou l'un des les styles de conception. Nous allons juste placer le contenu. Faisons juste un exemple de plus. Vous pouvez faire défiler vers le bas et cliquer sur le petit signe plus bleu sous vos images, et disons que nous voulons ajouter une section sociale avec notre flux Instagram. Par exemple, j'aime celui-ci, essayons ça. Cliquez sur le petit outil « Édition », hauteurs de section petites, vous pouvez avoir la largeur de contenu que vous voulez, arrière-plan et les couleurs, et pour obtenir votre flux Instagram à cette section, vous devez cliquer sur le petit outil « Éditer » dans cette section et sélectionnez votre compte connecté. Ici, vous pouvez choisir le nombre d'éléments que vous souhaitez afficher. Cliquez sur « Design », et peut-être que vous voulez avoir plus d'images par ligne. Vous pouvez sélectionner si vous voulez un remplissage et d'autres paramètres. Faisons juste six images montrant et appuyez sur « Appliquer ». Maintenant, nous avons ajouté notre flux Instagram au bas de cette page. Si vous passez le curseur sur votre section, vous pouvez voir qu'il est dit espaceur, alors essayons juste de supprimer cet espaceur, qui me semble mieux. Si vous souhaitez ajouter un espaceur, vous pouvez cliquer sur le petit signe de dépôt, et ici vous pouvez sélectionner pour ajouter un espaceur, un bouton, et beaucoup d'autres choses. Vous pouvez ajouter une ligne si vous le souhaitez. Mais retirons celui-ci. « Enregistrer », cliquez sur l'aperçu en plein écran, et là vous auriez ajouté du contenu à votre page d'accueil. Je vais effectivement supprimer cette première section parce que je n'aime pas celle-là dans ce modèle, donc je vais juste appuyer sur « Supprimer », « Terminé » et « Enregistrer ». C' est un peu sur la façon dont vous pouvez modifier votre page d'accueil pour la rendre plus personnelle. Mais pour ce cours, je vais juste le garder comme ça. Vous pouvez expérimenter plus vous-même et voir si vous voulez apporter d'autres modifications à votre page d'accueil.
10. Page : portfolio: Ok, donc maintenant on a fait notre page d'accueil et on l'a ajustée. Maintenant, je voulais vous montrer comment créer cette page d'accueil en
tant que pages de portefeuille puis ce que cela signifie est que cette page pour l'instant est une galerie, qui signifie que vous pouvez cliquer sur les images et que nous choisissons dans le réglage de la boîte de lumière, vous pouvez faire l'image est plus grande. Mais c'est ce qui se passe. Vous pouvez également ajouter un lien qui
vous mènera à une autre page lorsque vous cliquez sur les images. Mais si vous voulez avoir une page de portefeuille pure où vous avez des projets et que vous voulez que chaque projet soit affiché sur une page séparée et qu'il soit montré comme une miniature ici, c'est ainsi que vous le faites. Sous Navigation principale et sous Non lié, vous pouvez cliquer sur le signe plus. Lorsque vous cliquez sur le signe plus, vous pouvez ajouter des pages, des collections et plus encore. Ce que nous ferons est d'ajouter un portefeuille alors cliquez sur Portfolio. Voici quelques modèles de portefeuille préfabriqués que vous pouvez choisir. Ajoutons ce portefeuille aussi. Je vais simplement le renommer en portfolio et ici vous avez tous les projets. Sous Projet on va cliquer sur Modifier et on peut dire qu'il s'agit d'une collection sur quelque chose. Ensuite, nous pouvons ajouter nos propres images. Supprimez ces images dans la galerie et maintenant nous pouvons cliquer sur Rechercher des images et ici vous pouvez ajouter des images de Unsplash, qui est un excellent site pour les images libres de droits. Si vous voulez les utiliser, vous voulez probablement utiliser vos propres images lors de la création de votre propre site de portfolio. Ajoutons cette image et ajoutons d'autres images. Ok, donc trois images peuvent suffire ici. Appuyez sur Enregistrer. Maintenant, cliquez sur les trois petits points sur les paramètres du projet un et supprimez l'image sous Général et ajoutez une image que vous voulez utiliser comme image de votre voiture. Vous pouvez également modifier le titre, par exemple, chats et les chiens et les scories d'URL. Vous n'avez pas besoin de changer quoi que ce soit avec le référencement ou l'image sociale pour l'instant. Il suffit de cliquer sur Enregistrer et ensuite nous pouvons retourner à notre page de portefeuille et là vous avez votre portefeuille. Je vais juste aller de l'avant et créer quelques projets supplémentaires et accélérer cela un peu pour vous. Projet deux, cette page semble un peu différente, donc je vais juste cliquer sur le petit symbole d'édition et changer l'image d'arrière-plan ici. Lorsque vous avez votre image peut changer quelle partie de votre image est affichée en ajustant ce petit cercle. Vous pouvez ajuster la hauteur de la section. Vous pouvez ajouter des textes, puis ajouter des images. Lorsque vous téléchargez les images, vous pouvez cliquer sur Fermer. Vous pouvez également ajuster le type de galerie sur ces pages comme vous le souhaitez et tous les autres paramètres. Ok, donc peut-être quelque chose comme ça. Appuyez sur Enregistrer, appuyez sur le petit symbole de paramètres dans Project 2 et ajoutez une nouvelle image. Peut modifier le titre et le laitier d'URL et appuyer sur Enregistrer. Retournez à la page de votre portefeuille et voyons à quoi cela ressemble. Si vous allez modifier sur la page de votre portefeuille et sur le petit symbole d'édition, vous pouvez modifier le nombre de colonnes que vous souhaitez afficher. Peut-être trois, et quel type de mise en page vous voulez. Vous pouvez expérimenter tous ces paramètres. Ajoutons un peu d'espacement et rendons-les carrés et peut-être que je veux quatre colonnes. OK, appuyez sur Enregistrer, comme vous pouvez le voir ici, vous pouvez créer la page de portfolio qui ressemble notre page de galerie régulière sur la page d'accueil ou où vous voulez sur votre site Web. La différence entre la page du portefeuille et la page régulière avec la galerie est que sur la page du portefeuille, vous pourrez cliquer sur ces projets et entrer dans une autre page où vous obtiendrez plus d'informations sur le projet. Selon le domaine de création avec lequel vous travaillez et le type de produits avec lesquels vous travaillez, cela pourrait être une bonne solution pour vous ou vous pourriez aller avec la version plus simple qui est juste la page d'accueil de la galerie. Pour l'instant, je vais simplement faire glisser la page du portefeuille sous non lié et pour le reste de cette classe, nous allons utiliser cette page standard comme page d'accueil où vous obtiendrez des images de boîte lumineuse. Mais je voulais juste vous montrer comment créer ce portfolio pages parce que pour certains d'entre vous, cela pourrait être une meilleure façon de faire votre page d'accueil et pour certains d'entre vous, il pourrait être trop d'informations à la fois pour apprendre et aussi vous pourriez ne pas avoir tous ces renseignements à inclure dans votre portefeuille.
11. Page : À propos: Ok, alors créons la page à propos. Vous avez déjà à propos de la page dans le modèle. Cliquez sur celui-ci, et nous pouvons cliquer sur les petits paramètres assemblés pour voir à quoi tout ressemble. Ça a l'air bien. Voyons ce que nous voulons faire de cette page. Donc, fondamentalement, ce que vous voulez ajouter ici est une photo de vous-même, et quelques informations sur vous. Qu' est-ce que tu fais ? Ce que vous pouvez offrir aux clients, et peut-être vous pourquoi vous faites ce que vous faites. Alors, appuyez sur le bouton d'édition et voyons comment nous voulons changer cela. Tout d'abord, modifions l'image. Cliquez sur le petit symbole d'édition, supprimez l'image et téléchargez une nouvelle image. J' ai enregistré un portrait de moi-même que je vais utiliser comme exemple ici en classe. Là, vous avez l'image. Vous pouvez cliquer sur l'éditeur d'image si vous voulez changer la taille de l'image ou si vous voulez l'ajuster d'une manière ou d'une autre. Ainsi, vous pouvez tout changer de la saturation, à la taille et vous pouvez ajouter un filtre et tout cela. Changons juste la taille de cette image de portrait à peut-être 3:2, sera probablement bon et appuyez sur enregistrer pour faire les changements. Lorsque vous obtenez la petite boîte d'option. Donc, vous êtes sûr de vouloir apporter ces modifications permanentes, appuyez simplement sur Enregistrer. Cas que Alice peut s'amuser, et puis nous pouvons changer le design de l'image si nous le voulons. Vous pouvez cliquer autour et voir lequel vous voulez. Je vais aller pour l'original. Vous pouvez choisir si vous voulez une animation comme entrer en collision ou se concentrer. Concentrez-vous bien. Ne vous inquiétez pas des couleurs et des polices en ce moment. Nous changerons tout cela plus tard. Pour l'instant, je vais juste écrire un peu sur moi. Je peux changer le titre en, peut-être en-tête 2 et peut-être que je veux utiliser le paragraphe 1. Donc quand tu as écrit un peu sur toi, c'est bon pour l'instant. Nous allons modifier tous les styles de conception ici, la couleur et les polices et tout plus tard. Enregistrez votre page à propos.
12. Page : Contact: Passons à la page de contact. Cela est également inclus dans les modèles d'origine. Cliquez sur la page de contact et ici nous pouvons simplement ajouter nos propres informations. Cliquez sur Modifier et vous pouvez simplement écrire quelque chose sur les raisons pour lesquelles le visiteur de votre page aimerait vous contacter. Ici, nous avons une petite forme qui est ajoutée. Donc, si vous cliquez sur le bouton Modifier, vous verrez un formulaire. Fondamentalement, vous pouvez ajouter votre propre formulaire si vous cliquez sur le signe de dépôt et faites défiler vers le bas pour former. La seule différence est que ce formulaire est affiché, et si vous cliquez sur Activer le mode Lightbox, vous obtiendrez une petite boîte à la place qui ouvrira le formulaire. Jetons simplement ces modifications et cliquez sur le petit symbole de suppression et ajustez le formulaire qui est déjà sur le site. Le nom du formulaire peut être e-mail, votre nom et ici vous pouvez ajouter des champs de formulaire et vous pouvez les modifier. Donc, vous voulez probablement un nom, un e-mail, une ligne d'objet est bon et un message. Vous pouvez ajouter une description et ajouter d'autres champs de formulaire. Donc, fondamentalement, un formulaire de contact, c'est tout ce dont vous avez besoin. Vous pouvez également ajouter une case de site Web si vous voulez que le visiteur écrive dans leurs sites Web, des cases à
cocher, si vous voulez poser questions et un tas de choses différentes que vous pouvez explorer vous-même. Vous pouvez choisir où se trouve le stockage. Par exemple, vous pouvez le connecter à Mailchimp, Zapier ou Google Drive. La chose normale à laquelle vous vous connectez est votre adresse e-mail. Si vous le connectez à votre adresse e-mail, vous recevrez un e-mail dès que quelqu'un remplira votre formulaire. Dans la section avancée, vous pouvez choisir ce que vous voulez que le bouton soit nommé, comment vous voulez que le bouton soit aligné et si vous
voulez envoyer le visiteur à une autre page lorsqu'il a rempli le formulaire. Vous pouvez également ajouter un message post-soumission, qui montrera quand quelqu'un a rempli votre formulaire et c'est tout ce qu'il y a à cela. Alors appuyez sur appliquer, et pour essayer cela, vous devez appuyer sur Enregistrer et puis nous pouvons aller à la vue plein écran et cliquez sur le petit bouton et vous obtiendrez votre formulaire. Donc ici, le visiteur peut signer son nom, son adresse
e-mail, son sujet et un message et soumettre. Éditons les autres choses sur cette page. Il se peut que vous n'ayez pas de demandes de presse s'il s'agit de votre premier site Web. Donc, nous allons juste taper votre adresse e-mail, et voici un petit truc. Si vous sélectionnez votre adresse e-mail et appuyez sur le petit symbole de lien, vous pouvez cliquer sur le petit symbole de paramètres, cliquez sur e-mail et tapez votre e-mail, et cela rendra ce texte lié à mail à : hello@mayerfaber.com. Ainsi, lorsque quelqu'un clique sur ce lien, son logiciel de messagerie s'ouvre automatiquement et peut vous envoyer un e-mail. Voici quelques liens sociaux qui pourraient être agréables à avoir ici. Vous pouvez les concevoir. Peut-être que tu veux les agrandir. Vous pouvez même concevoir le style d'entre eux. Allons juste pour normal. Peut-être que vous voulez ajouter un peu d'espace entre le texte et les liens sociaux. Dans ce cas, cliquez sur le petit symbole de dépôt et de l'espace là, et là vous avez un peu d'espace. Sur cette page de contact, ils ont une image. Ajoutons une image différente, et cette fois, nous pourrions essayer d'utiliser les images unsplash. Alors cliquez sur Rechercher des images et Free, et peut-être que vous voulez quelque chose comme un téléphone. Tapez le téléphone et faites défiler vers le bas et voyez si vous trouvez quelque chose que vous aimez et cliquez sur Ajouter une image. Vous pouvez ajuster l'endroit où vous voulez que le point de mise au point soit dans votre image et cela semble plutôt bon. Donc, en ce moment, ne vous dérange pas les polices, les couleurs ou l'apparence du bouton. Nous le modifierons plus tard en classe. Il suffit de cliquer sur Enregistrer, cliquez sur l'aperçu complet et ici vous avez votre page de contact.
13. Page : Blog: Créons un blog sur votre page, et ce modèle a déjà un blog, donc nous allons simplement cliquer sur celui-ci. Vous allez accéder à ces options de blog. Ce sont les billets de blog que vous pouvez modifier, et vous pouvez enregistrer des brouillons, vous pouvez enregistrer pour réviser et planifier vos billets de blog. Commençons par éditer cette page de résumé de blog, alors cliquez sur « Modifier » et cliquez sur le petit outil d'édition. Ici vous pouvez choisir. C' est le blog à une seule colonne, où vous avez une colonne et le blog entier ne s'affiche pas. Vous pouvez sélectionner toutes sortes de paramètres ici, si vous voulez qu'un article complet soit affiché, ou si vous voulez juste l'extrait et le titre tel qu'il est ici. Essayons d'autres mises en page. Côte-à-côte, on dirait ça. Blog de maçonnerie, ressemble à ça, blog
de grille de base ou tournant côte à côte blog. Je pense que je veux avoir le blog de la grille de base, ce qui signifie essentiellement que tous les messages de blog seront affichés ici. Vous pouvez sélectionner le nombre de colonnes que vous souhaitez. Choisissez trois colonnes si vous voulez plein ou encart, et combien d'espacement et tous ces paramètres. Vous pouvez choisir le placement de vos images. Le rapport, allons-y quatre carrés. Alignement du texte, si vous voulez afficher les extraits ou non, lien
Lire plus, et il y a un tas de paramètres que vous pouvez explorer ici, alors nous allons juste pour cette mise en page, cliquez sur « Enregistrer ». Si nous cliquons sur les billets de blog, nous pouvons simplement supprimer tous ces articles et ajouter nos propres billets de blog. Pour ajouter des publications, vous cliquez sur le petit signe plus, ajoutez un message, et ici c'est comme créer une autre page afin que vous puissiez entrer un titre de publication, par
exemple, Nouveau motif, et vous pouvez ajouter tout ce que vous voulez pour publier un blog. Ajoutons une image. Je vais cliquer sur « Rechercher une image » et ajouter une que nous avons importée. Vous pouvez choisir la conception et l'animation, mais je vais juste appuyer sur « Appliquer » et peut-être que je veux ajouter une autre image, puis vous pouvez appuyer sur « Enregistrer », « Publier » ou « Planifier ». Essayons simplement ce qui se passe lorsque vous appuyez sur « Horaire ». Vous pouvez planifier la publication à un autre jour et heure. Vous pouvez simplement enregistrer le post, ce qui en fera un brouillon, et vous pouvez publier le post. Il suffit de cliquer sur « Terminé », et là vous avez un nouveau message. Ajoutons deux autres messages. Maintenant, nous allons accélérer un peu ça pour vous. Dans vos billets de blog, vous pouvez, comme je l'ai mentionné, ajouter ce que vous voulez, alors ajoutons une citation ici. Faites les paramètres du devis, et vous pouvez même ajouter une galerie, un bouton et tout ce que vous voulez ajouter à votre billet de blog. Maintenant, nous avons ajouté trois messages, donc il ressemble au modèle. Pour éditer les publications encore plus, allez dans Modifier dans le billet de blog et dans le coin supérieur droit, accédez au symbole des paramètres. Ici, vous avez plus de paramètres à faire à votre article, sorte que vous pouvez réellement créer plus de vos billets de blog ici. Vous pouvez ajouter des catégories si vous le souhaitez, et des balises, et décider si vous voulez avoir des commentaires sur ou non, et vous avez plus d'options. Ce qui est important ici est d'ajouter une image miniature, cliquez sur « Télécharger » une image, et je vais juste ajouter la même image que j'avais sur le post. Ici, vous pouvez écrire un extrait, qui dit un peu à vos téléspectateurs sur votre billet de blog. Vous pouvez lier le titre de votre publication à l'URL source si vous voulez le lier à un autre endroit, vous pouvez choisir l'auteur. Vous n'avez pas besoin de faire quoi que ce soit avec le référencement si vous ne voulez pas. C' est l'aperçu social où vous pouvez télécharger une image si vous le souhaitez, et vous pouvez la partager si vous avez connecté votre compte à, par
exemple, votre Pinterest, vous pouvez partager votre billet de blog sur Pinterest. Vous pouvez taper votre emplacement, mais le plus important est que vous ajoutez une image miniature, cliquez sur « Appliquer » et cliquez sur « Enregistrer ». Revenons en arrière et faisons de même avec les autres messages. Cliquez sur le petit symbole de paramètres, « Options », « Télécharger » une image et écrire un petit extrait. Retournez et faites de même avec le dernier billet de blog. Cliquez sur le symbole des paramètres, « Options » et je vais juste télécharger le modèle. Cliquez sur « Appliquer » et sur « Enregistrer ». Maintenant, nous pouvons retourner à notre page de blog et voir à quoi cela ressemble. Nous avons trois billets de blog affichage avec le titre et l'extrait et lire plus de lien. Si nous cliquons sur le lien « Lire la suite », vous allez à ce billet de blog. C' est la base de la création du billet de blog. Allons aux paramètres du blog. Accédez aux paramètres d'accueil et aux blogs. Voici quelques paramètres simples que vous pouvez modifier. Vous pouvez créer la structure d'URL standard pour les articles de blog, et si vous cliquez sur le petit point d'interrogation, vous pouvez voir ce que cela signifie. Le pourcentage et T signifie le titre de votre message, qui est les paramètres normaux. Allez dans les paramètres courants, et ici vous pouvez décider si vous voulez activer les commentaires et si vous voulez demander l'approbation et tous ces éléments, ainsi que d'autres paramètres pour vos billets de blog. Vous n'avez pas vraiment besoin de vous soucier de ces paramètres pour l'instant, mais vous pouvez aller et expérimenter avec eux plus loin. Maintenant, nous avons créé notre blog qui ressemble à ceci, alors passons à la prochaine leçon où nous allons commencer à changer les styles de conception de notre site Web.
14. Conception : Polices: Jusqu' à présent en classe, nous avons placé le contenu de notre site. Nous avons créé toutes ces pages. Ils sont Accueil, Blog, A propos et Contact. Ensuite, nous avons notre site de portefeuille supplémentaire que je viens de
créer pour vous montrer comment vous pouvez le faire. Mais ce sont nos quatre pages principales. C' est la première leçon où nous allons parler des styles de conception. Dans cette leçon, nous allons parler des polices. Cliquez sur une page où nous avons quelques textes. La page À propos, par exemple, retourner à la maison, dans le menu et cliquez sur le signe et cliquez sur les polices. C' est une fonctionnalité vraiment agréable dans la version 7.1 de Squarespace, qu'ils ont déjà des combinaisons de polices pour vous, ce qui rend l'ensemble du processus vraiment rapide pour choisir les polices sur votre site. Vous pouvez également, bien sûr, y aller et modifier et ajuster certaines polices comme vous le souhaitez. Mais nous allons juste changer la police et voir ce qui se passe. Vous pouvez choisir sans empattement, serif ou mixte. Il suffit de cliquer sur cette police Poppins et là vous pouvez voir les différentes polices est changé et même la navigation est changée à une autre police. C' est probablement un bug qui en fait un carré noir, mais la police est modifiée. Si j'appuie sur « Enregistrer », je suppose que la police sera modifiée. Oui, alors ne vous dérange pas ce petit insecte. Mais essayons plutôt les polices serif ou la police mixte. Pour ce site, allons-y pour quelque chose de classique. Je choisirai cette Futura. Ici, vous pouvez changer la taille de base si vous voulez avoir une taille plus petite. Allons-y pour 14 ans. Si vous cliquez sur le petit symbole de paramètres, vous pouvez entrer et modifier certaines polices et les modifier. Comme si tu voulais avoir plus de graisse. Il suffit de cliquer sur « Enregistrer » et peut-être qu'on va se débarrasser de ce bug. Vous pouvez même changer les styles de police ici en une autre police si vous le
souhaitez et vous pouvez entrer et modifier le poids, le style, la hauteur de la ligne, l'espacement des lettres, la transformation du texte. Il semble que si j'appuie sur save, alors vous afficherez le texte et le bug semble disparaître. Retournons ici. Vous pouvez modifier la taille des différents titres et appuyer sur « Enregistrer ». Maintenant, revenons en arrière et revenons dans les paragraphes. C' est la police Poppins. Vous pouvez modifier le poids de cela ainsi que le style et la hauteur de
la ligne, les différents paragraphes, leur taille et tous les paramètres. Vous pouvez expérimenter avec ça par vous-même. Si vous n'avez pas autant de connaissances sur la typographie, j'opterais simplement pour les combinaisons de polices standard que Squarespace a déjà faites pour vous. Fondamentalement, vous pouvez faire tous les changements que vous
voulez, pour le rendre aussi facile que possible. Je voudrais juste opter pour une combinaison de polices pré-faites que Squarespace a déjà mis en place. C' est ainsi que vous modifiez la police de votre ensemble.
15. Conception : Couleurs: Changeons les couleurs de votre site Web. Dans le menu de conception, cliquez sur les couleurs et ici nous pouvons changer la palette de couleurs et les thèmes de section. Cliquez sur « Modifier » sur la palette de couleurs et vous avez des granulés de concepteur qui sont préfabriqués, ce qui est assez agréable donc vous n'avez pas besoin de penser beaucoup à la palette de couleurs. Si vous utilisez les palettes de concepteur pré-faites, Allons-y pour cette rose. Vous pouvez soit, obtenir un pastilles à partir d'une image. Vous pouvez glisser-déposer à partir d'une couleur pour commencer par une couleur et choisir la palette de couleurs que vous voulez aller à partir de là, ainsi que les couleurs personnalisées. Même si vous avez une palette de concepteurs, allons-y pour celle-ci et cliquez sur Modifier les couleurs personnalisées. Vous pouvez entrer et changer les couleurs pour une palette plus personnalisée qui vous convient. Le deuxième est d'y aller et de le rendre un peu plus rose par exemple. Ok, alors peut-être quelque chose comme ça et si vous cliquez sur les thèmes de section, vous pouvez aller de l'avant et éditer tous les autres thèmes pré-faits sur votre site Web. Ici vous pouvez voir ce que les thèmes sont sélectionnés sur cette page. C' est blanc minimal ici et blanc minimal à ce contenu. Allons au blanc minimal et voyons ce qu'on peut changer. C' est un collage d'images. Vous pouvez modifier tous ces paramètres sur le thème de section minimale blanche. Je vais juste faire défiler jusqu'à ce que j'ai trouvé le bloc d'image qui dit le collage de bloc d'image et je peux voir que l'arrière-plan de la carte est réglé sur cette couleur rose clair. Si je clique dessus, je peux passer à une autre couleur dans ma palette ou opter pour une couleur personnalisée si je veux le faire. J' aime les roses pâles, je vais juste aller pour ça. Il y a tellement d'options ici dans les thèmes de la section. Je ne les traiterai pas tous, mais vous pourriez simplement cliquer sur quelque chose que vous voulez changer. Vous pouvez voir quel type de bloc il s'agit et comment vous pouvez le modifier. Par exemple, ici vous pouvez voir l'en-tête et il s'agit du collage de bloc d'image. Ce sont les liens sociaux, que vous pouvez changer la couleur si vous le souhaitez. Je vais juste aller de l'avant et cliquer sur Annuler ici parce que je n'ai pas fait changements et si vous pensez que c'est juste trop à apprendre et à de nombreux paramètres, je voudrais juste ignorer les thèmes de la Section et aller et changer ceux-ci et juste changer la palette de couleurs à quelque chose que vous aimez.
16. Conception : Boutons: Dans cette leçon, je vais parler des boutons. Comme nous n'avons pas vraiment de boutons sur notre page, je ne pense pas que je voudrais simplement ajouter un bouton. Cliquez donc sur « Modifier » sur la page À propos. Je vais juste ajouter un bouton ci-dessous où il est dit Contactez-moi. Maintenant, je vais juste ajouter une adresse e-mail et nous allons agrandir ce bouton. Peut-être que je le veux à droite ou à gauche, mettons-le à gauche. Appuyez sur « Enregistrer » là, nous avons un bouton que nous pouvons changer le style de conception. Dans le menu Style Design, cliquez sur « Boutons » et vous obtiendrez ces différentes options décrites ou solides, carrées arrondies ou pilules. Allons prendre une pilule et le rembourrage est la taille du bouton autour du texte. Allons pour quelque chose comme ça, 1.5 RAM, appuyez sur « Enregistrer ». Pour styler le bouton encore plus, nous revenons à Design, et allons dans les premières polices et vous pouvez cliquer sur le « Petit symbole de
réglage » dans votre pack de polices et cliquer sur « Boutons ». Ici vous pouvez faire quelques paramètres, faisons le bouton des calques majuscules. Peut-être que vous voulez plus d'espacement des lettres, comme ça, peut-être des poids plus élevés. Vous pouvez changer la taille des différents boutons afin que je puisse changer le grand bouton, qui est celui que j'ai choisi ici. Le bouton moyen je n'ai pas cela sur cette page et un petit bouton. Appuyez sur « Enregistrer » revenir en
arrière, revenir au panneau de conception, puis vous pouvez changer les couleurs du bouton. Allez-y et cliquez sur « Thème de la section » Ceci est le thème minimal blanc sur cette page. Vous pouvez cliquer sur le « Bouton », puis vous pouvez changer l'arrière-plan du bouton si vous voulez une autre couleur. Peut-être que vous voulez la couleur de votre palette. Je vais juste aller pour le noir et vous pouvez changer la couleur du texte. Maintenant, vous savez comment styliser vos boutons alors passons à la leçon suivante.
17. Conception : Animation: Examinons le style de conception appelé animations, et c'est une leçon très rapide car il
n'y a vraiment pas beaucoup de paramètres à faire ici. Si vous vous souvenez, lorsque nous avons créé les différents contenus sur nos pages, nous avons pu ajuster l'animation sur certaines sections. Par exemple, ici, faites défiler vers le bas et vous pouvez le modifier si vous le souhaitez ; mise à l'échelle, décoloration, aucune animation ou par défaut du site. Utilisons simplement le site par défaut et appuyez sur « Enregistrer ». Pour changer l'animation sur l'ensemble de votre site, vous cliquez sur « Animations » dans le menu de conception, puis vous pouvez choisir l'un de ces styles,
aucun, fondu, diapositive d'échelle, clip. Je pense que c'est l'échelle semble bonne et vous pouvez décider de la vitesse, lente, moyenne ou rapide. Moyen pourrait être bon et sauver. Cela signifie que la page
sur laquelle cliquerait aura cette animation si nous n'avons pas défini une certaine animation à ce bloc de contenu. C' était une très courte leçon sur l'animation. Je pense que d'avoir un peu d'animation sur votre site le rend vraiment professionnel. Vous pouvez facilement le changer ici, sorte que vous pouvez simplement l'essayer et voir ce que vous aimez.
18. Conception : Navigation: Maintenant, allons de l'avant et modifions cette navigation de votre site. Tout d'abord, nous pouvons regarder les polices à l'intérieur de ce dans les leçons précédentes. Lorsque nous avons sélectionné des polices pour l'ensemble de votre site, vous allez dans le style de conception des polices, puis dans les paramètres. Ensuite, vous pouvez simplement cliquer en haut ici et vous obtiendrez les paramètres avancés, c'
est-à-dire le titre du site, navigation
du site et le bouton d'en-tête. Allons de l'avant et jetons un coup d'oeil au titre du site, donc c'est celui-ci. Vous pouvez choisir d'avoir un titre de site que vous tapez, ou vous pouvez choisir d'avoir votre logo. Je vais vous montrer comment ajouter un logo dans la prochaine leçon, mais pour l'instant, modifions simplement la police de ce titre du site. Nous pouvons essayer les polices Poppins,
qui semble assez bien, qui semble assez bien, ou vous pouvez parcourir toutes les polices et cliquer sur Enregistrer, Retour, et ici vous pouvez modifier toutes sortes de paramètres comme le Poids et le Style, Hauteur de la
ligne, Espacement des lettres et tout cela. Cliquez sur Enregistrer, puis sur Précédent. Ensuite, vous pouvez entrer et modifier la navigation du site. Les paramètres prédéfinis sont que vous avez le paragraphe comme style. Mais vous pouvez aussi entrer et changer cela. Vous pouvez aller de l'avant et la changer en une autre police. Allons juste pour Poppins pour cela et retour, ou vous pouvez revenir en arrière et choisir Paragraphe. Vous pouvez modifier la taille de la navigation. Si vous vouliez un peu plus grand, 1.3 semble bien, ou vous pouvez changer la taille au paragraphe un, paragraphe deux, paragraphe trois. Appuyez sur Sauvegarder et revenir. Nous n'avons pas de bouton d'en-tête pour le moment, mais si nous en avions un, nous pouvons modifier les paramètres ici. Cliquez sur Précédent et je vais vous montrer comment changer la mise en page de l'en-tête. Vous cliquez sur Modifier une page, Modifier l'en-tête de site, puis Mise en page d'en-tête. Ici, vous pouvez modifier l'endroit où vous voulez que votre Menu et le Titre du Site apparaissent. Essayons d'avoir mon titre de site au milieu et le titre du site et le logo. Nous allons juste passer sur le titre du site pour l'instant et je vais
vous montrer comment ajouter un logo dans la prochaine leçon. Les éléments que vous pouvez choisir si vous voulez avoir un bouton, Liens
sociaux, si vous voulez qu'ils apparaissent dans votre menu, cette taille d'icône sociale. Si vous avez une boutique, vous pouvez ajouter un panier. Cliquez sur Précédent et Couleurs. Vous pouvez utiliser un arrière-plan transparent, ou vous pouvez choisir d'avoir une couleur de votre Menu. Allons pour un fond transparent. Hit Style et ici vous pouvez sélectionner la quantité de remplissage que vous voulez sur votre Menu, espacement que vous voulez entre les éléments et l'espacement que vous voulez avec les liens. Si vous voulez qu'un Menu ait une position fixe sorte que lorsque vous faites défiler le Menu soit toujours là, ou si vous voulez qu'il soit juste en haut de la page, nous allons utiliser une position fixe. Ici, vous pouvez choisir si vous voulez fixer le style d'en-tête pour être basique ou faire défiler en arrière. Choisissons simplement Basic. Vous pouvez choisir si vous voulez avoir une pleine largeur ou un encart. Revenez en arrière et je pense que je vais changer la disposition d'en-tête à celle que j'avais avant. Parce que c'est mieux comme ça. Ensuite, vous cliquez simplement sur « Enregistrer ». C' est tout ce qu'il y a pour changer le style de conception de la Navigation.
19. Conception : Ajouter un logo: Dans cette leçon, nous allons ajouter un logo à votre site au lieu du titre du site. Si vous avez déjà un logo, vous pouvez le télécharger et l'ajouter à votre site. Si vous n'avez pas de logo, vous pouvez simplement utiliser une police comme je vous l'ai montré dans la leçon précédente et ajouter votre nom de marque à votre site. Mais ajoutons un logo. Cliquez sur « Modifier », puis sur « Modifier l'en-tête du site », le titre et le logo du site. Ici, il est dit que le logo remplace le titre du site sur toutes les pages. Cliquez sur le petit bouton « Télécharger ». J' ai enregistré mon logo en tant que P&G. Si vous voulez vous assurer que vous avez un fond transparent sur votre logo, vous l'enregistrez en tant que P&G. Cliquez pour télécharger le logo. Ici, vous pouvez choisir la hauteur du logo, ce qui signifie essentiellement la taille de votre logo, et la hauteur maximale du logo mobile. Essayons simplement l'un ou l'autre et revenons à la vue mobile et à la vue Bureau. Nous pouvons revenir à la hauteur du logo mobile et augmenter la taille à 50 pixels et voir si cela a apporté des modifications. Ok, ça a l'air mieux dans la vue mobile. C' est tout ce qu'il y a pour ajouter un logo à votre site Web. Alors appuyez sur « Enregistrer ». Quelle que soit la page sur laquelle vous allez cliquer maintenant, vous aurez votre logo sur votre site Web.
20. Conception : Bas de page: Dans cette leçon, je vais juste vous montrer comment changer le pied de page de votre site. Le pied de page est l'espace inférieur de votre site Web. Cliquez sur « Modifier » et ici vous avez le pied de page d'édition en bas de votre page. Lorsque vous changez le pied de page, vous changerez le pied de page sur toutes vos pages, sur l'ensemble de votre site Web. Peut-être que vous voulez l'avoir fait avec une base carrée là ou peut-être que vous ne le faites pas, donc vous pouvez juste enlever celui-là. Vous pouvez modifier les liens sociaux, peut-être vous les voulez plus grands et vous pouvez écrire votre nom ici, ou peut-être vous voulez même ajouter votre logo. Si vous voulez ajouter votre logo, vous pouvez cliquer sur le symbole de petites gouttes Ajouter une image, et rechercher l'image importée et ajouter le logo que nous venons de télécharger. Nous ne voulons pas de légende sur le logo et appuyez simplement sur « Appliquer ». Si vous voulez que l'image soit plus petite, vous ajoutez un espaceur en cliquant sur le symbole de dépôt, « Ajouter un espaceur », puis vous pouvez simplement ajouter plus d'espace sur le côté de votre logo. Supprimons la zone de texte, et ici vous avez votre logo et vous avez vos liens sociaux. Si vous voulez un menu au pied de page aussi, je ne pense pas que ce soit nécessaire lorsque vous avez ce petit site avec seulement quelques pages. Mais si vous voulez avoir cela, vous pouvez ajouter soit un lien de contenu, ce qui signifie que vous liez à vos pages, soit vous pouvez ajouter une zone de texte et écrire vos pages, et simplement supprimer les liens de contenu et ensuite nous pouvons les faire aligné vers la droite. Une autre astuce, si vous voulez avoir juste une ligne vers le bas est de maintenir le décalage et cliquez sur « Entrée » pour obtenir une distance plus proche. Ensuite, nous pouvons ajouter des liens à ce texte, alors cliquez sur le texte, cliquez sur « Lien », et vous pouvez ajouter une page, la page d'accueil, et appuyez sur « Enregistrer ». Faites de même sur le blog, page, le blog et appuyez sur « Enregistrer ». Sélectionnez le texte ci-dessus, cliquez sur « Ajouter un lien, Page et À propos ». La même chose avec le contact, cliquez sur « Lien, Page et Contact ». J' ai oublié de cliquer sur appliquer sur ceux pour qu'ils n'aient pas vraiment obtenu de liens, alors faisons-le à nouveau. Assurez-vous d'appuyer sur « Appliquer », cliquez sur « Terminé » et enregistrez. Maintenant, vous avez fait un pied de page qui s'affiche sur toutes vos pages. Si vous voulez que le pied de page soit dans une couleur différente, cliquez sur « Modifier pied de page » et cliquez sur le petit symbole « Modifier ». Vous pouvez opter pour l'arrière-plan si vous voulez avoir une image ou quelque chose comme arrière-plan. Mais sinon, vous pouvez choisir la couleur et ajouter une couleur à votre pied de page. Essayons la lumière minimale et voyons à quoi ça ressemble. Allons pour le blanc minimal. Dans le format, vous pouvez sélectionner la hauteur de la section ou y aller et la modifier vous-même. La largeur du contenu si vous voulez l'avoir au milieu de votre page, ainsi que l'alignement. Mais je pense que cela a l'air bien, alors appuyez sur « Enregistrer », et ici vous avez votre pied de page. Maintenant, vous pouvez voir lorsque vous faites défiler vers le bas que le menu
de navigation défile vers le bas avec votre page lorsque vous faites défiler vers le bas.
21. Conception : Blocs d'images: Donc, le dernier style de conception que je veux vous montrer comment modifier, c'est les bases de ce
que vous devez savoir pour
créer un site de portefeuille de base est les blocs d'image. Alors allez à « Design » et « Blocs d'image ». Celui-ci est un bloc d'image, c'est un collage de bloc d'image, et il y a d'autres blocs d'image. Nous allons donc simplement ajouter un bloc d'image à cette page pour voir les changements que nous pouvons apporter. Cliquez sur le petit symbole de goutte et l'image et nous allons simplement ajouter une image et cliquer sur « Conception » et ce sont les blocs d'image. C' est donc une affiche, une carte, chevauchement, un collage et une pile. Alors allons pour la carte, appuyez sur « Appliquer », maintenant nous écrivons juste un titre et un sous-titre. Je vais juste changer le titre et changer le sous-titre en différents paragraphes et titres et appuyer sur « Terminé », et enregistrer. Ainsi, dans les blocs d'image, vous pouvez modifier certains paramètres. Il s'agit de la carte de bloc d'image, si vous cliquez sur ce bloc d'image, la carte de bloc d'image s'affichera. Vous pouvez choisir si vous voulez que la position du contenu soit centrée en haut ou en bas. Allons juste pour le centre, l'alignement du texte, allons-y pour la largeur de l'image gauche, séparation de
l'image du texte, et la séparation des titres les uns des autres, le titre et le sous-titre. était donc les paramètres que vous pouviez faire pour la carte de bloc d'image. Alors allons de l'avant et voyons ce que vous pouvez faire sur le collage de bloc d'image, et c'est la position du contenu. Peut-être que vous voulez qu'il soit centré et prend la largeur de l'image d'alignement, c'est 70 pour cent maintenant. Donc j'aime qu'ils se chevauchent, donc 70 % ont l'air bien. La largeur du contenu est la largeur du texte, allons-y pour 50 il
décalage
du contenu décalage ,
puis tous ,
puis tousces paramètres que vous pouvez expérimenter avec. Appuyez sur « Enregistrer » et « Design », puis revenons en arrière. Appuyez sur « Modifier » et je vais juste supprimer ce nouveau bloc d'image que j'ai créé juste pour vous montrer. Ici, nous avons créé de nouveaux paramètres pour ce bloc d'image que le contenu du texte est au centre du contenu de l'image. Appuyez sur « Enregistrer ». Maintenant, vous savez un peu comment faire quelques réglages pour les différents blocs d'image.
22. Derniers ajustements: Ok, donc maintenant nous avons créé tout notre site Web, toutes les pages et apporté tous leurs changements de style de conception. Examinons tout le site et voyons si nous voulons apporter des changements. Nous allons cliquer sur la vue plein écran et je vais simplement faire
défiler mes pages pour voir si je veux apporter des modifications. Cette première page a l'air bien, bien que je n'aime pas la police de la navigation, alors modifions cela tout de suite. Cliquez sur « Police » et le « Design ». Cliquez sur « Paramètres » et cliquez sur « Police de navigation » et ici vous pouvez changer lequel utiliser. Essayons Futura à la place. Je l'aime beaucoup mieux. Cliquez sur « Enregistrer » et peut-être que vous voulez avoir un peu plus de poids à 400. Voyons si nous voulons l'avoir en majuscules. De cette façon, nous voulons avoir plus d'espacement entre les lettres peut-être. Je pense que j'aime mieux les minuscules et supprime l'espacement des lettres et peut-être augmenter la taille un peu. Ok, donc quelque chose comme ça. Ça a l'air beaucoup mieux pour moi. Revenons en arrière et pleine vue à nouveau. En fait, je ne pense pas qu'il est très logique d'avoir le blog d'abord et à propos de ce contact. Je voudrais également ajouter la page d'accueil. Cette page à la navigation principale. Au moment où vous êtes sur une autre page et que vous cliquez sur le logo, vous rendez chez vous, ce qui est standard pour tous les sites Web. Mais vous pouvez également choisir de l'avoir dans votre navigation principale. C' est plus logique pour moi sur ce site de portefeuille de base, où vous n'avez que ces quatre pages différentes. Dans le menu de navigation principal, vous pouvez également cliquer et faire glisser pour sélectionner l'endroit où vous voulez que les pages apparaissent dans le menu et cliquer à nouveau sur l'affichage plein écran. Cliquez sur « À propos de la page » et faites défiler vers le bas. Celle-là a l'air bien. Le blog a l'air bien aussi. Le contact, peut-être que je veux
changer ce fond parce que je ne peux pas vraiment voir cette police sur celui-là. Sinon, je pense que ça a l'air bien. Sortez du mode plein écran. Cliquez sur « Police » et le texte du bouton en bas et le style. Peut-être que cela fonctionne juste si j'augmente les côtés de paragraphe. Non, ça n'a pas marché. Allons de l'avant et personnalisons la taille à un peu plus grand et qui me semble mieux. Peut-être que nous voulons personnaliser le poids aussi. Cela me semble beaucoup mieux avec le poids de 500 sur ce bouton. Vous pouvez simplement aller et venir sur votre site et assurer que vous êtes satisfait de tous les paramètres. Pour moi, je suis vraiment heureux avec cela maintenant, retournez à la maison et faites défiler à nouveau. Si je clique sur les images, j'obtiendrai un mode de boîte lumineuse et je pourrai faire défiler les images. Cliquez sur « À propos » et c'est un peu à propos de moi. Le blog. Si je vais dans un blog, quoi ça ressemble ? Ça a l'air bien et une page de contact. Ok, donc je suis vraiment content de ce que ça a l'air maintenant. Maintenant, nous avons créé l'ensemble de notre site Web.
23. BONUS : Ajouter une icône de navigateur: Je suppose que c'est une petite leçon de bonus sur la façon d'ajouter un favicon ou une icône de navigateur, comme je crois est le nouveau nom de cette petite icône qui est affichée en haut de votre page. Par exemple, sur mon site Web, j'ai une petite fleur comme favicon ou icône de navigateur. Les paramètres standard pour Squarespace sont d'avoir cette boîte noire et cela n'a pas l'air si agréable. Vous pouvez créer un favicon dans n'importe quel type de logiciel de conception, vous pouvez probablement le créer sur votre iPad ou dans Illustrator, Photoshop, même dans Canvas si vous l'utilisez. Mais comme ce serait une toute autre classe sur la façon de
créer un favicon de toutes ces façons différentes, je vais juste passer par la façon de créer vraiment rapidement un favicon en ligne. Je vais juste Google favicon. J' ai trouvé ce site, favicon.io, où vous pouvez créer un favicon à partir du texte, un fichier PNG à ICO, si vous voulez ce format et à partir d'un emoji. Nous allons simplement en créer un à partir du texte qui est le moyen le plus simple. Peut-être que je veux avoir un M et un F ou juste un M, Maja Faber comme favicon. Je peux sélectionner l'arrière-plan. J' aime le cercle et la taille de la police un peu plus petite afin qu'elle se promène dans ce cercle, vous pouvez changer la police à la police que vous voulez. Utilisons simplement ceci littéralement une police. Je pense que je ferais est d'utiliser un M au lieu d'un M et un F. Ajustez la taille de celui-ci à peut-être 70. La couleur de police que je veux de la lumière et la couleur de fond peut être, peut-être rose. Ensuite, j'ai juste appuyé sur « Télécharger ». Cela téléchargera un fichier zip que j'ai ouvert. Ici, vous avez toutes les favicons différentes que vous pouvez télécharger sur votre site. Revenons à notre site Squarespace, cliquez sur « Accueil », icône design et navigateur et ajoutez favicon. Ici, il est dit, en utilisant le champ ci-dessous, vous pouvez télécharger une icône URL de navigateur pour une utilisation avec votre site. Cette icône peut être au format PNG ou ICO, et sera redimensionnée par le navigateur pour l'afficher dans votre barre d'URL. Remarque, c'est à dire ne prend pas en charge le format PNG. Peut-être que nous devrions choisir le format ICO, il
suffit de cliquer et de le faire glisser, appuyez sur « Enregistrer » et voir à quoi cela ressemble. Peut-être que vous avez besoin de recharger le site. Là, vous avez le favicon ICO. En fait, j'ai l'impression que ça n'a pas l'air si bon. Je vais juste revenir en arrière et nous allons effectivement sélectionner le favicon PNG de toute façon. Je l'ai sur mon site et je pense que cela fonctionne vraiment bien. Je vais faire est d'aller de l'avant et de supprimer celui-ci et faire glisser dans le PNG appuyez « Enregistrer », et actualiser le site. Là, vous avez votre favicon ou icône de navigateur. Comme il est montré si petit, vous ne pouvez vraiment pas voir ce que c'est, mais c'est plus agréable que c'est un peu de couleur au lieu d'une simple boîte noire.
24. BONUS : Page de protection des mots de passe: Dans cette leçon, je vais vous montrer comment ajouter une page protégée par mot de passe. Vous pouvez disposer de certains contenus que vous souhaitez protéger par mot de passe. Pour moi, c'est mon catalogue avec mes illustrations, mes modèles, que je ne montre qu'aux clients potentiels. J' ai donc un catalogue avec plus de 200 modèles qui est sur mon site web mais protégé par un mot de passe. Nous allons simplement créer un duplicata de la page d'accueil, où nous avons déjà une galerie. Cliquez sur les derniers paramètres et dupliquez la page et nommons ce catalogue. Donc, il ressemble exactement comme la page d'accueil pour l'instant. Je l'ai placé sous les pages non liées et je vais juste éditer cette page, supprimer l'Instagram et je peux juste ajouter quelques images pour m'assurer que nous gardons ces pages à part. Si vous créez un catalogue avec le mot de passe comme je l'ai fait, il n'y a vraiment pas de norme pour autant que je sache, comme il est censé ressembler. Ma suggestion et mes conseils sont de le garder aussi simple que
possible parce que ce que vous voulez avec ce catalogue est de vendre votre œuvre d'art, donc vous voulez juste un visiteur ou le client potentiel pour faire
défiler votre page pour être en mesure de voir votre œuvre d'art. Dans mon catalogue, je n'ai pas d'images ou de maquettes, donc je peux simplement les supprimer. Ajoutons juste quelques modèles de plus. Je vais juste appuyer sur « Fermer » et nous pouvons éditer le type de galerie, ce qui en fait peut-être une grille simple avec la même taille des images. Donc peut-être quelque chose comme ça. Si vous créez un catalogue, vous pouvez également choisir de trier vos motifs ou illustrations dans des collections
ou dans quel type de motifs ils sont ou dans quel type de motifs vous souhaitez trier votre catalogue. Mais cette leçon est sur la façon de créer une page protégée par mot de passe. façon dont vous choisissez de concevoir la page de votre catalogue potentiel dépend entièrement de vous. Alors appuyez sur « Enregistrer » et maintenant nous avons notre catalogue ici. Nous pouvons simplement nous assurer que nous avons les bonnes limaces d'URL, alors appuyez sur le catalogue « Paramètres » et URL slug. Ici, nous pouvons choisir d'avoir un mot de passe sur notre page. Utilisons simplement le catalogue de mots de passe et appuyez sur « Enregistrer ». Lorsque vous voyez un petit symbole de verrouillage, vous savez que cette page est protégée par mot de passe. Pour voir à quoi il ressemble lorsque vous essayez d'accéder à ce site, vous allez à l'écran de conception et de verrouillage. Vous pouvez avoir des mots de passe différents pour différentes pages, mais vous ne pouvez avoir qu'une seule mise en page sur votre écran de verrouillage. Par exemple, choisissez quelque chose comme ça, comme une mise en page, puis revenez à l'écran de verrouillage et ici vous pouvez changer la marque. Peut-être que vous voulez votre logo à la place ou juste votre nom et vous pouvez choisir si vous voulez afficher un symbole de verrouillage, alors appuyez sur « Enregistrer », retour et « Média ». Vous pouvez appuyer sur « Aucun », si vous ne voulez pas d'image en arrière-plan et stylisez la couleur de l'arrière-plan. Allons-y pour un rose. Vous pouvez modifier si vous voulez que la bordure de la page. Quel type de serrure vous voulez. La couleur du verrou, le style de mot de passe. C' est un style ? Quelle police vous voulez dans la zone de mot de passe ? Il suffit de choisir le même que sur notre site et appuyez sur « Enregistrer ». Donc, là, vous avez votre page protégée par mot de passe. Ceci est un écran de verrouillage général, donc il apparaîtra sur toutes les pages que vous avez verrouillées avec le mot de passe. La différence est que vous pouvez utiliser un mot de passe différent sur toutes les pages. C' est ainsi que vous créez une page protégée par mot de passe.
25. BONUS : Créer de nouvelles pages: Dans cette leçon, je vais vous montrer comment ajouter de nouvelles pages à votre modèle. Dans cette classe, nous nous concentrons principalement sur l'utilisation du modèle que nous avons choisi. Parce que je sens que si vous êtes un débutant Squarespace, c'est un bon début pour ne pas le rendre trop compliqué. Mais si vous voulez ajouter des pages, je vais vous montrer comment faire cela. Comme je l'ai mentionné précédemment, vous avez la navigation principale sous Pages non liées. Si vous ajoutez une page à la navigation principale, elle apparaîtra dans votre navigation. Si vous ajoutez une page à Non lié, vous ne pouvez pas la trouver dans votre barre de navigation. Vous pouvez le trouver via un lien ou URL Slug. Vous pouvez faire glisser et déposer les pages de la navigation principale vers Non lié. Peu importe l'endroit où vous créez votre page. Commençons simplement par la façon de créer une nouvelle page. Si vous êtes débutant à Squarespace,
ce que je suppose si vous prenez ce cours, je trouve qu'il est plus facile de commencer par une mise en page. Cliquez sur Mise en page. Ici, vous avez toutes les pages que vous pouvez utiliser comme modèles. Nous avons les pages générales, rendez-vous sur la page, le contact, les services, galerie, l'équipe, les commentaires, le menu, RSVP, la FAQ, la politique de confidentialité et les conditions d'utilisation. Allons simplement pour général et voir quel type de pages nous avons à choisir ici. Commençons par ce général 2 et voyons à quoi cela ressemble. Lorsque vous cliquez sur une mise en page, vous obtiendrez la mise en page complète de cette page. Vous pouvez bien sûr le modifier comme vous le souhaitez. Si vous voulez faire cela, vous cliquez sur Modifier, puis vous allez dans différentes sections et les modifier. Vous pouvez survoler, changer l'image, par
exemple, comme nous l'avons fait dans les leçons précédentes. Vous pouvez formater cette section avec n'importe quelle hauteur, est la hauteur de la section et la largeur du contenu. En outre, vous pouvez changer les couleurs si vous souhaitez un thème de section différent. Allons juste pour le minimum de lumière pour celui-là. Si vous souhaitez ajouter une section à votre mise en page, vous cliquez sur le signe plus et ajoutez une section. Ajoutons simplement cette liste. Vous pouvez entrer et modifier les sections comme vous le souhaitez. Changez la police, l'en-tête, un paragraphe en quelque chose que vous trouvez bien. Changeons aussi cette image et voyons ce que nous pouvons trouver. Peut-être à cette image. Comme vous pouvez le voir, vous avez un peu de superposition dans cette image, qui signifie qu'elle ne montre pas ses vraies couleurs. Il a une superposition sur l'image. Si vous ne voulez pas superposer, nous devons entrer dans le style de conception, les
couleurs, les thèmes de section, et c'est pourquoi c'est minime. Cliquez sur votre bloc d'image. Ici, vous pouvez modifier la superposition de l'image. Si vous faites glisser votre superposition d'image vers le côté transparent, vous n'obtiendrez aucune superposition sur vos images dans le bloc d'image. Choc dans le thème de la section minimale blanche. Appuyez sur Enregistrer et revenez en arrière. Vous pouvez également modifier votre peinture en ajoutant des blocs. Je vous ai montré comment ajouter des sections en cliquant sur le signe plus. Si vous cliquez sur le petit symbole de dépôt qui apparaît lorsque vous survolez quelque chose, vous pouvez ajouter des blocs. Cliquez sur le petit signe de dépôt, et ici vous pouvez ajouter tous les blocs. Ajoutons simplement un bloc de texte. Modifiez l'alignement au centre et écrivez quelque chose ici. Vous pouvez changer le style de paragraphe, peut-être quelque chose comme ça. Là, vous avez ajouté un bloc dans votre section. Toucher fait, et sauver. Si vous déplacez votre page vers la section non liée, elle ne s'affichera pas dans le menu. Alors ajoutons une autre page. Vous pouvez également commencer par une page blanche, bien sûr. Mais je pense qu'une mise en page est bonne si vous êtes un débutant. Allons pour une page de révision peut-être et examiner 2, cliquez sur le mode plein écran pour voir à quoi cela ressemble. Peut-être que vous voulez ajouter une image ou quelque chose ici pour le rendre un peu plus intéressant. Ajoutons simplement celui-là. Ajoutons simplement une image de Unsplash et appliquons. Peut-être que tu veux enlever quelque chose. Vous survolez ce bloc et cliquez sur la petite poubelle. Appuyez sur Terminé et sauvegardez. Fondamentalement, vous pouvez commencer avec la mise en page et ajouter
des blocs à votre mise en page pour la personnaliser comme vous le souhaitez. Traînons ça aussi. Que faire si vous avez une boutique en dehors de votre page Web, comme une boutique Etsy ou Society6 shop ou quelque chose comme ça. Eh bien, alors vous pouvez ajouter un lien. Vous cliquez sur le petit signe plus et ajoutez le lien. Disons magasin. Nous pouvons ajouter notre boutique en ligne préférée de la société de design. Faites glisser cela vers le bas afin que nous l'ayons à la fin de la navigation. Ensuite, je vais simplement cliquer sur Accueil plein écran et essayer de cliquer sur boutique et voir ce qui se passe. Cela m'amènerait à un lien externe en dehors du site Web. La dernière chose que je voulais vous montrer sur la façon d'ajouter des pages est comment ajouter plus de pages sous un seul titre dans la navigation. Cliquez sur le dossier. Appelons juste les nouvelles. Faites glisser le curseur vers le bas jusqu'à la fin de la navigation, puis faites glisser les pages vers votre dossier. Ajoutons celui-là et celui-là, à la maison. Maintenant, comme vous pouvez le voir, vous avez une navigation qui apparaît sous votre dossier. Si vous survolez les actualités, vous pouvez cliquer sur les pages qui se trouvent en dessous et les trouver dans le menu. Faisons simplement glisser le dossier de nouvelles parce que nous voulons l'utiliser. Cliquez sur la page d'accueil. Là, nous avons notre site web. Vous pouvez en savoir plus sur l'ajout de nouvelles pages. Vous pouvez ajouter des magasins que je ne passerai pas dans cette classe parce que vous avez besoin d'un plan commercial ou commercial. Vous pouvez ajouter des événements et des portefeuilles que je vous ai montrés plus tôt dans la classe, pages
blanches, la mise en page, les dossiers et les liens.
26. Publiez votre site Web: Maintenant, nous avons créé tout
notre site Web de portefeuille et nous avons terminé et tout ce que nous avons à faire est de le publier. Je vais vous montrer comment le publier,
mais je ne publierai pas mon site car alors je dois payer pour un abonnement et un domaine. Je vais vous montrer comment vous pouvez publier le vôtre. Cliquez sur « Accueil », « Paramètres », « Disponibilité du site », puis cliquez sur « Mise à niveau pour publier ». Ici, vous allez sélectionner votre plan et tout, puis vous pouvez publier votre site lorsque vous vous inscrivez à un plan. Je vais simplement cliquer sur « Retour » et vous montrer où vous allez connecter votre domaine. Vous obtiendrez un domaine intégré, qui est un domaine étrange, crocodile-cello-yaak-squarespace.com. Vous pouvez le personnaliser si vous le souhaitez, mais vous aurez toujours le squarespace.com à la fin. Essayons de le renommer en majasquarespace.com. Vous pouvez réellement utiliser ce domaine si vous le souhaitez, il n'expire jamais. Ça ne coûte rien. Vous pouvez également utiliser un domaine que vous possédez. Vous pouvez en savoir plus sur la façon de connecter cela ici. Je l'ai déjà fait,
ce n'est pas si dur, mais il faut un peu de patience pour passer à travers toutes les étapes. Vous pouvez également obtenir un domaine via Squarespace, ce qui est génial car alors vous aurez toutes les factures de votre site Web dans Squarespace. C' est ce que j'ai fait avec mes sites Web. J' ai acheté le domaine via Squarespace. Vous pouvez choisir votre domaine et cliquer sur « Ajouter ». Pour plus d'informations à ce sujet, vous pouvez consulter le centre d'aide Squarespace, dont je vous montrerai plus dans la prochaine leçon. Il n'est pas difficile de connecter le domaine. Si vous n'avez pas déjà de domaine, je vous suggère de l'acheter via Squarespace parce que cela rend tout cela beaucoup plus facile. Ce n'est pas si difficile de connecter le domaine si vous en avez déjà un.
27. Assistance et questions: Je voulais juste prendre ce temps pour
passer par le centre de soutien et d'aide Squarespace avec vous. Parce que je ne suis pas un soutien de Squarespace. J' ai construit quelques sites web avec Squarespace et je connais mon chemin. Mais dans cette classe, je vous montre les bases sur la façon de créer un site Web de portefeuille simple. Si vous voulez connaître des techniques plus avancées et avoir des questions spécifiques, vous devriez consulter le centre d'aide Squarespace. Lorsque vous êtes connecté,
vous pouvez accéder au centre d'aide Squarespace en cliquant sur « Aide » dans le menu, puis sur « Base de connaissances ». Ici, vous avez un tas de guides ou vous pouvez rechercher quelques mots clés si vous voulez avoir de l'aide avec quelque chose de spécifique. Disons que je veux de l'aide avec les blocs d'image. Vous pouvez cliquer sur l'article sur les blocs d'image. Vous pouvez voir si vous faites défiler vers le bas que cette vidéo s'applique à Squarespace version 7.0. C' était la version précédente de Squarespace. Cela peut signifier que ce guide d'aide est le même
pour l'ancienne version de Squarespace et la nouvelle version de Squarespace. La nouvelle version s'appelle 7.1. Vous pouvez voir ici si vous faites défiler vers le bas que la mise en page
en ligne prend en charge un style de légende défini par styles de section, version 7.1 ou modèle version 7.0. J' ai trouvé que Squarespace vient mettre à jour leur centre d'aide et d'ajouter l'aide pour 7.1, la nouvelle version de Squarespace. Vous pouvez trouver ces informations sur les différentes pages. Cliquez simplement sur une autre page, Blogging, par
exemple ; Blogging avec Squarespace et voir à quoi cela ressemble. Ici, ils ont la version 7.1 et vous pouvez également cliquer sur la version 7.0. La version 7.1 est ce que vous voulez lire,
modèles et conceptions, travailler avec des modèles. Ici, il est dit, ce guide est pour la version 7.0. Toutes les diapositives de la version 7.1 partagent le même modèle. Pour en savoir plus, visitez Squarespace 7.1. Vous devez vous assurer que vous lisez à propos de la version que vous utilisez, qui est la 7.1 que nous utilisons dans cette classe. Mais vous avez tellement d'informations ici que vous pouvez accéder. Vous pouvez également consulter la communauté où vous pourriez obtenir de l'aide pour votre réponse. Vous pouvez participer à notre webinaire et si vous ne trouvez pas ce que vous cherchez, vous pouvez contacter un conseiller, alors cliquez sur « Contactez-nous ». Ici, vous pouvez sélectionner le sujet de votre question. Choisissez un sujet. Disons que Blocks et vous obtiendrez ces articles. Si vous ne trouvez toujours pas ce que vous cherchez, vous pouvez envoyer un e-mail à Squarespace ou vous pouvez discuter en direct. En ce moment, le chat en direct est fermé. Mais pour moi, cela a été vraiment utile. Donc, le chat en direct est un service gratuit et aussi l'e-mail. Mais avec le chat en direct, vous pouvez vérifier avec le support et ils peuvent vous aider à trouver les réponses aux questions que vous ne pouvez pas trouver dans les articles préfabriqués.
28. Réflexions finales: C' est tout pour ce cours. J' espère que vous avez trouvé cette classe utile et motivante dans la création de votre propre site Web de portefeuille. Comme je l'ai mentionné plus tôt en classe, il n'a pas besoin de prendre des mois pour créer un site Web et vous n'
avez pas besoin de créer un site Web vraiment personnalisé et unique en tant que créatif. Il est correct de créer le site Web à partir d'un modèle. C' est l'art que vous créez que vous voulez montrer, pas vos compétences de conception Web. Cela dit, merci beaucoup d'avoir regardé. Si vous aimez cette classe, appuyez sur le bouton « Suivre » par mon nom ci-dessous. Si vous avez des questions, s'il vous plaît les poser sur la page Communauté ici en classe. N' hésitez pas à laisser un commentaire pour me faire savoir si vous avez apprécié ce cours, j'aimerais entendre vos pensées. Assurez-vous également que vous partagez votre projet. Si vous publiez votre projet sur Instagram, n'hésitez pas à me étiqueter @maja_faber. Merci encore d'avoir regardé.