User Guide Cancel

cfinclude

Last updated on Dec 4, 2025 | Also applies to ColdFusion

CFML Reference User Guide
ColdFusion functions
ColdFusion tags
1. ColdFusion tag summary
2. ColdFusion tags by category
  1. Application framework tags
    1. cfapplication
    2. cfassociate
    3. cferror
    4. cfimport
    5. cfinterface
    6. cflock
    7. cfscript
    8. cfthread
  2. Communications tags
  3. Database manipulation tags
  4. Data output tags
    1. cfchart
    1. cfchartdata
    2. cfchartseries
    3. cfchartset
    4. cfcol
    5. cfcontent
    6. cfdocument
    7. cfdocumentitem
    8. cfdocumentsection
    9. cfflush
    10. cfheader
    11. cflog
    12. cfoutput
    13. cfpresentation
    14. cfpresentationslide
    15. cfpresenter
    16. cfprocessingdirective
    17. cfprint
    18. cfreport
    19. cfreportparam
    20. cfsilent
    21. cftable
  5. Debugging tags
    1. cfdump
    2. cftimer
    3. cftrace
  6. Exception handling tags
    1. cfcatch
    2. cferror
    3. cffinally
    4. cfrethrow
    5. cfthrow
    6. cftry
  7. Extensibility tags
    1. cfchart
    2. cfchartdata
    3. cfchartseries
    4. cfcollection
    5. cfcomponent
    6. cfexecute
    7. cfftp
    8. function
    9. cfindex
    10. cfinterface
    11. cfinvoke
    12. cfinvokeargument
    13. cfobject
    14. cfproperty
    15. cfreport
    16. cfreportparam
    17. cfreturn
    18. cfsearch
    19. cfsharepoint
    20. cfspreadsheet
    21. cfwddx
    22. cfxml
  8. File management tags
    1. cfdirectory
    2. cffile
    3. cffileupload
    4. cfftp
    5. cfzip
    6. cfzipparam
  9. Flow-control tags
    1. cfabort
    2. cfbreak
    3. cfcase
    4. cfcontinue
    5. cfdefaultcase
    6. cfelse
    7. cfelseif
    8. cfexecute
    9. cfexit
    10. cfif
    11. cfinclude
    12. cflocation
    13. cfloop
    14. cfrethrow
    15. cfswitch
    16. cfthrow
    17. cftry
  10. Forms tags
    1. cfapplet
    2. cfcalendar
    3. cffileupload
    4. cfform
    5. cfformgroup
    6. cfformitem
    7. cfgrid
    8. cfgridcolumn
    9. cfgridrow
    10. cfgridupdate
    11. cfinput
    12. cfpdf
    13. cfpdfform
    14. cfpdfformparam
    15. cfpdfparam
    16. cfpdfsubform
    17. cfselect
    18. cfslider
    19. cftextarea
    20. cftree
    21. cftreeitem
  11. Internet Protocol tags
    1. cfajaximport
    2. cfajaxproxy
    3. cfftp
    4. cffeed
    5. cfimap
    6. cfhttp
    7. cfhttpparam
    8. cfldap
    9. cfmail
    10. cfmailparam
    11. cfmailpart
    12. cfpop
    13. cfsprydataset
  12. Page processing tags
    1. cfcache
    2. cfcontent
    3. cfflush
    4. cfheader
    5. cfhtmlhead
    6. cfinclude
    7. cfprocessingdirective
    8. cfsetting
    9. cfsilent
  13. Security tags
  14. Variable manipulation tags
    1. cfcookie
    2. cfdump
    3. cfparam
    4. cfregistry
    5. cfsavecontent
    6. cfschedule
    7. cfset
    8. cfsetting
  15. Other tags
    1. cfimage
    2. cflog
    3. cfregistry
3. Tags a-b
4. Tags c
5. Tags f
6. Tags g-h
  1. cfgraph
  2. cfgraphdata
  3. cfgrid
  4. cfgridcolumn
  5. cfgridrow
  6. cfgridupdate
  7. cfheader
  8. cfhtmlhead
  9. cfhtmltopdf
  10. cfhtmltopdfitem
  11. cfhttp
  12. cfhttpparam
7. Tags i
  1. cfif
  2. cfimage
  3. cfimap
  4. cfimapfilter
  5. cfimpersonate
  6. cfimport
  7. cfinclude
  8. cfindex
  9. cfinput
  10. cfinsert
  11. cfinterface
  12. cfinvoke
  13. cfinvokeargument
