Voyager 2
2.x
2.x
  • Introduction
  • Javascript
  • Media Manager
  • Plugins
  • Settings
  • bread
    • Actions
    • BREAD Builder
    • Layouts
    • Lists
    • Manipulate data
    • Multilanguage
    • Relationships
    • Validation
    • Views
  • contributing
    • Assets
    • CSS
    • Introduction
  • de
    • index
  • formfields
    • Checkboxes
    • Date & Time
    • Dynamic input
    • Formfields
    • Media Picker
    • Number
    • Password
    • Radios
    • Relationship
    • Repeater
    • Select
    • Simple array
    • Slider
    • Slug
    • Tags
    • Text
    • Toggle
  • getting-started
    • Installation
    • Prerequisites
    • Tips and tricks
    • What is Voyager
  • overriding
    • Overriding formfields
    • Icons
  • plugins
    • Assets
    • Components
    • Features
    • Filter
    • Plugin development
    • Language
    • Menu Items
    • Custom pages
    • Preferences
    • Routes
    • Settings
    • Widgets
Powered by GitBook
On this page

Was this helpful?

  1. overriding

Icons

To override an icon you simply have to register a component with the name of the icon you want to override, suffixed with Icon. For example, if you want to override the icon academic-cap, register a component named AcademicCapIcon:

import { defineAsyncComponent } from 'vue';

voyager.component('AcademicCapIcon', defineAsyncComponent(() => import('path/to/your/icon')));

Or, to define a simple non-async component:

import { defineComponent, h } from 'vue';

voyager.component('AcademicCapIcon', defineComponent({
    render() {
        return h('svg', { class: '...' });
    }
}));
PreviousOverriding formfieldsNextplugins

Last updated 3 years ago

Was this helpful?