support.cubewp.com support.cubewp.com
  • Helpdesk
  • Support Forum
Get CubeWP
support.cubewp.com support.cubewp.com
Get CubeWP
support.cubewp.com
  • Helpdesk
  • Support Forum

Docy

CubeWP Framework

  • Getting Started
    • Introduction
    • Installation
    • Support
    • Billing
  • How to use CubeWP?
    • Create Custom Post Types
    • Create Custom Taxonomies
    • Create Custom Fields
  • CubeWP Custom Fields
    • All Field Types
    • Conditional Fields with Taxonomy
    • Conditional Custom Fields
    • Dropdown Field
    • Checkbox Field
    • Radio Button Field
    • How to create Repeatable Fields ?
    • Conditional Custom Fields with Multiple Taxonomies
    • How to Allow Specific File Types in Media?
    • Relationship Fields
    • Custom CSS on Custom Fields
  • Maps
    • Google Map
    • OpenStreet Map
  • Single Page Template
    • Single Page with Elementor
  • Shortcodes
    • Login Page
    • Custom Field Shortcode
    • Archive Shortcodes
    • Pricing Plan
  • folder icon closed folder open iconDeveloper Guides
    • CubeWP Filters & Actions
    • Add CubeWP Settings
  • General
    • Import and Export
  • folder icon closed folder open iconFAQs
    • A Non Developer can use CubeWP Framework?
    • What are the minimum requirements?
    • Can I use CubeWP without Elementor?
    • Which page builders are compatible?
    • Which themes are compatible?
    • Is CubeWP work with my WordPress Theme?
    • Does CubeWP support Shortcodes?
    • Does CubeWP work with e-commerce plugins?
    • How many Field Types are available in CubeWP?
    • Why my Conditional Logic is not working while creating Custom Fields?
    • Where can I see my all Purchases?
    • Can I Import and Export CubeWP data of CubeWP?
    • Is CubeWP offering a Refund Policy?
    • Is CubeWP support Elementor Dynamic Tag?
    • Do i need Elementor Pro for Dynamic Tags?
    • What is CubeWP Frontend Pro?
    • Is CubeWP Frontend Pro a Page Builder?

Custom CSS on Custom Fields

Estimated reading: 1 minute 177 views

You can easily add your own Custom CSS on Custom Fields to show on the Detail Page Display.
You can add Two Types of Classes in any Custom Field.

  • Input type Class
  • Container Class

Note: Before adding a class, make sure that the class name is correct and it's available in your code or custom CSS settings.

Here is an Example.

docs-image-20

If your class name is correct then you can see the output on the frontend.

docs-image-21

By following above method you can easily Customize Single Layout and style according to your own design.
Here is another example, We have added different classes ( available in my CSS file ) to every custom field and here you can see the display of that classes.

docs-image-22

Related articles

  • Checkbox Field
  • How to Allow Specific File Types in Media?
  • Conditional Fields with Taxonomy
  • Relationship Fields
  • How to create Repeatable Fields ?
  • Create Custom Post Types
  • Conditional Custom Fields with Multiple Taxonomies
  • Radio Button Field
  • All Field Types
  • Dropdown Field
  • Conditional Custom Fields
  • See More
Share this Doc

Custom CSS on Custom Fields

Or copy link

Clipboard Icon
CONTENTS
Leaf Illustration

© 2022 All Rights Reserved by CubeWP