• Skip to main content
  • Skip to primary sidebar

WordPress, Genesis Framework and Storefront customization tutorials

  • Archive
    • Free
    • Premium
  • Blog
  • About
  • Contact
  • Newsletter
  • Login
Home ยป Create a text field in the Customizer and show it in the front end

Create a text field in the Customizer and show it in the front end

Add text to customizer

1) Add this to your functinos.php


// =========================================================================
// REGISTER CUSTOMIZER - PANEL, SECTION, SETTINGS AND CONTROL
// =========================================================================
function theme_name_register_theme_customizer( $wp_customize ) {
    // Create custom panel.
    $wp_customize->add_panel( 'text_blocks', array(
        'priority'       => 10,
        'theme_supports' => '',
        'title'          => __( 'Text Blocks', 'theme_name' ),
        'description'    => __( 'Set editable text for certain content.', 'theme_name' ),
    ) );
    // Add section.
    $wp_customize->add_section( 'custom_title_text' , array(
        'title'    => __('Custom Text','theme-name'),
        'panel'    => 'text_blocks',
        'priority' => 10
    ) );
    // Add setting
    $wp_customize->add_setting( 'title_text_block', array(
         'default'           => __( 'Default text', 'theme-name' ),
         'sanitize_callback' => 'sanitize_text'
    ) );
    // Add control
    $wp_customize->add_control( new WP_Customize_Control(
        $wp_customize,
        'custom_title_text',
            array(
                'label'    => __( 'Custom Text', 'theme_name' ),
                'section'  => 'custom_title_text',
                'settings' => 'title_text_block',
                'type'     => 'text'
            )
        )
    );
 
    // Sanitize text
    function sanitize_text( $text ) {
        return sanitize_text_field( $text );
    }
}
add_action( 'customize_register', 'theme_name_register_theme_customizer' );

2) Show in the Front End with a hook

function add_custom_field(){
    echo get_theme_mod( 'title_text_block');
}
add_action('genesis_site_description', 'add_custom_field');

In this case I’ve placed the custom text in the site-description, but You can put it anywhere You want using the Genesis Visual Hook Guide.

Add custom text via customizer

Filed Under: Free Tagged With: PHP

About Gabor Flamich

I'm a web developer and designer based in Budapest, Hungary. In recent years, I've documented hundreds of solutions I came across during development. This site is an archive for useful code snippets on WordPress, Genesis Framework and WooCommerce. If You have any questions related to WordPress development, get in touch!

Reader Interactions

Comments

  1. Naeem Rafeeq says

    2021-05-27 at 01:15

    I am new to wordpress, and was very confuse about adding text control, Your post solve my problem. Thank you so much
    Best Wishes

    Reply
  2. Nicu says

    2022-12-10 at 05:05

    Thanks for this tutorial, it helped me a lot.

    Reply

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Primary Sidebar

Gabor Flamich

Hi! I'm Gabor.
I write tutorials on WordPress and WooCommerce.

MacBook

12 Essential Snippets for Genesis Developers

Subscribe to my Newsletter to view my basic collection of Genesis snippets that I use for my projects!

Sign Up for Free
  • Facebook
  • GitHub
  • Instagram
  • LinkedIn
  • Twitter
  • YouTube
UpdraftPlus Premium

Tags

ACF Ajax Analytics API Bootstrap Breadcrumb category CPT CSS fetch FSE Genesis Google Maps Gutenberg HTML Isotope JavaScript jQuery loop Map Menu Parallax PHP Rest API SASS SEO SQL Storefront SVG tab tag manager tags Taxonomy Tool upsell Webpack Wholesale WooCommerce WordPress WPML

Disclosure: Some of the links in this site are affiliate links. I will be paid a commission if you use this link to make a purchase.

  • Privacy Policy / Terms of Service
© 2025 WP Flames - All Right Reserved