[ Venture Theme ] Option/Variant Change of Width and Position and Personalization Notes on Product

[cgrq]

Hello,

This is how my product page looks like:

1) I would like to know where I can find within the codes on how I can change the position of my options, variants and quantity so it can look like this:

2.) Is there a way where I can change the width of the options and variants drop-down? The idea is to make sure that all my options, with long descriptions would be seen, and those short ones may be narrowed down? Like this:

3) I did two line item property field. One is ‘personalize’, ‘other’ is another. It shows on my page. However, when I receive orders, I don’t get the ‘other’ instructions.

Name / Family Name / Company Name

Instructions (font change, special requests, etc)
<textarea id=“other” style="width:350px; max-width:100%; height:80px; name=“properties[Other]”>

Thanks!

[Kinjaldavra]

hello @cgrq

Please provide website url and if your store is password protected then also provide password So I will check and provide a solution here.

[cgrq]

Hey,

No password but it’s www.cqprintsph.com

Thanks a lot!

[Kinjaldavra]

hello @cgrq

do you want to look like this https://nimb.ws/dVMInS

[cgrq]

Wow, looks good. How do we go about it? I want to see it in mobile, as well.

Also, do we have answers with having 2 line item property field? Is it possible?

In Shopify Admin, order page, this shows:

See that personalize shows but other instructions don’t. This was a sample order made by me.

Thank you again!

[Kinjaldavra]

hello @cgrq

Do you want to also OTHER INSTRUCTIONS to the order tab you have need to hire a Shopify expert

For Option/Variant Change of Width please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

.template-product .product-form  .product-form__item:nth-child(1) , .template-product  .product-form  .product-form__item:nth-child(2) , .template-product  .product-form  .product-form__item:nth-child(3) {
    -webkit-flex: 0 0 100%;
    -moz-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
     flex: 0 0 100%;
 }

[dmwwebartisan]

@cgrq

Please add the following code at the bottom of your assets/theme.scss.liquid file.

.product-form__item {
    -webkit-flex: 1 0 100%!important;
    -moz-flex: 1 0 100 !important;
    -ms-flex: 1 0 100% !important;
    flex: 1 0 100% !important;
    margin-bottom: 10px !important;
    padding: 0 5px !important;
    width: 100% !important;
    display: block !important;
}

Thanks!

[cgrq]

Thing is, I was able to do it with Personalization and if my clients want to change the name.

Can’t I make 2 line item property fields at a time? Or do you think it’s best to get an app?

[cgrq]

Thanks, this is also another way to put it.

[dmwwebartisan]

@cgrq

Please use PageFly App

[PageFly-Victor]

Hi @cgrq

You can build the layout as you want by using PageFly Landing Page Builder.

For the third option, you can try Infinite Options or Product Personalizer by Zepto, they also integrate with PageFly so you can build 3 in 1.

Let me know if you have any questions. Cheers!

PageFly!

[YuChen]

What is the reason why adding attributes to the dawn 2.0 theme in this way does not take effect?