COS Reference

Table of contents
Close

Included COS files

There are certain Javascript and CSS files that are automatically attached to all COS templates. Some files can be removed, while others cannot. This article describes the purpose of each of these files. In addition to the files listed here, you can attach your own custom CSS files and Javascript files to your templates.

To learn more about the order in which stylesheets are attached to COS content, check out this article.

jQuery

jQuery is automatically included in the head tag of every HubSpot template. It is rendered as part of the standard_header_includes  HubL variable. You have the ability to choose between the latest version of jQuery 1.11.x or version 1.7.1, in Content Settings.  If you choose to use the latest version of jQuery, you can also choose to include a jQuery migrate script for backwards compatibility with older browsers.
JQuery settings

public_common.css

public_common.css is a file that is included primarily for the HubSpot app navigation. It includes various animations used throughout the app, as well as a few snippets of code to style universal HubSpot elements such as blog featured images and bread crumb navigations. You can view the file, here.

layout.css

Layout.css (fomerly known as required_base.css) is the file that is responsible for styling HubSpot's responsive grid. This file is always automatically included in any drag and drop template. It is not included by default in custom coded templates. 

In addition to the responsive grid CSS, the file includes some classes that can be used to show and hide elements at different viewports. You can view the file, here.

hs_default_custom_style.css

Also know as Primary CSS, this file is a global CSS file that is included in all of template layouts by default. This file is analogous to style.css in Wordpress themes.

You can disable it in Content Settings or within the Edit > Edit Head feature of Template Builder. If you would like to include it in a coded template, you must use the include_default_custom css function.
.

Primary CSS

public_common.js

Every COS page includes public_common.js in the footer of the template. This file renders as part of standard_footer_includes and cannot be removed. This Javascript file is used by many of the features of the app, as well as website features such as HubSpot's slider module.

HubSpot Tracking Code

The HubSpot tracking code is automatically added to any HubSpot template. It is included with the standard_footer_includes HubL variable. The tracking code loads a analytics Javascript file names your HubID.js (example 158015.js).