[conuaf]

conuaf

#4268

How do I replace the “Continue reading” button with just a plain “Continue Reading” text link?

[Kenneth John Odle]

Kenneth John Odle

#27753

There has been a lot of talk on this forum about replacing the text for the “Continue reading” button, but this is the first time I’ve seen this.

That entire block button is created using CSS. (You have been reading up that, right?)

You’ll might want to change it from block to an inline display using this custom CSS:

a.more-link, a.more-link span {

display: inline;

margin: 10px 0 5px;

}

(You can adjust those margins, too.)

The rest of the code from the stylesheet is

.block-button,

.block-button:visited,

.Button,

.button,

#commentform #submit {

background: url(images/bg-block-button.png) left bottom repeat-x #1C5FA5;

background: -moz-linear-gradient(#2982C5, #1C5FA5);

background: -webkit-linear-gradient(#2982C5, #1C5FA5);

background: linear-gradient(#2982C5, #1C5FA5);



-moz-border-radius: 3px;

-webkit-border-radius: 3px;

border-radius: 3px;



-moz-box-shadow: 0 0 5px #555;

-webkit-box-shadow: 0 0 5px #555;

box-shadow: 0 0 5px #555;



border: 1px solid #1C5FA5;

color: #fff;

cursor: pointer;

display: block;

float: right;

font: bold 12px arial;

margin: 10px 5px 5px;

padding: 5px 15px 6px;

position: relative;

text-decoration: none;

text-shadow: 0 -1px 0 #16497E;

}

Undo any changes you’ve made from Graphene’s display options (“block buttons” in the “colours” options), and then add something that undoes everything in the above bit of code, like this:

.block-button:hover,

.button:hover,

#commentform #submit:hover {

background: none;

border:none;

color: #000;

cursor: pointer;

etc.

Good luck and let us know if you get stuck!