Home>Support>Change the “Continue reading” to menu style

Change the “Continue reading” to menu style

By Alexander Hecht, 10 years ago. Last reply by Andrew Misplon, 10 years ago.
Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].

Hello,

I would like to change the Continue Reading button that is placed at the end of a blog excerpt.

I found this: https://siteorigin.com/thread/change-the-continue-reading-button-for-post-excerpts/

Is it possible to make this button look like the menu?

I mean no rounded corners, background like the menu, then hover with the same color as the menu.

I couldn’t manage to get the code myself, it would be nice if you have an idea. I can fill in the color codes afterwards myself.

Thanks

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 10 years, 8 months ago Daniel
    Hi, I Work Here

    Hi Alexander

    Do you have a public URL where we can take a look at this? If you need to keep this URL private from other users, just select “Private Reply” on the bottom right of the comment box.

    Please send a direct link to the page in question.

    Looking forward to hearing from you.

  2. 10 years, 8 months ago Andrew Misplon
    Hi, I Work Here

    Hi Alexander Hecht

    It’ll look something like this:

    /* Change the Continue Reading Button */

article.post .more-link, article.page .more-link {
  padding: 4px 10px;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: none;
  background: red;
  filter: none;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  color: #fff;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}

article.post .more-link:hover, article.page .more-link:hover {
background: blue;
color: black;
}

    Insert under Appearance > Custom CSS. The button comes first then the hover styles.

    Hope that helps. Edit as required.

  3. 10 years, 8 months ago Alexander Hecht

    Thanks Andrew! That works perfectly. Is there a way to change the text to “Read more”?

  4. 10 years, 7 months ago Andrew Misplon
    Hi, I Work Here

    For sure, glad that helped. Changing the text would take a bit of effort. You’d need to use a child theme and copy content-single.php and content.php into the child theme. Then within those two files you’d need to change the string Continue reading. Sorry there isn’t an easier way.

  5. 10 years, 7 months ago Alexander Hecht

    Thanks. I already have a child theme with these phps, so no big effort.

  6. 10 years, 7 months ago Andrew Misplon
    Hi, I Work Here

    Super, let me know if you need a further hand there.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More