[Kelly]

Hello,

What should I do to add a simple “Buy Now on Amazon” button on my “Book” page? I don’t plan to sell the book on this particular page, but I want to add a clickable buy button that takes people to the book on Amazon.

Hope to hearing from you.

Thank you!

Kelly

[Mahesh]

@kelsantana: Please post in your site url.

Regards,
Mahesh

[Kelly]

Hello Mahesh,

Thank you for your assistance again! Here it is: http://www.reviewsbythebanks.com/books

Best,
Kelly

[Mahesh]

@kelsantana: I checked your site and seem you do have Buy Now on Amazon link in the content. Do you want the CSS to make the link as button? Let me know further.

Regards,
Mahesh

[Kelly]

Yes, Mahesh. This is exactly what I’m looking for.I have the link there to not get the space empty,but I prefer the CSS to create a button. Thank you!

Best,

Kelly

[Mahesh]

@kelsantana: Go to Dashboard=> Appearance=> Customize=> Theme Options=> Custom CSS box and add the following CSS:

.entry-content a {
    background-color: #eee;
    border-radius: 5px;
    padding: 8px;
}
.entry-content a:hover {
    text-decoration: none;
}

Note: Please change the background-color as you desire.

Regards,
Mahesh

[Kelly]

I appreciate your help!

My next question is since I can change the background color for my like ( and I’m assuming I just need to change the piece of code inside what you gave me), how I’m going to know or where I can find the code for the colors? For instance, if I wanted to have the buy button with the text in white and the background in blue what should I do?Thank you, Mahesh!

Best,

Kelly

[Mahesh]

@kelsantana: Please remove the previous and use the following CSS:

.entry-content a.my_button {
    background-color: #0000FF;
    border-radius: 5px;
    padding: 8px;
    color: #fff;
}
.entry-content a.my_button:hover {
    text-decoration: none;
}

Note: Please add my_button class to the link you want to make button.

Regards,
Mahesh

[Kelly]

Hey Mahesh,

Sorry to bother again, but could you clarify where exactly I should insert “my_button” (I’m not a developer so it’s not clear to me). Should I add “my_button” to the visual area when I edit the page or should I got to the HTML? Also, should I add it to the phrase I already created (Buy now on Amazon) or not?

Thank you!
Kelly

[Mahesh]

@kelsantana: Currently you have following HTML for the Amazon Buy button
<a href="https://www.amazon.com/Childrens-Book-Adventure-Froblicious-Rhyming-ebook/dp/B01GOTXESA" target="_blank">Buy Now on Amazon</a>
Change it to the following:
<a class="my_button" href="https://www.amazon.com/Childrens-Book-Adventure-Froblicious-Rhyming-ebook/dp/B01GOTXESA" target="_blank">Buy Now on Amazon</a>
This will fix the issue. Let me know if any problem.

Regards,
Mahesh

[Author]

Posts