LogoLogo
SourceSupportTraining
v6.x
v6.x
  • Introduction
    • Contributing Guide
    • Release History
      • 6.1.0
      • 6.0.5
      • 6.0.4
      • 6.0.3
      • 6.0.0
      • Upgrading From v5.x
    • About This Book
      • Author
  • Getting Started
    • Installation
      • System Requirements
      • *CommandBox Installation
      • Source Installation
      • Existing ColdBox Application
      • Docker
    • Updates
  • Usage
    • Using ContentBox
      • The ContentBox Dashboard
        • Home
        • About
      • Content
        • Publish Content
          • Blog
          • Sitemap
          • Content Editing Tips
            • Editor Features
            • Dynamic Variable Output
            • Markdown Support
            • Relocations
            • Scheduled Content
        • Custom Content
          • Content Store
          • Content Templates
          • Categories
          • Media Manager
          • Menu Manager
      • Comments
        • Inbox
        • Settings
      • Look & Feel
        • Active Theme
        • Global HTML
        • Themes
        • Widgets
          • Inserting a Simple Widget
      • Media Manager
      • Modules
        • Installing Modules
        • Managing Modules
      • Users
        • Manage
        • Permissions
        • Roles
      • Tools
        • Import
        • Export
        • Static Site Generation
      • System
        • Auth Logs
        • Geek Settings
        • Settings
          • Site Options
          • Admin Options
          • Security Options
          • Login Options
          • Content Options
          • Editor Options
          • Media Manager Options
          • Gravatars
          • Notifications
          • Mail Server
          • Search Options
          • Login Options
        • Security Rules
        • Updates
      • Widgets
        • An Easy Example
        • Inside the Page Editor
    • Developing For ContentBox
  • Front End Development
    • Front End Development
      • File Structure
      • JS and CSS Assets
      • Customizing Views
      • Customizing Layouts
      • Customizing Navigation
      • Global Variables
      • Managing Assets
      • Template Variables
      • The Content Store
    • Theme Development
      • Theme Settings
      • Theme UDFs
      • Theme Templates
      • Theme Layouts
      • Theme Views
      • Theme SEO Functionality
  • Back End Development
    • Back End Development
      • Overriding ContentBox Settings
      • Modules
        • Installing a Module
        • Using a Module
        • Module Locations and Conventions
        • Build a Module
        • Scaffold a Module
        • Theme your Module
        • Build an Admin Module
        • Adding Admin Menus to your Module
        • Adding Meta to your Modules
      • Widgets
        • Core Widgets
        • Simple Widget
        • Widgets with Arguments
        • Multiple Render Function Widgets
      • Interceptors
      • Accessing Logged in User
      • Customizing the Admin
      • Staying on the Upgrade Path
Powered by GitBook
On this page
  • AddAsset() Method for CSS and JS
  • Better Asset Management coming soon

Was this helpful?

Edit on GitHub
Export as PDF
  1. Front End Development
  2. Front End Development

Managing Assets

Last updated 2 years ago

Was this helpful?

By default the includes directory of your theme is used to store your static assets.

Because these assets are called from your customized theme, however, you may use any directory conventions you prefer. If you plan to use customized paths or CDN links in your template, it's best to create a setting in your Theme.cfc which will then be configured through the admin.

AddAsset() Method for CSS and JS

In the Front End of the Website, the Theme takes over the rendering. To ensure all Assets are added correctly from various modules, for every theme, we recommend using the htmlHelper's addAsset() method.

Since the SuperType ( which all ColdBox items inherit from ) implements addAsset() you can call it directly from almost any file in your application.

addAsset( "#prc.cbroot#/includes/css/#css#.css" );

You might have noticed, that even in the , the actual implementation of the cssFullAppendList and cssAppendList use the addAsset to add the CSS to the head of the HTML page.

This applies to both CSS and JS. The main downside to this approach is that all assets added with addAsset are added to the head. The order of the assets is not strictly ( or easily ) controlled either.

Better Asset Management coming soon

We recommend using a similar approach to the admin, using an array, and outputting in the theme. We will be standardizing an approach soon, so all themes can easy implement these features, with a single line cbhelper method.

Admin Asset Management methods explained here