The problem that wordpress's wp_trim_words summary did not intercept to the specified character length was solved

1. Problem description

In the article list of imqd.cn, the method used to truncate and retain the first 75 characters of the text suddenly has no effect.

<p class="post-desc text-black-50 d-none d-md-block">
				<?php
				echo wp_trim_words( get_the_content(), 75, '...');
				?>
</p>

All the text content is directly displayed, resulting in a very long list of articles, which is not good-looking.

The correct should be like this:

Untitled

2. Troubleshooting

  1. First check whether the code has been passive, and found that it has not, because the local test is still normal
  2. Another website discovery made for customers has the same problem
  3. I found that it may be the reason why wp has automatically updated the version. The current version is , and there is no such problem in 6.0.1the previous version .6.0
  4. wordpressThen I updated it locally 6.0.1and found that it was still normal, and this did not happen online
  5. I confirm that wp_trim_wordsthis function WPis still officially supported, so it may be caused by inconsistent online server environments or inconsistent PHP versions, but this method is WPprivate and should not be affected by the environment, so I still don’t know where the problem lies.

3. Problem solving

I didn't find the root cause of the problem, so I had to find another way to solve it.

On the website, directly replace the content with the abstract.

<?php
				echo wp_trim_words( get_the_excerpt(), 75, '...');
?>

I also judged the abstract of the article. If the article does not have an abstract, it will be automatically displayed in the text, so I also added a style method, and if there are more than 3 lines, an ellipsis will automatically appear to solve it.

CSS file:

.threelines {
    
    
    word-break: break-all;
    overflow: hidden;
    text-overflow: ellipsis;
		/*以下3行是核心代码*/
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

/*然后还要给p标签添加一个高度,避免在不支持以上属性的浏览器下不生效*/
.post-body .post-desc {
    
    
    margin-bottom: 0;
    height: 75px;
}

In addition, it is also planned to disable the automatic update of WP, so that a similar situation occurs again, just add the following code in wp-config.js:

define( 'WP_AUTO_UPDATE_CORE', false );

So far the problem is solved. That is, the method of wp + the method of CSS is combined to achieve.

Guess you like

Origin blog.csdn.net/imqdcn/article/details/131687164