Как вывести такое на Wordpress?

Question

[Виталий Мельничук]

Как можно вывести на Wordpress из js функции движка. Дату, Заголовок ( работает) и категорию.
Я делаю так

<script>
var date = '<?= the_date('d.m.Y', $post->ID); ?>';
var title = '<?= the_title(); ?>';
var category = '<?= $cur_terms = get_the_terms( $post->ID, 'video_category' );
			
				foreach( $cur_terms as $cur_term ){
					echo ''. $cur_term->name .'';
				} ?>';

	 function extendMagnificIframe(){
            var $start = 0;
            var $iframe = {
                markup: '<div class="mfp-iframe-scaler">' +
                '<div class="mfp-close"></div>' +
                '<iframe class="mfp-iframe" frameborder="0" allowfullscreen></iframe>' +
                '</div>' +
                '<div class="mfp-bottom-bar">' +
                '<p class="fb-date">'+date+'</p>' +
                '<div class="mfp-title"><p class="fb-name">'+title+'</p>' +
                '<p class="fb-secondary">'+category+'</p></div>' +
                '</div>',
                patterns: {
                    youtube: {
                        index: 'youtu',
                        id: function(url) {

                            var m = url.match( /^.*(?:youtu.be\/|v\/|e\/|u\/\w+\/|embed\/|v=)([^#\&\?]*).*/ );
                            if ( !m || !m[1] ) return null;

                            if(url.indexOf('t=') != - 1){

                                var $split = url.split('t=');
                                var hms = $split[1].replace('h',':').replace('m',':').replace('s','');
                                var a = hms.split(':');

                                if (a.length == 1){

                                    $start = a[0];

                                } else if (a.length == 2){

                                    $start = (+a[0]) * 60 + (+a[1]);

                                } else if (a.length == 3){

                                    $start = (+a[0]) * 60 * 60 + (+a[1]) * 60 + (+a[2]);

                                }
                            }

                            var suffix = '?autoplay=1';

                            if( $start > 0 ){

                                suffix = '?start=' + $start + '&autoplay=1';
                            }

                            return m[1] + suffix;
                        },
                        src: '//www.youtube.com/embed/%id%'
                    },
                    vimeo: {
                        index: 'vimeo.com/',
                        id: function(url) {
                            var m = url.match(/(https?:\/\/)?(www.)?(player.)?vimeo.com\/([a-z]*\/)*([0-9]{6,11})[?]?.*/);
                            if ( !m || !m[5] ) return null;
                            return m[5];
                        },
                        src: '//player.vimeo.com/video/%id%?autoplay=1'
                    }
                }
            };

            return $iframe;

        }
</script>

Но у меня работает только заголовок.
Что не так сделано?

Answer 1

[Алексей Скляров]

Потому что вы пытаетесь вывести $post->ID;, но даю вам сто процентов что вы не написали перед этим global $post. Вот и все, в случае же с тайтлом, в самой функции уже привязка к посту есть.

Comments

[Виталий Мельничук]

Без $post->ID; или global $post результат тот же. Только заголовок работает.

[Алексей Скляров]

Виталий Мельничук, вам нужно оставить post id, но для этого нужно добавить global $post, как я указал. Потому что без него, ваша переменная $post будет пустой, собственно, поэтому у вас ничего и не выводится.

[Алексей Скляров]

Виталий Мельничук, и вообще то, что вы пытаетесь сделать - лютый костыль. Почему бы вам не перестать пытаться лепить php код в js, а просто в блоке с постом создать дата-атрибуты (которые как раз вызовом php функций и заполните), и уже потом js-ом их подтягивать к себе в скрипт? В итоге получится что-то типа этого:

global $post;
$date = get_the_date('d.m.Y', $post->ID);
$title = get_the_title($post->ID);
$cur_terms = get_the_terms( $post->ID, 'video_category' );
// Здесь кстати вы пытались вывести все Названия таксономий, причем слитно
// Не уверен, что это то что вам нужно
$cat = array();
foreach( $cur_terms as $cur_term ){
          $cat = array_push($cat, $cur_term->name,);
}
$cat = implode(",", $cat);

<div id="main-post" class="post" data-category="<?=$category;?>" data-title="<?=$title;?>" data-date="<?=$date;?>">
<!-- Тут идет ваш пост-->
</div>

JS-код добавьте в какой-нибудь файл и подключите на странице:

var container = $('#main-post');
var date = container.attr('data-date');
var title = container.attr('data-title');
var category =container.attr('data-category');

   function extendMagnificIframe(){
            var $start = 0;
            var $iframe = {
                markup: '<div class="mfp-iframe-scaler">' +
                '<div class="mfp-close"></div>' +
                '<iframe class="mfp-iframe" frameborder="0" allowfullscreen></iframe>' +
                '</div>' +
                '<div class="mfp-bottom-bar">' +
                '<p class="fb-date">'+date+'</p>' +
                '<div class="mfp-title"><p class="fb-name">'+title+'</p>' +
                '<p class="fb-secondary">'+category+'</p></div>' +
                '</div>',
                patterns: {
                    youtube: {
                        index: 'youtu',
                        id: function(url) {

                            var m = url.match( /^.*(?:youtu.be\/|v\/|e\/|u\/\w+\/|embed\/|v=)([^#\&\?]*).*/ );
                            if ( !m || !m[1] ) return null;

                            if(url.indexOf('t=') != - 1){

                                var $split = url.split('t=');
                                var hms = $split[1].replace('h',':').replace('m',':').replace('s','');
                                var a = hms.split(':');

                                if (a.length == 1){

                                    $start = a[0];

                                } else if (a.length == 2){

                                    $start = (+a[0]) * 60 + (+a[1]);

                                } else if (a.length == 3){

                                    $start = (+a[0]) * 60 * 60 + (+a[1]) * 60 + (+a[2]);

                                }
                            }

                            var suffix = '?autoplay=1';

                            if( $start > 0 ){

                                suffix = '?start=' + $start + '&autoplay=1';
                            }

                            return m[1] + suffix;
                        },
                        src: '//www.youtube.com/embed/%id%'
                    },
                    vimeo: {
                        index: 'vimeo.com/',
                        id: function(url) {
                            var m = url.match(/(https?:\/\/)?(www.)?(player.)?vimeo.com\/([a-z]*\/)*([0-9]{6,11})[?]?.*/);
                            if ( !m || !m[5] ) return null;
                            return m[5];
                        },
                        src: '//player.vimeo.com/video/%id%?autoplay=1'
                    }
                }
            };

            return $iframe;

        }

[Виталий Мельничук]

Алексей Скляров, вроде ок, но в исходном коде то что нужно. А уже в попап окне повтор и так на каждом посте, одинаково все. Можно как то post_id сделать уникальным при выводе с дата атрибутов?

[Алексей Скляров]

Виталий Мельничук, У вас post_id всегда уникальный за счет того, что каждый пост свой уникальный ID и имеет, тот способ что я описал в самом посте выводит дата атрибуты, а в js коде мы крепимся к этим дата атрибутам.

[Виталий Мельничук]

Алексей Скляров, Ну Ваш способ работает. Спасибо.
Осталось мне создать контейнер с динамичным id поста, если такое реально.