Exercice de Grammaire: Les Articles et leur Omission en Français

Dejar un comentario / articles, exercices, français, Grammaire / Por

body {
font-family: ‘Segoe UI’, Tahoma, Geneva, Verdana, sans-serif;
max-width: 100%;
margin: 0 auto;
padding: 20px;
background-color: #f9f9f9;
}
h1, h2, h3 {
color: #2c3e50;
}
.container {
background-color: white;
padding: 30px;
max-width: 100%;
border-radius: 10px;
box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}
.subscription-form {
background-color: #e8f4f8;
padding: 20px;
border-radius: 8px;
margin-bottom: 30px;
}
.exercise-container {
display: none;
}
.form-group {
margin-bottom: 15px;
}
label {
display: block;
margin-bottom: 5px;
font-weight: bold;
}
input, select {
width: 100%;
padding: 10px;
border: 1px solid #ddd;
border-radius: 4px;
font-size: 16px;
}
button {
background-color: #3498db;
color: white;
border: none;
padding: 12px 20px;
border-radius: 4px;
cursor: pointer;
font-size: 16px;
transition: background-color 0.3s;
}
button:hover {
background-color: #2980b9;
}
.exercise-text {
line-height: 2;
font-size: 18px;
}
.gap {
border-bottom: 1px solid #333;
padding: 0 5px;
margin: 0 3px;
min-width: 50px;
display: inline-block;
}
input.gap-input {
width: 80px;
border: none;
border-bottom: 1px solid #333;
font-size: 16px;
text-align: center;
}
.result {
margin-top: 30px;
padding: 20px;
background-color: #eafaf1;
border-radius: 8px;
display: none;
}
.certificate {
text-align: center;
margin-top: 30px;
padding: 20px;
border: 2px solid #2c3e50;
border-radius: 8px;
display: none;
}
.difficulty-selector {
margin-bottom: 20px;
}
.error {
color: red;
font-size: 14px;
}
#certificatePreview {
position: relative;
width: 100%;
height: 100%;
background-color: #fff;
border: 10px solid transparent;
border-image: linear-gradient(45deg, #f39c12, #e67e22, #d35400, #c0392b, #e74c3c) 1;
box-sizing: border-box;
overflow: hidden;
}
.certificate-background {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0.07;
z-index: 0;
background-position: center;
background-repeat: no-repeat;
background-size: 70%;
}
.certificate-content {
position: relative;
z-index: 1;
padding: 20px;
width: 100%;
height: 100%;
box-sizing: border-box;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.certificate-header {
display: flex;
justify-content: space-between;
align-items: flex-start;
}
.certificate-title {
flex-grow: 1;
text-align: center;
}
.certificate-logo {
width: 120px;
height: 60px;
}
.certificate-footer {
display: flex;
justify-content: space-between;
align-items: flex-end;
}
.certificate-qr {
width: 120px;
height: 120px;
display: flex;
justify-content: center;
align-items: center;
}
.certificate-qr img {
max-width: 100%;
max-height: 100%;
}
.certificate-signature {
flex-grow: 1;
text-align: center;
}
.triangle-pattern {
position: absolute;
width: 150px;
height: 120px;
}
.triangle-pattern.top-right {
top: 0;
right: 0;
}
.triangle-pattern.bottom-left {
bottom: 0;
left: 0;
}
.article-tip {
background-color: #fff3cd;
border-left: 5px solid #ffc107;
padding: 10px;
margin-bottom: 20px;
border-radius: 0 5px 5px 0;
}
.article-tip-title {
font-weight: bold;
margin-bottom: 5px;
}

Exercice de Grammaire: Les Articles et leur Omission en Français

Inscrivez-vous pour commencer l’exercice

Veuillez vous abonner et remplir vos informations pour accéder à l’exercice.

Complétez le texte avec les articles appropriés ou laissez vide s’il n’y a pas d’article

Aide-mémoire des articles français:

Articles définis: le, la, l’, les
Articles indéfinis: un, une, des
Articles partitifs: du, de la, de l’
Articles contractés: au (à + le), aux (à + les), du (de + le), des (de + les)
Omission de l’article: laissez la case vide quand aucun article n’est nécessaire

Choisissez le niveau de difficulté:

Facile
Moyen
Difficile

Les Articles en Français (Niveau Facile)
Je vais souvent à plage en été. J’aime soleil et mer. Ce matin, j’ai mangé pain avec confiture. Mon frère préfère manger sans sucre, il prend donc fruits frais.

enfants aiment jouer dans sable. Ma fille va à école tous jours sauf dimanche. Elle a amis sympathiques. Ils parlent français et anglais couramment.

Nous aimons voyager en France et visiter monuments historiques. année dernière, nous sommes allés musée du Louvre. Il y avait touristes venus monde entier. Tour Eiffel est monument emblématique de Paris. Mon père aime boire café noir sans sucre.

Les Articles en Français (Niveau Moyen)
Pour apprendre français, il faut pratiquer tous les jours. grammaire française a règles complexes concernant utilisation articles. Par exemple, après plupart des prépositions de lieu, on utilise articles définis. Mais après “en”, on met généralement rien.

J’ai acheté livres pour améliorer mon vocabulaire. Je lis deux heures par jour. lecture est activité importante pour maîtriser langue étrangère. Il y a expressions idiomatiques qui n’existent pas dans autres langues.

professeur nous a demandé d’écrire dissertation sur avantages de apprentissage langues étrangères. J’ai mal à trouver idées originales. Je pense rentrer demain pour travailler avec amis.

Les Articles en Français (Niveau Difficile)
Dans étude langues, question articles pose souvent problèmes apprenants. En français, on emploie articles dans situations où autres langues n’en utilisent pas. Par exemple, on dit “J’aime café” mais en anglais, “I like coffee” (sans article).

omission article se produit dans plusieurs cas: après certaines prépositions comme “sans” ( argent), dans expressions figées (avoir faim), avec noms de pays masculins (en Italie, mais États-Unis), et après dans phrases négatives.

Il travaille comme professeur français à université. Quand on parle livres intéressants, je pense toujours à littérature française du XIXe siècle.

Résultat

Certificat de Réussite

Exercice de Grammaire: Les Articles et leur Omission en Français

Ce certificat atteste que

a complété avec succès l’exercice sur les articles en français

Score: / 100

Niveau:

Date:

________________________________

Signature du Professeur

// Variables globales
let currentDifficulty = ‘facile’;
let userInfo = {
prenom: ”,
nom: ”,
email: ”
};

// Logo FrenchGuru en SVG
const frenchguru_logo_svg = `

`;

// Attente que le DOM soit chargé
document.addEventListener(‘DOMContentLoaded’, function() {
// Éléments du DOM
const startButton = document.getElementById(‘startButton’);
const changeDifficultyButton = document.getElementById(‘changeDifficultyButton’);
const checkButton = document.getElementById(‘checkButton’);
const generatePdfButton = document.getElementById(‘generatePdfButton’);
const difficultySelect = document.getElementById(‘difficultySelect’);

// Définir l’arrière-plan du certificat
const certificateBackground = document.querySelector(‘.certificate-background’);
certificateBackground.style.backgroundImage = `url(‘data:image/svg+xml;base64,${btoa(frenchguru_logo_svg)}’)`;

// Ajouter les logos SVG
const headerLogo = document.getElementById(‘certificateHeaderLogo’);
const footerLogo = document.getElementById(‘certificateFooterLogo’);
headerLogo.innerHTML = frenchguru_logo_svg;
footerLogo.innerHTML = frenchguru_logo_svg;

// Ajouter aussi le logo au container caché pour l’exportation PDF
document.getElementById(‘logoSvgContainer’).innerHTML = frenchguru_logo_svg;

// Ajout des écouteurs d’événements
startButton.addEventListener(‘click’, startExercise);
changeDifficultyButton.addEventListener(‘click’, changeDifficulty);
checkButton.addEventListener(‘click’, checkAnswers);
generatePdfButton.addEventListener(‘click’, generatePdf);

// Générer le QR code
function generateQRCode() {
const qrCodeContainer = document.getElementById(‘qrCodeContainer’);
qrCodeContainer.innerHTML = ”;

try {
// Version du QR code (1-40) avec un niveau de correction d’erreur ‘L’
var qr = qrcode(4, ‘L’);
qr.addData(‘https://frenchguru.com’);
qr.make();

qrCodeContainer.innerHTML = qr.createImgTag(4);
} catch (error) {
console.error(“Erreur lors de la génération du QR code:”, error);
// Fallback si la génération du QR code échoue
qrCodeContainer.innerHTML = ‘

QR Code

‘;
}
}

// Fonction pour démarrer l’exercice
function startExercise() {
// Validation des champs
const prenom = document.getElementById(‘prenom’).value.trim();
const nom = document.getElementById(‘nom’).value.trim();
const email = document.getElementById(‘email’).value.trim();
const subscribe = document.getElementById(‘subscribe’).checked;

// Réinitialisation des messages d’erreur
document.getElementById(‘prenomError’).textContent = ”;
document.getElementById(‘nomError’).textContent = ”;
document.getElementById(‘emailError’).textContent = ”;
document.getElementById(‘subscribeError’).textContent = ”;

let isValid = true;

// Vérification des champs
if (!prenom) {
document.getElementById(‘prenomError’).textContent = ‘Veuillez entrer votre prénom.’;
isValid = false;
}

if (!nom) {
document.getElementById(‘nomError’).textContent = ‘Veuillez entrer votre nom.’;
isValid = false;
}

if (!email) {
document.getElementById(‘emailError’).textContent = ‘Veuillez entrer votre email.’;
isValid = false;
} else if (!isValidEmail(email)) {
document.getElementById(‘emailError’).textContent = ‘Veuillez entrer un email valide.’;
isValid = false;
}

if (!subscribe) {
document.getElementById(‘subscribeError’).textContent = ‘Vous devez vous abonner pour continuer.’;
isValid = false;
}

if (isValid) {
// Enregistrement des informations de l’utilisateur
userInfo.prenom = prenom;
userInfo.nom = nom;
userInfo.email = email;

// Affichage de l’exercice
document.getElementById(‘subscriptionForm’).style.display = ‘none’;
document.getElementById(‘exerciseContainer’).style.display = ‘block’;

// Affichage de l’exercice du niveau sélectionné
showExercise(currentDifficulty);
}
}

// Validation d’email simple
function isValidEmail(email) {
const re = /^[^s@]+@[^s@]+.[^s@]+$/;
return re.test(email);
}

// Fonction pour changer le niveau de difficulté
function changeDifficulty() {
const newDifficulty = difficultySelect.value;
showExercise(newDifficulty);
currentDifficulty = newDifficulty;

// Réinitialiser les champs de saisie
const inputs = document.querySelectorAll(‘.gap-input’);
inputs.forEach(input => {
input.value = ”;
input.style.backgroundColor = ”;
});

// Cacher le résultat
document.getElementById(‘resultContainer’).style.display = ‘none’;
document.getElementById(‘certificatePreview’).style.display = ‘none’;
}

// Fonction pour afficher l’exercice sélectionné
function showExercise(difficulty) {
document.getElementById(‘exerciseFacile’).style.display = ‘none’;
document.getElementById(‘exerciseMoyen’).style.display = ‘none’;
document.getElementById(‘exerciseDifficile’).style.display = ‘none’;

document.getElementById(‘exercise’ + difficulty.charAt(0).toUpperCase() + difficulty.slice(1)).style.display = ‘block’;
}

// Fonction pour vérifier les réponses
function checkAnswers() {
const inputs = document.querySelectorAll(‘#exercise’ + currentDifficulty.charAt(0).toUpperCase() + currentDifficulty.slice(1) + ‘ .gap-input’);
let correctAnswers = 0;

inputs.forEach(input => {
const userAnswer = input.value.trim();
const correctAnswer = input.getAttribute(‘data-answer’);

if ((userAnswer.toLowerCase() === correctAnswer.toLowerCase()) ||
(correctAnswer === “” && userAnswer === “”)) {
input.style.backgroundColor = ‘#d4edda’;
correctAnswers++;
} else {
input.style.backgroundColor = ‘#f8d7da’;
}
});

// Calcul du score
const score = Math.round((correctAnswers / 25) * 100);

// Affichage du résultat
document.getElementById(‘scoreDisplay’).textContent = `Votre score est de ${score}% (${correctAnswers} réponses correctes sur 25)`;
document.getElementById(‘resultContainer’).style.display = ‘block’;

// Prévisualisation du certificat
document.getElementById(‘certificateNamePreview’).textContent = `${userInfo.prenom} ${userInfo.nom}`;
document.getElementById(‘certificateScorePreview’).textContent = `${score}`;
document.getElementById(‘certificateLevelPreview’).textContent = currentDifficulty.charAt(0).toUpperCase() + currentDifficulty.slice(1);
document.getElementById(‘certificateDatePreview’).textContent = new Date().toLocaleDateString(‘fr-FR’);
document.getElementById(‘certificatePreview’).style.display = ‘block’;

// Générer le QR code
generateQRCode();
}

// Fonction pour générer le PDF du certificat
function generatePdf() {
if (typeof jspdf === ‘undefined’ || typeof jspdf.jsPDF === ‘undefined’) {
alert(‘La bibliothèque jsPDF n’est pas chargée correctement. Veuillez réessayer plus tard.’);
return;
}

try {
// Créer un nouveau document PDF
const { jsPDF } = window.jspdf;
const doc = new jsPDF(‘l’, ‘mm’, ‘a4’);

// Dimensions du document
const pageWidth = doc.internal.pageSize.getWidth();
const pageHeight = doc.internal.pageSize.getHeight();

// Ajouter un fond
doc.setFillColor(240, 240, 240);
doc.rect(0, 0, pageWidth, pageHeight, ‘F’);

// Ajouter une bordure décorative
doc.setDrawColor(66, 133, 244);
doc.setLineWidth(5);
doc.rect(10, 10, pageWidth – 20, pageHeight – 20, ‘S’);

// Titre du certificat
doc.setFontSize(24);
doc.setFont(‘helvetica’, ‘bold’);
doc.setTextColor(44, 62, 80);
doc.text(‘Certificat de Réussite’, pageWidth / 2, 30, { align: ‘center’ });

// Sous-titre
doc.setFontSize(16);
doc.setFont(‘helvetica’, ‘normal’);
doc.text(‘Exercice de Grammaire: Les Articles et leur Omission en Français’, pageWidth / 2, 40, { align: ‘center’ });

// Informations du certificat
doc.setFontSize(12);
doc.text(‘Ce certificat atteste que’, pageWidth / 2, 60, { align: ‘center’ });

// Nom de l’utilisateur
doc.setFontSize(20);
doc.setFont(‘helvetica’, ‘bold’);
doc.text(`${userInfo.prenom} ${userInfo.nom}`, pageWidth / 2, 70, { align: ‘center’ });

// Informations supplémentaires
doc.setFontSize(12);
doc.setFont(‘helvetica’, ‘normal’);
doc.text(‘a complété avec succès l’exercice sur les articles en français’, pageWidth / 2, 80, { align: ‘center’ });

// Score et niveau
const score = document.getElementById(‘certificateScorePreview’).textContent;
const level = document.getElementById(‘certificateLevelPreview’).textContent;
doc.text(`Score: ${score} / 100`, pageWidth / 2, 95, { align: ‘center’ });
doc.text(`Niveau: ${level}`, pageWidth / 2, 105, { align: ‘center’ });
doc.text(`Date: ${new Date().toLocaleDateString(‘fr-FR’)}`, pageWidth / 2, 115, { align: ‘center’ });

// Signature
doc.line(pageWidth / 2 – 30, 150, pageWidth / 2 + 30, 150);
doc.text(‘Signature du Professeur’, pageWidth / 2, 158, { align: ‘center’ });

// ID unique
const certificateId = generateUniqueId();
doc.setFontSize(8);
doc.text(`ID: ${certificateId}`, pageWidth – 15, pageHeight – 10, { align: ‘right’ });

// Ajout du QR code en bas de page (simulé)
doc.setDrawColor(0);
doc.setFillColor(0);
doc.roundedRect(20, pageHeight – 40, 30, 30, 1, 1, ‘F’);

// Téléchargement du PDF
doc.save(`certificat_${userInfo.nom}_${userInfo.prenom}.pdf`);
} catch (error) {
console.error(“Erreur lors de la génération du PDF:”, error);
alert(“Une erreur s’est produite lors de la génération du PDF. Veuillez réessayer plus tard.”);
}
}

// Fonction pour générer un ID unique pour le certificat
function generateUniqueId() {
return ‘FG-‘ + Math.random().toString(36).substring(2, 10).toUpperCase();
}
});

Dejar un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *