Read More Button Instead Of Text - Question | JoomShaper
Back to the questions

Read More Button Instead Of Text

JR

Joe Rupp

Template 3 years ago

I'm using Helix Ultimate and would like the 'read more' links to be buttons instead of text. Wondering if there's an easy way to do that by adding some custom CSS to the template in the template manager. I know other templates do it, but I like the free Helix Ultimate even though I have a paid subscription.

0
7 Answers
Order by
Oldest Newest Votes
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 3 years ago #5408

If you are talking about the readmore text of the blog list page, then here is sample code, need to put in Custom CSS:

.article-list .article .readmore a{
    display: inline-block;
    margin: 10px 0 0;
    font-size: 16px;
    line-height: 20px;
    padding: 4px 12px;
    text-transform: lowercase;
    color: #fff;
    background: #f47d56;
}

Note: Path towards custom CSS: Extensions>Templates>Styles> Click on your current default template name then choose Template Options. Then find custom CSS within the custom code.

https://prnt.sc/pu705g

https://prnt.sc/pu70zn

Hope this helps!

Best Regards

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 3 years ago #5405

Hi there!

Would you please give me your site URL here? It will be easier for me then if I can provide some CSS.

Best Regards

0
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 3 years ago #5407

Hi,

using custom CSS should take you ~ 3 min, if you know CSS of course.

.readmore { your-styles }

But to replace them from typical link to button tag requires a little more work to edit the php file altogether

0
JR
Joe Rupp
Accepted Answer
3 years ago #5410

Thanks y'all. That's exactly what I was looking for. I do know CSS and I can take it from here. Thanks again for the quick response.

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 3 years ago #5413

You are always welcome:)

0
R
radek
Accepted Answer
3 months ago #145454

Hello,

I tried the piece of code and it does not work. Will it work in latest Helix? I need to add read more to article.

The butto is not active: https://user-images.githubusercontent.com/1296369/72349841-30083680-36d5-11ea-93c7-c998a764ff27.png

Thank you

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 3 months ago #145921

Hi radek!

Thanks for your interest.

The code will still work in the latest Helix Ultimate template. It is for the 'read more' text after each article in category blog page.

However, if it doesn't work for you kindly post a new question with your own requirements and site links.

Best Regards

0