radykal | Support Center Chooser

For which product do you need support?

Fancy Product Designer Multistep Product Configurator Another

Start a new topic
Answered

How to use masking images to create cornered/circle bounding boxes

Hello,


This is a post that was created 2 years ago talking about creating bounding boxes with cornered edges, and the answer was posted:


Sorry, no there is currently no way of doing that. In most cases you can use a masking image though, like in our pin demo: http://fancyproductdesigner.com/product/bagde-pin/


Can anyone explain how I can do this? Is there still a requirement to do this or is the feature added?


Thank you,

Khastarin


Best Answer

No, bounding boxes can still only be rectangles. There is one new feature called masking, which allows using a .svg file as mask for a whole view (product builder, edit mask button directly above the product preview) or the old masking image trick.


Answer

No, bounding boxes can still only be rectangles. There is one new feature called masking, which allows using a .svg file as mask for a whole view (product builder, edit mask button directly above the product preview) or the old masking image trick.

This does not explain how to do it. 

I also need to do a circle bounding box. I would gladly use the image trick, but what is this image trick

Hi radykal, 

i can not get the svg mask to work - which would be a nice feature. 
it work in the product builder, but it does nothing on the front end


maybe overwritten by some global settings? 

i used a single path solid filled circle like: 
<?xml version="1.0" encoding="utf-8"?>

<!-- Generator: Adobe Illustrator 23.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->

<svg version="1.0" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"

  viewBox="0 0 266 266" style="enable-background:new 0 0 266 266;" xml:space="preserve">

<style type="text/css">

 .st0{fill:#873D3D;}

</style>

<circle class="st0" cx="133" cy="133" r="132"/>

</svg>


thanks a lot !

Please open a support ticket so we can have a closer look at your issue. 

Login or Signup to post a comment