Product Add to Cart Button (hover over button) – External Link

[Sebizzle]

Hi,

How can I go about having the Add to cart button that is enabled on theme settings in woocommerce area (Enable add to cart button) that appears on hover product image as an external link button ?

Basically, it should open the external url in a new tab like it does on the product page. I would like this button to take to external url…

 

 

[Sebizzle]

This reply has been marked as private.

[Harry]

Hi,

If you want open in new tab you need create product as external/affiliate product http://take.ms/HHyS2

Best regards!

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

[Sebizzle]

This reply has been marked as private.

[Harry]

Hi,

We use default function of WooComerce so it can’t edit. Please use this plugin for this https://wordpress.org/plugins/wc-external-product-new-tab/

Best regards!

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

[Sebizzle]

This seems to have done the job ! :)))

The only other edit I wanted help with was changing the title link of the product to the external link ? Please, thank you very very much 🙂

[Sebizzle]

Also, there is an issue with this button, in that it is disabled in mobile mode ? If i could add the external add to cart link to the photo and the title this would solve this issue all together.

 

Thanks

[Harry]

Hi,

Please add below code in claue-child > functions.php

function jas_claue_child_wc_product_title() {
    remove_action( 'woocommerce_shop_loop_item_title', 'jas_claue_wc_product_title', 15 );
    echo '<h3 class="product-title pr fs__14 mg__0 fwm"><a class="cd chp" target="_blank" href="' . esc_url( get_permalink() ) . '">' . get_the_title() . '</a></h3>';
}
add_action( 'woocommerce_shop_loop_item_title', 'jas_claue_child_wc_product_title', 15 );

And download attach file and extract to claue > core > libraries > vendors > WooCommerce and remember to backup this file when you update theme.

Best regards

Attachments:

You must be logged in to view attached files.

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

[Sebizzle]

Thank you very much.

For this attached file, could I not bring this folder to the child theme to not lose it when updating theme ? Is this possible ?

[Sebizzle]

So this code and file you added seems to open in a new tab, and thats great. Thank you very much. However, if this could bypass the product page and when user clicks on the title (for external product) for it to open the external url in a new tab without going to product page this would be great.

Also as mentioned above, For this attached file, could I not bring this folder to the child theme to not lose it when updating theme ? Is this possible ?

 

Many thanks 🙂

[Sebizzle]

It also seems to get the title link, but not the link in the image to open in external url link ?

[Sebizzle]

Also one other issue I have noticed after implementing this, is when the actual external button on the product page is clicked it opens the cart instead of opening in a new tab as well now ??

I think we are nearly there, so thank you so much, but I will just summarise things to make it easier to help you help me finish this… 🙂 As the code you sent nearly does this, but this is what I am after…

1) External products on the shop (only external products)

• All titles when clicked open the external url in a new tab
• All images when clicked open the external url in a new tab
• Add to cart button when clicks open the external url in a new tab

2) Product Pages (only external products)

• If user searches they can find product and when they click on button it opens the external url in a new tab

[Harry]

Hi,

1. Please add code i suggested in functions.php in claue-child to click on title open on new tab

2. Please download file and put claue > core > libraries > vendors > WooCommerce to click on image open in new tab

3. the plugin i suggest when click on add to cart button open on new tab

4. It can’t the only way to hide search function in Theme Option > Header.

Best regards

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

[Sebizzle]

Hi,

1. Please add code i suggested in functions.php in claue-child to click on title open on new tab

Is this possible to adapt this code to just do this on external products product-type-external?

2. Please download file and put claue > core > libraries > vendors > WooCommerce to click on image open in new tab

This does not seem to be working? Is this possible to also adapt this code to just do this on external products product-type-external?

3. the plugin i suggest when click on add to cart button open on new tab

This does work fine, but hopefully If I can get images and titles of product-type-external to open in new tab with EXTERNAL URL then this will be great.

4. It can’t the only way to hide search function in Theme Option > Header.

Ok, but this is not the issue here. The issue here is after i made the changes you made it no longer on the product page opens the add to card as an external URL, instead it tries to add to cart like a normal product, so the buttom seems to work only now in the archeive hover over button but now not on the product page. This is wrong af the products are registered as external products and the plugin is active and the external url works elsewhere for the products..?

 

Best regards

[Harry]

Hi,

1,2. Sorry the code can’t adapt for only external product

3. Please remove code at 1,2 to plugin can apply for only external product.

Best regards

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

[Sebizzle]

Hi,

So i removed this codes and file and it seems to work again now. I am still trying to get the title to open in external URL link when clicked, the image I can stop going through by adding a simple…

.products .product-type-external .db {pointer-events: none;}

But I need to have the titles open for external links for external products..

 

thank you

[Harry]

Hi,

Could you try this plugin https://wordpress.org/plugins/open-external-links-in-a-new-window/

Best regards

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

[Sebizzle]

This reply has been marked as private.

[Sebizzle]

This reply has been marked as private.

[Sebizzle]

It seems that the themes external button is not allowing the external link opening plugin to change the button ?

[Harry]

Hi,

1. Please revert all code you added, use only plugin i suggested to open on new tab when you click on button on product listing page with external product .

2. By default on product detail page when you click on button it open on new tab please don’t add any code to do it.

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

[Author]

Posts