Documentation
HomeForumHelp
  • About Cwicly
  • Beginner's Guide
    • Install Cwicly
    • Getting Started
      • Overview
      • Settings
    • Edit and Manage your Site
    • The WordPress Dashboard
    • The Dashboard Menu
    • Site Editor
    • Create your Front Page
      • Front Page
      • Header
        • Header Template Part
        • Structure
      • Footer
        • Footer Template Part
        • Structure
  • ⚡Cwicly
    • Block ID
    • Breakpoints
    • Class
      • Global/Block Classes
    • Cloud Design Library
      • Create an Account
      • Overview of the Cloud Dashboard
      • Editor: Cloud Library
        • Access from the Editor
        • Add a Library
        • Switch between Libraries
        • Default Library
        • Download Library
        • Remove Library
        • Categories
          • All
          • Popular
          • Button
          • Composition
          • Decorative
          • Interactive
          • Layout
          • Media
          • Menu
          • Social
      • Design Blocks: Cloud Library
        • Search for a Design Block
        • Refresh
        • Add Design Block
        • Save Design to Library
        • Remove Design Block
      • Library Globals
        • Library: Global Styles
          • Library: Add Styles
          • Installation: Add Styles
          • Library: Style Settings
        • Library: Global Classes
          • Library: Add Classes
          • Installation: Add Classes
          • Library: Class Settings
        • Library: Global Stylesheets
          • Library: Add Stylesheet
          • Installation: Add Stylesheet
          • Library: Stylesheet Settings
        • Library: External Classes
          • Library: Add External Classes
          • Installation: Add External Classes
          • Library: External Classes Settings
      • Community Library
        • Save to Community Library
        • Download from Community Library
        • Remove from Community Library
        • Set Community as default
    • Colour Picker
      • Gradient Builder
    • Components
      • Components Library
      • Components Folders
      • Settings
      • Component Properties Modal
      • Properties (Add)
        • Text Property
        • Rich Text Property
        • List Property
        • Link Property
        • Image Property
        • Gallery Property
        • Video Property
        • Icon Property
        • Colour Property
        • Toggle Property
        • Number Property
        • Class Property
        • ID Property
        • Options Property
        • Conditions Property
        • Visibility Property
        • CSS Text Property
    • Copy/Paste
      • Block Styles
      • Classes & IDs
      • Dynamic Preview
      • Global Styles
      • Global Classes & Stylesheets
      • Blocks
    • CSS Grid
    • Dynamic Inserter
    • Font Manager
    • Navigator
    • Quick Inserter
    • Scaling
    • Smart Inserter
    • Span
    • Tag
  • ⛵Tailwind
    • Getting Started
      • About
      • Activate
      • Copy/Paste
      • Enable editing mode
      • Apply a Class
      • Pseudo state Management
      • Automatically Sync
        • Breakpoints
        • Colours
      • Shells
      • Custom Tailwind Configuration
      • Import Tailwind Plugins
  • 🖌️Themer
    • Themer
      • Templates
      • Parts
      • Fragments
    • Role Editor
      • User Role
      • Gutenberg Editor
      • Global Block Behaviour
      • Block Toolbar
      • Miscellaneous
      • Components
      • Code Block
      • Blocks
      • Post Types
      • Force iFrame
      • Client Canvas View
      • Help
      • User
  • 🌐Global Styles
    • Global Styles
      • Global Colours
        • Folders
        • Colour tab
        • Palette tab
        • Modifiers tab
          • Opacity
          • Lighten
          • Darken
          • Saturate
          • Desaturate
          • Spin
      • Dark Mode
      • Global Gradients
      • Global Typography
      • Global Block Typography
      • Theme Elements
      • Global Settings
        • Defaults
        • Backend
      • Remove Gutenberg Global Styles
    • Global Classes & Stylesheets
      • Global Classes
      • Global Stylesheets
      • External Classes
  • 🎨Design
    • Background
      • Background Colors
      • Background Source
      • Sizing & Positioning
      • Styling
    • Typography
      • Typography
      • Rem conversion
      • Global Typography
      • Text Align
      • Font Family
      • Font Size
      • Font Weight
      • Spacing
      • Line Height
      • Style
      • Decoration
      • Transform
      • White Space
      • Overflow Wrap
      • Word Break
      • Word Spacing
      • Axes
      • Text Colour
      • Link Colour
    • Fluid Values
    • Layout
      • Display
      • Visual
      • Position
    • Sizing
      • Height
      • Width
    • Margin & Padding
    • Borders
      • Border
      • Shadows
      • Outline
    • Effects
      • General
      • Transitions
      • Animations
      • Filters
      • Text Shadow
      • Tilter
      • Separators
    • Transforms
    • Pseudo Classes/Elements
    • Relative Styling
  • 🎓Advanced
    • Custom CSS
    • Quick Code
    • Scrolling
      • Animate On Scroll
      • Scroll Direction
    • Attributes
    • Tooltip
      • Source
      • Theme
        • Custom Theme
  • 👆Interactions
    • Visibility Conditions
      • Blocks
      • Themer
    • Link
      • Link Source
      • Link Action
    • Interactions
      • Trigger
      • Actions
    • Hover Animation
    • Dynamic Slider
      • Settings Tab
  • 🖥️Editor
    • Inserter Panel
    • Quick Insert
    • Block Inspector
    • Primary Tab
    • Design Tab
    • Advanced Tab
    • Responsive Selector
  • 🔧Blocks
    • Accordions
    • Accordion
      • Basics
      • Settings
      • Colours
      • Layout
      • Typography
      • Margin and Padding
    • Button
      • Add
      • Icon
    • Code
      • Enable/Disable
      • Add
      • Languages
      • Settings
    • Columns
      • Basics
      • Add
      • Settings
      • Grid Editor
        • Auto Grid
        • Auto Template
    • Column
    • Container
    • Div
    • Filter
      • Basics
      • Filter Editor
      • Create a Filter
      • Style a Filter (example)
    • Fragment
    • Gallery
      • Filter
      • Source
      • Settings
      • Text
      • Image Style
    • Heading
    • Hook
    • Icon
    • Image
      • Source
      • Size
      • Settings
      • Hover Animation
    • Input
      • Input Settings
    • List
      • List Types
      • Settings
      • Icon
    • Maps
      • Settings
      • Size
      • Style
      • Overlay Layout
      • Colours
    • Menu
      • Settings
      • Main Menu
      • Sub Menu
      • Items
    • Modal
      • Modal Style
      • Settings
      • Trigger
      • Animation
    • Nav
      • Nav Block Settings and Styles
      • Nav Items Block
      • Nav Dropdown Block
      • Nav Link
      • Custom Dropdown Block
      • Nav Menu
    • Post Content
    • Paragraph
    • Popover
    • Query
      • Query Settings
      • Query Editor
        • Posts
        • Terms
        • Users
        • Comments
    • Query Template
      • Layout
      • Grid editor
    • Repeater
      • Nested Repeater
    • Section
    • Slider
      • Settings
      • Navigation
      • Dots
    • Slide
    • Styler
    • SVG Block
    • Tab List
      • Tab
    • Tab Contents
      • Tab Content
    • Taxonomy Terms
    • Video
      • Source
      • Settings
      • Div Overlay
  • ⚙️Settings
    • Settings
    • License
    • Icon Collections
    • Font Sets
    • Google Maps API
    • Advanced Settings
    • Regeneration
    • WooCommerce
  • 🛒WooCommerce
    • Archive Page
    • Attributes
      • Colour Type
      • Image Type
    • Cart
    • Product Variations
    • Create a Product Type
      • Simple
      • Variable
        • Create Attributes
      • Grouped
      • External
    • Build a Single Product Page
    • Dynamic Content
    • Link
  • 🗃️Miscellaneous
    • Blocks Specifics
    • Icon Selector
    • Trailing Slash
    • Units
      • Default Units
    • Code Snippets
    • Shortcuts
    • Actions
    • Filters
    • Browser Console
  • 🔗Resources
    • Changelog
    • Roadmap
    • Forum
