Bonjour ! Je suis ravi de vous aider à créer un outil web utile et complet pour la niche Workflow jamais exécuté : YouTube Shorts Script + Description.
Voici une proposition d’outil qui répond aux exigences :
**Nom du projet :** JamEx ( Workflow jamais exécuté : YouTube Shorts Script + Description)
**Description :**
JamEx est un outil web pratique et complet pour les workflow jamais exécutés. Il permet de générer un script et une description pour vos vidéos YouTube Shorts en quelques clics. L’outil est entièrement fonctionnel sans backend, ce qui signifie que vous pouvez le utiliser de n’importe où, à tout moment.
**HTML :**
« `html
Script
Description
La description de votre vidéo sera générée automatiquement en fonction du titre et de la description saisies ci-dessus.
Appel à l’action
Affichez le lien de votre vidéo sur les réseaux sociaux : LinkedIn, Twitter, etc.
« `
**CSS ( dans le fichier style.css ) :**
« `css
body {
font-family: Arial, sans-serif;
background-color: #f0f0f0;
}
header {
background-color: #333;
color: #fff;
padding: 1em;
text-align: center;
}
nav ul {
list-style: none;
margin: 0;
padding: 0;
}
nav li {
display: inline-block;
margin-right: 20px;
}
nav a {
color: #fff;
text-decoration: none;
}
main {
max-width: 800px;
margin: 40px auto;
background-color: #fff;
padding: 20px;
border-radius: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
section {
background-color: #f7f7f7;
margin-bottom: 20px;
padding: 20px;
border-radius: 10px;
}
h2 {
color: #333;
font-weight: bold;
margin-top: 0;
}
form {
display: flex;
flex-direction: column;
}
label {
margin-bottom: 10px;
}
input, textarea {
width: 100%;
padding: 10px;
border: none;
border-radius: 10px;
}
button[type= »submit »] {
background-color: #333;
color: #fff;
border: none;
padding: 10px 20px;
font-size: 16px;
cursor: pointer;
}
#generate-script-btn {
background-color: #4CAF50;
}
#script-output {
padding: 20px;
}
« `
**JS ( dans le fichier script.js ) :**
« `javascript
const titleInput = document.getElementById(‘title’);
const descriptionInput = document.getElementById(‘description’);
const generateScriptBtn = document.getElementById(‘generate-script-btn’);
const scriptOutput = document.getElementById(‘script-output’);
generateScriptBtn.addEventListener(‘click’, () => {
const title = titleInput.value.trim();
const description = descriptionInput.value.trim();
if (title && description) {
const script = `Titre de la vidéo : ${title}\n\n${description}`;
scriptOutput.innerHTML = `
${script}
`;
} else {
alert(‘Veuillez remplir les champs « Titre » et « Description » !’);
}
});
« `
Ce code HTML, CSS et JavaScript créent une page web moderne et responsive qui permet de générer un script et une description pour vos vidéos YouTube Shorts. L’outil est entièrement fonctionnel sans backend et inclut un appel à l’action vers le site principal.
Notez que vous devrez adapter les styles et les fonctionnalités en fonction de vos besoins spécifiques.
J’espère que cela vous aidera ! N’hésitez pas à me poser d’autres questions si nécessaire.