Title: Read More Button
Last modified: August 20, 2016

---

# Read More Button

 *  Resolved [MYLauren](https://wordpress.org/support/users/mylauren/)
 * (@mylauren)
 * [13 years, 2 months ago](https://wordpress.org/support/topic/read-more-button-2/)
 * Hi,
 * I’ve read how to make a “Read More” link. I was wondering how I would make my
   link a button instead like the others throughout my blog.
 * I used the code below to make the buttons on my posts page:
 * .read-more {
    font-family: sans-serif; display: inline-block; line-height: 1em;
   padding: 6px 13px; margin:0 .6em 1.5em 0; border: 1px solid #a2547a; border-bottom-
   color: #65209a; color: white !important; text-align: center; text-shadow: 0 -
   1px 0 hsla(0,0%,0%,.3); text-decoration: none !important;
 *  /*Border radius*/
    -webkit-border-radius: 15px; -moz-border-radius: 15px; border-
   radius: 15px;
 *  /*Background*/
    background-color: #a2547a; /*Fallback*/ background: -webkit-
   gradient( linear, left top, left bottom, color-stop(.2, #a2547a), color-stop(
   1, #a2547a) ); background: -moz-linear-gradient( center top, #a2547a 20%, #a2547a
   100% );
 *  /*Box shadow*/
    -webkit-box-shadow: inset 0 1px 0 hsla(230,230,250) /*Top*/,
   inset 0 0 2px hsla(230,230,250) /*Shine*/, 0 1px 2px hsla(230,230,250) /*Shadow*/;-
   moz-box-shadow: inset 0 1px 0 hsla(230,230,250) /*Top*/, inset 0 0 2px hsla(230,230,250)/*
   Shine*/, 0 1px 2px hsla(230,230,250) /*Shadow*/; box-shadow: inset 0 1px 0 hsla(
   0,100%,100%,.3) /*Top*/, inset 0 0 2px hsla(230,230,250) /*Shine*/, 0 1px 2px
   hsla(230,230,250) /*Shadow*/; }
 * How can I manage the same within your widget? Thank you.
 * [http://wordpress.org/extend/plugins/feature-a-page-widget/](http://wordpress.org/extend/plugins/feature-a-page-widget/)

Viewing 1 replies (of 1 total)

 *  Plugin Author [mrwweb](https://wordpress.org/support/users/mrwweb/)
 * (@mrwweb)
 * [13 years, 2 months ago](https://wordpress.org/support/topic/read-more-button-2/#post-3570419)
 * If you’re using the code from the FAQ page, you just need to add your CSS class
   to the link:
 * `return $excerpt . ' <a class="read-more" href="' . get_permalink( $featured_page_id).'"
   >Read More…</a>';`

Viewing 1 replies (of 1 total)

The topic ‘Read More Button’ is closed to new replies.

 * ![](https://ps.w.org/feature-a-page-widget/assets/icon.svg?rev=974121)
 * [Feature A Page Widget](https://wordpress.org/plugins/feature-a-page-widget/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/feature-a-page-widget/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/feature-a-page-widget/)
 * [Active Topics](https://wordpress.org/support/plugin/feature-a-page-widget/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/feature-a-page-widget/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/feature-a-page-widget/reviews/)

## Tags

 * [buttons](https://wordpress.org/support/topic-tag/buttons/)

 * 1 reply
 * 2 participants
 * Last reply from: [mrwweb](https://wordpress.org/support/users/mrwweb/)
 * Last activity: [13 years, 2 months ago](https://wordpress.org/support/topic/read-more-button-2/#post-3570419)
 * Status: resolved