Learn more button

@NickMazarot You can use CSS to change "read more" text to "learn more". I saw you used CSS?

/* Hide current Read More */
a.summary-read-more-link {
   visibility: hidden;
}
/* Insert new Learn More */
a.summary-read-more-link:after {
   visibility: visible;
   content: "Learn More →";
   padding: 10px 20px;
   border: 2px solid #fff;
   border-radius: 50px;
   display: inline-block;
   font-family: "Oleo Script";
   font-size: 18px;
}
/* Background Hover for Learn More Button */
a.summary-read-more-link:hover:after {
   background: #fff;
   color: #000;
}

Edited August 5, 2019 by tuanphan
Initial Revision

@NickMazarot Can you share site url with read more button?

https://www.doitlikegreeks.com/beachesBut its under construction ! In this page though you will see both of them ( read more-learn more) button !Thank you

@NickMazarot You can use CSS to change "read more" text to "learn more". I saw you used CSS?

Thank you very much for your answer!I used one of a previous answer that you gave in a different post!Do you know why i can't edit it ?

Thank you very much for your answer!I used one of a previous answer that you gave in a different post!Do you know why i can't edit it ?

@NickMazarot Which post?

https://answers.squarespace.com/questions/277488/how-can-i-edit-the-read-more-design-for-a-summary.htmlIt's this one if i'm not mistaken

@NickMazarot The code I just sent is the same as the code in the post you just sent (and it's the same code you used). I just added some edits.

Not relevant, but I wrote 1500 CSS for 68 Template in Squarespace. Maybe you will need it sometime. https://beaverhero.com/squarespace-all-css/

That's great ! I will need that for sure!! Thank you for your hard work ! I'm not very relevant with codes but i want to learn tbh.One last question about the learn more button! Why i can't edit it??Thank you

"Why can't edit it" - what do you mean? @NickMazarot

Learn more in 3 first posts?

@tuanphan The button "LEARN MORE" that the system had already i can edit it ( Edit the letters,edit the next page that drives you into ,edit the shape of the button ) ,the new one that we added with the code ,i don't have the option to edit and do this kind of stuff that i mentioned !!To be more specific for example it don't give me the option to take of the arrow that have next to the "LEARN MORE" button!https://www.doitlikegreeks.com/beaches

Edited August 5, 2019 by NickMazarot
Initial Revision

@NickMazarod It is added by code, so you need to edit with code.

In the code I sent, you can edit "arrow" (-->).Just copy symbols here and paste. https://fsymbols.com/keyboard/windows/alt-codes/list/

/* Insert new Learn More */
a.summary-read-more-link:after {
    visibility: visible;
    content: "Learn More →";
    padding: 10px 20px;
    border: 2px solid #fff;
    border-radius: 50px;
    display: inline-block;
    font-family: "Oleo Script";
    font-size: 18px;
}

@tuanphan from what i understood the old one recognize it as a button and a new one not.Is there a way to make it a button so i can have the option to edit it ? And one more question about the codes ,when i insert a new one do i delete the old one?Because when i go to insert a new one the old one is still there !Thank you!!

Because you add "Learn More" by Code, you need to edit it with Code. SS will not have the option to customize that.

You can edit the code you have inserted. If you insert a new one, it will overwrite the old code.

 

@tuanphan .Thank you very much about your time answering to me! I don't really know a lot about codes yet and that's why i think i'm gonna find a different way to fix this editing problem ,maybe i will delete the page and try make it from scratch!i'm sure that i can't find the way to edit it my self ! Hahaha anyway i really appreciate your help !!It's nice to have someone who knows like you helping people like me with small experience!