Вставьте ссылку на мои миниатюры изображений.

Вопрос или проблема

Я пытаюсь вставить ссылку на свои миниатюры изображений, ссылка – это гиперссылка на запись. Когда я вставляю этот код внутри цикла, вместо того, чтобы показывать первое изображение, сначала отображается второе изображение (template_url).

<a href="https://wordpress.stackexchange.com/questions/83700/<?php the_permalink() ?>" class="alignnone" title="<?php the_title(); ?>">
<?php if (has_post_thumbnail()) : ?>
<a href="<?php the_permalink(); ?>" title="<?php the_title();?>"><?php the_post_thumbnail(); ?></a>
<?php else : ?>
<img src="<?php bloginfo('template_url'); ?>/images/noimage.jpg" width="213" height="187" alt=""/>
<?php endif; ?>
</a>

Код шаблона:

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
    <div <?php post_class() ?> id="post-<?php the_ID(); ?>=">
    <div class="item">  
        <ul>
        <li>
     <a href="https://wordpress.stackexchange.com/questions/83700/<?php the_permalink() ?>" class="alignnone" title="<?php the_title(); ?>">

<a href="<?php the_permalink(); ?>" title="<?php the_title();?>">
                                                <?php if (has_post_thumbnail()) : ?>
                                                    <?php the_post_thumbnail(); ?></a>
                                                    <?php else : ?>
                                                        <img src="<?php bloginfo('template_url'); ?>/images/noimage.jpg" width="213" height="187" alt=""/>
                                                    <?php endif; ?>
    </a>                             
    <div id="info">
        <div class="title_album"> <strong>Άlbum : </strong> <?php print_custom_field('title_album'); ?><br /> </div>
                                        <div class="number_photos"><strong>Photos : </strong> <?php print_custom_field('Number_photos'); ?><br /> </div>
                        </div>
                </li>
            </ul>
        </div> <!-- конец элемента -->
    </div> <!-- КОНЕЦ div class post -->

Даже если эта часть кода, результат остается прежним…

<?php echo '<a href="', get_permalink(), '">';
        if (has_post_thumbnail()) 
{the_post_thumbnail();}
else {echo'<img src="', get_bloginfo('template_directory'), '/images/noimage.jpg',                                          '" width="213" height="187" alt="thumbnail" />';}
        echo '</a>'; ?>

Вам может понадобиться изменить код на что-то вроде этого:

<a href="https://wordpress.stackexchange.com/questions/83700/<?php the_permalink() ?>" class="alignnone" title="<?php the_title(); ?>">

<a href="<?php the_permalink(); ?>" title="<?php the_title();?>">
    <?php if (has_post_thumbnail()) : ?>
        <?php the_post_thumbnail(); ?></a>
    <?php else : ?>
        <img src="<?php bloginfo('template_url'); ?>/images/noimage.jpg" width="213" height="187" alt=""/>
    <?php endif; ?>
</a>

И я предполагаю, что вы указали изображение заглавной миниатюры, чтобы оно отображалось, да? http://codex.wordpress.org/Post_Thumbnails

Вы не можете использовать тег внутри другого тега ,
Попробуйте сделать так….

<a href="https://wordpress.stackexchange.com/questions/83700/<?php the_permalink() ?>" class="alignnone" title="<?php the_title(); ?>">
    <?php if (has_post_thumbnail()) : ?>
        <?php the_post_thumbnail(); ?>
    <?php else : ?>
        <img src="<?php bloginfo('template_url'); ?>/images/noimage.jpg" width="213" height="187" alt=""/>
    <?php endif; ?>
</a>

Ответ или решение

Для вставки ссылок на миниатюры изображений в вашем шаблоне WordPress необходимо учесть несколько моментов, чтобы избежать наложения тегов и неправильной работы кода. Сначала, как вы правильно заметили, нельзя использовать один тег <a> внутри другого.

Ваши первоначальные подходы имеют некоторые недочеты, которые можно исправить. Давайте рассмотрим правильный способ вставить гиперссылку для миниатюр изображений.

Вот исправленный код:

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
    <div <?php post_class(); ?> id="post-<?php the_ID(); ?>">
        <div class="item">  
            <ul>
                <li>
                    <a href="<?php the_permalink(); ?>" class="alignnone" title="<?php the_title(); ?>">
                        <?php if (has_post_thumbnail()) : ?>
                            <?php the_post_thumbnail(); ?>
                        <?php else : ?>
                            <img src="<?php bloginfo('template_url'); ?>/images/noimage.jpg" width="213" height="187" alt=""/>
                        <?php endif; ?>
                    </a>
                    <div id="info">
                        <div class="title_album"><strong>Άlbum : </strong><?php print_custom_field('title_album'); ?><br /></div>
                        <div class="number_photos"><strong>Photos : </strong><?php print_custom_field('Number_photos'); ?><br /></div>
                    </div>
                </li>
            </ul>
        </div> <!-- end item -->
    </div> <!-- END div class post -->
<?php endwhile; endif; ?>

В этом коде:

  1. Мы используем один тег <a> вокруг миниатюры (или изображения по умолчанию), чтобы сделать его кликабельным, без вложенных тегов.
  2. the_permalink() и the_title() используются правильно для получения ссылки и заголовка соответствующего поста.
  3. Убедитесь, что для каждого поста установлено изображение миниатюры, чтобы избежать отображения изображения по умолчанию, если оно не задано.

После такого исправления у вас не должно возникать проблем с отображением изображений и ссылками. Если вы всё правильно сделали, то каждая миниатюра будет указывать на соответствующий пост.

Если у вас возникнут дополнительные вопросы или трудности, не стесняйтесь задавать.

Оцените материал
Добавить комментарий

Капча загружается...