如何在自定义模板中显示多个 Post 缩略图插件自定义 post 缩略图
How to display Multiple Post Thumbnails plugin custom post thumbnail image in custom template
我使用了 wordpress Multiple Post Thumbnails 插件来添加自定义 post 元框图像字段。
if (class_exists('MultiPostThumbnails')) {
new MultiPostThumbnails(
array(
'label' => 'Homepage Full-Width',
'id' => 'homepage-full-width',
'post_type' => 'post'
)
);
}
我想在我的网站首页大横幅默认特色图片中以全尺寸显示这张新特色图片 (http://nimb.ws/YelErQ)。
现在主题上面 post 特色图像显示在主题前面 - page.php 文件中使用以下代码。
<?php
$lead_article = ot_get_option('lead_article');
if (has_post_thumbnail($lead_article)) :
$lead_article_img_horizontal = wp_get_attachment_image_src(get_post_thumbnail_id($lead_article), "tol-horizontal");
$lead_article_img_vertical = wp_get_attachment_image_src(get_post_thumbnail_id($lead_article), "tol-vertical");
$lead_article_img_horizontal_src = esc_url( $lead_article_img_horizontal[0]);
$lead_article_img_vertical_src = esc_url( $lead_article_img_vertical[0]);
?>
<div id="lead-article" class="post featured-style10 post-header">
<div data-interchange="[<?php echo $lead_article_img_horizontal_src ?>, landscape], [<?php echo $lead_article_img_vertical_src ?>, portrait]" class="parallax_bg skrollable skrollable-between" data-bottom-top="transform: translate3d(0px, -20%, 0px);" data-top-bottom="transform: translate3d(0px, 20%, 0px);" style="transform: translate3d(0px, 0.382158%, 0px);background-image: url(<?php echo $lead_article_img_horizontal_src ?>)"></div>
</div>
<?php endif; ?>
我遵循了插件说明 https://github.com/voceconnect/multi-post-thumbnails/wiki 但在我的 front-page.php 文件中不起作用。
所以任何人都知道这个的解决方案然后请帮助我。
谢谢。
根据 documentation,您需要做的就是将此代码添加到您的模板中以显示您的自定义缩略图:
<?php if (class_exists('MultiPostThumbnails')) :
MultiPostThumbnails::the_post_thumbnail(
get_post_type(),
'homepage-full-width'
);
endif; ?>
请注意,要使此代码正常工作,您需要将其放在 The Loop.
中的某处
更新:
假设 ot_get_option('lead_article')
returns 一个 ID,试试这个:
<?php
$lead_article = ot_get_option('lead_article');
$lead_article_img_horizontal = null;
$lead_article_img_vertical = null;
if (
class_exists('MultiPostThumbnails')
&& MultiPostThumbnails::has_post_thumbnail( get_post_type($lead_article), 'homepage-full-width', $lead_article )
):
$lead_article_img_horizontal = MultiPostThumbnails::get_post_thumbnail_url( get_post_type($lead_article), 'homepage-full-width', $lead_article );
$lead_article_img_vertical = esc_url( wp_get_attachment_image_src(get_post_thumbnail_id($lead_article), "tol-vertical")[0] );
// Fallback to featured image if available
elseif ( has_post_thumbnail($lead_article) ):
$lead_article_img_horizontal = esc_url( wp_get_attachment_image_src(get_post_thumbnail_id($lead_article), "tol-horizontal")[0] );
$lead_article_img_vertical = esc_url( wp_get_attachment_image_src(get_post_thumbnail_id($lead_article), "tol-vertical")[0] );
endif;
if ( $lead_article_img_horizontal && $lead_article_img_vertical ):
?>
<div id="lead-article" class="post home-featured-post featured-style10 post-header">
<div data-interchange="[<?php echo $lead_article_img_horizontal ?>, landscape], [<?php echo $lead_article_img_vertical ?>, portrait]" class="parallax_bg skrollable skrollable-between" data-bottom-top="transform: translate3d(0px, -20%, 0px);" data-top-bottom="transform: translate3d(0px, 20%, 0px);" style="transform: translate3d(0px, 0.382158%, 0px);background-image: url(<?php echo $lead_article_img_horizontal ?>)"></div>
</div>
<?php
endif;
?>
我使用了 wordpress Multiple Post Thumbnails 插件来添加自定义 post 元框图像字段。
if (class_exists('MultiPostThumbnails')) {
new MultiPostThumbnails(
array(
'label' => 'Homepage Full-Width',
'id' => 'homepage-full-width',
'post_type' => 'post'
)
);
}
我想在我的网站首页大横幅默认特色图片中以全尺寸显示这张新特色图片 (http://nimb.ws/YelErQ)。
现在主题上面 post 特色图像显示在主题前面 - page.php 文件中使用以下代码。
<?php
$lead_article = ot_get_option('lead_article');
if (has_post_thumbnail($lead_article)) :
$lead_article_img_horizontal = wp_get_attachment_image_src(get_post_thumbnail_id($lead_article), "tol-horizontal");
$lead_article_img_vertical = wp_get_attachment_image_src(get_post_thumbnail_id($lead_article), "tol-vertical");
$lead_article_img_horizontal_src = esc_url( $lead_article_img_horizontal[0]);
$lead_article_img_vertical_src = esc_url( $lead_article_img_vertical[0]);
?>
<div id="lead-article" class="post featured-style10 post-header">
<div data-interchange="[<?php echo $lead_article_img_horizontal_src ?>, landscape], [<?php echo $lead_article_img_vertical_src ?>, portrait]" class="parallax_bg skrollable skrollable-between" data-bottom-top="transform: translate3d(0px, -20%, 0px);" data-top-bottom="transform: translate3d(0px, 20%, 0px);" style="transform: translate3d(0px, 0.382158%, 0px);background-image: url(<?php echo $lead_article_img_horizontal_src ?>)"></div>
</div>
<?php endif; ?>
我遵循了插件说明 https://github.com/voceconnect/multi-post-thumbnails/wiki 但在我的 front-page.php 文件中不起作用。
所以任何人都知道这个的解决方案然后请帮助我。
谢谢。
根据 documentation,您需要做的就是将此代码添加到您的模板中以显示您的自定义缩略图:
<?php if (class_exists('MultiPostThumbnails')) :
MultiPostThumbnails::the_post_thumbnail(
get_post_type(),
'homepage-full-width'
);
endif; ?>
请注意,要使此代码正常工作,您需要将其放在 The Loop.
中的某处更新:
假设 ot_get_option('lead_article')
returns 一个 ID,试试这个:
<?php
$lead_article = ot_get_option('lead_article');
$lead_article_img_horizontal = null;
$lead_article_img_vertical = null;
if (
class_exists('MultiPostThumbnails')
&& MultiPostThumbnails::has_post_thumbnail( get_post_type($lead_article), 'homepage-full-width', $lead_article )
):
$lead_article_img_horizontal = MultiPostThumbnails::get_post_thumbnail_url( get_post_type($lead_article), 'homepage-full-width', $lead_article );
$lead_article_img_vertical = esc_url( wp_get_attachment_image_src(get_post_thumbnail_id($lead_article), "tol-vertical")[0] );
// Fallback to featured image if available
elseif ( has_post_thumbnail($lead_article) ):
$lead_article_img_horizontal = esc_url( wp_get_attachment_image_src(get_post_thumbnail_id($lead_article), "tol-horizontal")[0] );
$lead_article_img_vertical = esc_url( wp_get_attachment_image_src(get_post_thumbnail_id($lead_article), "tol-vertical")[0] );
endif;
if ( $lead_article_img_horizontal && $lead_article_img_vertical ):
?>
<div id="lead-article" class="post home-featured-post featured-style10 post-header">
<div data-interchange="[<?php echo $lead_article_img_horizontal ?>, landscape], [<?php echo $lead_article_img_vertical ?>, portrait]" class="parallax_bg skrollable skrollable-between" data-bottom-top="transform: translate3d(0px, -20%, 0px);" data-top-bottom="transform: translate3d(0px, 20%, 0px);" style="transform: translate3d(0px, 0.382158%, 0px);background-image: url(<?php echo $lead_article_img_horizontal ?>)"></div>
</div>
<?php
endif;
?>