Tips for plugin setup / UI layout composer suggestions (especially on mobile!)
G
Graphcom Development
started a topic
about 5 years ago
I recently inherited a website where the previous developer was using Fancy Product Designer to create custom aprons for radiation protection. After reviewing the community forums and plugin documentation, I see that the plugin has a lot of capabilities and potential to create a great user experience. However, the way that the former developer of the site set it up is not ideal. If you go to this product page and select the lead type and size and then hit "Design your own" you'll see what I mean.
The UI composer is basically completely unusable on mobile, the static image with directions at the bottom doesn't make sense, and overall the experience is very confusing. I saw Custom Ink's website in another forum post and I love what they did with the layout composer. Does anybody have any suggestions for what settings need to be updated / where I should get started in improving this?
Best Answer
r
rady kal
said
about 5 years ago
You could improve your mobile settings and remove the blank space from the sides.
Also you can create a different fancy product and connect it to your mobile version (On the meta box on the right side of your WooCommerce product). In that fancy product you can remove any blank area within the canvas and use the whole canvas to place your product images.
yes, you need to do it for each product individually.
G
Graphcom Development
said
about 5 years ago
This really does not answer my question. The canvas is wider than it is tall, which is not accurate to how most people user their mobile devices.
I want to create a better mobile experience, but there doesn't appear to be any documentation on the website for how to do so. Many of the demos on the site function well and the layouts actually change for mobile (like this one https://fancyproductdesigner.com/product/shirts/ - see screenshots as well)
Can you please outline the steps I need to take to make my site function like this?
Instead of loading another fancy product for each mobile product you can also just enlarge the image on the canvas so it uses the whole space of the canvas.
If you still have blank space please edit the width of the fancy product going to Fancy Product Designer -> products -> settings
G
Graphcom Development
said
about 5 years ago
I don't see a meta box on the right side of the WooCommerce product. I want to edit the UI layout for ALL the products on the site - are you saying that I need to manually change it for each one individually?
How do you remove the blank area within the canvas? Also, the mobile preview is the wrong orientation. It is wider than it is tall - can this be changed? See attached screenshot.
You could improve your mobile settings and remove the blank space from the sides.
Also you can create a different fancy product and connect it to your mobile version (On the meta box on the right side of your WooCommerce product). In that fancy product you can remove any blank area within the canvas and use the whole canvas to place your product images.
Graphcom Development
I recently inherited a website where the previous developer was using Fancy Product Designer to create custom aprons for radiation protection. After reviewing the community forums and plugin documentation, I see that the plugin has a lot of capabilities and potential to create a great user experience. However, the way that the former developer of the site set it up is not ideal. If you go to this product page and select the lead type and size and then hit "Design your own" you'll see what I mean.
The UI composer is basically completely unusable on mobile, the static image with directions at the bottom doesn't make sense, and overall the experience is very confusing. I saw Custom Ink's website in another forum post and I love what they did with the layout composer. Does anybody have any suggestions for what settings need to be updated / where I should get started in improving this?
You could improve your mobile settings and remove the blank space from the sides.
Also you can create a different fancy product and connect it to your mobile version (On the meta box on the right side of your WooCommerce product). In that fancy product you can remove any blank area within the canvas and use the whole canvas to place your product images.
- Oldest First
- Popular
- Newest First
Sorted by Newest Firstrady kal
yes, you need to do it for each product individually.
Graphcom Development
This really does not answer my question. The canvas is wider than it is tall, which is not accurate to how most people user their mobile devices.
I want to create a better mobile experience, but there doesn't appear to be any documentation on the website for how to do so. Many of the demos on the site function well and the layouts actually change for mobile (like this one https://fancyproductdesigner.com/product/shirts/ - see screenshots as well)
Can you please outline the steps I need to take to make my site function like this?
rady kal
Instead of loading another fancy product for each mobile product you can also just enlarge the image on the canvas so it uses the whole space of the canvas.
If you still have blank space please edit the width of the fancy product going to Fancy Product Designer -> products -> settings
Graphcom Development
I don't see a meta box on the right side of the WooCommerce product. I want to edit the UI layout for ALL the products on the site - are you saying that I need to manually change it for each one individually?
How do you remove the blank area within the canvas? Also, the mobile preview is the wrong orientation. It is wider than it is tall - can this be changed? See attached screenshot.
rady kal
You could improve your mobile settings and remove the blank space from the sides.
Also you can create a different fancy product and connect it to your mobile version (On the meta box on the right side of your WooCommerce product). In that fancy product you can remove any blank area within the canvas and use the whole canvas to place your product images.
-
Adding Fancy Products to Categories
-
Shortcode for specfic product designer
-
What theme is recommended to use with FPD ?
-
Exclude Image from export
-
Google Font Family adds extras
-
Floating Dialog box
-
Uploadzone not working
-
Image transparency like in T-shirt demo
-
How do I get clipart
-
What does the LOAD button do / what is it for?
See all 2204 topics