Tagged: , ,

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • November 13, 2015 at 11:26 pm #535768
    nigdowser

    Hi,

    I have spent a lot of time poking around the web but can’t find an answer to this one…

    I would like to be able to alter the text of a specific button. I have created a page in Enfold which I use as a sales page for a product. If I include the [add_to_cart id=”123″] shortcode, I get the prices shown before it and the text ‘Add To Cart’ shown.

    Now, I can alter the size and color of the buttons in general using CSS, but what I’d really like to be able to do is alter a specific button so that I can have specific text on a specific button, as in “Get The Holiday Special Now!” rather than “Add To Cart”. Also, I’d like to be able to hide the price shown before that button, as usually I’m offering a special price to select customers and the original price is either wrong (for them) or irrelevant.

    All I have found are ways to alter the text on all types or classes of buttons and nothing about specifying which particular buttons could be changed. Can you point me in the right direction to do these specific things, or is it even possible to do this? I’m assuming it might have something to do with using the page id as reference somewhere, somehow, but my coding is useless for this.

    So, in summary:
    1. Alter the text on a specific button on a specific page created in Enfold (not the Woocommerce product page)
    2. Hide the price(s) shown by the side of the button
    3. Use CSS to selectively alter the specific button on a specific page

    Many thanks!

    November 14, 2015 at 5:23 pm #535909
    Elliott

    Hi nigdowser!

    I’m not sure if it will work but you can right click your page and view source and copy the HTML for the add to cart button that is output and paste that inside a codeblock element and change the text there.

    Woocommerce also has an “add to cart URL” shortcode, https://docs.woothemes.com/document/woocommerce-shortcodes/, which you can use to just get the URL needed so you can create your own button.

    Regards,
    Elliott

    November 16, 2015 at 11:08 pm #536942
    nigdowser

    Thanks for those ideas.

    Actually, I’ve found a simpler way of doing it and thought it might be helpful if I share it here for others in similar situations.

    Firstly, the shortcode [add_to_cart_url id=”123″] does not seem to play nicely and (as of this post’s date) has been noted to produce odd results.

    However…. If I create a button in Enfold, I can then use the following link to direct them to the cart page directly (and, of course, have it styled and say what I want): The link is
    http://mywebsite.com/?add-to-cart=123 (with the numbers at the end being the product id)

    Of course, you could also make the button however you wanted, as long as it has this link in it.

    Much simpler and cleaner! For those who are looking for more details to pass with the button, I suggest you check out https://nicolamustone.com/2015/09/18/creating-custom-add-to-cart-url/

    Hope this helps others resolve this issue!!

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • The topic ‘styling specific woocommerce buttons’ is closed to new replies.