AvisPlus Product Options v2
  • Get started!
    • Key Terminology Simplified
      • Avis Options and variants
      • Option Set
      • Option template
      • Option Set template
      • Option type
      • Option name
      • Label on Product
      • Label on Cart
      • Option value
      • Add-on product (Add charge)
      • Bundle variant
      • Conditional logic
      • Option URL
      • Tooltip
      • Help Text
      • Placeholder Text
      • Option widget
    • Option Types
      • Single line text
      • Multiple-line text
      • Number
      • Datetime
      • Email
      • Phone
      • Font Selector
      • Color Picker
      • File Upload
      • Switch
      • Quantity
      • Hidden field
      • Color swatch
      • Image swatch
      • Radio button
      • Checkboxes
      • Button
      • Dropdown menu
      • Color dropdown menu
      • Image dropdown menu
      • Combo box
      • Option Group
      • Space
      • Paragraph
      • HTML
      • Heading
      • Divider
      • Pop-up
      • Size chart
    • Activate App
  • User guide
    • Create Avis Option Set
      • Avis Option Set Template
      • Avis Option Template
    • Change product image upon option selection
    • Translate Avis options
    • Customize Shopify Option
    • Add Charge for an option value
      • One-time add charge feature
      • Add-charge by Quantity
      • Add-charge by Character
      • Hide Add charge product from Storefront
      • Hide Add charge product from Search bar
      • Hide Add charge product from 'Related Products' section
      • Hide Add charge product from Google Search
    • Add Bundle for an option value
    • Conditional Logic (Avis and Avis)
      • Conditional Logic (Avis and Shopify)
    • File Upload for Customers
      • File Upload Advanced Options
    • App Settings
      • Avis Option Settings
      • Shopify Option Settings
    • App Design
      • Avis Option Design
      • Shopify Option Design Library
    • OPTION URL feature
    • Import/Export Option Sets
    • Shopify Point Of Sale (POS) integration
    • Customize tooltip
    • Delete Span tags around the Add charge
    • Changing the option position on the Product page
      • Getting the HTML element
      • Reposition Avis options in EComposer Landing Page Builder
  • Subscription and billings
    • Pricing plans
    • How to Upgrade Your Plan
    • How to Cancel Your Subscription
  • Frequently Asked Questions
    • The differences between "Avis Option" tab and "Shopify Option" tab
    • How can I reposition Avis Options on Product Page?
    • What to do if Avis options aren’t visible on Product Page?
    • How can I set up Conditional Logic for options?
    • How can I add a charge to an option/ a variant?
    • Why aren't the option's Add charge included in Orders?
    • How can I show Avis Options on Packing Slips?
    • How can I show Avis option on Order confirmation Email/Order invoice/New order?
    • How can I show Avis option on Shipping Confirmation Email?
    • Can I add bundling products with the app?
    • Does the app work with Shopify Online Store 2.0?
    • Will the app slow down my website?
    • What happens if I uninstall the app, and how does it affect my store?
  • support and features request
    • 📩Contact Us
Powered by GitBook
On this page
  1. User guide
  2. App Design

Avis Option Design

When you want to change the Style, Color or the Size of the Option but don't know how to do it on your side. Then head to the Design Sections in Avis Option or Shopify Option to explore more.

PreviousApp DesignNextShopify Option Design Library

Last updated 8 months ago

1. Customizing Avis Option

From Dashboard, heading to Avis Option, then you may notice the Design Option button on the top right corner of the page. Click on the button, you will be in the whole new tab with lots of new things.

In this Section, you can customize Font size, the styles of Label on product and variant style, as well as the Color, Shape, Width and Spacing of all the Options inside your store. Clicking on different tabs will give you different customized styles, for example, in the Swatches tab, you can even customize the Border color selected/unselected

If you have programming background or just simply want to test out your new customization, this section is for you. You can navigate to the bottom of the Design page, and put in your custom CSS

After choosing the right customization, hit the Save button on the top right corner of the Design Option page

2. Customizing Shopify Option

From Dashboard, heading to Shopify Option, then you may notice the Design Library button on the top right corner of the page. Click on the button, you will be led to a new tab with both designs and previews of customizations.

In this section, you can customize the Styles in Product Page and Collection Page in your store. Click on the Customize hyperlink on the top corner of each style box, you will open a new pop-up. In this pop-up, you can choose the size, the shape, border type and the effect of the Styles.

After customizing your designed style, click on the Save button in the bottm right corner of the Pop-up

Avis Option main page
Design Option main page
Swatch Design
Custom CSS
Shopify Option main page
Design Library main page