Powered by GitBook
On this page
  • Open Attributes
  • Add an Attribute
  • Enable Archives?
  • Type
  • Select
  • Button
  • Colour
  • Image
  • Default Sort Order
  • Add
  • Edit Attribute
  • Delete Attribute
  • Configure Terms
  • Attribute Terms
  • Add new term
  • Name
  • Slug
  • Description
  • Edit Attribute Term
  • Quick Edit Attribute Term
  • Delete Attribute Term
  • View Attribute Term

Was this helpful?

  1. WooCommerce

Attributes

Last updated 1 year ago

Was this helpful?

The attributes property allows you to add additional data to your products, such as size, colour, or material.

Attributes can be used to create variations of a product, or to simply provide more information about a specific product.

Open Attributes

Ensure that WooCommerce is installed and active.

  • Navigate to the WordPress dashboard.

  • Find Products under WooCommerce in dashboard menu.

  • Find Attributes and click to open.

  • The attributes page is where you add and manage your attributes.

  • When you first open the page, the Attribute window will indicate that "No attributes currently exist" until you create some.

Add an Attribute

  • To add a new Attribute, open the Attributes page and add the name of the desired attribute.

  • The "slug" will be added automatically later.

  • Alternately, you may want to add a specific slug.

Enable Archives?

The Enable Archives box allows you to have a page for the specified attribute with all the products available inside.

  • To enable "Enable Archives?", check the box. A tick will appear to confirm that it is enabled.

