Problem with changing default [Read more] button.

Community Forums Forums Design Tips and Tricks Problem with changing default [Read more] button.

This topic is: resolved

This topic contains 6 replies, has 2 voices, and was last updated by  abssquad 6 months ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #100268

    abssquad
    Member
    Post count: 7

    Hey,

    I have trouble finding the code, that is giving me the default Read more button, when making text brake in my blog.

    I want to customize my default [Read More] button to a simple blue link, without brackets.

    Im using Metro pro theme running on genesis. Looked everywhere but I didn’t managed to find the specific code.

    Anyone has ideas, what shall I do?

    http://abssquad.com
    #100314

    nutsandbolts
    Moderator
    Post count: 3140

    Try adding this to functions.php (customize the last line with whatever you’d like your “read more” link to say):

    // Customize Read More text
    add_filter( 'excerpt_more', 'nabm_more_link' );
    add_filter( 'get_the_content_more_link', 'nabm_more_link' );
    add_filter( 'the_content_more_link', 'nabm_more_link' );
    function nabm_more_link() {
    return '<a href="' . get_permalink() . '" rel="nofollow">Continue Reading...</a>';
    }

    You could also give it a div class to make it easier to style.


    Andrea Whitmer, Owner, Nuts and Bolts Media
    I provide dev and training services for web designers • Find me on Twitter and Google+

    #100364

    abssquad
    Member
    Post count: 7

    Awesome job Andrea!! Thanks a lot.

    There is still this one thing I was wondering about, that how can I change the colour of the continue reading link, right now it is black but I would like a certain blue tone for it, and is it possible to remove the line under it as well?

    #100502

    nutsandbolts
    Moderator
    Post count: 3140

    I usually give my link a div class, like this:

    // Customize Read More text
    add_filter( 'excerpt_more', 'nabm_more_link' );
    add_filter( 'get_the_content_more_link', 'nabm_more_link' );
    add_filter( 'the_content_more_link', 'nabm_more_link' );
    function nabm_more_link() {
    return '<a href="' . get_permalink() . '" rel="nofollow"><div class="morelink"Continue Reading...</div></a>';
    }

    That way in my stylesheet I can do things like this:

    .morelink {
    color: blue;
    text-decoration: none;
    }
    
    .morelink:hover {
    color: #000;
    }

    Or whatever styling works best for your situation. Hopefully that makes sense.


    Andrea Whitmer, Owner, Nuts and Bolts Media
    I provide dev and training services for web designers • Find me on Twitter and Google+

    #100553

    abssquad
    Member
    Post count: 7

    Im afraid there is a mistake in the last code, because the continue reading link will dissapear when I change the first code to second you gave me.

    Since Im not very familiar with css I cant figure out what is the problem there.

    Sorry for the trouble, hope you can help me with that.

    #101274

    nutsandbolts
    Moderator
    Post count: 3140

    Sorry about that – you’re correct, there’s an error there. Try this one:

    // Customize Read More text
    add_filter( 'excerpt_more', 'nabm_more_link' );
    add_filter( 'get_the_content_more_link', 'nabm_more_link' );
    add_filter( 'the_content_more_link', 'nabm_more_link' );
    function nabm_more_link() {
    return '<div class="morelink"><a href="' . get_permalink() . '" rel="nofollow">Continue Reading...</a></div>';
    }

    Andrea Whitmer, Owner, Nuts and Bolts Media
    I provide dev and training services for web designers • Find me on Twitter and Google+

    #101819

    abssquad
    Member
    Post count: 7

    Thanks a lot Andrea, that solved the problem.

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.