使用WordPress自定义帖子类型显示StoryMapJS

时间:2018-12-12 作者:zipadee

所以我想用StoryMapJs 在我的网站上,我希望能够通过自定义帖子类型来管理这些内容。我已经为每个选项创建了自定义帖子类型和字段,但我很难让它们显示出来。我的代码如下:

<?php global $post; $post_slug = $post->post_name;
                $args=array(
                \'post_type\' => \'storymap_event\',
                \'posts_per_page\' => -1
                );
            ?>

            <div id="mapdiv" style="width: 100%; height: 600px;"></div>

            <?php $my_query = null;
            $my_query = new WP_Query($args); $i=0;

            if( $my_query->have_posts() ) { while ($my_query->have_posts()) : $my_query->the_post(); $i++;
                $title = get_the_title();
                $excerpt = get_the_excerpt();
                $thumb_id = get_post_thumbnail_id();
                $thumbnail = wp_get_attachment_image_src($thumb_id,\'\', true);
                $latitude = intval(get_post_meta($post->ID, \'wpcf-latitude\', true));
                $longitude = intval(get_post_meta($post->ID, \'wpcf-longitude\', true));
                $caption = get_post_meta($post->ID, \'wpcf-image-caption\', true);
                $credit = get_post_meta($post->ID, \'wpcf-image-credit\', true);
                if ( get_post_meta($post->ID, \'wpcf-image-credit\', true )) { $overview = \'overview\'; } else { $overview = \'\'; }

                $sm_array_slides = array (
                    $i => 
                      array (
                        \'text\' => 
                        array (
                          \'headline\' => $title,
                          \'text\' => $excerpt
                        ),
                        \'location\' => 
                        array (
                          \'name\' => \'Lime street\',
                          \'lat\' => 53.407615,
                          \'lon\' => -2.977302,
                          \'zoom\' => 10,
                          \'line\' => true,
                        ),
                        \'media\' => 
                        array (
                          \'url\' => \'https://www.youtube.com/watch?v=CCGTR-Oa50Q\',
                          \'caption\' => \'Example video\',
                        ),
                      ),
                );

                endwhile; } wp_reset_query();

                $sm_array = array (
                  \'storymap\' => 
                  array (
                    \'slides\' => $sm_array_slides
                  ),
                );

                ?>

                <?php $json = json_encode($sm_array);?>

                <script type="text/javascript">
                var storymap_data = <?php echo $json; ?>;
                var storymap_options = {};
                var storymap = new VCO.StoryMap(\'mapdiv\', storymap_data, storymap_options);
                window.onresize = function(event) {
                    storymap.updateDisplay(); // this isn\'t automatic
                }
            </script>
目前,这类功能正常,但只会显示一个事件。我知道我为什么会遇到这个问题,但我糟糕的PHP知识意味着我被困在了如何解决这个问题上!我需要在循环外创建$sm\\u array\\u slides变量,并从storymap\\u事件循环中填充它。

对不起,我知道这件事很冗长,我不确定我是否解释得很好,但我真的希望有人能帮我,因为我在胡说八道!我希望这是一个非常简单的解决方案。

1 个回复
最合适的回答,由SO网友:rudtek 整理而成

如果先创建数组,然后在循环中添加到其中,会发生什么情况。现在,您不需要添加到数组,只需继续创建它即可。

post\\u名称$args=数组(\'post\\u type\'=>\'storymap\\u事件\',\'posts\\u per\\u page\'=>-1);?>

        <div id="mapdiv" style="width: 100%; height: 600px;"></div>

        <?php $my_query = null;
        $my_query = new WP_Query($args); $i=0;

        $sm_array_slides = array();
        if( $my_query->have_posts() ) { while ($my_query->have_posts()) : $my_query->the_post(); $i++;
            $title = get_the_title();
            $excerpt = get_the_excerpt();
            $thumb_id = get_post_thumbnail_id();
            $thumbnail = wp_get_attachment_image_src($thumb_id,\'\', true);
            $latitude = intval(get_post_meta($post->ID, \'wpcf-latitude\', true));
            $longitude = intval(get_post_meta($post->ID, \'wpcf-longitude\', true));
            $caption = get_post_meta($post->ID, \'wpcf-image-caption\', true);
            $credit = get_post_meta($post->ID, \'wpcf-image-credit\', true);
            if ( get_post_meta($post->ID, \'wpcf-image-credit\', true )) { $overview = \'overview\'; } else { $overview = \'\'; }

            $sm_array_slides [] = array (
                $i => 
                  array (
                    \'text\' => 
                    array (
                      \'headline\' => $title,
                      \'text\' => $excerpt
                    ),
                    \'location\' => 
                    array (
                      \'name\' => \'Lime street\',
                      \'lat\' => 53.407615,
                      \'lon\' => -2.977302,
                      \'zoom\' => 10,
                      \'line\' => true,
                    ),
                    \'media\' => 
                    array (
                      \'url\' => \'https://www.youtube.com/watch?v=CCGTR-Oa50Q\',
                      \'caption\' => \'Example video\',
                    ),
                  ),
            );

            endwhile; } wp_reset_query();

            $sm_array = array (
              \'storymap\' => 
              array (
                \'slides\' => $sm_array_slides
              ),
            );

            ?>

            <?php $json = json_encode($sm_array);?>

            <script type="text/javascript">
            var storymap_data = <?php echo $json; ?>;
            var storymap_options = {};
            var storymap = new VCO.StoryMap(\'mapdiv\', storymap_data, storymap_options);
            window.onresize = function(event) {
                storymap.updateDisplay(); // this isn\'t automatic
            }
        </script> 
你可能需要额外支付array ( 在这条线上:

$sm_array_slides [] = array ( (不要忘记尾随符))

但是我不知道你的地图要找的数组格式,所以我没有在代码中删除它。