Creating BUTTON

[bestfitbybrazil]

How to create button for page that does not have button class?  Don’t i need to declare clase of button in HTML?  If so, where can i enter this html code?  a file?

For instance this class is for new button, but i can’t put inside CSS customizer

VIEW CART

This is sample button CSS:

.myButton {
background-color:#44c767;
-moz-border-radius:28px;
-webkit-border-radius:28px;
border-radius:28px;
border:1px solid #18ab29;
display:inline-block;
cursor:pointer;
color:#ffffff;
font-family:Verdana;
font-size:12px;
padding:9px 31px;
text-decoration:none;
text-shadow:0px 1px 0px #2f6627;
}
.myButton:hover {
background-color:#57a5cf;
}
.myButton:active {
position:relative;
top:1px;
}

[Harry]

you just add HTML

View Cart

But where you want to insert button.

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[bestfitbybrazil]

but don’t we have to declare the button class in html first?

for instance: VIEW CART

the CSS editor will accept HTML?  the syntax turns red like it won’t work.

[Harry]

You want change button with these css?

You can’t add HTML to css file.

If you want change for view cart button. please add code

.jas-mini-cart .button {
background-color:#44c767;
-moz-border-radius:28px;
-webkit-border-radius:28px;
border-radius:28px;
border:1px solid #18ab29;
display:inline-block;
cursor:pointer;
color:#ffffff;
font-family:Verdana;
font-size:12px;
padding:9px 31px;
text-decoration:none;
text-shadow:0px 1px 0px #2f6627;
}
.jas-mini-cart .button:hover {
background-color:#57a5cf;
}
.jas-mini-cart .button:active {
position:relative;
top:1px;
}

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[bestfitbybrazil]

no what i’m trying to do is put a “view cart” and “checkout” button on “Single Product Page”.  they don’t exist there, and I want to include it in a custom way.  So need to create this button so it shows on this type of page ??

https://bestfitbybrazil.com/product/dynamite-brazil-leggings-l2094-apple-booty-horus-sexy-workout-leggings/

 

[bestfitbybrazil]

I think I figured it out. I should just put the html class reference in the “cart” page html element WPBakery Editor correct? https://bestfitbybrazil.com/cart

And the CSS can go in the WPBakery CSS settings Editor of the same page?

[Harry]

Hi,

Please add below code to claue-child > functions.php and add your css code to claue-child > style.css

function show_view_cart_on_poduct_page() {
    echo '<a href="' . esc_url(wc_get_cart_url()) . '" class="myButton">' . esc_html( 'View cart', 'claue' ) . '</a>';
    echo '<a href="' . esc_url(wc_get_checkout_url()) . '" class="myButton ml__15">' . esc_html( 'Checkout', 'claue' ) . '</a>';
}
add_action('woocommerce_single_product_summary', 'show_view_cart_on_poduct_page', 55);

Kind regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[Author]

Posts