Documentation

Bienvenue dans la documentation de Script.js

Installation

Pour utiliser Script.js, vous avez deux options :

Télécharger le fichier JS

Vous pouvez télécharger le fichier JS de Script.js et ses dépendances pour l'inclure dans votre projet.

  • <script src="header.js"></script>

  • <script src="footer.js"></script>

  • <script src="switch-mode.js"></script>

Utiliser le CDN

Vous pouvez également utiliser le CDN de Script.js pour inclure le framework dans votre projet.

  • <link rel="stylesheet" href="https://script-js.untypequicode.fr/js/header.js">

  • <link rel="stylesheet" href="https://script-js.untypequicode.fr/js/footer.js">

  • <link rel="stylesheet" href="https://script-js.untypequicode.fr/js/switch-mode.js">

Les possibilités de Script.js

La gestion du header

Accéder au script du header

Télécharger le fichier JS

<script src="header.js"></script>

Utiliser le CDN

<link rel="stylesheet" href="https://script-js.untypequicode.fr/js/header.js">

Gestion du header

Vous pouvez gérer le menu, le logo, le dark mode et les réseaux sociaux du header :

Le contenu du menu du header

Vous pouvez modifier le contenu du menu du header en modifiant le tableau db_header :

const db_header = [
{ text: "Accueil", url: "index", },
{ text: "A propos", url: "a-propos", } ];

La valeur texte correspond au texte du lien et la valeur url correspond à l'URL du lien.

Le contenu du logo du header

Vous pouvez modifier le contenu du logo du header en modifiant le tableau logo :

const logo = {
type: "text",
content: "script.js",
link: "https://script-js.untypequicode.fr",
index: "Accueil", }

La valeur type correspond au type de contenu du logo. Il est possible de choisir entre text, image. et imagetext.

La valeur content correspond au contenu du logo. Si le type est text, il s'agit du texte du logo. Si le type est image, il s'agit de l'URL de l'image du logo. Si le type est imagetext, il s'agit du texte du logo et de l'URL de l'image du logo sous la forme ["images/favicon.svg", "script.js"]

La valeur link correspond à l'URL du lien du logo.

Le dark mode du header

Vous pouvez activer le dark mode du header en modifiant la valeur switch_mode :

const switch_mode = "true"

La valeur true active le dark mode et la valeur false désactive le dark mode.

Les liens du header

Vous pouvez modifier les liens du header en modifiant le tableau db_header_link :

const db_header_link = [ { text: "GitHub", url: "https://github.com/untypequicode/script.js", content: `` } ]

La valeur text correspond au texte du lien, la valeur url correspond à l'URL du lien et la valeur content correspond au contenu du lien.

Ajout du système de dark mode

Télécharger le fichier JS

<script src="switch-mode.js"></script>

Utiliser le CDN

<link rel="stylesheet" href="https://script-js.untypequicode.fr/js/switch-mode.js">

Accéder au script du footer

Télécharger le fichier JS

<script src="footer.js"></script>

Utiliser le CDN

<link rel="stylesheet" href="https://script-js.untypequicode.fr/js/footer.js">

Gestion du footer

Vous pouvez gérer le texte et le lien du footer :

Le contenu du footer

Vous pouvez modifier le contenu du footer en modifiant le tableau db_footer :

const db_footer = {
left: { content: 'Copyright \u00A9 2024 Script.js | Tous droits réservés.',
link: 'mentions-legales' } }

La valeur content correspond au texte du footer et la valeur link correspond à l'URL du lien du footer.