{"id":1622,"date":"2021-01-18T20:35:36","date_gmt":"2021-01-18T18:35:36","guid":{"rendered":"https:\/\/creativethemes.com\/blocksy\/?post_type=documentation&#038;p=1622"},"modified":"2026-10-08T11:46:35","modified_gmt":"2026-10-08T08:46:35","slug":"custom-code-snippets","status":"publish","type":"documentation","link":"https:\/\/creativethemes.com\/blocksy\/docs\/extensions\/custom-code-snippets\/","title":{"rendered":"Custom Code Snippets"},"content":{"rendered":"\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\">\n<figure class=\"wp-block-video\"><video autoplay loop muted preload=\"auto\" src=\"https:\/\/creativethemes.com\/blocksy\/wp-content\/uploads\/2021\/01\/Screen-Recording-2021-10-21-at-22.27.09.mov\" playsinline><\/video><figcaption class=\"wp-element-caption\">Activating the Custom Code Snippets extension.<\/figcaption><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">The <strong>Custom Code Snippets<\/strong> extension lets you add custom code to your website without modifying Blocksy&#8217;s theme files. Snippets can be loaded globally across the entire website or only on individual posts and pages.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">This is useful for adding third-party scripts, analytics integrations, tracking pixels, custom JavaScript, CSS and other code that needs to be inserted at a specific location in the page.<\/p>\n\n\n\n<div class=\"wp-block-group has-palette-color-8-color has-palette-color-1-background-color has-text-color has-background is-layout-constrained wp-block-group-is-layout-constrained\">\n<p class=\"is-style-info coblocks-alert-paragraph wp-block-paragraph\"><strong>Blocksy Pro required<\/strong><br>The Custom Code Snippets extension requires Blocksy Companion Pro to be installed and active.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">Getting Started<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">To activate Custom Code Snippets:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Navigate to <strong>WordPress Dashboard \u2192 Blocksy \u2192 Extensions<\/strong>.<\/li>\n\n\n\n<li>Locate the <strong>Custom Code Snippets<\/strong> extension.<\/li>\n\n\n\n<li>Enable the extension.<\/li>\n<\/ol>\n\n\n\n<p class=\"wp-block-paragraph\">Once activated, you can add code globally from the Customiser or configure snippets for individual posts and pages.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">Global Code Snippets<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">To add code across the entire website, open <strong>Customiser \u2192 Extensions \u2192 Custom Code Snippets<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-video\"><video autoplay loop muted preload=\"auto\" src=\"https:\/\/creativethemes.com\/blocksy\/wp-content\/uploads\/2021\/01\/Screen-Recording-2021-10-21-at-22.29.08.mov\" playsinline><\/video><figcaption class=\"wp-element-caption\">Configuring global code snippets.<\/figcaption><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">The extension provides three insertion areas, letting you place code at the location required by the service or integration you are configuring.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Header Scripts<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Code added to <strong>Header Scripts<\/strong> is inserted into the document&#8217;s <code>&lt;head&gt;<\/code> section. This location is commonly required by analytics platforms, verification services, external libraries and other integrations that need to load early in the page.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">After Body Open Scripts<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Code added to <strong>After Body Open Scripts<\/strong> is inserted immediately after the opening <code>&lt;body&gt;<\/code> element. Some third-party services, including certain tag-management configurations, provide a separate snippet specifically for this location.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Footer Scripts<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Use <strong>Footer Scripts<\/strong> for code that should load near the end of the page. This is often appropriate for scripts that do not need to execute before the primary page content has loaded.<\/p>\n\n\n\n<div class=\"wp-block-group has-palette-color-8-color has-palette-color-1-background-color has-text-color has-background is-layout-constrained wp-block-group-is-layout-constrained\">\n<p class=\"is-style-info coblocks-alert-paragraph wp-block-paragraph\"><strong>Choose the correct location<\/strong><br>Always follow the instructions provided by the service whose code you are adding. Moving a snippet between the Header, After Body Open and Footer locations can prevent an integration from working correctly.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">Per Page\/Post Code Snippets<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Custom Code Snippets can also be added only to a specific post or page. This is useful when an integration should run only in a particular section of the website rather than globally.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">For example, a conversion-tracking script could be loaded only on a confirmation or Thank You page instead of being included on every page of the website.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">To add a page-specific or post-specific snippet:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Edit the desired post or page in the WordPress editor.<\/li>\n\n\n\n<li>Open the <strong>Blocksy<\/strong> settings panel.<\/li>\n\n\n\n<li>Locate the <strong>Custom Code Snippets<\/strong> section.<\/li>\n\n\n\n<li>Add the code to the appropriate <strong>Header Scripts<\/strong>, <strong>After Body Open Scripts<\/strong> or <strong>Footer Scripts<\/strong> field.<\/li>\n\n\n\n<li>Update the post or page to save the changes.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-video\"><video autoplay loop muted preload=\"auto\" src=\"https:\/\/creativethemes.com\/blocksy\/wp-content\/uploads\/2021\/01\/Screen-Recording-2021-10-21-at-22.32.55.mov\" playsinline><\/video><figcaption class=\"wp-element-caption\">Adding code snippets to an individual post or page.<\/figcaption><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">Working with Custom Code<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">The extension can be used for a wide range of integrations, but the code itself remains your responsibility. Only add snippets from sources you trust and make sure the code is intended for the insertion location you have selected.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Incorrect or malformed code can interfere with the front end of the website or with other scripts that are already running. When troubleshooting an integration, temporarily disabling the relevant snippet can help determine whether it is contributing to the issue.<\/p>\n\n\n\n<div class=\"wp-block-group has-palette-color-8-color has-palette-color-1-background-color has-text-color has-background is-layout-constrained wp-block-group-is-layout-constrained\">\n<p class=\"is-style-info coblocks-alert-paragraph wp-block-paragraph\"><strong>Third-party integrations<\/strong><br>The Custom Code Snippets extension provides the locations where custom code can be inserted. Configuration, compatibility and troubleshooting of code supplied by third-party services remain dependent on those services and the code being used.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">Video Resources<\/h2>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"Integrating Powerful Analytical Tools | Blocksy Integrations\" width=\"1290\" height=\"968\" src=\"https:\/\/www.youtube.com\/embed\/EzBWrB3O_bs?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>The Custom Code Snippets extension lets you add custom code to your website without modifying Blocksy&#8217;s theme files. Snippets can be loaded globally across the entire website or only on individual posts and pages. This is useful for adding third-party scripts, analytics integrations, tracking pixels, custom JavaScript, CSS and other code that needs to be [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"doc_categories":[116],"class_list":["post-1622","documentation","type-documentation","status-publish","hentry","doc_categories-extensions"],"acf":[],"_links":{"self":[{"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation\/1622","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation"}],"about":[{"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/types\/documentation"}],"author":[{"embeddable":true,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/comments?post=1622"}],"version-history":[{"count":2,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation\/1622\/revisions"}],"predecessor-version":[{"id":15295,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation\/1622\/revisions\/15295"}],"wp:attachment":[{"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/media?parent=1622"}],"wp:term":[{"taxonomy":"doc_categories","embeddable":true,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/doc_categories?post=1622"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}