{"id":1420,"date":"2024-03-23T07:56:38","date_gmt":"2024-03-23T07:56:38","guid":{"rendered":"https:\/\/docs.wpblockart.com\/blockart-blocks\/?post_type=docs&p=1420"},"modified":"2024-04-10T08:27:36","modified_gmt":"2024-04-10T08:27:36","slug":"team","status":"publish","type":"docs","link":"https:\/\/docs.wpblockart.com\/blockart-blocks\/team\/","title":{"rendered":"Team"},"content":{"rendered":"\n

The Team Block showcases the individuals in your team. You can display detailed descriptions that include Name, Designation, Picture, Social Links, etc.<\/p>\n\n\n\n

\"Add
Add Team Block<\/figcaption><\/figure>\n\n\n\n

After you have chosen the Team Block block, you’ll get a block editing panel on the right-hand side. It has three options, i.e., General<\/strong>, Style<\/strong>, and Advanced<\/strong>. These options customize the design and other elements of the block. Let\u2019s explore one by one below:<\/p>\n\n\n\n

General<\/h2>\n\n\n\n

Image<\/h3>\n\n\n\n

It comes with the following options for customizing the team member image: <\/p>\n\n\n\n

    \n
  • Enable<\/strong> – Switch the Toggle to the right area to display the team member image on your site. Enabling the option will display the Add Image option, which will help you add the team image.<\/li>\n<\/ul>\n\n\n\n
    \"Enable
    Enable and Add Image<\/figcaption><\/figure>\n\n\n\n

    Name<\/h3>\n\n\n\n

    It comes with the following options for customizing the team member’s Name:<\/p>\n\n\n\n

      \n
    • Enable <\/strong>– Switch the Toggle to the right area to display the team member’s name. Enabling the option will display the Team member’s name. <\/li>\n\n\n\n
    • HTML Markup<\/strong> – Under the Markup option, select the required markup for your name. You can set the value to be in Heading, Paragraph, or Div.<\/li>\n<\/ul>\n\n\n\n
      \"Enable
      Enable Team Member Name and Set HTML Markup<\/figcaption><\/figure>\n\n\n\n

      Designation<\/h3>\n\n\n\n

      It comes with the following options for customizing the team member Designation: <\/p>\n\n\n\n

        \n
      • Enable<\/strong> – Switch the Toggle to the right area to display the team member Designation.<\/li>\n<\/ul>\n\n\n\n
        \"Enable
        Enable Designation<\/figcaption><\/figure>\n\n\n\n

        Description<\/h3>\n\n\n\n

        It comes with the following options for customizing the team member Description:<\/p>\n\n\n\n

          \n
        • Enable<\/strong> – Switch the Toggle to the right area to display the team member Description.<\/li>\n<\/ul>\n\n\n\n
          \"Enable
          Enable Description<\/figcaption><\/figure>\n\n\n\n

          Social Icon<\/h3>\n\n\n\n

          It comes with the following options for customizing the team member’s Social Icon:<\/p>\n\n\n\n

            \n
          • Font Size<\/strong> – It determines the size of the social icon. Moreover, you can set the different Icon sizes for various devices (Desktop, Tablet, and Mobile). <\/li>\n\n\n\n
          • Icon 1<\/strong> – It represents the first social icons displayed on the Team Block. Clicking the edit option will allow you to change the Social Icon as well as add the redirection link. Likewise, Switch the Toggle to the left area to disable the social icon. <\/li>\n<\/ul>\n\n\n\n

            [Note – You can use the same setting for customizing the social Icon from 1-5].<\/em><\/p>\n\n\n\n

            \"Enable
            Enable Social Icon and Set Font Size<\/figcaption><\/figure>\n\n\n\n

            Style<\/h2>\n\n\n\n

            It provides the following styling options for the Team Block. These are listed below:<\/p>\n\n\n\n

            Properties<\/h3>\n\n\n\n
              \n
            • Text Alignment<\/strong> – It sets the alignments for the Team Block. You can set the alignments as Left<\/strong>,\u00a0Center, Right, <\/strong>and Justify<\/strong>. Moreover, you can also set the alignment position on different devices (Desktop, Tablet, and Mobile).<\/li>\n<\/ul>\n\n\n\n
              \"Set
              Set Team Block to Center Alignment<\/figcaption><\/figure>\n\n\n\n

              Background<\/h3>\n\n\n\n
                \n
              • Type – <\/strong>It sets the background color of the Team Block. You can change the background’s visual appearance by changing its color or adding an image.<\/li>\n<\/ul>\n\n\n\n
                \"Change
                Change Background Color<\/figcaption><\/figure>\n\n\n\n

                Image<\/h3>\n\n\n\n
                  \n
                • Size <\/strong>– It determines the size of the space. You can increase or decrease the size of the image by moving the slider.<\/li>\n<\/ul>\n\n\n\n
                  \"Change
                  Change Size of the Image<\/figcaption><\/figure>\n\n\n\n

                  Name<\/h3>\n\n\n\n

                  It comes with the following options for styling the team member’s Name:<\/p>\n\n\n\n

                    \n
                  • Color <\/strong>– It changes the color of the team member’s name.<\/li>\n\n\n\n
                  • Typography <\/strong>– It allows you to control the\u00a0Typography, such as font family,\u00a0weight,\u00a0font size,\u00a0line height, and other related styling properties for the name. The options are listed below:\n
                      \n
                    • Font Family<\/strong> \u2013 The option allows you to choose the appropriate font family for the name.<\/li>\n\n\n\n
                    • Weight<\/strong> \u2013 It refers to the thickness or boldness of the name.<\/li>\n\n\n\n
                    • Size<\/strong> \u2013 It controls the font size of the name.<\/li>\n\n\n\n
                    • Line Height<\/strong> \u2013 It manages the space above and below the name.<\/li>\n\n\n\n
                    • Letter Spacing<\/strong> \u2013  It controls the amount of space between characters in the name.<\/li>\n\n\n\n
                    • Style<\/strong> \u2013 Using the property, you can set the name to be Italic or Oblique.<\/li>\n\n\n\n
                    • Transformation<\/strong> \u2013 It changes the case of the name such as Lowercase, Uppercase, and Capitalize.<\/li>\n\n\n\n
                    • Decoration <\/strong>\u2013 The styling is applied to the name to make it more visually appealing. The options include underline, overline, and line through.<\/li>\n<\/ul>\n<\/li>\n\n\n\n
                    • Margin<\/strong> \u2013  It sets the space around the team\u2019s name. Moreover, you can set the space value to be different on various devices (Desktop, Tablet, and Mobile).<\/li>\n<\/ul>\n\n\n\n
                      \"Add
                      Add Styling to Team Name<\/figcaption><\/figure>\n\n\n\n

                      Designation<\/h3>\n\n\n\n

                      It comes with the following options for styling the team member Designation:<\/p>\n\n\n\n

                        \n
                      • Color<\/strong> \u2013 It changes the color of the team member\u2019s designation.<\/li>\n\n\n\n
                      • Typography<\/strong> \u2013 It allows you to control the designation Typography, such as\u00a0font family,\u00a0weight,\u00a0font size,\u00a0line height, and other related styling properties.<\/li>\n\n\n\n
                      • Margin <\/strong>\u2013 It sets the space around the designation. Moreover, you can set the space value to be different on various devices (Desktop, Tablet, and Mobile).<\/li>\n<\/ul>\n\n\n\n
                        \"Add
                        Add Styling to Team Designation<\/figcaption><\/figure>\n\n\n\n

                        Description<\/h3>\n\n\n\n

                        It comes with the following options for styling the team member Description:<\/p>\n\n\n\n

                          \n
                        • Color<\/strong> \u2013 It changes the color of the team member\u2019s description.<\/li>\n\n\n\n
                        • Typography <\/strong>\u2013 It allows you to control the description Typography, such as\u00a0font family,\u00a0weight,\u00a0font size,\u00a0line height, and other related styling properties.<\/li>\n\n\n\n
                        • Margin <\/strong>\u2013 It sets the space around the description. Moreover, you can set the space value to be different on various devices (Desktop, Tablet, and Mobile).<\/li>\n<\/ul>\n\n\n\n
                          \"Add
                          Add Styling to Team Description<\/figcaption><\/figure>\n\n\n\n

                          Border<\/h3>\n\n\n\n

                          It customizes the Border area added around the Team block and comes with the following options:<\/p>\n\n\n\n

                            \n
                          • Type<\/strong>\u00a0\u2013 You can set the border type as\u00a0Solid,\u00a0Dotted,\u00a0Dashed,\u00a0Double, etc. Moreover, select the border type to be\u00a0None\u00a0if you do not want to add any borders.<\/li>\n<\/ul>\n\n\n\n

                            When you select none, you will be given the following option:<\/p>\n\n\n\n

                              \n
                            • Radius<\/strong> \u2013 It allows you to fix the radius value to make the round corners for the border.<\/li>\n<\/ul>\n\n\n\n

                              However, if you select the border type to be other than none, two more options will be added. The option is listed below:<\/p>\n\n\n\n

                                \n
                              • Border Color<\/strong> \u2013 It allows you to choose the appropriate border color.<\/li>\n\n\n\n
                              • Size<\/strong> \u2013 It provides the option to select the border size.<\/li>\n<\/ul>\n\n\n\n
                                \"Add
                                Add and Customize Border<\/figcaption><\/figure>\n\n\n\n

                                Advanced<\/h2>\n\n\n\n

                                The Advanced section consists of four customization options for the Team Block.<\/p>\n\n\n\n

                                Spacing<\/h3>\n\n\n\n

                                Under the spacing section, you can find the following options available:<\/p>\n\n\n\n

                                  \n
                                • Block Margin<\/strong> \u2013 According to the site requirement, you can assign a specific margin value to the block along with units like px, em, %, and rem. Moreover, you can set different margin values for various devices (Desktop, Tablet, and Mobile).<\/li>\n\n\n\n
                                • Block Padding \u2013\u00a0<\/strong>According to the site requirement, you can assign a specific padding value to the block along with units like\u00a0px, em, %, and rem. Moreover, you can set different padding values for various devices (Desktop, Tablet, and Mobile).<\/li>\n<\/ul>\n\n\n\n
                                  \"Manage
                                  Manage Margin and Padding Space<\/figcaption><\/figure>\n\n\n\n

                                  Z-Index<\/h3>\n\n\n\n

                                  It allows you to set the priority of the Team block according to the site requirement.<\/p>\n\n\n\n

                                  Responsive Condition<\/h3>\n\n\n\n

                                  Using the option, you can enable\/disable displaying the block on various screen sizes:<\/p>\n\n\n\n

                                    \n
                                  • Hide on Desktop<\/strong> \u2013 It hides the Team block on the Desktop.<\/li>\n\n\n\n
                                  • Hide on Tablet<\/strong> \u2013 It hides the Team block on the Tablet.<\/li>\n\n\n\n
                                  • Hide on Mobile<\/strong>\u00a0\u2013 It hides the Team block on the Mobile<\/li>\n<\/ul>\n\n\n\n
                                    \"Enable\/Disable
                                    Enable\/Disable Block Responsive Condition<\/figcaption><\/figure>\n\n\n\n

                                    Advanced<\/h3>\n\n\n\n

                                    Under the option, you can set the CSS ID and Classes for this particular Team block. The available options are listed below:<\/p>\n\n\n\n

                                      \n
                                    • CSS ID<\/strong> \u2013 It allows you to set specific IDs to style this particular block. Once you have set the ID, you can write the CSS Code to style the block using that particular ID.<\/li>\n\n\n\n
                                    • Additional CSS Class(es)<\/strong> \u2013 It allows you to add a CSS class to your block and write custom CSS to style this particular block.<\/li>\n<\/ul>\n\n\n\n
                                      \"Add
                                      Add CSS ID and Additional CSS Class<\/figcaption><\/figure>\n\n\n\n

                                      After creating the separate ID and Classes, visit your CSS editor and write a style for the ID and class.<\/p>\n","protected":false},"excerpt":{"rendered":"

                                      The Team Block showcases the individuals in your team. You can display detailed descriptions that include Name, Designation, Picture, Social Links, etc. After you have chosen the Team Block block, you’ll get a block editing panel on the right-hand side. It has three options, i.e., General, Style, and Advanced. These options customize the design and[…]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","meta":[],"doc_category":[7],"doc_tag":[],"_links":{"self":[{"href":"https:\/\/docs.wpblockart.com\/blockart-blocks\/wp-json\/wp\/v2\/docs\/1420"}],"collection":[{"href":"https:\/\/docs.wpblockart.com\/blockart-blocks\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/docs.wpblockart.com\/blockart-blocks\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/docs.wpblockart.com\/blockart-blocks\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/docs.wpblockart.com\/blockart-blocks\/wp-json\/wp\/v2\/comments?post=1420"}],"version-history":[{"count":24,"href":"https:\/\/docs.wpblockart.com\/blockart-blocks\/wp-json\/wp\/v2\/docs\/1420\/revisions"}],"predecessor-version":[{"id":2761,"href":"https:\/\/docs.wpblockart.com\/blockart-blocks\/wp-json\/wp\/v2\/docs\/1420\/revisions\/2761"}],"wp:attachment":[{"href":"https:\/\/docs.wpblockart.com\/blockart-blocks\/wp-json\/wp\/v2\/media?parent=1420"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/docs.wpblockart.com\/blockart-blocks\/wp-json\/wp\/v2\/doc_category?post=1420"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/docs.wpblockart.com\/blockart-blocks\/wp-json\/wp\/v2\/doc_tag?post=1420"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}