最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

php - Hide or Show Read More Button by Content Area

programmeradmin3浏览0评论

I'm trying to hide the read more button somehow based on character count, the button should only appear on long posts. But since I also control the button with css, maybe I need to hide it based on the height setting of the content, not the number of characters. (I'm not sure about that)

First of all, the number of characters is checked with this code in functions.php

add_filter('excerpt_length', 'my_excerpt_length');
function my_excerpt_length($length) {
return 100;

Content.php file contains summary and button

    <div class="news-main">
        <?php the_excerpt(); ?>
    </div>

I open a different div underneath it and add a button.

<div class="news-read">
<a href="<?php echo get_permalink($post->ID); ?>" target="_blank" rel="noopener" class="Read">Read More</a> 
</div>

Then I check the news-main that is the summary area, in css

.news-main { 
overflow: hidden;
max-height:255px
}

The purpose of defining this css is to break the summary right at the end of the line. This way, when the character limit is reached, half a line is not displayed at the bottom.

The reason why I opened the content.php ”news-read” class was to be able to define this css definition. Because if I don't move the button to a different div, the height setting in css hides the button completely. I understand that the button needs to be somehow linked to the character count or hidden according to the height setting in the css. Because the button is in a completely different div.

How can I somehow hide this button according to the height setting or the number of characters?

EDIT About the code written by @Studio Wai

I noticed that the code partially works. However, this code behaves a little strangely. If I set the character limit in functions.php to 150 and the character limit in content.php to 999, the code works as expected for me. It depends on functions.php, but the character limit in content.php needs to be set differently. (Maybe it's because of the strlen definition, I'm not sure)

The character limit in functions.php can be 150 or 200, but accordingly the character limit in content.php should also be set like the golden ratio. Otherwise, the button will not be displayed in some long posts.I think there are two possibilities why the code is behaving contradictorily; first, the code is not actually looking at what is in another file, and second, the theme's excpert functions... (The number of characters is actually managed in functions.php and conflicts with the limit in content in php. So the two limits work together. And so the code quality may not be considered good). It is not a code that can be run directly in projects like my project.

Also, in order for the code to work even partially, it needs to be placed in the "news-read" div

 <div class="news-read">
<?php if ($excerpt_length >= $excerpt_limit) : ?>
 <a href="<?php echo get_permalink($post->ID); ?>" target="_blank" rel="noopener" class="Read">Read More</a>
  <?php endif; ?>
 </div>

It may give ideas to those working on a similar project. However, it is useful to know that it does not work stably.

The version I am running in its unstable form is as follows

functions.php

function my_excerpt_length($length) {
    return 150; // Set excerpt length to 100 words
}
add_filter('excerpt_length', 'my_excerpt_length', 20, 1);

content.php

<div class="news-main">
    <?php the_excerpt(); ?>
    <?php
$excerpt = get_the_excerpt();
$excerpt_length = strlen($excerpt);
$excerpt_limit = 999; // Match the limit set in functions.php?>

</div>
</div>
</div>

 <div class="news-read">
    <?php if ($excerpt_length >= $excerpt_limit) : ?>
    <a href="<?php echo get_permalink($post->ID); ?>" target="_blank" rel="noopener" class="Read">Read More</a>
     <?php endif; ?>
 </div>

Thanks for the idea though

I'm trying to hide the read more button somehow based on character count, the button should only appear on long posts. But since I also control the button with css, maybe I need to hide it based on the height setting of the content, not the number of characters. (I'm not sure about that)

First of all, the number of characters is checked with this code in functions.php

