By Jim Miller


2012-06-06 00:33:01 8 Comments

Like it says -- I've got a D7 content type whose editing form needs to be themed. I did this all the time in D6 by registering theme functions in template.php and writing the associated theming functions, but things seem to have changed in D7, especially regarding what goes into template.php, or if D7 has shifted to using .tpl.php files for this, or whatever. Is there any advice out there?

3 comments

@laniol 2014-03-28 19:26:06

To change node forms from Admin interface you may use:

Display Suite - http://drupal.org/project/ds

Field Group - http://drupal.org/project/field_group

Renderable Elements - http://drupal.org/project/rel

Enable the following modules: Display Suite, Display Suite Forms, Display Suite Extras, Field Group, Renderable Elements

Set the Renderable Elements settings by going to the settings page at admin/structure/rel/config and making sure the "Enable form registration" checkbox is checked.

Now go to the "Manage fields" form of one of your content types. Click on "Manage form display" at the top of the page to register the form with Renderable Elements to select which fields to enable. Upon saving this form you will be able to manage the display of ALL fields on your content type using the standard Display Suite UI.

source: http://getlevelten.com/blog/ian-whitcomb/drupal-form-layouts-renderable-elements

@arajashe 2013-04-06 06:02:56

You have two options.

option 1: using the template.php of your admin theme

  • Pick the right theme to customize. Remember that by default, drupal 7 uses a different theme for administration and there is a setting under admin/appearance that says what your admin theme is and if content editing should use the admin theme. look at this setting and figure out whether you want to customize your main theme or your admin theme.
  • once the theme has been identified, if that theme is a core theme and not one that resides in sites/all/themes or sites/something.com/themes, you may want to create a base theme rather than changing the existing theme. it is a bad idea to change a core theme anyways. Even if it is a downloaded theme, it makes sense to create a subtheme so that you can keep upgrading the downloaded theme when new versions come out.
  • (optional) to create a subtheme. lets say, your admin theme is seven and it is also being used for content editing, simply create a folder called my_seven under sites/all/themes. next add a my_seven.info under the newly created my_seven directory with the following contents

    base theme = seven name = My Seven description = My simple one-column, tableless, fluid width administration theme (child of Seven).

  • Now add a file called template.php under the same folder with the following contents. please note that the form id is strictly derived from your content types machine name. the template name however can be anything you please but -node-form looks like a good convention to follow.

    <?php 
    
    function my_seven_theme() {
      return array(
        '<my_content_machinename>_node_form' => array(
            'arguments' => array('form' => NULL),
            'template' => '<my_content_machinename or anything else>-node-form',
            'render element' => 'form',
        ),
      );
    }
    
  • now create a <content_type_machinename>-node-form.tpl.php file with the following contents to test if things are working.. once you see the custom form, just change the tpl.php to your heart's content. pick a custom field other than title to be sure it is working fine.. ideally pick something that is not a simple text field. a term reference field type would be a good candidate to ensure that your subtheme is working ok.

    <div>   
        <?php print drupal_render($form['title']); ?>
    </div>
    <div>
        <?php print drupal_render($form['field_<my_field1>']); ?>   
    </div>
    
  • clear your theme registry cache (actually not required for the first time a theme is made use of but do it anyways)

  • set the new subtheme as the admin theme using the admin/appearance page.
  • edit a content or create a new content and you should see your modified form.

option 2: using your own drupal module to customize the form

  • create a new folder called custom_content_forms under sites/all/modules
  • create a custom_content_forms.info file with the following contents

    name = My Custom Content Forms
    description = A trivial module to customize my content entry forms such as smartphone
    core = 7.x
    
  • create a custom_content_forms.module with the following content

    <?php
    
    function custom_content_forms_theme() {
        return array(
            '<contenttype_machine_name>_node_form' => array(
                'template' => '<contenttype_machine_name>-node-form',
                    'render element' => 'form',
            ),
        );
    }
    
  • now create a <content_type_machinename>-node-form.tpl.php file with the following contents to test if things are working.. once you see the custom form, just change the tpl.php to your heart's content. pick a custom field other than title to be sure it is working fine.. ideally pick something that is not a simple text field. a term reference field type would be a good candidate to ensure that your subtheme is working ok.

    <div>   
        <?php print drupal_render($form['title']); ?>
    </div>
    <div>
        <?php print drupal_render($form['field_<my_field1>']); ?>   
    </div>
    
  • go to administration and enable the new module and you should see your customized form when you add or edit content of the targeted type.

