How to use coral ui in making simple form component ? | Community
Skip to main content
Level 2
December 12, 2018
Question

How to use coral ui in making simple form component ?

  • December 12, 2018
  • 5 replies
  • 3447 views

I have started with Coral UI and have gone through its documentation. However, I am unable to find the starting point.

I have also tried making custom component and pasting coral UI markups given in documentation. Its not showing up properly. For example, I have used following code in my custom component html script:

<table class="coral-Table coral-Table--hover">

  <thead class="coral-Table-Head">

    <tr class="coral-Table-row">

        <th class="coral-Table-headerCell">FirstName</th>

            <th class="coral-Table-headerCell">LastName</th>

            <th class="coral-Table-headerCell">PhoneNo</th>

        </tr>

    </thead>

    <tbody class="coral-Table-body">

    <tr class="coral-Table-row">

        <td class="coral-Table-cell">Rishabh</td>

            <td class="coral-Table-cell">Krishan</td>

            <td class="coral-Table-cell">9454117031</td>

        </tr>

        <tr class="coral-Table-row">

        <td class="coral-Table-cell">Krishna</td>

            <td class="coral-Table-cell">Kumar</td>

            <td class="coral-Table-cell">9545675429</td>

        </tr>

    </tbody>

</table>

only table is displayed but no hovering. Please Help.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

5 replies

rmahendra
Adobe Employee
Adobe Employee
December 12, 2018

Have you checked Documentation | CoralUI  ?

smacdonald2008
Level 10
December 12, 2018

Coral API is not meant to go into Production. Its meant for Author and to build out component dialogs or AEM UI.  So Coral API is not meant to build a custom component that is rendered in an AEM web page.

AmirYamin
February 24, 2020
can you please send me a sample code for whole component built in Coral UI
smacdonald2008
Level 10
December 12, 2018

To build out custom components - you can use a lib such as Bootstrap.

VeenaVikraman
Community Advisor
Community Advisor
December 13, 2018

Why a custom component ? What is the use case ?

arunpatidar
Community Advisor
Community Advisor
December 13, 2018

Hi,

Rishabh Coral/Granite framework is created for AEM UI. In case if you want to create an utility page/landing page then you can use those frameworks but for your own website or customer facing, it is not recommended.

The reason for not working coral UI in custom components is, the supporting JS/CSS won't be available or loaded.

Arun Patidar