Link
Links provide users with quick references to relevant Procore or affiliate websites that will provide more contextual information to a page or feature.
Links should be used to trigger a page or in some cases a modal in Procore’s product. Refrain from using links to perform actions.
Demo and Developer GuidelinesLinks should be used to trigger a page or in some cases a modal in Procore’s product. Refrain from using links to perform actions.
Anatomy
Link Text
Link text should clearly state where the user is being directed. Links are either title case (when referencing the title of a page) or sentence case (when indirectly referring to the page inline).
All links that reference a page by its name must match the header of the page exactly.
Links can either be blue or white depending on where they are placed. A link within a tooltip will be white.
All links that reference a page by its name must match the header of the page exactly.
Links can either be blue or white depending on where they are placed. A link within a tooltip will be white.
Types
Inline
Links can be used within a sentence that is linked to another page. These links are sentence case.
When a part of a sentence adequately describes the page where the user will be directed, hyperlink that word or phrase in the sentence. If you are linking to a page where a user can complete an action, the link text should always start with a verb.
When a part of a sentence adequately describes the page where the user will be directed, hyperlink that word or phrase in the sentence. If you are linking to a page where a user can complete an action, the link text should always start with a verb.
Standalone
Standalone links are displayed outside of the context of a sentence. These are title case, and the link text is always the title of the linked page.
In body text that includes a link, don’t tell the user to click the link. The link itself is an effective call to action, and this will make your body text more concise.
In body text that includes a link, don’t tell the user to click the link. The link itself is an effective call to action, and this will make your body text more concise.