Customising The Text Of "Read More" Link

Customising The Text Of "Read More" Link

---

Now, to add style to the text link, you will have to add CSS to the .jump-link element. 

Again click anywhere in between the HTML code and press CTRL+F (or CMD+F on Mac) to open the Search box in the top right corner. Using the search box, search for the code given below.

]]></b:skin>

Now just above the code you found, paste you CSS code. CSS will look like this.

.jump-link {
text-align:center;
}

.jump-link a {
font-size:15px;
padding:10px;
font-weight: 900;
font-style: normal;
color: rgb(16, 32, 232);
font-size: 15px;
border: 2px double rgb(55, 151, 178);
border-top-left-radius: 100px;
border-top-right-radius: 100px;
border-bottom-right-radius: 100px;
border-bottom-left-radius: 100px;
border-style: double;

border-style: outset;
border-top-left-radius: 23px;
border-top-right-radius: 23px;
border-bottom-right-radius: 23px;
border-bottom-left-radius: 23px;
height: 31px;
width: 175px;
background-image: linear-gradient(rgb(214, 205, 205), rgb(225, 144, 144));
background-position: initial initial;
background-repeat: initial initial;
background-color: rgb(135, 116, 116);
font-weight:bold;
}

اگر فانٹ بڑا رکھنا ہو تو یہ کوڈ لکھیں 

.jump-link {
text-align:center;
}

.jump-link a {
font-size:40px;
padding:10px;
font-weight: 900;
font-style: normal;
color: rgb(16, 32, 232);
font-size: 40px;
border: 2px double rgb(55, 151, 178);
border-top-left-radius: 100px;
border-top-right-radius: 100px;
border-bottom-right-radius: 100px;
border-bottom-left-radius: 100px;
border-style: double;

border-style: outset;
border-top-left-radius: 23px;
border-top-right-radius: 23px;
border-bottom-right-radius: 23px;
border-bottom-left-radius: 23px;
height: 50px;
width: 300px;
background-image: linear-gradient(rgb(214, 205, 205), rgb(225, 144, 144));
background-position: initial initial;
background-repeat: initial initial;
background-color: rgb(135, 116, 116);
font-weight:bold;
}

or  second  mathod


search


<div class='jump-link'> <a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><data:post.jumpText/></a>
</div>



replace with


<div class='jump-link'>
<a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'>Continue »</a>
</div>