8. Tags j-l
9. Tags m-o
10. Tags p-q
  1. cfparam
  2. cfpdf
  3. cfpdfform
  4. cfpdfformparam
  5. cfpdfparam
  6. cfpdfsubform
  7. cfpod
  8. cfpop
  9. cfpresentation
  10. cfpresentationslide
  11. cfpresenter
  12. cfprint
  13. cfprocessingdirective
  14. cfprocparam
  15. cfprocresult
  16. cfprogressbar
  17. cfproperty
  18. cfquery
  19. cfqueryparam
11. Tags r-s
  1. cfregistry
  2. cfreport
  3. cfreportparam
  4. cfrethrow
  5. cfreturn
  6. cfsavecontent
  7. cfschedule
  8. cfscript
  9. cfsearch
  10. cfselect
  11. cfservlet
  12. cfservletparam
  13. cfset
  14. cfsetting
  15. cfsharepoint
  16. cfsilent
  17. cfslider
  18. cfspreadsheet
  19. cfsprydataset
  20. cfstoredproc
  21. cfswitch
12. Tags t
  1. cftable
  2. cftextarea
  3. cftextinput
  4. cfthread
  5. cfthrow
  6. cftimer
  7. cftooltip
  8. cftrace
  9. cftransaction
  10. cftree
  11. cftreeitem
  12. cftry
13. Tags u-z
  1. cfupdate
  2. cfwddx
  3. cfwebsocket
  4. cfwindow
  5. cfxml
  6. cfzip
  7. cfzipparam
CFML Reference
1. Reserved words and variables
2. Ajax JavaScript functions
3. ColdFusion ActionScript functions
4. ColdFusion mobile functions
5. Application.cfc reference
6. Script functions implemented as CFCs
7. ColdFusion Flash Form style reference
8. ColdFusion event gateway reference
9. ColdFusion C++ CFX Reference
10. ColdFusion Java CFX reference
11. WDDX JavaScript Objects
Cloud services

Description

Embeds references to ColdFusion pages in CFML. You can embed cfinclude tags recursively. For another way to encapsulate CFML, see cfmessagebox. (A ColdFusion page was formerly sometimes called a ColdFusion template or a template.)

Syntax

<cfinclude 
template = "template name" 
runOnce = "true|false">

Note

You can specify this tag's attributes in an attributeCollection attribute whose value is a structure. Specify the structure name in the attributeCollection attribute and use the tag's attribute names as structure keys.

History

ColdFusion 11: The compileextforinclude attribute of the <cfapplication> tag affects the behavior of the <cfinclude> tag.

By default only files with the cfm and cfml extensions get compiled when included using the <cfinclude> tag. All other files when included using the cfinclude tag will not get compiled but their content will be statically included. No error will be thrown.
A server-level setting and an application-level setting has been added to specify a list of file extensions that can contain the CFM code. While processing the <cfinclude> tag, ColdFusion checks for this Application-level/server-level setting to decide whether to compile the content or to statically include it. The setting value is comma separated list of file extensions. If file extensions are specified at application-level, the server-level file extension list will be ignored and the application-level file extension list will be used.
Specifying a special value wildcard (*) in the file extension list makes the cfinclude tag to compile any file.
The server-level setting can be modified using the ColdFusion Administrator. The setting can be found at Server Settings > Settings page. A new key/tag attribute compileextforinclude added to the application cfc/cfm to specify this file extension list.

ColdFusion 10: Added the attribute {{runOnce}}

ColdFusion MX: Changed error behavior: if you use this tag to include a CFML page whose length is zero bytes, you do not get an error.

Attributes

Attribute	Req/Opt	Default	Description
template	Required		A logical path to a ColdFusion page.
runOnce	Optional	false	If set to true, the given template (if already processed) is not processed again for a given request.

Usage

ColdFusion searches for included files in the following locations:

In the directory of the current page or a directory relative to the current page
In directories mapped in the ColdFusion Administrator
You cannot specify an absolute URL or file system path for the file to include. You can only use paths relative to the directory of the including page or a directory that is registered in the ColdFusion Administrator Mappings. The following cfinclude statements work, assuming that the myinclude.cfmfile exists in the specified directory:

<cfinclude template="myinclude.cfm"> 
<cfinclude template="../myinclude.cfm"> 
<cfinclude template="/CFIDE/debug/myinclude.cfm">

But the following do not work:

<cfinclude template="C:\ColdFusion\wwwroot\doccomments\myinclude.cfm">
<cfinclude template="http://localhost:8500/doccomments/myinclude.cfm">

The included file must be a syntactically correct and complete CFML page. For example, to output data from within the included page, you must have a cfoutput tag, including the end tag, on the included page, not the referring page. Similarly, you cannot span a cfif tag across the referring page and the included page; it must be complete within the included page.
You can specify a variable for the templateattribute, as the following example shows:

<cfset templatetouse="../header/header.cfm"> 
<cfinclude template="#templatetouse#">

Example

<!--- main.cfm --->
<cfinclude template="header.cfm">
<p>
 Welcome to my cfinclude demo!
</p>
<cfinclude template="footer.cfm">

header.cfm

<p>
 Sample header!
</p>

footer.cfm

<p>
 Sample footer!
</p>

Real-world uses of the cfinclude function

Corporate intranet portal

Enterprise organizations need consistent branding and navigation across hundreds of intranet pages used by employees for HR, IT support, finance, and project management. The portal must maintain uniform headers, footers, and navigation menus while allowing different departments to manage their own content sections independently, without duplicating layout code or risking brand inconsistency.

Problem statement

Copying header and footer HTML across hundreds of pages creates maintenance nightmares
Branding updates require changing every single page individually causing errors and inconsistency
Different teams working on pages create divergent styles and navigation structures
No centralized control over corporate branding elements and navigation menus
Page load bloat from duplicate code across every department page

Solution

The cfinclude tag creates a modular portal architecture where the header, navigation, and footer are maintained in single shared files that are included across all pages. Changes to branding, navigation, or footer information are made once in the shared component files and automatically propagate to all portal pages instantly.

corporate_portal.cfm

<!--- Page-specific data --->
<cfset pageTitle = "Employee Dashboard">
<cfset currentSection = "dashboard">
<cfset userName = "Sarah Johnson">
<cfset userDepartment = "Marketing">
<cfset userRole = "Senior Manager">

<!--- Include shared header --->
<cfinclude template="header.cfm">

<!--- Include shared navigation --->
<cfinclude template="navigation.cfm">

<!--- Main content area --->
<div class="main-content">
    <div class="content-wrapper">
        <h1>Welcome back, <cfoutput>#userName#</cfoutput>!</h1>
        
        <div class="dashboard-grid">
            <div class="widget">
                <div class="widget-icon">📊</div>
                <div class="widget-content">
                    <h3>My Tasks</h3>
                    <div class="widget-value">12</div>
                    <p>Pending items</p>
                </div>
            </div>
            
            <div class="widget">
                <div class="widget-icon">📅</div>
                <div class="widget-content">
                    <h3>Meetings Today</h3>
                    <div class="widget-value">3</div>
                    <p>Scheduled</p>
                </div>
            </div>
            
            <div class="widget">
                <div class="widget-icon">📧</div>
                <div class="widget-content">
                    <h3>Unread Messages</h3>
                    <div class="widget-value">8</div>
                    <p>In your inbox</p>
                </div>
            </div>
            
            <div class="widget">
                <div class="widget-icon">🎯</div>
                <div class="widget-content">
                    <h3>Goals Progress</h3>
                    <div class="widget-value">75%</div>
                    <p>Quarterly targets</p>
                </div>
            </div>
        </div>
        
        <div class="recent-activity">
            <h2>Recent Activity</h2>
            <div class="activity-list">
                <div class="activity-item">
                    <span class="activity-time">2 hours ago</span>
                    <span class="activity-desc">Completed project proposal review</span>
                </div>
                <div class="activity-item">
                    <span class="activity-time">5 hours ago</span>
                    <span class="activity-desc">Attended team standup meeting</span>
                </div>
                <div class="activity-item">
                    <span class="activity-time">Yesterday</span>
                    <span class="activity-desc">Submitted expense report for approval</span>
                </div>
            </div>
        </div>
        
        <div class="info-box">
            <h3>💡 How cfinclude Works Here</h3>
            <p>
                This page uses <strong>cfinclude</strong> to embed three shared components:
            </p>
            <ul>
                <li><code>&lt;cfinclude template="includes/header.cfm"&gt;</code> - Corporate header with logo</li>
                <li><code>&lt;cfinclude template="includes/navigation.cfm"&gt;</code> - Main navigation menu</li>
                <li><code>&lt;cfinclude template="includes/footer.cfm"&gt;</code> - Footer with links and copyright</li>
            </ul>
            <p>
                All pages in the portal include these same files, ensuring consistency. 
                When marketing updates the logo in header.cfm, it automatically appears 
                on all 200+ portal pages instantly!
            </p>
        </div>
    </div>
</div>

<!--- Include shared footer --->
<cfinclude template="footer.cfm">

navigation.cfm

<style>
    .main-nav { background: white; box-shadow: 0 2px 5px rgba(0,0,0,0.1); }
    .nav-content { max-width: 1200px; margin: 0 auto; padding: 0 20px; 
                   display: flex; gap: 30px; }
    .nav-item { padding: 15px 0; color: ##333; text-decoration: none; 
                font-weight: 500; border-bottom: 3px solid transparent; 
                transition: all 0.3s; cursor: pointer; }
    .nav-item:hover { color: ##1e3c72; border-bottom-color: ##1e3c72; }
    .nav-item.active { color: ##1e3c72; border-bottom-color: ##1e3c72; }
</style>

<nav class="main-nav">
    <div class="nav-content">
        <cfoutput>
            <a href="##" class="nav-item #currentSection EQ 'dashboard' ? 'active' : ''#">
                🏠 Dashboard
            </a>
            <a href="##" class="nav-item #currentSection EQ 'hr' ? 'active' : ''#">
                👥 HR Portal
            </a>
            <a href="##" class="nav-item #currentSection EQ 'it' ? 'active' : ''#">
                💻 IT Support
            </a>
            <a href="##" class="nav-item #currentSection EQ 'finance' ? 'active' : ''#">
                💰 Finance
            </a>
            <a href="##" class="nav-item #currentSection EQ 'projects' ? 'active' : ''#">
                📊 Projects
            </a>
        </cfoutput>
    </div>
</nav>

<style>
    .main-content { max-width: 1200px; margin: 30px auto; padding: 0 20px; }
    .content-wrapper { background: white; padding: 30px; border-radius: 10px; 
                       box-shadow: 0 2px 10px rgba(0,0,0,0.1); }
    .dashboard-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); 
                      gap: 20px; margin: 30px 0; }
    .widget { background: linear-gradient(135deg, ##667eea 0%, ##764ba2 100%); 
              color: white; padding: 25px; border-radius: 10px; display: flex; 
              align-items: center; gap: 20px; }
    .widget-icon { font-size: 48px; }
    .widget-content h3 { font-size: 14px; opacity: 0.9; margin-bottom: 10px; }
    .widget-value { font-size: 36px; font-weight: bold; }
    .widget-content p { font-size: 12px; opacity: 0.8; }
    .recent-activity { margin-top: 30px; }
    .activity-list { margin-top: 15px; }
    .activity-item { padding: 15px; background: ##f8f9fa; border-left: 4px solid ##667eea; 
                     margin-bottom: 10px; border-radius: 5px; }
    .activity-time { font-weight: bold; color: ##667eea; margin-right: 15px; }
    .info-box { background: ##e7f3ff; padding: 20px; border-radius: 10px; 
                border-left: 4px solid ##1e3c72; margin-top: 30px; }
    .info-box h3 { color: ##1e3c72; margin-bottom: 15px; }
    .info-box ul { margin-left: 20px; margin-top: 10px; }
    .info-box code { background: ##fff; padding: 3px 8px; border-radius: 3px; 
                     color: ##e74c3c; font-family: 'Courier New', monospace; }
</style>

header.cfm

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <cfoutput><title>#pageTitle# - Corporate Portal</title></cfoutput>
    <style>
        * { margin: 0; padding: 0; box-sizing: border-box; }
        body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; 
               background: ##f5f5f5; }
        .site-header { background: linear-gradient(135deg, ##1e3c72 0%, ##2a5298 100%); 
                       color: white; padding: 20px 0; box-shadow: 0 2px 10px rgba(0,0,0,0.1); }
        .header-content { max-width: 1200px; margin: 0 auto; padding: 0 20px; 
                          display: flex; justify-content: space-between; align-items: center; }
        .logo { font-size: 28px; font-weight: bold; display: flex; align-items: center; gap: 10px; }
        .user-info { display: flex; align-items: center; gap: 15px; }
        .user-avatar { width: 40px; height: 40px; border-radius: 50%; 
                       background: white; color: ##1e3c72; display: flex; 
                       align-items: center; justify-content: center; font-weight: bold; }
        .user-details { text-align: right; }
        .user-name { font-weight: bold; }
        .user-role { font-size: 12px; opacity: 0.9; }
    </style>
</head>
<body>
    <header class="site-header">
        <div class="header-content">
            <div class="logo">
                🏢 <span>ACME Corporation</span>
            </div>
            <div class="user-info">
                <div class="user-details">
                    <cfoutput>
                        <div class="user-name">#userName#</div>
                        <div class="user-role">#userDepartment# - #userRole#</div>
                    </cfoutput>
                </div>
                <div class="user-avatar">
                    <cfoutput>#left(userName, 1)#</cfoutput>
                </div>
            </div>
        </div>
    </header>

footer.cfm

<style>
    .site-footer { background: ##2c3e50; color: white; margin-top: 50px; padding: 30px 0; }
    .footer-content { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
    .footer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); 
                   gap: 30px; margin-bottom: 30px; }
    .footer-section h4 { margin-bottom: 15px; color: ##3498db; }
    .footer-links { list-style: none; }
    .footer-links li { margin-bottom: 10px; }
    .footer-links a { color: ##ecf0f1; text-decoration: none; transition: color 0.3s; }
    .footer-links a:hover { color: ##3498db; }
    .footer-bottom { border-top: 1px solid ##34495e; padding-top: 20px; 
                     text-align: center; font-size: 14px; color: ##95a5a6; }
</style>

<footer class="site-footer">
    <div class="footer-content">
        <div class="footer-grid">
            <div class="footer-section">
                <h4>Quick Links</h4>
                <ul class="footer-links">
                    <li><a href="##">Employee Directory</a></li>
                    <li><a href="##">Company Calendar</a></li>
                    <li><a href="##">Policies & Procedures</a></li>
                    <li><a href="##">Benefits Information</a></li>
                </ul>
            </div>
            
            <div class="footer-section">
                <h4>Resources</h4>
                <ul class="footer-links">
                    <li><a href="##">IT Help Desk</a></li>
                    <li><a href="##">Training Portal</a></li>
                    <li><a href="##">Travel Booking</a></li>
                    <li><a href="##">Expense Reports</a></li>
                </ul>
            </div>
            
            <div class="footer-section">
                <h4>Support</h4>
                <ul class="footer-links">
                    <li><a href="##">Submit a Ticket</a></li>
                    <li><a href="##">FAQ</a></li>
                    <li><a href="##">Contact HR</a></li>
                    <li><a href="##">Emergency Contacts</a></li>
                </ul>
            </div>
            
            <div class="footer-section">
                <h4>About</h4>
                <ul class="footer-links">
                    <li><a href="##">Company News</a></li>
                    <li><a href="##">Leadership Team</a></li>
                    <li><a href="##">Careers</a></li>
                    <li><a href="##">Privacy Policy</a></li>
                </ul>
            </div>
        </div>
        
        <div class="footer-bottom">
            <cfoutput>
                <p>&copy; #year(now())# ACME Corporation. All rights reserved.</p>
                <p style="margin-top: 10px; font-size: 12px;">
                    Last updated: #dateFormat(now(), "mmmm d, yyyy")# | 
                    Powered by ColdFusion cfinclude
                </p>
            </cfoutput>
        </div>
    </div>
</footer>
</body>
</html>

Email template

Marketing teams send out hundreds of email campaigns each month for various purposes, including product launches, promotions, newsletters, and customer engagement. Each email requires consistent branding elements such as logos, headers, footers, social media links, and unsubscribe information. However, the content and call-to-action sections need to be unique for each campaign. It's important to maintain brand compliance while also reducing the time spent developing new email designs.

Problem statement

Copying email HTML boilerplate for every campaign creates version control chaos
Brand guideline violations occur when teams modify headers or footers incorrectly
Legal compliance elements (unsubscribe links, privacy notices) inconsistent across emails
Email designers waste time recreating standard sections instead of focusing on content

Solution

The cfinclude tag builds email templates from modular components, with the email header featuring a logo, the social media footer containing links, and the legal/unsubscribe footer maintained as shared files included in each campaign's custom content.

email_template.cfm

<cfparam name="url.campaign" default="welcome">

<!--- Campaign-specific content --->
<cfswitch expression="#url.campaign#">
    <cfcase value="welcome">
        <cfset emailSubject = "Welcome to Our Community!">
        <cfset heroHeading = "Welcome Aboard!">
        <cfset heroSubheading = "We're thrilled to have you join our community">
        <cfset heroImage = "🎉">
        <cfset ctaText = "Get Started Now">
        <cfset ctaLink = "##onboarding">
        <cfset contentText = "Thank you for joining us! We've prepared a special welcome guide to help you get the most out of your experience.">
    </cfcase>
    <cfcase value="promo">
        <cfset emailSubject = "Exclusive 30% Off - Limited Time!">
        <cfset heroHeading = "Flash Sale!">
        <cfset heroSubheading = "Save 30% on all products this weekend only">
        <cfset heroImage = "🔥">
        <cfset ctaText = "Shop Now">
        <cfset ctaLink = "##shop">
        <cfset contentText = "Don't miss out on our biggest sale of the season. Use code SAVE30 at checkout. Offer ends Sunday at midnight!">
    </cfcase>
    <cfcase value="newsletter">
        <cfset emailSubject = "Your Monthly Update">
        <cfset heroHeading = "Newsletter">
        <cfset heroSubheading = "What's new this month">
        <cfset heroImage = "📰">
        <cfset ctaText = "Read More">
        <cfset ctaLink = "##news">
        <cfset contentText = "Catch up on the latest product updates, industry insights, and tips from our expert team.">
    </cfcase>
</cfswitch>

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <cfoutput><title>#emailSubject#</title></cfoutput>
    <style>
        body { font-family: Arial, sans-serif; background: ##f4f4f4; margin: 0; padding: 20px; }
        .email-preview { max-width: 800px; margin: 0 auto; background: white; }
        .preview-toolbar { background: ##2c3e50; color: white; padding: 15px 20px; 
                           border-radius: 5px 5px 0 0; }
        .campaign-selector { margin-bottom: 20px; text-align: center; }
        .campaign-btn { background: ##3498db; color: white; padding: 10px 20px; 
                        margin: 0 5px; border: none; border-radius: 5px; 
                        text-decoration: none; display: inline-block; }
        .campaign-btn:hover { background: ##2980b9; }
        .info-panel { background: ##e7f3ff; padding: 20px; margin: 20px 0; 
                      border-left: 4px solid ##3498db; border-radius: 5px; }
        .component-label { background: ##f39c12; color: white; padding: 5px 10px; 
                          font-size: 12px; font-weight: bold; margin: 10px 0; 
                          display: inline-block; }
    </style>
</head>
<body>
    <div class="campaign-selector">
        <h2>Email Template Assembly Demo</h2>
        <p>Select a campaign type to see modular email assembly:</p>
        <a href="?campaign=welcome" class="campaign-btn">Welcome Email</a>
        <a href="?campaign=promo" class="campaign-btn">Promotional Email</a>
        <a href="?campaign=newsletter" class="campaign-btn">Newsletter</a>
    </div>
    
    <div class="email-preview">
        <div class="preview-toolbar">
            <cfoutput>
                <strong>Preview:</strong> #emailSubject# | 
                <strong>Campaign:</strong> #url.campaign#
            </cfoutput>
        </div>
        
        <!--- Email content starts here --->
        <div style="background: white;">
            
            <div class="component-label">INCLUDED: email-header.cfm</div>
            <!--- Include shared email header --->
            <cfinclude template="email-header.cfm">
            
            <div class="component-label">CUSTOM CONTENT: Campaign-specific</div>
            <!--- Campaign-specific hero section --->
            <table width="100%" cellpadding="0" cellspacing="0" border="0">
                <tr>
                    <td align="center" style="padding: 40px 20px; background: linear-gradient(135deg, ##667eea 0%, ##764ba2 100%);">
                        <div style="font-size: 72px; margin-bottom: 20px;">
                            <cfoutput>#heroImage#</cfoutput>
                        </div>
                        <h1 style="color: white; margin: 0 0 10px 0; font-size: 42px;">
                            <cfoutput>#heroHeading#</cfoutput>
                        </h1>
                        <p style="color: white; font-size: 18px; margin: 0 0 30px 0; opacity: 0.9;">
                            <cfoutput>#heroSubheading#</cfoutput>
                        </p>
                        <cfoutput>
                            <a href="#ctaLink#" style="background: white; color: ##667eea; 
                               padding: 15px 40px; text-decoration: none; border-radius: 30px; 
                               font-weight: bold; display: inline-block;">
                                #ctaText#
                            </a>
                        </cfoutput>
                    </td>
                </tr>
            </table>
            
            <!--- Campaign content --->
            <table width="100%" cellpadding="0" cellspacing="0" border="0">
                <tr>
                    <td style="padding: 40px 20px;">
                        <p style="font-size: 16px; line-height: 1.6; color: ##333; margin: 0;">
                            <cfoutput>#contentText#</cfoutput>
                        </p>
                    </td>
                </tr>
            </table>
            
            <div class="component-label">INCLUDED: email-social-footer.cfm</div>
            <!--- Include shared social media footer --->
            <cfinclude template="email-social-footer.cfm">
            
            <div class="component-label">INCLUDED: email-legal-footer.cfm</div>
            <!--- Include shared legal/unsubscribe footer --->
            <cfinclude template="email-legal-footer.cfm">
            
        </div>
    </div>
    
    
</body>
</html>

email-header.cfm

<!--- Shared Email Header Component --->
<table width="100%" cellpadding="0" cellspacing="0" border="0">
    <tr>
        <td align="center" style="padding: 30px 20px; background-color: ##2c3e50;">
            <table width="600" cellpadding="0" cellspacing="0" border="0">
                <tr>
                    <td align="center">
                        <h1 style="color: ##3498db; margin: 0; font-size: 32px; font-weight: bold;">
                            🏢 ACME Company
                        </h1>
                        <p style="color: ##ecf0f1; margin: 10px 0 0 0; font-size: 14px;">
                            Your trusted partner for success
                        </p>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>

email-legal-footer.cfm

<!--- Shared Legal/Unsubscribe Footer Component --->
<table width="100%" cellpadding="0" cellspacing="0" border="0">
    <tr>
        <td align="center" style="padding: 20px; background-color: ##2c3e50;">
            <p style="color: ##95a5a6; font-size: 12px; margin: 0 0 10px 0;">
                <cfoutput>
                    &copy; #year(now())# ACME Company. All rights reserved.<br>
                    123 Business Street, Suite 100, City, State 12345
                </cfoutput>
            </p>
            <p style="color: ##95a5a6; font-size: 12px; margin: 10px 0;">
                <a href="##" style="color: ##3498db; text-decoration: none;">Unsubscribe</a> | 
                <a href="##" style="color: ##3498db; text-decoration: none;">Privacy Policy</a> | 
                <a href="##" style="color: ##3498db; text-decoration: none;">Contact Us</a>
            </p>
            <p style="color: ##7f8c8d; font-size: 11px; margin: 10px 0 0 0;">
                You're receiving this email because you subscribed to our mailing list.<br>
                To ensure delivery, please add noreply@acme.com to your address book.
            </p>
        </td>
    </tr>
</table>

email-social-footer.cfm

<!--- Shared Social Media Footer Component --->
<table width="100%" cellpadding="0" cellspacing="0" border="0">
    <tr>
        <td align="center" style="padding: 30px 20px; background-color: ##34495e;">
            <p style="color: white; margin: 0 0 20px 0; font-size: 16px; font-weight: bold;">
                Connect With Us
            </p>
            <table cellpadding="0" cellspacing="0" border="0">
                <tr>
                    <td style="padding: 0 10px;">
                        <a href="##" style="color: ##3498db; text-decoration: none; font-size: 24px;">📘</a>
                    </td>
                    <td style="padding: 0 10px;">
                        <a href="##" style="color: ##1DA1F2; text-decoration: none; font-size: 24px;">🐦</a>
                    </td>
                    <td style="padding: 0 10px;">
                        <a href="##" style="color: ##E4405F; text-decoration: none; font-size: 24px;">📸</a>
                    </td>
                    <td style="padding: 0 10px;">
                        <a href="##" style="color: ##0077B5; text-decoration: none; font-size: 24px;">💼</a>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>

Get help faster and easier

New user?