Variables
Learn how to use variables in Hammer to create dynamic content and make your templates more maintainable.
Introduction
Variables in Hammer allow you to define reusable values that can be referenced throughout your templates. This makes it easy to maintain consistent content, update site-wide information, and create dynamic pages.
Variables help you:
- Centralize content management
- Avoid repetitive typing
- Make bulk updates efficiently
- Create dynamic, data-driven pages
Defining Variables
To define a variable, use the @var directive at the top of your HTML file:
<!-- @var variableName = "value" -->
You can define variables anywhere in your file, but it's best practice to define them in the <head> section for organization.
Using Variables
To output a variable, you can use either syntax:
<!-- @var pageTitle = "Welcome" -->
<title><!-- @pageTitle --></title>
<h1><!-- $pageTitle --></h1>
Hammer supports both @@variableName and $$variableName syntax for variable output. Use whichever style you prefer or mix them throughout your templates.
Variable Types
Hammer supports different types of variables:
Strings
<!-- @var name = "Hammer for Mac" -->
<h1><!-- @name --></h1>
<!-- Or using $ syntax -->
<h1><!-- $name --></h1>
Numbers
<!-- @var version = 1.0 -->
<span>Version <!-- @version --></span>
<!-- Or using $ syntax -->
<span>Version <!-- $version --></span>
Examples
Basic Page Variables
<!DOCTYPE html>
<html lang="en">
<head>
<!-- @var appName = "Hammer for Mac" -->
<!-- @var tagline = "Because we bloody love HTML" -->
<title><!-- @appName --> - <!-- @tagline --></title>
</head>
<body>
<h1><!-- $appName --></h1>
<p><!-- $tagline --></p>
</body>
</html>
Meta Tags
<!-- @var description = "The ultimate static site generator" -->
<meta name="description" content="<!-- @description -->">
<!-- Or using $ syntax -->
<meta name="description" content="<!-- $description -->">
Best Practices
pageTitle instead of title.
Naming Conventions
- Use camelCase for variable names (e.g.,
pageTitle) - Make names descriptive and meaningful
- Avoid abbreviations unless they're commonly understood
- Keep variable names consistent across your site
Organization
- Define all variables at the top of your file
- Group related variables together
- Use comments to organize variable sections
- Consider creating a separate include file for shared variables
Next Steps
Now that you understand variables, learn about:
- Hammer Includes to combine variables with reusable components
- Path Resolution for managing assets with variables
- Conditional Logic for dynamic content based on variables