{"id":1592,"date":"2024-03-20T10:28:17","date_gmt":"2024-03-20T10:28:17","guid":{"rendered":"https:\/\/docs.wpblockart.com\/blockart-blocks\/?post_type=docs&p=1592"},"modified":"2024-04-11T06:31:44","modified_gmt":"2024-04-11T06:31:44","slug":"testimonial","status":"publish","type":"docs","link":"https:\/\/docs.wpblockart.com\/blockart-blocks\/testimonial\/","title":{"rendered":"Testimonial"},"content":{"rendered":"\n

The Testimonial block allows you to share the customer\/client feedback, which explains how they have benefited from your product or services. The block adds social proof by letting your site visitors know what other people say about you.<\/p>\n\n\n\n

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

After you have chosen the Testimonial 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 Testimonial block. Let\u2019s explore one by one below:<\/p>\n\n\n\n

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

General<\/h3>\n\n\n\n
    \n
  • Per Page<\/strong> – It determines the number of testimonials you want to display on a page.<\/li>\n\n\n\n
  • Per Move<\/strong> – It determines the number of testimonials changed during the slide.<\/li>\n\n\n\n
  • Speed<\/strong> – It refers to how quickly the slides transition from one to another. If you add a higher slider value, the slides change slowly, and if you add a lower slider value, the slides change quickly.<\/li>\n\n\n\n
  • Interval – <\/strong>It determines the time interval between each slide translation or how long each slide is visible before the next one appears.<\/li>\n\n\n\n
  • Loop –<\/strong> Enabling the loop creates a continuous slideshow experience. Once the slider reaches the end, it automatically starts from the first slide.<\/li>\n\n\n\n
  • AutoPlay – <\/b>It automatically translates the slide from one to another without the need for any user to manually navigate through them.<\/li>\n\n\n\n
  • Pause On <\/strong>– The option pauses the testimonial slide when hovering the cursor over the slider if you choose the Hover option.<\/li>\n\n\n\n
  • Arrows<\/strong> – Enabling the arrow displays the icons (left and right) that help manually move the slider forward and backward.<\/li>\n\n\n\n
  • Pagination – <\/b>It adds dot icons to the slider area that indicate the current testimonial position and the number of total testimonials.<\/li>\n<\/ul>\n\n\n\n
    \"General
    General Settings of the Block<\/figcaption><\/figure>\n\n\n\n

    Spacing and Height <\/h3>\n\n\n\n
      \n
    • Space Between <\/strong>– It determines the space between two testimonials.<\/li>\n<\/ul>\n\n\n\n
      \"Manage
      Manage the Gap Between Two Testimonials<\/figcaption><\/figure>\n\n\n\n

      Arrow and Dots<\/h3>\n\n\n\n

      It styles the arrow and dot icons appearing over the slider image and comes up with the following options:<\/p>\n\n\n\n

        \n
      • Size <\/strong>\u2013 It determines the size of the arrow icon. <\/li>\n\n\n\n
      • Arrow Distance from Edges<\/strong> – It determines the space between the arrow and testinomial edge.<\/li>\n<\/ul>\n\n\n\n
        \"Customize
        Customize Arrow and Dots<\/figcaption><\/figure>\n\n\n\n

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

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

        Arrows and Dots<\/h3>\n\n\n\n
          \n
        • Color<\/strong> – \u00a0It allows you to change the color of the Arrow and Dots icon added to the Testimonial block.<\/li>\n\n\n\n
        • Background<\/strong> – It sets the background color and image of the arrow and dots.<\/li>\n\n\n\n
        • Border<\/strong> – It customizes the Border area added around the arrow and comes with the following options:\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. When you select none, you will be given the following option:<\/li>\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<\/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>\u00a0\u2013 It provides the option to select the border size.<\/li>\n<\/ul>\n\n\n\n
              \"Change
              Change Arrow and Dot Color<\/figcaption><\/figure>\n\n\n\n
                \n
              • Bottom Margins for Dots<\/strong> – \u00a0It manages the dot\u2019s margin-bottom value.<\/li>\n<\/ul>\n\n\n\n
                \"Set
                Set Bottom Margin Value<\/figcaption><\/figure>\n\n\n\n

                Color<\/h3>\n\n\n\n
                  \n
                • Text Color<\/strong> – \u00a0It allows you to change the color of the Testimonial text.<\/li>\n<\/ul>\n\n\n\n
                  \"Change
                  Change Text Color<\/figcaption><\/figure>\n\n\n\n

                  Background <\/h3>\n\n\n\n
                    \n
                  • Type<\/strong> – It sets the background color of the Testimonial. You can change the visual appearance of the background 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

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

                    It customizes the Border area added around the testimonial 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 for the section block. When you select none, you will be given the following option:<\/li>\n\n\n\n
                    • Radius<\/strong>\u00a0\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>\u00a0\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 options for the Testimonial 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>\u00a0\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 the value of the different margins for various devices (Desktop, Tablet, and Mobile).<\/li>\n\n\n\n
                        • Block Padding – <\/strong>According to the site requirement, you can assign a specific padding value to the block along with units like px, em, %, and rem. Moreover, you can set the 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 Testimonial 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>\u00a0\u2013 It hides the Testimonial block on the Desktop.<\/li>\n\n\n\n
                          • Hide on Tablet<\/strong>\u00a0\u2013 It hides the Testimonial block on the Tablet.<\/li>\n\n\n\n
                          • Hide on Mobile<\/strong>\u00a0\u2013 It hides the Testimonial block on the Mobile.<\/li>\n<\/ul>\n\n\n\n
                            \"Enable
                            Enable 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 Testimonial 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>\u00a0\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

                              After creating the separate ID and Classes, visit your CSS editor and write a style for the ID and class.<\/p>\n\n\n\n

                              \"Add
                              Add Additional CSS ID and Classes<\/figcaption><\/figure>\n","protected":false},"excerpt":{"rendered":"

                              The Testimonial block allows you to share the customer\/client feedback, which explains how they have benefited from your product or services. The block adds social proof by letting your site visitors know what other people say about you. After you have chosen the Testimonial block, you’ll get a block editing panel on the right-hand side.[…]<\/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\/1592"}],"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=1592"}],"version-history":[{"count":32,"href":"https:\/\/docs.wpblockart.com\/blockart-blocks\/wp-json\/wp\/v2\/docs\/1592\/revisions"}],"predecessor-version":[{"id":2806,"href":"https:\/\/docs.wpblockart.com\/blockart-blocks\/wp-json\/wp\/v2\/docs\/1592\/revisions\/2806"}],"wp:attachment":[{"href":"https:\/\/docs.wpblockart.com\/blockart-blocks\/wp-json\/wp\/v2\/media?parent=1592"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/docs.wpblockart.com\/blockart-blocks\/wp-json\/wp\/v2\/doc_category?post=1592"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/docs.wpblockart.com\/blockart-blocks\/wp-json\/wp\/v2\/doc_tag?post=1592"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}