Question

我正试图reproduce this Masonry来展示一个画廊。我为此创建了一个CPT。 “CPT - 画廊”。

首先，我考虑创建自定义帖子类型以将所有图像一起发布。

我的CPT：

---＆GT;＆GT;＆GT;标题＆lt;＆lt;＆lt; --- ---＆GT;＆GT;＆GT;图像默认 - 缩略图＆lt;＆lt;＆lt; --- ---＆GT;＆GT;＆GT;强制＆lt;＆lt;＆lt; --- ---＆gt;＆gt;＆gt;图像＆lt;＆lt;＆lt; --- ---＆gt;＆gt;＆gt;图像＆lt;＆lt;＆lt; --- ...

前三个部分（标题，图像默认和内容）是基础知识。准备好了。

之后，我考虑使用自定义元数据并添加每个图像网址。但是，通过URL添加URL并不是直观的，对于用户来说，无论是新手还是高级，都可以为用户提供更多功能。此外，金额会有所不同，图片可以是1，可能是5可能是10等等。

我看到有一个plugin for WordPress，但插件不是全宽，当我将插件的css设置为全宽时，Mansory会出现几个错误视口调整大小。

注意到插件和代码的功能，我在每篇文章中看到，插件使用自己的WordPress编辑器库。它采用生成的短代码（在the_content();内）并在Mansory类中显示图像。

我正在尝试这样做，但没有成功。

无论如何，我想做什么？

- ＆gt;抓住WordPress图库的短代码，并在div＆lt; -

的masonry内显示每张图片

逻辑示例：
图库的简码：[gallery ids="1,2,3,4,5,6"]

我拍摄每张图片并在循环中显示。

实际例子：

在这里，我使用div的{{1}}执行循环。

masonry

循环将显示图库中的所有图像。

<?php
  $args = array( 'post_type' => 'gallery', 'showposts' => 1 );
  $wp_query = new WP_Query($args);
  if(have_posts()):
    while ($wp_query -> have_posts()) : $wp_query -> the_post();
?>

<div class="item">
  <figure style="margin: 0px !important" itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
      <a href="<?php IMAGE 1 OF GALLERY WP; ?>" itemprop="contentUrl" data-size="1800x1200" data-index="0">
          <img src="<?php IMAGE 1 OF GALLERY WP; ?>" class="image" itemprop="thumbnail" alt="">
      </a>
  </figure>
</div>

我怎么能这样做？

Answer 1

你快到了。您只需要获取并循环浏览图库图像。这样的事情对你有用。参考此处：https://codex.wordpress.org/Function_Reference/get_post_gallery_images

<?php
global $post;
$gallery = get_post_gallery_images( $post );

foreach( $gallery as $image_url ) {
?>
<div class="item">
  <figure style="margin: 0px !important" itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
      <a href="<?php echo $image_url ?>" itemprop="contentUrl" data-size="1800x1200" data-index="0">
          <img src="<?php echo $image_url ?>" class="image" itemprop="thumbnail" alt="">
      </a>
  </figure>
</div>
<?php 
}
?>

如何在某个div中插入图库的每个图像？ WordPress的

1 个答案: