WP有用于使用wp_trim_word的钩子吗?

时间:2018-07-10 作者:alex

我正在使用引导程序来布局一个简单的网页。我还添加了一些css(@media (min-width: 1920px) {..}) 用于不同分辨率的媒体查询

现在我希望WP有一个钩子来检查媒体分辨率,这样我就可以修剪更多的字符/单词。

<?php echo wp_trim_words(get_the_content(), 40, \'...\'); ?>
vs公司

 <?php echo wp_trim_words(get_the_content(), 70, \'...\'); ?>
简而言之,如何根据浏览器分辨率输出不同的文本长度?

3 个回复
SO网友:cjbj

浏览器分辨率在用户端设置。实际上,页面加载后,甚至可以调整窗口的大小。Css媒体查询将在用户端处理这些问题。

因此,当在服务器端生成页面时,用户窗口的大小是未知的,您无法确定此时要服务的单词数。它必须在用户端完成。

最简单的方法是包含最长的摘录,并将最后30个单词包装在<span> 标签,您可以在较小的屏幕上使用css隐藏这些标签。

更复杂的方法是使用jquery检测屏幕大小,然后调用rest api 检索相关摘录。

SO网友:Howdy_McGee

找出特定函数是否有挂钩的一种方法是在WordPress Code Reference, 通常只需输入函数名并选中“Hooks”。这将直接将您带到hook of the same name 或者列出与请求匹配的挂钩列表。

此外,您可以访问the function itself 使用上述相同方法并选中“函数”。通过向下导航#Source section 您可以单击Expand full source code 链接,它将显示整个函数,您可以通过它查看它可能具有的任何挂钩。

最后,如果您真的需要这样做,那么您不会使用PHP来检查浏览器的分辨率,您应该使用Javascript或CSS(溢出:隐藏?)但我不建议你这样做。

SO网友:Den Isahac

通过Javascript检查浏览器分辨率,或者在您的情况下,bootstrap具有不同的媒体断点,您可以使用这些断点隐藏/显示不同长度的摘录

1。适用于小型设备(横向电话,576px及以上)

@media (min-width: 576px) { ... }

<span class="d-none d-sm-block d-md-none">
    <?php echo wp_trim_words(get_the_content(), 40, \'...\'); ?>
</span>

2。适用于中型设备(平板电脑、768px及以上)

@media (min-width: 768px) { ... }

<span class="d-none d-md-block d-lg-none">
    <?php echo wp_trim_words(get_the_content(), 50, \'...\'); ?>
</span>

3。适用于大型设备(台式机、992px及以上)

@media (min-width: 992px) { ... }

<span class="d-none d-lg-block d-xl-none">
    <?php echo wp_trim_words(get_the_content(), 60, \'...\'); ?>
</span>

4。适用于超大设备(大型台式机、1200px及以上)

@media (min-width: 1200px) { ... }

<span class="d-none d-xl-block">
    <?php echo wp_trim_words(get_the_content(), 70, \'...\'); ?>
</span>

结束

相关推荐