{"id":9453,"date":"2024-02-06T16:13:53","date_gmt":"2024-02-06T14:13:53","guid":{"rendered":"https:\/\/creativethemes.com\/blocksy\/?post_type=documentation&#038;p=9453"},"modified":"2026-10-08T14:07:24","modified_gmt":"2026-10-08T11:07:24","slug":"contact-info","status":"publish","type":"documentation","link":"https:\/\/creativethemes.com\/blocksy\/docs\/theme-blocks\/contact-info\/","title":{"rendered":"Contact Info"},"content":{"rendered":"\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\">\n<figure class=\"wp-block-video\"><video height=\"2056\" style=\"aspect-ratio: 3456 \/ 2056;\" width=\"3456\" autoplay loop muted src=\"https:\/\/creativethemes.com\/blocksy\/wp-content\/uploads\/2024\/02\/Screen-Recording-2024-02-13-at-14.56.34.mov\" playsinline><\/video><figcaption class=\"wp-element-caption\">The Contact Info block in action.<\/figcaption><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">The <strong>Contact Info<\/strong> block provides a structured way to display contact details anywhere the WordPress block editor is available. It can combine information such as addresses, phone numbers, email addresses, opening hours and website links in a single layout.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Individual contact entries can include their own labels, content, links and icons, making the block suitable for contact sections, sidebars, Content Blocks and other areas where visitors need quick access to your details.<\/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 Companion required<\/strong><br>The Contact Info block becomes available after installing and activating <strong>Blocksy Companion<\/strong>.<\/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\">Open the WordPress block inserter and search for <strong>Contact Info<\/strong>. After adding the block to your layout, use the editor sidebar to configure the contact entries and their presentation.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">You can add, remove and reorder individual entries depending on the information you want to display.<\/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\">Granular Controls<\/h2>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-995f960e wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure data-wp-context=\"{&quot;imageId&quot;:&quot;6af78e5e53ddf&quot;}\" data-wp-interactive=\"core\/image\" data-wp-key=\"6af78e5e53ddf\" class=\"wp-block-image size-full has-lightbox wp-lightbox-container\"><img loading=\"lazy\" decoding=\"async\" width=\"640\" height=\"1864\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/creativethemes.com\/blocksy\/wp-content\/uploads\/2024\/02\/Screenshot-2024-02-13-at-15.00.29.png\" alt=\"Contact Info block settings in the WordPress editor\" class=\"wp-image-9622\"\/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\tdata-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"state.thisImage.buttonRight\"\n\t\t\tdata-wp-style--top=\"state.thisImage.buttonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewBox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><figcaption class=\"wp-element-caption\">Configuring the Contact Info block.<\/figcaption><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<h3 class=\"wp-block-heading\">Contact Items<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Add the contact methods that should appear inside the block. Available item types include:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Address<\/strong><\/li>\n\n\n\n<li><strong>Phone<\/strong><\/li>\n\n\n\n<li><strong>Mobile Phone<\/strong><\/li>\n\n\n\n<li><strong>Work Hours<\/strong><\/li>\n\n\n\n<li><strong>Fax<\/strong><\/li>\n\n\n\n<li><strong>Email<\/strong><\/li>\n\n\n\n<li><strong>Website<\/strong><\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Each item can be configured independently, allowing the block to contain only the contact information relevant to your website.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Item Content<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Configure the text displayed for each contact item, including its title or label and the corresponding contact information.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Where applicable, contact information can be linked so visitors can interact with it directly. For example, phone numbers can initiate a call, email addresses can open the visitor&#8217;s email application and website or address entries can point to an appropriate destination.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Link Options<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Configure the destination associated with an item and choose whether supported links should open in a new browser tab.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The item&#8217;s icon can also act as part of the clickable contact entry, providing a larger and more convenient interaction area.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Icon Controls<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Adjust the appearance of the icons used to represent each contact method, including their size and spacing relative to the accompanying content.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Icon Shape Type<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">Display the icons without a surrounding shape or place them inside one of the available shaped containers. Depending on the selected style, the shape can use either an outlined or filled presentation.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Items Direction<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Choose how the individual contact entries are arranged:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Vertical<\/strong> \u2013 stack the contact items one underneath another.<\/li>\n\n\n\n<li><strong>Horizontal<\/strong> \u2013 arrange the contact items across the same row when sufficient space is available.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Use the arrangement that best fits the surrounding layout and the number of contact methods displayed.<\/p>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>The Contact Info block provides a structured way to display contact details anywhere the WordPress block editor is available. It can combine information such as addresses, phone numbers, email addresses, opening hours and website links in a single layout. Individual contact entries can include their own labels, content, links and icons, making the block suitable [&hellip;]<\/p>\n","protected":false},"author":6,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"doc_categories":[133],"class_list":["post-9453","documentation","type-documentation","status-publish","hentry","doc_categories-theme-blocks"],"acf":[],"_links":{"self":[{"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation\/9453","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\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/comments?post=9453"}],"version-history":[{"count":10,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation\/9453\/revisions"}],"predecessor-version":[{"id":15328,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation\/9453\/revisions\/15328"}],"wp:attachment":[{"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/media?parent=9453"}],"wp:term":[{"taxonomy":"doc_categories","embeddable":true,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/doc_categories?post=9453"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}