Portfolio

Bienvenue dans mon portfolio de développement WordPress.
Ici, vous découvrirez mon thème personnalisé RM Modern, conçu avec une esthétique propre et moderne pour offrir une expérience utilisateur fluide.
En complément du thème, j’ai développé le plugin Formnest, une solution de formulaire de contact flexible et facile à utiliser qui permet aux sites web de collecter efficacement les demandes.
De plus, le plugin Testimonials Slider améliore l’engagement des utilisateurs en présentant élégamment les avis clients grâce à des animations de défilement fluides.
Explorez les fonctionnalités détaillées, la structure du code et les démonstrations en direct ci-dessous pour découvrir l’étendue complète de mon travail.

Il s’agit d’un thème WordPress personnalisé que j’ai conçu et développé entièrement à partir de zéro, en respectant les standards modernes et les meilleures pratiques.
Le thème est entièrement responsive, optimisé pour la vitesse, et construit avec un code propre et facile à maintenir.

• Thème WordPress personnalisé avec une structure de fichiers modulaire.
• Inclut des modèles pour la page d’accueil, les archives, les articles individuels, les pages, la page 404, la barre latérale, l’en-tête et le pied de page.
• Ressources organisées pour le CSS et le JS dans un dossier dédié.
• Entièrement personnalisable avec prise en charge du customizer WordPress (via inc/customizer.php).
• Conçu pour une gestion de contenu facile et une grande évolutivité.

• Mise en page responsive pour tous les appareils.
• Slider de témoignages personnalisé avec des transitions fluides.
• Intégration complète avec le Customizer de WordPress.
• Balises optimisées pour le SEO et prêtes pour le schema.
• Accessibilité assurée (rôles ARIA, navigation au clavier).

Homepage Code Snippet
<?php
get_header(); ?></p>
<section class="entry">
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<?php get_template_part( 'template-parts/content', get_post_type() ); ?>
<?php endwhile; else : ?> </p>
<?php _e( 'No posts yet.', 'rm-modern' ); ?>
<?php endif; ?>
<div class="posts-navigation">
<?php the_posts_pagination(); ?>
</div>
</section>
<p> <?php get_footer(); ?>

Theme Header Code Snippet
</p></div>
<!-- .container (end main container) -->
</main>
<footer class="site-footer">
<div class="container">
<div class="footer-inner">
<div class="footer-brand">
<a href="<?php echo esc_url( home_url( '/' ) ); ?>“><?php bloginfo( 'name' ); ?></a>
</div>
<div class="footer-widgets">
<div class="footer-menu">
<?php
if ( has_nav_menu( 'footer' ) ) {
wp_nav_menu( array( 'theme_location' => ‘footer’, ‘container’ => false, ‘menu_class’ => ” ) );
} else {
// fallback list of pages
wp_page_menu( array( ‘show_home’ => true ) );
}
?>
</div>
</p></div>
</p></div>
<div style="margin-top:28px;font-size:12px;color:#999">
    Talaourar Abderraouf, WordPress Developer
</div>
</p></div>
</footer>
<p><?php wp_footer(); ?>
</body>
</html>

Le plugin Testimonials Slider est une solution personnalisée que j’ai développée pour afficher les avis clients de manière dynamique et élégante sur les sites WordPress.
Il permet d’intégrer facilement un carrousel fluide de témoignages via un shortcode, avec des styles modernes et une navigation intuitive.
Ce plugin améliore l’engagement des visiteurs en valorisant la confiance grâce aux retours clients présentés de façon professionnelle.

Plugin WordPress entièrement développé en PHP, CSS et JavaScript.
Intègre un Custom Post Type pour gérer les témoignages dans le back-office.
Utilise un shortcode simple pour afficher le slider sur n’importe quelle page ou article.
Styles CSS modulaires et scripts JS dédiés au fonctionnement du slider.
Code organisé en dossiers clairs pour faciliter la maintenance et l’évolution.

Gestion simple et rapide des témoignages via un Custom Post Type.
Interface intuitive avec support complet Gutenberg et shortcode classique.
Slider fluide, responsive, et optimisé pour la performance.
Styles modernes avec possibilité de personnalisation CSS.
Compatible avec la plupart des thèmes WordPress modernes.
Intégration facile dans n’importe quel site grâce au shortcode.

slider.js Code Snippet
jQuery(document).ready(function($){
$(‘.ts-slider’).slick({
autoplay: true,
arrows: true,
dots: true,
infinite: true,
speed: 500,
slidesToShow: 1,
adaptiveHeight: true
});
});

You can manage your testimonials here

And get this wonderful slider

Le plugin Formnest est une solution avancée de création et gestion de formulaires de contact personnalisés pour WordPress.
Conçu pour être flexible et facile à utiliser, il permet aux utilisateurs de construire des formulaires complexes grâce à un système de templates et un constructeur intégré.
Formnest gère les soumissions, les validations, et les interactions AJAX pour une expérience utilisateur fluide et moderne.

Plugin WordPress complet pour la création et gestion des formulaires de contact.
Intègre un constructeur de formulaires basé sur des templates PHP modulaires.
Gère la soumission des formulaires avec traitement côté serveur via AJAX pour plus de réactivité.
Styles dédiés pour le frontend et le backend garantissant une cohérence visuelle.
Système de Custom Post Type pour stocker les soumissions.
Code organisé en classes PHP pour une architecture claire et évolutive.

Construction de formulaires personnalisés via un système modulaire et templates.
Gestion optimisée des soumissions avec stockage sécurisé en CPT.
Interactions AJAX pour des validations et soumissions sans rechargement.
Interface d’administration intuitive et responsive.
Séparation claire entre frontend et backend avec styles et scripts dédiés.
Architecture orientée objet facilitant la maintenance et l’extension.

formnest-frontend.css Code
.formnest-form {
max-width: 700px;
margin: 0 auto;
padding: 30px;
background: #ffffff;
border-radius: 15px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
display: flex;
flex-wrap: wrap;
gap: 15px;
}
/* Input & textarea styling */
.formnest-form input,
.formnest-form textarea,
.formnest-form select {
background: #f5f6fa;
border: none;
border-radius: 10px;
padding: 12px 15px;
font-size: 15px;
width: 100%;
box-sizing: border-box;
outline: none;
transition: box-shadow 0.2s ease, background 0.2s ease;
}
.formnest-form input:focus,
.formnest-form textarea:focus,
.formnest-form select:focus {
background: #fff;
box-shadow: 0 0 0 2px #a18cff;
}
/* Two fields per row */
.formnest-field {
flex: 1 1 calc(50% – 15px);
}
/* Full width fields (textarea & button) */
.formnest-full {
flex: 1 1 100%;
}
/* Textarea */
.formnest-form textarea {
min-height: 150px;
resize: vertical;
}
/* Submit button */
.formnest-form button {
background: linear-gradient(90deg, #5e4bfa, #8f6efc);
color: #fff;
border: none;
border-radius: 25px;
padding: 14px 25px;
font-size: 16px;
font-weight: 600;
cursor: pointer;
transition: opacity 0.2s ease;
}
.formnest-form button:hover {
opacity: 0.9;
}
/* Success / message box */
.formnest-message {
padding: 12px;
background: #e1f5e1;
color: #2e7d32;
border-radius: 8px;
width: 100%;
}
/* Responsive: stack on mobile */
@media (max-width: 600px) {
.formnest-field {
flex: 1 1 100%;
}
}

Add the fields for your form, choose the id, click update, and that’s it! You will get this wonderful form!

And you can get the forms submissions in your wordpress dashbord. You will also get an email immediately after a form is submitted.