Redirection image article

BunnyGaming
PHP

Bonjour à tous , alors voila je suis entrain de finaliser toutes les redirections de mon blog, petit probleme que je rencontre actuellement je souhaite donc récupere les 3 derniers acticle de mon blog sur ma page index chose qui se passe niquel par contre quand je veut faire la redirection avec l'id ca ne fonctionne pas des idées ?

                            <div class="card h-100 shadow border-0">
                            <a href="_blog/article.php?id=<?= $ra['id'] ?>">
                                <img class="card-img-top" height="300" width="600" src="<?= $chemin_miniature ?>" />
                            </a>
$req = $DB->prepare("SELECT a.*, u.pseudo, u.avatar, b.name
FROM article a 
INNER JOIN utilisateur u On u.id = a.id_utilisateur
INNER JOIN blog b On b.id = a.id_blog
ORDER BY a.date_creation DESC
LIMIT 3 ");
$req->execute();
$req_article = $req->fetchALL();

j'ai fait un foreach plus bas d'ou le $ra

Merci de l'aide :)

14 réponses

JoolsMcFly
Réponse acceptée

Alors au début quand tu fais

$req_article = $req->fetchALL();

$chemin_miniature = null;
if(isset($req_article['miniature'])){
    $chemin_miniature = 'public/miniature/' . $req_article['id'] . '/' . $req_article['miniature'];
}else{
    $chemin_miniature = 'public/miniature/defaut/defaut.png';
}

$req_article est un tableau de résultats donc $req_article['miniature'] n'est pas défini car miniature est au niveau de chaque résultat, pas au plus haut niveau du tableau.
Il faut que tu mettes ça dans la boucle :

                    <?php
                        foreach($req_article as $ra){
                             if(isset($ra['avatar'])){
                                $chemin_avatar = 'public/avatar/' . $ra['id_utilisateur'] . '/' . $ra['avatar'];
                             } else {
                                $chemin_avatar = 'public/avatar/defaut/defaut.svg';
                             }
                             if(isset($req_article['miniature'])){
                                 $chemin_miniature = 'public/miniature/' . $req_article['id'] . '/' . $req_article['miniature'];
                             }else{
                                 $chemin_miniature = 'public/miniature/defaut/defaut.png';
                             }
                     ?>
                        <div class="col-lg-4 mb-5">
                            <div class="card h-100 shadow border-0">
                            <a href="/_blog/article.php?id=<?= $ra['id_blog'] ?>"> article</a>
                                <img class="card-img-top" height="300" width="600" src="<?= $chemin_miniature ?>" />

Normalement ça devrait mieux marcher.

Et je te conseille de mettre un / dans les src ou les href pour que ce soit un chemin absolu (/public au lieu de public) sinon si tu te trouves dans un sous-dossier comme /_blog/article.php?id=9 alors ton image ne s'affichera pas :

Ne fonctionne pas car ton navigateur cherche à afficher /_blog/public/miniature/defaut/defaut.png qui n'existe pas:

<img class="img-fluid rounded" src="public/miniature/defaut/defaut.png" width="900" height="400">

Fonctionne car ça va bien dans le dossier public à la racine.

<img class="img-fluid rounded" src="/public/miniature/defaut/defaut.png" width="900" height="400">
JoolsMcFly

"Ça ne fonctionne pas" est un peu juste pour décrire le problème. ^^

Le HTML ressemble à quoi pour ton lien ?
L'ID est bon ?
Est-ce que tu n'aurais pas besoin d'un / en début de href au cas-où la page sur laquelle tu es soit dans un sous-dossier (http://tonsite.dev/recents) ?

Que se passe-t'il si tu vas directement sur une URL avec un ID article connu ?
http://tonsite.dev/_blog/article.php?id=12 par exemple. Ça affiche l'article correctement ? T'as une erreur ? Laquelle ?

BunnyGaming
Auteur

Salut alors le html pour mon lien c'est le premier bout de code,

l'id est le bon car il me donne bien l'article qui correspond, j'ai bien essayer de mettre un / au début rien ne change.

quand je vais directement au lien ça me renvoi directement sur la page de mon blog car ça doit sélectionner la catégorie avant mais quand je vais de ma page blog et que je clique sur l'article ca fonctionne bien .

de plus la je vien de m'aperçevoir que ca ne récupére pas non plus les miniature des articles.

JoolsMcFly

mais quand je vais de ma page blog et que je clique sur l'article ca fonctionne bien

Quelle est cette URL qui fonctionne ?

Soundboy39

Bonjour,

Est-ce que tu a fait un var_dump de $ra avant l'affichage du HTML ? Afin de t'assurer que tu a bien tout ce qu'il faut comme il faut...

BunnyGaming
Auteur

oui c'est fait est celui me donne bien tous meme l'image mais celle-ci n'apparait pas

JoolsMcFly

Il faut qe tu nous donnes plus d'infos précises car c'est compliqué là.

Pour ton pb d'image qui n'apparait pas il faudrait que tu nous donnes le résultat du var_dump et que tu nous dises dans quel répertoire elle est stocké sur ton ordi et ce que renvoit la requête.
De plus, $chemin_miniature vient d'où ?

BunnyGaming
Auteur

le $chemin_miniature vient d'ici $chemin_miniature = null; if(isset($req_article['miniature'])){ $chemin_miniature = 'public/miniature/' . $req_article['id'] . '/' . $req_article['miniature']; }else{ $chemin_miniature = 'public/miniature/defaut/defaut.png'; } le chemin donc de defaut est bien pris en compte donc pour moi c'est l'id qui convient pas qui doit merde

voila ce que donne le var_dump de $ra : array(24) { ["id"]=> string(1) "8" [0]=> string(1) "8" ["id_blog"]=> string(1) "2" [1]=> string(1) "2" ["titre"]=> string(7) "Salut 8" [2]=> string(7) "Salut 8" ["libelle"]=> string(5) "SALUT" [3]=> string(5) "SALUT" ["contenu"]=> string(5) "salut" [4]=> string(5) "salut" ["date_creation"]=> string(19) "2023-02-27 06:13:55" [5]=> string(19) "2023-02-27 06:13:55" ["date_modification"]=> string(19) "2023-02-27 06:13:55" [6]=> string(19) "2023-02-27 06:13:55" ["id_utilisateur"]=> string(1) "1" [7]=> string(1) "1" ["miniature"]=> NULL [8]=> NULL ["pseudo"]=> string(5) "Admin" [9]=> string(5) "Admin" ["avatar"]=> string(36) "0bd2ea430a2729b0220e294028e2773d.png" [10]=> string(36) "0bd2ea430a2729b0220e294028e2773d.png" ["name"]=> string(10) "Patisserie" [11]=> string(10) "Patisserie" }

JoolsMcFly

Elles sont stockées où sur ton ordi les miniatures ? Dans un sous-dossier de public/miniature comme public/miniature/12/432h4jk32h4k324h23k.png ?

T'as un print_r d'un article avec miniature à montrer?

BunnyGaming
Auteur

elle sont sur l'hebergeur de mon site par sur mon ordi et derriere il sont stocker dans public/miniature/(id de l'article)/123456789fejfbnjbjz.png

BunnyGaming
Auteur

[(https://zupimages.net/viewer.php?id=23/09/wegj.png)]

JoolsMcFly

OK l'image s'affiche bien, c'est bon du coup ?
Je ne suis pas sûr de comprendre le problème en fait, s'il y en a toujours un ^^

BunnyGaming
Auteur

la miniature de l'article sur la page article c'est toujours afficher.
Mais sur la page d'accueil de mon site ou je recupere les 3 derniers articles que ce soit la miniature ou la redirection ne ce fait toujours pas

BunnyGaming
Auteur

[(https://zupimages.net/viewer.php?id=23/09/jfea.png)]

JoolsMcFly

OK donc en regardant le code source je vois sur la page /_blog/liste-article.php?id=2 :

                      <div class="card h-100 shadow border-0">
                            <a href="/_blog/article.php?id=2"> article</a>
                                <img class="card-img-top" src="public/miniature/defaut/defaut.png" width="600" height="300">

                                <div class="card-body p-4">
                                    <div class="badge bg-primary bg-gradient rounded-pill mb-2">Patisserie</div>
                                    <a class="text-decoration-none link-dark stretched-link" href=""><h5 class="card-title mb-3">SAlut Test 3/4</h5></a>
                                    <p class="card-text mb-0"></p>
                                </div>
                                <div class="card-footer p-4 pt-0 bg-transparent border-top-0">
                                    <div class="d-flex align-items-end justify-content-between">
                                        <div class="d-flex align-items-center">
                                            <img class="rounded-circle me-3" src="public/avatar/1/0bd2ea430a2729b0220e294028e2773d.png"> 
                                            <div class="small">
                                                <div class="fw-bold">Admin</div>
                                                <div class="text-muted">18/02/2023</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

le premier lien est bon : <a href="/_blog/article.php?id=2"> article</a> mais plus bas t'as un autre lien et c'est lui qui réagit au clic et il n'est pas bon car il a un href vide :
<a class="text-decoration-none link-dark stretched-link" href=""><h5 class="card-title mb-3">SAlut Test 3/4</h5></a>
Laisse juste la balise h5et ca fonctionnera.

Ensuite si je vais sur /_blog/article.php?id=8 (ou /_blog/liste-article.php?id=1) je vois :
<img class="img-fluid rounded" src="../public/miniature/defaut/defaut.svg" width="900" height="400">

=> les .. sont en trop.

Et enfin pour le problème de miniatures qui ne s'affichent pas quand tu affiches les 3 derniers articles est-ce que tu peux faire voir tout le code stp (requête, foreach etc) ? Ça nous aidera à t'aider.

BunnyGaming
Auteur 
<?php
require_once('include.php');

$req = $DB->prepare("SELECT a.*, u.pseudo, u.avatar, b.name
FROM article a 
INNER JOIN utilisateur u On u.id = a.id_utilisateur
INNER JOIN blog b On b.id = a.id_blog
ORDER BY a.date_creation DESC
LIMIT 3 ");
$req->execute();
$req_article = $req->fetchALL();

$chemin_miniature = null;
if(isset($req_article['miniature'])){
    $chemin_miniature = 'public/miniature/' . $req_article['id'] . '/' . $req_article['miniature'];
}else{
    $chemin_miniature = 'public/miniature/defaut/defaut.png';
}

?>
<!DOCTYPE html>
<html lang="fr">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
        <meta name="description" content="" />
        <meta name="author" content="" />
        <title>Les Gourmandises de Theo</title>
        <!-- Favicon-->
        <link rel="icon" type="image/x-icon" href="_include/assets/favicon.ico" />
        <!-- Bootstrap icons-->
        <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css" rel="stylesheet" />
        <!-- Core theme CSS (includes Bootstrap)-->
        <link href="_include/css/styles.css" rel="stylesheet" />
    </head>
    <body class="d-flex flex-column h-100">
        <main class="flex-shrink-0">
            <?php require_once('_include/nav.php')?>
            <!-- Header-->
            <header class="bg-dark py-5">
                <div class="container px-5">
                    <div class="row gx-5 align-items-center justify-content-center">
                        <div class="col-lg-8 col-xl-7 col-xxl-6">
                            <div class="my-5 text-center text-xl-start">
                                <h1 class="display-5 fw-bolder text-white mb-2">Les Gourmandises de Theo</h1>
                                <p class="lead fw-normal text-white-50 mb-4">Réalisation de recette en vidéo et écrite.</p>
                                <div class="d-grid gap-3 d-sm-flex justify-content-sm-center justify-content-xl-start">
                                    <a class="btn btn-primary btn-lg px-4 me-sm-3" href="#features">Youtube</a>
                                    <a class="btn btn-outline-light btn-lg px-4" href="_blog/index.php">Blog</a>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-5 col-xxl-6 d-none d-xl-block text-center"><img class="img-fluid rounded-3 my-5" src="_include/img/acc-600x400.png" alt="..." /></div>
                    </div>
                </div>
            </header>
            <!-- Features section-->
            <section class="py-5" id="features">
                <div class="container px-5 my-5">
                    <div class="row gx-5">
                        <div class="col-lg-4 mb-5 mb-lg-0"><h2 class="fw-bolder mb-0">Retrouvez toutes les recettes sur les différents réseaux sociaux.</h2></div>
                        <div class="col-lg-8">
                            <div class="row gx-5 row-cols-1 row-cols-md-2">
                                <div class="col mb-5 h-100">
                                    <div class="feature bg-primary bg-gradient text-white rounded-3 mb-3"><i class="bi bi-collection"></i></div>
                                    <h2 class="h5">Blog</h2>
                                    <p class="mb-0">Sur le blog vous pourrez retrouver différentes recettes.</p>
                                </div>
                                <div class="col mb-5 h-100">
                                    <div class="feature bg-primary bg-gradient text-white rounded-3 mb-3"><i class="bi bi-building"></i></div>
                                    <h2 class="h5">Forum</h2>
                                    <p class="mb-0">Vous rechercher de l'aide pour faire une recette ? avoir des conseils de réalisation ? ou même partager vos créations alors n'hésitez pas !</p>
                                </div>
                                <div class="col mb-5 mb-md-0 h-100">
                                    <div class="feature bg-primary bg-gradient text-white rounded-3 mb-3"><i class="bi bi-toggles2"></i></div>
                                    <h2 class="h5">Twitch</h2>
                                    <p class="mb-0">Retrouvez-nous bientôt pour des lives cuisine.</p>
                                </div>
                                <div class="col h-100">
                                    <div class="feature bg-primary bg-gradient text-white rounded-3 mb-3"><i class="bi bi-toggles2"></i></div>
                                    <h2 class="h5">Youtube</h2>
                                    <p class="mb-0">Sur cette chaine vous pourrez retrouver des vidéos avec différentes recette.</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- Testimonial section
            <div class="py-5 bg-light">
                <div class="container px-5 my-5">
                    <div class="row gx-5 justify-content-center">
                        <div class="col-lg-10 col-xl-7">
                            <div class="text-center">
                                <div class="fs-4 mb-4 fst-italic">"Working with Start Bootstrap templates has saved me tons of development time when building new projects! Starting with a Bootstrap template just makes things easier!"</div>
                                <div class="d-flex align-items-center justify-content-center">
                                    <img class="rounded-circle me-3" src="https://dummyimage.com/40x40/ced4da/6c757d" alt="..." />
                                    <div class="fw-bold">
                                        Tom Ato
                                        <span class="fw-bold text-primary mx-1">/</span>
                                        CEO, Pomodoro
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>-->
            <!-- Blog preview section-->

            <section class="py-5">
                <div class="container px-5 my-5">
                    <div class="row gx-5 justify-content-center">
                        <div class="col-lg-8 col-xl-6">
                            <div class="text-center">
                                <h2 class="fw-bolder">Les derniers article sur le blog.</h2>
                                <p class="lead fw-normal text-muted mb-5">Retrouvez les 3 derniers articles du blog pour plus de recette rendez vous directement sur l'onglet blog en haut du site.</p>
                            </div>
                        </div>
                    </div>
                    <div class="row gx-5">
                    <?php
                        foreach($req_article as $ra){
                            $chemin_avatar = null;
                                if(isset($ra['avatar'])){
                                    $chemin_avatar = 'public/avatar/' . $ra['id_utilisateur'] . '/' . $ra['avatar'];
                                }else{
                                    $chemin_avatar = 'public/avatar/defaut/defaut.svg';
                                }
                     ?>
                        <div class="col-lg-4 mb-5">
                            <div class="card h-100 shadow border-0">
                            <a href="/_blog/article.php?id=<?= $ra['id_blog'] ?>"> article</a>
                                <img class="card-img-top" height="300" width="600" src="<?= $chemin_miniature ?>" />

                                <div class="card-body p-4">
                                    <div class="badge bg-primary bg-gradient rounded-pill mb-2"><?= $ra['name'] ?></div>
                                    <h5 class="card-title mb-3"><?= $ra['titre'] ?></h5>
                                    <p class="card-text mb-0"><?= $ra['libelle'] ?></p>
                                </div>
                                <div class="card-footer p-4 pt-0 bg-transparent border-top-0">
                                    <div class="d-flex align-items-end justify-content-between">
                                        <div class="d-flex align-items-center">
                                            <img class="rounded-circle me-3" src="<?= $chemin_avatar ?>" class="profil__avatar"/> 
                                            <div class="small">
                                                <div class="fw-bold"><?= $ra['pseudo'] ?></div>
                                                <div class="text-muted"><?= date_format(date_create($ra['date_creation']), 'd/m/Y')?></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <?php
                        }
                    ?>
                    </div>

                    <!-- Call to action-->
                    <aside class="bg-primary bg-gradient rounded-3 p-4 p-sm-5 mt-5">
                        <div class="d-flex align-items-center justify-content-between flex-column flex-xl-row text-center text-xl-start">
                            <div class="mb-4 mb-xl-0">
                                <div class="fs-3 fw-bold text-white">Soyez au courant de l'actualité.</div>
                                <div class="text-white-50">Inscrivez-vous pour ne rien louper.</div>
                            </div>
                            <div class="ms-xl-4">
                                <div class="input-group mb-2">
                                    <input class="form-control" type="text" name="mail" placeholder="Email address..." aria-label="Email address..." aria-describedby="button-newsletter" />
                                    <button class="btn btn-outline-light" id="button-newsletter" type="submit" value="S'inscire">Sign up</button>
                                </div>
                                <div class="small text-white-50"></div>
                            </div>
                        </div>
                    </aside>
                </div>
            </section>
        </main>
        <!-- Footer-->
        <footer class="bg-dark py-4 mt-auto">
            <div class="container px-5">
                <div class="row align-items-center justify-content-between flex-column flex-sm-row">
                    <div class="col-auto"><div class="small m-0 text-white">Copyright &copy; Les Gourmandises de Theo 2023</div></div>
                    <div class="col-auto">
                        <a class="link-light small" href="#!">CGU</a>
                        <span class="text-white mx-1">&middot;</span>
                        <a class="link-light small" href="connexion.php">Login</a>
                        <span class="text-white mx-1">&middot;</span>
                        <a class="link-light small" href="contact.php">Contact</a>
                    </div>
                </div>
            </div>
        </footer>
        <!-- Bootstrap core JS-->
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
        <!-- Core theme JS-->
        <script src="_include/js/scripts.js"></script>
    </body>
</html>

Salut alors j'ai déjà fait ce que tu m'a dit plus haut et la redirection fonctionne, Merci :)