将鼠标悬停在带有冲突代码的WordPress主题上

Question

因此，我当前正在使用以下脚本（效果3）： http : //tympanus.net/codrops/2013/06/18/caption-hover-effects/

我试图使这些框显示在我的博客内容列表中，该列表当前使用内容功能。 为此，我已经包含了对演示文件的CSS和JS的调用；

<link rel="stylesheet" type="text/css" href="css/default.css" />
<link rel="stylesheet" type="text/css" href="css/component.css" />
<script src="js/modernizr.custom.js"></script>

我将其添加到index.php文件而不是标头中，因为我仅在此页面上需要它。 目前，我只有博客列表的特色图片/嵌入式节目。 我删除了所有wordpress标题和摘录标签，因为我希望在添加内容之前着重于使其工作。 因此，目前，它只是演示中使用的代码的副本以及博客列表自身的代码。 这里显示的是图片发布。

<ul class="grid cs-style-3">
  <li>
    <figure>        
    <?php
    }

    if ($format === 'image') { ?>

      <?php if (has_post_thumbnail()) : ?>

        <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>" class="post-image" >                                  
          <?php the_post_thumbnail(); ?>
        </a>

        <figcaption>
          <h3>Settings</h3>
          <span>Jacob Cummings</span>
          <a href="http://dribbble.com/shots/1116685-Settings">Take a look</a>
        </figcaption>
    </figure>

这是我迷路的地方，也许是由于同一页面上的脚本太多，因为博客列表本身使用webkit编码来显示。 但是我复制了所有代码，完全与演示中的代码相同，减去了图像部分，这是我的博客代码。 但是，无论我尝试什么，它都只会在没有效果的情况下显示在图像下。 我完全迷失了在这里做什么和出主意的想法。

我曾尝试搜索，但没有任何帮助。 因此，我认为这更多地取决于我已经为该主题编写的编码不佳。 我设法以相同的方式添加了其他部分，但是没有获得用于主题函数本身的额外代码。

您可以在任何图像下查看我所指的页面以及此处出错的地方：

http://outside.hobhob.uk/test/blog/

很高兴提供其他任何额外的东西。

完整代码： http ： //hostcode.sourceforge.net/view/6152

Answer 1

您发布的代码存在一些问题，请尝试将其替换。 我只是删除了评论中正在谈论的Brachet，并添加了endif; 在代码块的末尾。 我仍然不知道$ format变量是否正确地插入了代码的其他位置，因此可能还有其他问题。

<figure>        
    <?php if ($format === 'image') : ?>
        <?php if (has_post_thumbnail()) : ?>

            <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>" class="post-image" >                                  
                <?php the_post_thumbnail(); ?>
            </a>
            <figcaption>
                <h3>Settings</h3>
                <span>Jacob Cummings</span>
                <a href="http://dribbble.com/shots/1116685-Settings">Take a look</a>

            </figcaption>
        <?php endif; ?>
    <?php endif; ?>    
</figure>