How to change prev/next post links to images

  • Resolved annaeleo

    (@annaeleo)


    7 years, 4 months ago

    Hi! I’ve been trying to change next post / previous post text links to images but with no success. I’ve tried to search from google but I didn’t find any answers.

    The css code I tried was

    .pagi-next {
	width: 350px;
	padding: 75px 0 0 0;
	height: 0;
	background: url("URL") no-repeat;
	overflow: hidden;
}

    but it only made the next post text to disappear. So can any of you help me?

Viewing 4 replies - 1 through 4 (of 4 total)

  • Not sure exactly what you are attempting to do here, but your height is set to 0. Pretty sure anything with a height of 0 is going to be invisible. I do believe if you set your height to a higher value, your text links will probably come back. Most likely you are not going to be able to solve this with CSS alone and are going to have to partially recode the PREV/NEXT links themselves.

    I am just guessing though.

    Thread Starter annaeleo

    (@annaeleo)

    I tried to change the height, but nothing happened. So is it possible to add the link to the image in the content.php file then? Here’s what it looks like. 

       <?php
        $prev_post = get_previous_post();
        $next_post = get_next_post();
    ?>

    <?php if (!empty( $prev_post )) : ?>
    <span class="pagi-prev"><a href="<?php echo get_permalink( $prev_post->ID ); ?>"><i class="fa fa-caret-left"></i><?php _e('Previous Post', 'maidesign'); ?></a></span>
    <?php endif; ?>

    <?php if (!empty( $next_post )) : ?>
    <span class="pagi-next"><a href="<?php echo get_permalink( $next_post->ID ); ?>"><?php _e('Next Post', 'maidesign'); ?> <i class="fa fa-caret-right"></i></a></span>
    <?php endif; ?>

</div>
<?php endif; ?>

    And what I’m trying to do is use this image
    instead of the text link to the next (and previous) post.

    • This reply was modified 7 years, 4 months ago by annaeleo.
    • This reply was modified 7 years, 4 months ago by annaeleo.
    • This reply was modified 7 years, 4 months ago by annaeleo.
    • This reply was modified 7 years, 4 months ago by annaeleo.
    Thread Starter annaeleo

    (@annaeleo)

    Can’t anyone help?

    Thread Starter annaeleo

    (@annaeleo)

    Nicely helped. I solved it by myself finally.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘How to change prev/next post links to images’ is closed to new replies.

Tags