当帖子标题超出限制时，使字体大小变小

Question

我正在制作一个wordpress网站，在image中使用可视化作曲家帖子网格制作页面产品。当产品名称变得稍长时，它会分成两行并扭曲列的高度。如果标题长于列的宽度，我如何告诉它使字体变小？

Answer 1

首先，由于您应该构建响应式网站，这可能会很尴尬。您的文本应该根据阅读网站的屏幕重新调整，如果您尝试定义更改以使文本适合一行，您可能会反复调整此内容。

我建议您围绕此设计并自定义您的布局，而不是一遍又一遍地尝试根据文本长度更改大小。

但是，您可以在PHP / CSS中执行以下操作。

检查strlen功能上的get_title。如果strlen超过指定金额（比如20），您就会添加一个类，否则请忽略它。然后，根据您想要更改字体的方式，您可以根据需要设置该类的样式。

您需要编辑主题以使用以下内容替换标题：

<?php 

$title = get_the_title();

if (strlen($title) >= 20) {
  <h1 class="longer-text-modifier">
} else {
  <h1>
}

  <?= $title; ?>
</h1>

你的CSS是

.longer-text-modifier {
  font-size: 16px; // or em or rem
}

编辑：这也可以通过JavaScript动态完成。