---
title: "Connecting your templates to fields"
date: "2017-11-13T07:44:40+00:00"
summary: "Learn how to connect your Site Studio templates to Drupal content fields. Discover two methods: using the Field element for complete field rendering and field tokens for dynamic content insertion within elements."
image:
type: "page"
url: "/drupal-starter-kits/add-ons/site-studio/connecting-your-templates-fields"
id: "85de1d19-5819-43a9-90fb-d8bae6f894f5"
---

Table of contents will be added

When you create a template for a content entity such as a content type, you need to connect it to the content fields it uses. You have two options; use the Field element which will render the Drupal field using its field format, or use a field token to render a fields data within a Site Studio element. 

Using the the field element
---------------------------

You can render the content of a field from your Content type within your template using the [Field element](/drupal-starter-kits/add-ons/site-studio/field-element "Field element"). When you use this option, the template will render the processed output of the field. The main use for this is when you want to render the complete field. For example, use the Field element to render the Body field or the Layout canvas field from your content type.

To use the Field element:

1.  Navigate to Site Studio > Templates > Content templates > **Content type**
2.  Select a template and click **Edit**
3.  Drag a **Field** **element** onto the Layout canvas
4.  Double click on the **Field element** to edit its settings
5.  In the drop-down, select a field from your Content type to render. For example, Body
6.  Click **Apply**
7.  Click **Save and continue.**

![4b26a5b0-using-the-field-element.gif](https://acquia.widen.net/content/9a24227a-2f51-4227-952a-0f1c67eddcc3/web/4b26a5b0-using-the-field-element.gif?animate=true)

Using field tokens in your template
-----------------------------------

You can use field tokens to render content from your Drupal fields. Tokens are specially formatted blocks of text that serve as placeholders for a dynamically generated value. They consist of a **Type** and a **Value** and are always contained within square brackets like this **\[node:title\]**. In this example, **node:** is the **type** and **title** is the **value**. 

Example: Use a field token to render the node title into the Heading element:

### Step 1 - Add a heading element to your template

1.  Navigate to Site Studio > Templates > Content templates > **Content type**
2.  Select a template and click **Edit**
3.  Add a  **Heading element** to your layout canvas.

### Step 2 - Insert the node title token into the heading element

1.  Double click the Heading element to open its settings
2.  Click the **plus icon button** to switch all fields within the element to variable mode. Variable mode allows you to enter tokens into any field widget type.
3.  Click the **search icon button** to open the token browser.
4.  Use the token browser to find the field you want to render in your template. For this example, open **Nodes** and find **Title**.  
      
    
    ![cbf31c19-toggle-variable-mode-open-token-browser.gif](https://acquia.widen.net/content/453bab43-a2f9-4989-895d-5e75fc670bb0/web/cbf31c19-toggle-variable-mode-open-token-browser.gif?animate=true)
    
      
     
5.  Click within the **Heading text field** to give it focus
6.  Click on the **token link** to insert it within the Heading field
7.  Click **Apply** to save the Heading settings with the token inserted.  
      
    
    ![42913763-insert-token-into-template-element.gif](https://acquia.widen.net/content/0649e495-1ab1-4dad-8345-7007ae49b4ab/web/42913763-insert-token-into-template-element.gif?animate=true)
    
8.  Click **Save and continue** to save your template.
9.  The Title field from your Content type will now render into the Heading text field in your Heading element within your template.

Deleting tokens from fields in Elements
---------------------------------------

To delete a token from a field:

1.  Within the Heading element, click on **plus icon button** to toggle into variable mode
2.  Select and delete the token text from the field
3.  Click on **plus icon button** to toggle out of variable mode
4.  The field will return to its original state without a token.
5.  Click **Apply.**