add_filter('excerpt_length', 'my_excerpt_length');
function my_excerpt_length($length) {
return 100;

Content.php file contains summary and button

    <div class="news-main">
        <?php the_excerpt(); ?>
    </div>

I open a different div underneath it and add a button.

<div class="news-read">
<a href="<?php echo get_permalink($post->ID); ?>" target="_blank" rel="noopener" class="Read">Read More</a> 
</div>

Then I check the news-main that is the summary area, in css

.news-main { 
overflow: hidden;
max-height:255px
}

The purpose of defining this css is to break the summary right at the end of the line. This way, when the character limit is reached, half a line is not displayed at the bottom.

The reason why I opened the content.php ”news-read” class was to be able to define this css definition. Because if I don't move the button to a different div, the height setting in css hides the button completely. I understand that the button needs to be somehow linked to the character count or hidden according to the height setting in the css. Because the button is in a completely different div.

How can I somehow hide this button according to the height setting or the number of characters?

EDIT About the code written by @Studio Wai

I noticed that the code partially works. However, this code behaves a little strangely. If I set the character limit in functions.php to 150 and the character limit in content.php to 999, the code works as expected for me. It depends on functions.php, but the character limit in content.php needs to be set differently. (Maybe it's because of the strlen definition, I'm not sure)

The character limit in functions.php can be 150 or 200, but accordingly the character limit in content.php should also be set like the golden ratio. Otherwise, the button will not be displayed in some long posts.I think there are two possibilities why the code is behaving contradictorily; first, the code is not actually looking at what is in another file, and second, the theme's excpert functions... (The number of characters is actually managed in functions.php and conflicts with the limit in content in php. So the two limits work together. And so the code quality may not be considered good). It is not a code that can be run directly in projects like my project.

Also, in order for the code to work even partially, it needs to be placed in the "news-read" div

 <div class="news-read">
<?php if ($excerpt_length >= $excerpt_limit) : ?>
 <a href="<?php echo get_permalink($post->ID); ?>" target="_blank" rel="noopener" class="Read">Read More</a>
  <?php endif; ?>
 </div>

It may give ideas to those working on a similar project. However, it is useful to know that it does not work stably.

The version I am running in its unstable form is as follows

functions.php

function my_excerpt_length($length) {
    return 150; // Set excerpt length to 100 words
}
add_filter('excerpt_length', 'my_excerpt_length', 20, 1);

content.php

<div class="news-main">
    <?php the_excerpt(); ?>
    <?php
$excerpt = get_the_excerpt();
$excerpt_length = strlen($excerpt);
$excerpt_limit = 999; // Match the limit set in functions.php?>

</div>
</div>
</div>

 <div class="news-read">
    <?php if ($excerpt_length >= $excerpt_limit) : ?>
    <a href="<?php echo get_permalink($post->ID); ?>" target="_blank" rel="noopener" class="Read">Read More</a>
     <?php endif; ?>
 </div>

Thanks for the idea though

Share Improve this question edited Mar 16 at 4:19 A. Muller asked Mar 12 at 19:32 A. MullerA. Muller 439 bronze badges
Add a comment  | 

1 Answer 1

Reset to default 0

This checks the number of characters and hide the button server-side in content.php:

<?php
$excerpt = get_the_excerpt();
$excerpt_length = strlen($excerpt);
$excerpt_limit = 100; // Match the limit set in functions.php

// only for debugging:
var_dump($excerpt);
var_dump($excerpt_length);
?>

<div class="news-main">
    <?php the_excerpt(); ?>
</div>

<?php if ($excerpt_length >= $excerpt_limit) : ?>
    <div class="news-read">
        <a href="<?php echo get_permalink($post->ID); ?>" target="_blank" rel="noopener" class="Read">Read More</a>
    </div>
<?php endif; ?>

If your file contains the_excerpt();, comment it out.

<?php // the_excerpt(); ?>

Edit:

Your output looks fine. Can you please remove my code and replace it with <?php the_excpert(); ?> again.

Please update your code in your functions.php:

function my_excerpt_length($length) {
    return 100; // Set excerpt length to 100 words
}
add_filter('excerpt_length', 'my_excerpt_length', 20, 1);

Your function should be defined before calling add_filter(). Otherwise, PHP may throw an error if it can't find my_excerpt_length.

If another plugin or theme is overriding excerpt_length with a later priority, your function might not take effect. Therefore add 20, 1

发布评论

评论列表(0)

  1. 暂无评论