====== Formation Webmaster - Wordpress ====== ===== Introduction ===== Il existe de multiples manières de créer un site web. Parmi elles, des solutions partiques et toutes faites comme Wix, d'autres qui nécessites des compétences qui s'aquièrent au fil des [[formations:devweb_1|Devweb du GInfo]] ou encore des gestionnaires de contenu comme Shopify, Drupal, Joomla ou **Wordpress**. C'est de dernier auquel nous allons nous intéresser ! **Prérequis** : Demander à votre prédecesseur les identifiants de connexion au site de votre asso ! ===== HTML ===== ==== Notre première page ==== Rappel de [[formations:devweb_1]]. La base d'une page html Un titre de page Bonjour.
Ceci est mon contenu
Si vous enregistrez le fichier et que vous ouvrez le fichier avec un navigateur, vous devriez voir ceci. {{:formations:capture_d_e_cran_2017-10-26_a_23.32.55.png?200|}} -> La ligne contenant **** explique au navigateur que la page contient du html répondant à la norme HTML5 -> La balise **** contient diverses informations qui ne seront pas vues par l'utilisateur directement, mais qui pourront être utile au navigateur pour interpréter la page; ici on peut voir que la balise contient le titre de la page et le codage du texte (UTF-8). -> La balise **** contient tout le contenu de la page. Vous aurez deviné que la balise **
** est une balise permettant de sauter une ligne, elle est dite de balise de structuration de texte. ==== Les balises ==== Modifier une police : Texte en gras Texte en italique Mettre une image : Mettre une musique : Mettre une vidéo : Mettre un lien : Lien cliquable Créer un bloc :
Un bloc
Créer un paragraphe :

Contenu paragraphe

Créer un titre :

Le titre les + important

Le titre les - important
Importer un fichier de style (css) : Passer une ligne :
Rappel sur [[https://fr.w3docs.com/apprendre-html/mise-en-forme-html.html|W3School]] ===== CSS ===== ==== Sélection des éléments HTML ==== Rappel de [[formations:devweb_1]] & [[formations:devweb_2]]. Voyons rapidement ensemble les bases du CSS ! Pour sélectionner un élément, vous aurez besoin des id et des classes
Bloc 1
Bloc 2
Bloc 3
Ici, Le bloc 2 et le bloc 3 hériteront du même style car le sélecteur "class" est identique. **Mais au fait... comment on écrit du style ?** ==== Écrire du style ==== Trois façons de faire : - Dans un fichier externe - Dans la balise HTML avec l'attribut : style="" - Dans une balise ===== Wordpress - Partie pratique ===== ==== Créer et modifier une page ==== === Connectez vous à votre site WordPress === L'adresse URL de votre site associatif est de la forme **nom_association.asso.centrale-marseille.fr** Pour modifier votre site WordPress ajoutez '/wp-admin' à la fin de l'URL : **nom_association.asso.centrale-marseille.fr/wp-admin** {{ :tutoriels:identification_wp.png?nolink |}} Identifiez vous à l'aide de votre identifiant/adresse mail et de votre mot de passe ou avec la connexion via My. Si vous n'avez pas vos identifiants, contactez vos prédécesseurs ! Si vos prédécesseurs ont définitivement perdus vos identifiants, contactez le GInfo, et/ou en particulier le président ou le respo réseau de ce dernier === Sélectionnez la page à modifier dans votre espace d'administration WordPress === Vous êtes maintenant dans l'interface de gestion de votre WordPress. Dans le menu principal de gauche, cliquez sur l'onglet "Pages". La liste de toutes les pages de votre site apparaît alors. {{ :tutoriels:pages_wp.png?nolink |}} === Créer une page vierge === === Dupliquer une page existante de votre asso === ==== Modifier un utilisateur ==== ==== Changer le thème ====