variant internal link

eslamibrahim
Shopify Partner
14 0 0

I want to create internal links like this when i click on that variant open new URL.

Screenshot 2024-05-08 010347.png

 

This example link: https://medpak.shop/products/bilovit-orange-essential-oil-10-ml

please help me to do that, thank you

Replies 5 (5)

SAN_MSWEB
Shopify Expert
1106 131 137

Hello,

 

I am San from MS Web Designer.

 

Here is the solution:

 

I just checked in chrome inspect and i think in this website variant created as custom section in that product page and if you want open this variant in new tab then you have to add this in href link target=”_blank”

 

Do let me know in case of any concerns.

 

Regards,

San

If it’s helpful to you, please mark it as a solution.  


Need Help with Shopify Design, Migration, Speed, or Custom tasks?  
email: hi@mswebdesigner.com
Try Our Conversion Booster app to get more sales | Connect Our Founder Linkedin

BSS-TechFusion
Shopify Expert
150 26 15

Hi @eslamibrahim , you can try follow my instructions.

- Go to Online store -> Themes -> Edit code

BSSTechFusion_1-1715571483403.png

 

- Find file theme.liquid

- Paste this code above tag </head> -> Click Save

 

BSSTechFusion_2-1715571495015.png

 {% if request.page_type == "product" %}
    <script>      
      const productVariantLinks = document.querySelectorAll('.product-info__block .product-version-wrapper .product-version-link');
      
      setTimeout(() => {
        productVariantLinks.forEach(link => {
          link.setAttribute('target', '_blank');
        });
      }, 500);
    </script>
    {% endif %}

 

 I hope this helps! If it works for you, please mark it as a solution. I am very happy about that. Have a great day!

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.

For B2B solutions and custom pricing, check out B2B Wholesale Solution by BSS |
For adding product labels/badges, visit BSS: Product Labels & Badges

BSS Commerce - Shopify Apps & Store Development Service Provider

Hire a Shopify expert | Shopify Plus Store Development

eslamibrahim
Shopify Partner
14 0 0

Thank you so much, but that's not my store. Here is the link I was referring to: https://medpak.shop/products/bilovit-orange-essential-oil-10-ml.
I would like to implement a feature similar to that.

Screenshot 2024-05-08 010347.png

eslamibrahim
Shopify Partner
14 0 0

I want to do that on my website, I want to link another like that" https://level-up.gg/products/jbl-true-wireless-earphone-t205bt " on that Product link  JBL WIRELESS EARPHONE WITH MIC BLACK T110BT – Level Up (level-up.gg)

BSS-TechFusion
Shopify Expert
150 26 15

Hi @eslamibrahim 

- These are the default interface and features of the theme.

- To display the variant options, first add variants to your product. If the variant options still do not appear, you can go to the following step by step to check and enable it.

1. Go to Online store -> Themes -> Customize

view.png

2. Select product page -> Variant picker

view.png

* NOTE: 

You can install the app BSS: Product Variants Options (https://apps.shopify.com/product-options-by-bss)

if you want to choose from various option types: Image swatch, textbox, multi-select, file upload, and more. Or choose colors and customize according to your preferences...."

 

Have a nice day sir! 

 

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.

For B2B solutions and custom pricing, check out B2B Wholesale Solution by BSS |
For adding product labels/badges, visit BSS: Product Labels & Badges

BSS Commerce - Shopify Apps & Store Development Service Provider

Hire a Shopify expert | Shopify Plus Store Development