Wordpress Portfolio:内嵌标题和元数据的特色图片
Wordpress Portfolio: Featured Image inline with title and meta
首先,我相当缺乏经验 - 尤其是 PHP。任何指导将不胜感激。
我正在尝试自定义 Wordpress 投资组合 post 页面。我希望 post 标题和元显示在特色图片的右侧。
我尝试使用纯 CSS 来完成此操作,添加 "display:inline-block" 并浮动图像和标题。这不起作用,所以我假设我需要编辑 php 模板 (content-portfolio.php),但不知道该怎么做。
再次,任何指导将不胜感激。非常感谢!
现在存在的 content-portfolio.php 文件是:
<?php
// =============================================================================
// VIEWS/INTEGRITY/CONTENT-PORTFOLIO.PHP
// -----------------------------------------------------------------------------
// Portfolio post output for Integrity.
// =============================================================================
$archive_share = x_get_option( 'x_integrity_portfolio_archive_post_sharing_enable' );
?>
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<div class="entry-featured">
<?php x_portfolio_item_featured_content(); ?>
</div>
<div class="entry-wrap cf">
<?php if ( x_is_portfolio_item() ) : ?>
<div class="entry-info">
<header class="entry-header">
<h1 class="entry-title entry-title-portfolio"><?php the_title(); ?></h1>
<?php x_integrity_entry_meta(); ?>
</header>
<?php x_get_view( 'global', '_content', 'the-content' ); ?>
</div>
<div class="entry-extra">
<?php x_portfolio_item_tags(); ?>
<?php x_portfolio_item_project_link(); ?>
<?php x_portfolio_item_social(); ?>
</div>
<?php else : ?>
<header class="entry-header">
<h2 class="entry-title entry-title-portfolio">
<a href="<?php the_permalink(); ?>" title="<?php echo esc_attr( sprintf( __( 'Permalink to: "%s"', '__x__' ), the_title_attribute( 'echo=0' ) ) ); ?>"><?php x_the_alternate_title(); ?></a>
</h2>
</header>
<?php x_get_view( 'global', '_content' ); ?>
<?php endif; ?>
</div>
</article>
我不知道你的意思是不是在 h1 行中都有:
<h1 class="entry-title entry-title-portfolio"><?php the_title(); x_integrity_entry_meta();?></h1>
您也可以尝试将 entry-header 样式更改为 .entry-header{display:flex}
您可以使用纯 css。
您需要为 header ".entry-header".
指定一个特定的宽度
同时将 "display:inline" 分配给“.entry-title-portfolio”和包装元内容的标签。
header.entry-header { width: 100%; }
h1.entry-title-portfolio { display: inline; }
[your meta class] { display: inline; }
首先,我相当缺乏经验 - 尤其是 PHP。任何指导将不胜感激。
我正在尝试自定义 Wordpress 投资组合 post 页面。我希望 post 标题和元显示在特色图片的右侧。
我尝试使用纯 CSS 来完成此操作,添加 "display:inline-block" 并浮动图像和标题。这不起作用,所以我假设我需要编辑 php 模板 (content-portfolio.php),但不知道该怎么做。
再次,任何指导将不胜感激。非常感谢!
现在存在的 content-portfolio.php 文件是:
<?php
// =============================================================================
// VIEWS/INTEGRITY/CONTENT-PORTFOLIO.PHP
// -----------------------------------------------------------------------------
// Portfolio post output for Integrity.
// =============================================================================
$archive_share = x_get_option( 'x_integrity_portfolio_archive_post_sharing_enable' );
?>
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<div class="entry-featured">
<?php x_portfolio_item_featured_content(); ?>
</div>
<div class="entry-wrap cf">
<?php if ( x_is_portfolio_item() ) : ?>
<div class="entry-info">
<header class="entry-header">
<h1 class="entry-title entry-title-portfolio"><?php the_title(); ?></h1>
<?php x_integrity_entry_meta(); ?>
</header>
<?php x_get_view( 'global', '_content', 'the-content' ); ?>
</div>
<div class="entry-extra">
<?php x_portfolio_item_tags(); ?>
<?php x_portfolio_item_project_link(); ?>
<?php x_portfolio_item_social(); ?>
</div>
<?php else : ?>
<header class="entry-header">
<h2 class="entry-title entry-title-portfolio">
<a href="<?php the_permalink(); ?>" title="<?php echo esc_attr( sprintf( __( 'Permalink to: "%s"', '__x__' ), the_title_attribute( 'echo=0' ) ) ); ?>"><?php x_the_alternate_title(); ?></a>
</h2>
</header>
<?php x_get_view( 'global', '_content' ); ?>
<?php endif; ?>
</div>
</article>
我不知道你的意思是不是在 h1 行中都有:
<h1 class="entry-title entry-title-portfolio"><?php the_title(); x_integrity_entry_meta();?></h1>
您也可以尝试将 entry-header 样式更改为 .entry-header{display:flex}
您可以使用纯 css。
您需要为 header ".entry-header".
指定一个特定的宽度同时将 "display:inline" 分配给“.entry-title-portfolio”和包装元内容的标签。
header.entry-header { width: 100%; }
h1.entry-title-portfolio { display: inline; }
[your meta class] { display: inline; }