Add 'Read More' button to blog main page

[kshibata]

Hello,

I’m using the icon stack and would like to add a Read More button to the blog main page. I have blog posts in English and Japanese. I’d like to have a button in both languages.

thank you

[paul.r]

Hi,

Thanks for writing in!

To add read more, add the code below in your child theme’s functions.php file.

 function x_excerpt_string( $more ) {
    $stack = x_get_stack();
    if ( $stack == 'integrity' ) {
      return ' ... <div><a href="' . get_permalink() . '" class="more-link">' . __( 'Read More', '__x__' ) . '</a></div>';
    } else if ( $stack == 'renew' ) {
      return ' ... <a href="' . get_permalink() . '" class="more-link">' . __( 'Read More', '__x__' ) . '</a>';
    } else if ( $stack == 'icon' ) {
      return ' ... <a href="' . get_permalink() . '" class="more-link">' . __( 'Read More', '__x__' ) . '</a>';
    } else if ( $stack == 'ethos' ) {
      return ' ... <a href="' . get_permalink() . '" class="more-link">' . __( 'Read More', '__x__' ) . '</a>';
    }
  }
  add_filter( 'excerpt_more', 'x_excerpt_string' );

Then if you would not like it to be in uppercase, you can add the code below in Theme Options > CSS

.more-link {
   text-transform:none;
}

Hope that helps

[kshibata]

Thank you.

The code added a ‘read more’ link, but…

1. I’d like it to be a centered button
2. It doesn’t show up in Japanese, only English.

Can you help with this? Thank you!

[Prasant]

Hello @kshibata,

Thanks for updating the thread.

Please update the CSS code with following:

.more-link {
   text-transform:none;
   text-align: center; 
}

Regarding translation, I would suggest you to please take a look at following article:

Theme Translations | Themeco Docs

Thanks.

[kshibata]

Thank you.

I added that code to the custom css in my child theme, but still no button.
Can you please assist?
Thank you!

[nico]

Hi @kshibata,

In this case, please share us your admin credentials and FTP so we could check your setup closer.

Don’t forget to set it in a secure note.

Thanks.

[rad]

Hi there,

I do see the read more on both language, the upper post doesn’t have the read more since it has a manually added excerpt. Is that what you’re referring? Or do you wish to make it look as a button?

For the meantime, please add this code too to make sure the manually added excerpt will have a read more link too.

function manually_added_excerpt_more( $excerpt ) {
	$excerpt_more = '';
	if( has_excerpt() ) {
        
	            $stack = x_get_stack();
			    if ( $stack == 'integrity' ) {
			      $excerpt_more =  ' ... <div><a href="' . get_permalink() . '" class="more-link">' . __( 'Read More', '__x__' ) . '</a></div>';
			    } else if ( $stack == 'renew' ) {
			      $excerpt_more = ' ... <a href="' . get_permalink() . '" class="more-link">' . __( 'Read More', '__x__' ) . '</a>';
			    } else if ( $stack == 'icon' ) {
			      $excerpt_more =  ' ... <a href="' . get_permalink() . '" class="more-link">' . __( 'Read More', '__x__' ) . '</a>';
			    } else if ( $stack == 'ethos' ) {
			      $excerpt_more =  ' ... <a href="' . get_permalink() . '" class="more-link">' . __( 'Read More', '__x__' ) . '</a>';
			    }
       
	}
	return $excerpt . $excerpt_more;
}
add_filter( 'get_the_excerpt', 'manually_added_excerpt_more' );

Thanks!