Modify the location of "Size Guide" link

[ccastanedag]

Hello Devs:

I would like to do 2 things:

1. Move the size guide link to below the short description.
2. Be able to modify the CSS of that link to make it more visual.

Is it possible to do? I will appreciate some light on this.

Thanks for your time

 

 

 

 

[Harry]

Hi,

1. You install claue-child.zip included in the package downloaded from ThemeForest via Appearance > Themes > Add New

2. Add below code to functions.php in claue-child

remove_action( 'woocommerce_single_product_summary', 'jas_claue_wc_add_extra_link_after_cart', 35 );
add_action( 'woocommerce_single_product_summary', 'jas_claue_wc_add_extra_link_after_cart', 20 );

3. Add below code to Dashboard > Claue > Theme Option > General Layout > Custom CSS

.extra-link a { color: #222;}

And change #222 with your color.

Best regards

And add below code to Dashboard

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

[ccastanedag]

Thanks for the fast answer:

But the original link is there and now I have two of them, how can I delete the one which is below the “add to cart” button? (See Screenshot)

https://prnt.sc/hguixy

Another question 1: There is a gray text “stock available” (Hay existencias) that I want to delete. It appears on single products and also on variable products after you choose a variation and push down the add to cart button. Is it possible to delete it?

Another Question 2: Is it possible to make the “Add to cart” button bigger. But at the same time vertically alligned with the counter bottons next to it and without destroying the template on mobile? I want my “Add to cart” button to standout!

Final question 3: Is it possible to grab the same css style of “Add to cart” button and apply it to “Go to checkout” (on cart page) and “Pay now” (on checkout page), how can I do this?

Thanks very much, I really appreaciate your help

Carlos Castañeda

[Harry]

Hi Carlos Castañeda,

1. Please change prev code you added in functions.php to

add_action( 'wp_head', 'remove_my_action' );
function remove_my_action(){
  remove_action( 'woocommerce_single_product_summary', 'jas_claue_wc_add_extra_link_after_cart', 35 );
}
add_action( 'woocommerce_single_product_summary', 'jas_claue_wc_add_extra_link_after_cart', 25 );

2. Add below code in Claue > Theme Option > General Layout > Custom CSS

.woocommerce-variation-availability { display: none;}

3,4. You can add below custom css

.quantity input.input-text[type=”number”],
form .quantity,
.single_add_to_cart_button {
height: 46px;
line-height: 42px;
}
.quantity .tc a {
top: 11px;
}
.wc-proceed-to-checkout a, #place_order {
float: right;
line-height: 40px;
background: #56cfe1;
background-color: rgb(86, 207, 225);
border: none;
color: #fff !important;
text-transform: uppercase;
position: relative;
}

Best regards

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

[Author]

Posts