{"id":1445,"date":"2018-03-03T22:17:43","date_gmt":"2018-03-04T04:17:43","guid":{"rendered":"https:\/\/wpcodeus.com\/?p=1445"},"modified":"2025-08-01T22:59:51","modified_gmt":"2025-08-02T03:59:51","slug":"php-code-to-wpbakery-visual-composer","status":"publish","type":"post","link":"https:\/\/wpcodeus.com\/php-code-to-wpbakery-visual-composer\/","title":{"rendered":"How To Add PHP Code to WPBakery Visual Composer"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"1445\" class=\"elementor elementor-1445\" data-elementor-post-type=\"post\">\n\t\t\t\t<div class=\"elementor-element elementor-element-81359a1 e-flex e-con-boxed parallax_section_no qode_elementor_container_no e-con e-parent\" data-id=\"81359a1\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9cac4fe elementor-widget elementor-widget-text-editor\" data-id=\"9cac4fe\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>In this tutorial we are going to show you how to add PHP Code to WPbakery Visual Composer.<\/p><p>At some point you may find yourself needing to add some PHP code to a certain part of a page template that is built using WPBakery Visual Composer. The default WPBakery Visual Composer however only has elements to add HTML and Javascript and doesn\u2019t allow the adding of php code into any of those elements or the text block. So today we are going to show you how to add custom php code to any WPBakery Visual Composer page by creating a shortcode in your themes functions.php.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-66f74b5 e-flex e-con-boxed parallax_section_no qode_elementor_container_no e-con e-parent\" data-id=\"66f74b5\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d20d19c elementor-widget elementor-widget-heading\" data-id=\"d20d19c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Create a Shortcode to add PHP Code to WPbakery Visual Composer<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-bce13e6 elementor-widget elementor-widget-text-editor\" data-id=\"bce13e6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Using the WordPress shortcode API guidelines, in your\u00a0<strong>functions.php<\/strong>\u00a0file (or other include depending on your theme setup) add the following code:<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3d8ebae elementor-widget elementor-widget-code-highlight\" data-id=\"3d8ebae\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"code-highlight.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"prismjs-default copy-to-clipboard \">\n\t\t\t<pre data-line=\"\" class=\"highlight-height language-php line-numbers\">\n\t\t\t\t<code readonly=\"true\" class=\"language-php\">\n\t\t\t\t\t<xmp>\/\/ Shortcode to output custom PHP in Visual Composer\nfunction wpc_vc_shortcode( $atts ) {\n    echo \"This is my custom PHP output in Visual Composer!\";\n}\nadd_shortcode( 'my_vc_php_output', 'wpc_vc_shortcode');\/\/ Shortcode to output custom PHP in Visual Composer\nfunction wpc_vc_shortcode( $atts ) {\n    echo \"This is my custom PHP output in Visual Composer!\";\n}\nadd_shortcode( 'my_vc_php_output', 'wpc_vc_shortcode');\/\/ Shortcode to output custom PHP in Visual Composer\nfunction wpc_vc_shortcode( $atts ) {\n    echo \"This is my custom PHP output in Visual Composer!\";\n}\nadd_shortcode( 'my_vc_php_output', 'wpc_vc_shortcode');<\/xmp>\n\t\t\t\t<\/code>\n\t\t\t<\/pre>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3f3b9b8 e-flex e-con-boxed parallax_section_no qode_elementor_container_no e-con e-parent\" data-id=\"3f3b9b8\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-5eba897 e-flex e-con-boxed parallax_section_no qode_elementor_container_no e-con e-parent\" data-id=\"5eba897\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0b17d46 elementor-widget elementor-widget-text-editor\" data-id=\"0b17d46\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Be sure to name the function and the shortcode something relevant to what you\u2019re trying to output on the page, this is only a simple example.<\/p><p>If you need to output multiple custom php functions that is separate from the first you will need to copy the code above and make sure you change the name of the shortcode. You can not have the same name for two different shortcodes.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-fc26c25 e-flex e-con-boxed parallax_section_no qode_elementor_container_no e-con e-parent\" data-id=\"fc26c25\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5bb5fcf elementor-widget elementor-widget-heading\" data-id=\"5bb5fcf\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Add The Shortcode to a Page Using WPBakery Visual Composer<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-342ce3f elementor-widget elementor-widget-text-editor\" data-id=\"342ce3f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Now that your shortcode has been added and registered it can be called into WPBakery Visual Composer using a \u201ctext block\u201d. Navigate over the the page that you are wanting to add the custom php to.<\/p><p>From there, add a WPBakery Visual Composer text block with your newly created shortcode called within it. For this guide the shortcode is\u00a0<strong>[my_vc_php_output]<\/strong><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ddfc266 e-flex e-con-boxed parallax_section_no qode_elementor_container_no e-con e-parent\" data-id=\"ddfc266\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5c0498b elementor-widget elementor-widget-image\" data-id=\"5c0498b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"1024\" height=\"365\" src=\"https:\/\/wpcodeus.com\/wp-content\/uploads\/2018\/03\/text-block-with-custom-php-shortcode-added-1024x365.jpg\" class=\"attachment-large size-large wp-image-1448\" alt=\"Add The Shortcode Into Page Using WPBakery Visual Composer\" srcset=\"https:\/\/wpcodeus.com\/wp-content\/uploads\/2018\/03\/text-block-with-custom-php-shortcode-added-1024x365.jpg 1024w, https:\/\/wpcodeus.com\/wp-content\/uploads\/2018\/03\/text-block-with-custom-php-shortcode-added-300x107.jpg 300w, https:\/\/wpcodeus.com\/wp-content\/uploads\/2018\/03\/text-block-with-custom-php-shortcode-added-768x274.jpg 768w, https:\/\/wpcodeus.com\/wp-content\/uploads\/2018\/03\/text-block-with-custom-php-shortcode-added-700x250.jpg 700w, https:\/\/wpcodeus.com\/wp-content\/uploads\/2018\/03\/text-block-with-custom-php-shortcode-added.jpg 1422w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-06e0ee2 e-flex e-con-boxed parallax_section_no qode_elementor_container_no e-con e-parent\" data-id=\"06e0ee2\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7fb5aa6 elementor-widget elementor-widget-text-editor\" data-id=\"7fb5aa6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Now that the shortcode is in your WPBakery Visual Composer page layout, check the results by previewing or publishing the page to ensure the output is as expected.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-4f9ee1d e-flex e-con-boxed parallax_section_no qode_elementor_container_no e-con e-parent\" data-id=\"4f9ee1d\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8e22623 elementor-widget elementor-widget-heading\" data-id=\"8e22623\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Useful Shortcode Examples to Use with WPBakery Visual Composer<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9422756 elementor-widget elementor-widget-text-editor\" data-id=\"9422756\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>As an added bonus we have included a list of useful shortcodes you can use throughout your WordPress website that can help you display a list full of dynamically populated data.<\/p><p>Using the WordPress shortcode API guidelines, in your\u00a0<strong>functions.php<\/strong>\u00a0file (or other include depending on your theme setup) add the following code:<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-113f210 e-flex e-con-boxed parallax_section_no qode_elementor_container_no e-con e-parent\" data-id=\"113f210\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-17def3b elementor-widget elementor-widget-code-highlight\" data-id=\"17def3b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"code-highlight.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"prismjs-default copy-to-clipboard \">\n\t\t\t<pre data-line=\"\" class=\"highlight-height language-php line-numbers\">\n\t\t\t\t<code readonly=\"true\" class=\"language-php\">\n\t\t\t\t\t<xmp>\/\/ WP Codeus Shortcode - Returns the site title.\n\nadd_shortcode( 'site-title', 'wpc_shortcode_site_title' );\nfunction wpc_shortcode_site_title() {\n    $blogname = get_option( 'blogname' );\n    return $blogname;\n}\n\n\n\/\/ WordPress Web Developement and Design Experts Shortcode - Returns the site description.\n\nadd_shortcode( 'site-description', 'wpc_shortcode_site_description' );\nfunction wpc_shortcode_site_description() {\n    $blogdescription = get_option( 'blogdescription' );\n    return $blogdescription;\n}\n\n\n\/\/ https:\/\/wpcodeus.com Shortcode - Returns the site url.\n\nadd_shortcode( 'url', 'wpc_shortcode_site_url' );\nfunction wpc_shortcode_site_url() {\n    $siteurl = get_option( 'siteurl' );\n    return $siteurl;\n}\n\n\n\/\/ contact@wpcodeus.com Shortcode - Returns the site admin email.\n\nadd_shortcode( 'admin-email', 'wpc_shortcode_site_admin_email' );\nfunction wpc_shortcode_site_admin_email() {\n    $admin_email = get_option( 'admin_email' );\n    return $admin_email;\n}\n\n\n\/\/ wpcodeus Shortcode - Returns the current users username.\n\nadd_shortcode( 'username', 'wpc_shortcode_username' );\nfunction wpc_shortcode_username() {\n    $current_user = wp_get_current_user();\n    $username = $current_user->user_login;\n    return $username;\n}\n\n\n\/\/ contact@wpcodeus.com Shortcode - Returns the current users email.\n\nadd_shortcode( 'email', 'wpc_shortcode_user_email' );\nfunction wpc_shortcode_user_email() {\n    $current_user = wp_get_current_user();\n    $user_email = $current_user->user_email;\n    return $user_email;\n}\n\n\n\/\/ Kevin Shortcode - Returns the current users first name.\n\nadd_shortcode( 'first-name', 'wpc_shortcode_user_first_name' );\nfunction wpc_shortcode_user_first_name() {\n    $current_user = wp_get_current_user();\n    $user_firstname = $current_user->user_firstname;\n    return $user_firstname;\n}\n\n\n\/\/ Wilgenbusch Shortcode - Returns the current users last name.\n\nadd_shortcode( 'last-name', 'wpc_shortcode_user_last_name' );\nfunction wpc_shortcode_user_last_name() {\n    $current_user = wp_get_current_user();\n    $user_lastname = $current_user->user_lastname;\n    return $user_lastname;\n}\n\n\n\/\/ Kevin Shortcode - Returns the current users display name.\n\nadd_shortcode( 'display-name', 'wpc_shortcode_user_display_name' );\nfunction wpc_shortcode_user_display_name() {\n    $current_user = wp_get_current_user();\n    $displayname = $current_user->display_name;\n    return $displayname;\n}\n\n\n\/\/ 2025 Shortcode - Returns the Current Year as a string in four digits.\n\nadd_shortcode( 'year', 'wpc_shortcode_year' );\nfunction wpc_shortcode_year() {\n    $date = getdate();\n    return $date['year'];\n}\n\n\n\/\/ July Shortcode - Returns the Current Month as a text string containing the month name.\n\nadd_shortcode( 'month', 'wpc_shortcode_month' );\nfunction wpc_shortcode_month() {\n    $date = getdate();\n    return $date['month'];\n}\n\n\n\/\/ 30 Shortcode - Returns the Current Day as a text string containing the day of the month.\n\nadd_shortcode( 'day', 'wpc_shortcode_day' );\nfunction wpc_shortcode_day() {\n    $date = getdate();\n    return $date['mday'];\n}\n\n\n\/\/ \u00a9 Shortcode - Returns the Copyright Symbol.\n\nadd_shortcode( 'copyright', 'wpc_shortcode_copyright' );\nfunction wpc_shortcode_copyright() {\n        return '\u00a9';\n}\n\n\n\/\/ \u00ae Shortcode - Returns the Registered Symbol.\n\nadd_shortcode( 'registered', 'wpc_shortcode_registered' );\nfunction wpc_shortcode_registered() {\n        return '\u00ae';\n}\n\n\n\/\/ \u2122 Shortcode - Returns the Trademark Symbol.\n\nadd_shortcode( 'trademark', 'wpc_shortcode_trademark' );\nfunction wpc_shortcode_trademark() {\n        return '\u2122';\n}<\/xmp>\n\t\t\t\t<\/code>\n\t\t\t<\/pre>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-99fd120 e-flex e-con-boxed parallax_section_no qode_elementor_container_no e-con e-parent\" data-id=\"99fd120\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e06c77f elementor-widget elementor-widget-heading\" data-id=\"e06c77f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">In Summary<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b795609 elementor-widget elementor-widget-text-editor\" data-id=\"b795609\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Obviously, there are more possibilities than returning a header tag using this solution; it can be expanded to serve any functionality possible with the WordPress Shortcode API, such as shortcodes that handle attributes.<\/p><p>We here at WP Codeus hope this quick guide helps other people facing the same issue; trying to add your own PHP code to any Visual Composer page.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>WPBakery Visual Composer by default does not allow you to add custom PHP code. In this Wordpress tutorial we are going to show you how to create a Wordpress shortcode that you can use to add php code to WPBakery Visual Composer. Click to get started!<\/p>\n","protected":false},"author":1,"featured_media":1446,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[249,68],"tags":[71,75,69],"class_list":["post-1445","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress-tutorials","category-code-snippets","tag-functions-php","tag-visual-composer","tag-wordpress"],"acf":[],"_links":{"self":[{"href":"https:\/\/wpcodeus.com\/wp-json\/wp\/v2\/posts\/1445","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpcodeus.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpcodeus.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpcodeus.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wpcodeus.com\/wp-json\/wp\/v2\/comments?post=1445"}],"version-history":[{"count":0,"href":"https:\/\/wpcodeus.com\/wp-json\/wp\/v2\/posts\/1445\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wpcodeus.com\/wp-json\/wp\/v2\/media\/1446"}],"wp:attachment":[{"href":"https:\/\/wpcodeus.com\/wp-json\/wp\/v2\/media?parent=1445"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpcodeus.com\/wp-json\/wp\/v2\/categories?post=1445"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpcodeus.com\/wp-json\/wp\/v2\/tags?post=1445"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}