Type

The Type property determines how the attribute's values should be displayed on the front end.

  • You can choose from Select, Button, Colour or Image.

Select

Creates a dropdown list of options, from which the user can select one item (or multiple if allowed).

Button

Creates a button which the user can use to select a particular attribute.

Colour

Adds a colour that the user can use to select a particular attribute.

Image

Adds an image that can be used to select a particular attribute.

This is useful for certain attributes such as materials.

Default Sort Order

Determines the sort order of the terms on the frontend shop product pages, such as Custom ordering, Name, Name (Numeric), Term ID.

If using custom ordering, you can drag and drop the terms in this attribute.

Add

When you have completed the elements on the page, click "Add Attribute" to save your settings.

  • This will add the new attribute to the attribute window.

Edit Attribute

You can edit an attribute by clicking "Edit" in the attribute window.

  • This will open an "Edit Attribute" window where you can change the Name, Slug, Enable Archives, Type and/or Default sort order.

Delete Attribute

You can remove an attribute by clicking "Delete" in the attribute window.

Configure Terms

The Configure Terms allows you to add attribute values.

  • Navigate to the Attributes window.

  • Click "Configure Terms" to open the Edit Attribute page.

Attribute Terms

Here you can create, edit and remove attribute values. Attribute terms can be assigned to products and variations.

Deleting a term will remove it from all products and variations to which it has been assigned. Recreating a term will not automatically assign it back to products.

Until you have created some values, a message will appear that tells you that no value has been found.

Add new term

Name

The name you add will be the one that appears on your site.

Slug

The “slug” is the URL-friendly version of the name. It is usually all lowercase and contains only letters, numbers, and hyphens.

Description

The description is not prominent by default; however, some themes may show it.

  • When you have added a term, click "Add new" to save the term.

  • The new term will be visible in the Attribute Terms window.

Edit Attribute Term

If you hover over an Attribute Term, a clickable "Edit" link will open.

  • Click to open an Edit Attribute Terms window where you can edit the Term.

  • You can edit the Name, the Slug or the Description.

  • Click the "Update" button to save the changes.

  • Click "Delete" to permanently delete the selected Term.

Quick Edit Attribute Term

This allows you to edit the Name or Slug within the page.

Delete Attribute Term

Allows you to delete a term.

View Attribute Term

Allows you to view an Attribute Term.

🛒
Colour Type
Colour Type
Colour Type
Image Type