NOTE: If you customize using both mechanisms, drupal will prefer the theme over the module.

EDIT: the above will only produce the fields. you wont get the node settings menu and submit and preview buttons by default. if you just add a

<?php print kpr($form); ?>

on the page (devel module needs to be enabled for kpr to work) to produce a dump of the $forms array. You will see that you can get these things on your form page quite easily by adding the following to the tpl.php

<div><?php print drupal_render($form['additional_settings']); ?></div>
<div><?php print drupal_render($form['actions']); ?></div>

@therobyouknow 2013-09-09 16:19:21

+1 great answer - I shall be using this myself. I will also extend it to pre-fill some fields based on the URL that would have brought me to the page.

@therobyouknow 2013-09-17 15:06:25

How does this handle fields with multiple values - i.e. the ability to add more of a certain type of field, I used <?php print drupal_render($form['field_<my_field1>']); ?> for a field which has a 'add another item' button but on clicking the button, the new field was not displayed.

@therobyouknow 2013-09-17 22:30:35

I've explained in more depth my last comment by asking a new question here: drupal.stackexchange.com/questions/85975/…

@therobyouknow 2013-10-02 08:44:10

when building the form, as the above answer describes, you must also make sure you call the function drupal_render_children($form); at the end of your code - according to themery.com/dgd7/advanced-theming/forms/with-templates

@shasi kanth 2014-10-21 11:10:08

I followed the second option to modify the template for the custom content type creation form, but after submitting the form, nothing happens. The node content is not inserted and the form loads again.

@choster 2012-06-06 05:53:24

According to the handbook page on theming node forms in Drupal 7, you would indeed make changes in the .tpl.php template files.

That said, we have usually found it easier to use Field Group and Display Suite. Node Form Columns is another option.

@Jim Miller 2012-06-06 23:05:34

Good suggestions; thanks. I'll also check out the modules you mentioned.

@therobyouknow 2013-09-19 09:54:03

Great answer. I've used Display Suite with some success but if you find things go missing you can turn it off and then analyse what the problem is. And If you're considering customising the form to output certain fields you might also consider drupal.org/project/field-conditional-state to display certain fields depending on the value of others.

@therobyouknow 2013-09-19 10:34:18

Related Questions

Sponsored Content

1 Answered Questions

How to create custom form and theme?

  • 2016-06-26 18:43:41
  • Dev
  • 24 View
  • 1 Score
  • 1 Answer
  • Tags:   theming webforms

2 Answered Questions

1 Answered Questions

[SOLVED] How do you theme the node edit page?

  • 2013-07-12 17:39:16
  • Jon H
  • 10391 View
  • 4 Score
  • 1 Answer
  • Tags:   7 theming nodes

2 Answered Questions

[SOLVED] How to theme content edit page

  • 2015-09-17 06:12:24
  • Oleg Vdovenko
  • 132 View
  • 1 Score
  • 2 Answer
  • Tags:   theming

1 Answered Questions

[SOLVED] Where do you edit the css of a basic bootstrap theme in Drupal 7?

  • 2015-05-23 20:58:11
  • JohnDoea
  • 3898 View
  • 2 Score
  • 1 Answer
  • Tags:   theming

1 Answered Questions

Drupal 6 make a content edit form be in a specified theme

  • 2014-12-05 18:45:10
  • Allen Chen
  • 20 View
  • 1 Score
  • 1 Answer
  • Tags:   theming

2 Answered Questions

[SOLVED] Use Bootswatch.com themes with Drupal Twitter bootstrap

2 Answered Questions

[SOLVED] How do I structure a simple Drupal 7 site/theme?

  • 2012-03-13 23:14:08
  • toxinlabs
  • 3178 View
  • 2 Score
  • 2 Answer
  • Tags:   7 theming nodes

1 Answered Questions

[SOLVED] Drupal multisite: Same theme, different colors

1 Answered Questions

Sponsored Content