php - Wordpress Portfolio:带有标题和元数据的特色图片
问题描述
首先,我相当缺乏经验——尤其是 PHP。任何指导将不胜感激。
我正在尝试自定义 Wordpress 投资组合帖子页面。我希望帖子标题和元数据显示在特色图像的内联和右侧。
我尝试使用纯 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>
解决方案
你可以用纯CSS来做。
您需要为标题“.entry-header”分配特定宽度。
并且还将“display:inline”分配给“.entry-title-portfolio”和包装您的元内容的标签。
header.entry-header { width: 100%; }
h1.entry-title-portfolio { display: inline; }
[your meta class] { display: inline; }
推荐阅读
- c++ - 使用指针向量移动构造函数
- java - 使用 JAXB 解组嵌套 XML
- drop-down-menu - Grafana 动态仪表板
- c# - 继承配置文件的自动映射器在 json 中返回额外的属性
- javascript - Rest API 搜索结果与搜索页面返回的结果不一样
- python - 使用 Python 从网页中提取链接
- python - pandas 按组计算移动的滚动方差
- firefox - 什么可以从后台页面替换 webextensions 中的 window.confirm 函数?
- android - 有没有一种简单的方法在 gradle 中包含常用功能设置
- jquery - 在表格内使用 jQuery 进行遍历