Read More Button

[prajwaldesai]

Hi,

I want to add read more button to my posts.Currently on my site the read more button is shown but in brackets. I want my read more button to look like this : example http://www.onlineteflacademy.com/

My website link : http://prajwaldesai.com. i am using a corporate child theme.

[Len]

Hi prajwaldesai

It looks like you're using the Content Limit (as opposed to excerpts) to display content. If you view source, you'll see a line of text, part of which reads ...

class="more-link">[Read more...]

Now we know what CSS selector to target - it is the a.more-link

All you need to do is add the following to the style.css file ...

a.more-link {
your styling rules
}

For instance ...

a.more-link {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
background-color: #e96a2a;
border-radius: 3px;
color: #fff !important;
float: right;
font-size: 13px;
font-weight: normal;
padding: 8px 12px 6px;
text-align: center;
text-decoration: none;
}

This will give you a button that has a slightly rounded border (3px), a background colour (#e96a2a), a font colour (#fff), it floats right, has a font size of 13px with a normal weight, a padding of 8px-top, 12px-sides and 6px-bottom, the text is centered and there is no text decoration.

a.more-link:hover {
background-color: #444;
text-decoration: none;
}

When you hover over the button the background colour will change to #444 (dark grey) and no text-decoration.

Use your imagination and style it however you want. 🙂

To get rid of the brackets add the following to your theme's functions.php file ...

/** Modify the Genesis content limit read more link */
add_filter( 'get_the_content_more_link', 'corporate_read_more_link' );
function corporate_read_more_link() {
return '... <a class="more-link" href="' . get_permalink() . '">Read More ...';
}

This will give you Read More followed by 3 dots. Insert whatever you want there.

Always make a backup of your files before editing them so you can revert if you make a mistake.

[Davinder Singh Kainth]

To remove Read More... just add following code to functions.php file


// Remove read more - basicWP.com
add_filter( 'get_the_content_more_link', 'child_read_more_link' );
function child_read_more_link() {
return '';
}


source - http://www.basicwp.com/remove-read-more-link-posts-genesis/

---

Sunshine PRO genesis theme
Need Genesis help? Davinder @ iGuiding Media | My Blog | Fresh Genesis Themes

[Author]

Posts