How To Edit The Text In Read More Button

• 

  hrhngx · Member · Dec 12, 2014 at 2:21 am

  • Copy link
  • Add topic to favorites

  How can I remove “Read More→” text [the arrow symbol, too] and insert my custom text in the button?

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Dec 12, 2014 at 3:28 am

  • Copy link

  Hi, due to the way the HTML and CSS are done for the read more button on Intergalactic, I can’t think of a way to edit the text that is there, however we can take away the arrow with the following CSS.

  a.more-link:after {
      content: "";
  }

  Sometimes the read more text is within a span tag, and in those cases we can hide that span tag and then use the :before or :after pseudo selectors to add different text, but not with this theme.

• 

  hrhngx · Member · Dec 12, 2014 at 7:36 pm

  • Copy link

  Yes, thanks to you; at least, I’ve managed to take away the arrow with the CSS above successfully!
  And I’ve learnt many cool tips from you as usual!
  Thank you very much again and again, sir…

  By the way, how can I make the hover color of “Read More” text as #000000 individually?
  Thank you for your patience again…

• 

  thesacredpath · Member · Dec 12, 2014 at 10:56 pm

  • Copy link

  This will turn the read more text black when hovered on all read more links.

  .entry-content a.more-link:hover {
      color: #000 !important;
  }

• 

  hrhngx · Member · Dec 13, 2014 at 1:15 am

  • Copy link

  Awesome! Just because of that I couldn’t handle this button, I had to leave it as “display: none” for a while; until I would find a better way…
  Thanks to you, I’ve done it and now I can use my button actively…
  Thank you very much again and again, sir…

• 

  thesacredpath · Member · Dec 13, 2014 at 8:19 pm

  • Copy link

  You are welcome.