{"id":954,"date":"2025-02-10T10:21:52","date_gmt":"2025-02-10T10:21:52","guid":{"rendered":"https:\/\/themepoints.com\/testimonials\/docs\/super-testimonial\/manage-shortcode\/grid-settings\/"},"modified":"2025-03-02T07:18:27","modified_gmt":"2025-03-02T07:18:27","slug":"grid-settings","status":"publish","type":"docs","link":"https:\/\/themepoints.com\/teamshowcase\/docs\/team-showcase\/manage-shortcode\/grid-settings\/","title":{"rendered":"Grid Settings"},"content":{"rendered":"\n<p>The <strong>Filter Menu <\/strong>in <strong>Team Showcase Pro helps<\/strong> you control how teams are displayed and filtered on the frontend. Below is a detailed guide to each option.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img fetchpriority=\"high\" decoding=\"async\" width=\"1400\" height=\"1581\" src=\"https:\/\/themepoints.com\/teamshowcase\/wp-content\/uploads\/2025\/02\/grid-settings.png\" alt=\"\" class=\"wp-image-1032\" srcset=\"https:\/\/themepoints.com\/teamshowcase\/wp-content\/uploads\/2025\/02\/grid-settings.png 1400w, https:\/\/themepoints.com\/teamshowcase\/wp-content\/uploads\/2025\/02\/grid-settings-266x300.png 266w, https:\/\/themepoints.com\/teamshowcase\/wp-content\/uploads\/2025\/02\/grid-settings-907x1024.png 907w, https:\/\/themepoints.com\/teamshowcase\/wp-content\/uploads\/2025\/02\/grid-settings-768x867.png 768w, https:\/\/themepoints.com\/teamshowcase\/wp-content\/uploads\/2025\/02\/grid-settings-1360x1536.png 1360w\" sizes=\"(max-width: 1400px) 100vw, 1400px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">1. Filter Menu Align<\/h4>\n\n\n\n<p>Customize the appearance of the <strong>filter menu<\/strong> to match your website design.<\/p>\n\n\n\n<h5 class=\"wp-block-heading\"><strong>Menu Alignment<\/strong><\/h5>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Choose where to position the filter menu:\n<ul class=\"wp-block-list\">\n<li><strong>Left<\/strong> \u2013 Align the menu to the left.<\/li>\n\n\n\n<li><strong>Center<\/strong> \u2013 Centers the menu on the page.<\/li>\n\n\n\n<li><strong>Right<\/strong> \u2013 Align the menu to the right.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">2. Show\/Hide All Button<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Toggle the visibility of the &#8220;All&#8221; button, which allows users to view all items in the grid.<\/li>\n\n\n\n<li><strong>Options:<\/strong>\n<ul class=\"wp-block-list\">\n<li><strong>Show:<\/strong> Displays the &#8220;All&#8221; button in the filter menu.<\/li>\n\n\n\n<li><strong>Hide:<\/strong> Removes the &#8220;All&#8221; button.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">3. All Button Text<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Customize the text for the &#8220;All&#8221; button.<\/li>\n\n\n\n<li>Default: <strong>&#8220;All&#8221;<\/strong> (Can be changed to any custom label).<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">4. Menu Background<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Set the background color for the filter menu.<\/li>\n\n\n\n<li>Click on <strong>&#8220;Select Color&#8221;<\/strong> to choose a custom color.<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">5. Menu Font Color<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Define the font color for the filter menu text.<\/li>\n\n\n\n<li>Click on <strong>&#8220;Select Color&#8221;<\/strong> to set a custom text color.<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">6. Menu Border<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Set a border color for the filter menu.<\/li>\n\n\n\n<li>Click on <strong>&#8220;Select Color&#8221;<\/strong> to customize the menu border appearance.<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">7. Menu Active Background Color<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Choose the background color for the active filter menu item.<\/li>\n\n\n\n<li>Click on <strong>&#8220;Select Color&#8221;<\/strong> to define the active menu background color.<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">8. Menu Active Font Color<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Set the font color for the active filter menu item.<\/li>\n\n\n\n<li>Click on <strong>&#8220;Select Color&#8221;<\/strong> to choose a custom active font color.<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">9. Menu Hover Background Color<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Define the background color for the filter menu when hovered over.<\/li>\n\n\n\n<li>Click on <strong>&#8220;Select Color&#8221;<\/strong> to select a hover background color.<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">10. Menu Hover Font Color<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Set the text color for the filter menu when hovered over.<\/li>\n\n\n\n<li>Click on <strong>&#8220;Select Color&#8221;<\/strong> to customize the hover font color.<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">11. Border Radius<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Adjust the border radius of the filter menu buttons to control their rounded corners.<\/li>\n\n\n\n<li>A higher value will create more rounded edges, while a lower value will keep the buttons square.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Summary<\/strong><\/h3>\n\n\n\n<p>The <strong>Grid Settings<\/strong> panel provides full customization of the filter menu, including alignment, button visibility, colors for background, text, borders, hover effects, and active states. You can also set a custom label for the &#8220;All&#8221; button and adjust the border radius for a polished look.<\/p>\n\n\n\n<p><\/p>\n","protected":false},"featured_media":0,"parent":560,"menu_order":2,"comment_status":"open","ping_status":"closed","template":"","doc_tag":[],"class_list":["post-954","docs","type-docs","status-publish","hentry"],"comment_count":0,"_links":{"self":[{"href":"https:\/\/themepoints.com\/teamshowcase\/wp-json\/wp\/v2\/docs\/954","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themepoints.com\/teamshowcase\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/themepoints.com\/teamshowcase\/wp-json\/wp\/v2\/types\/docs"}],"replies":[{"embeddable":true,"href":"https:\/\/themepoints.com\/teamshowcase\/wp-json\/wp\/v2\/comments?post=954"}],"version-history":[{"count":11,"href":"https:\/\/themepoints.com\/teamshowcase\/wp-json\/wp\/v2\/docs\/954\/revisions"}],"predecessor-version":[{"id":1080,"href":"https:\/\/themepoints.com\/teamshowcase\/wp-json\/wp\/v2\/docs\/954\/revisions\/1080"}],"up":[{"embeddable":true,"href":"https:\/\/themepoints.com\/teamshowcase\/wp-json\/wp\/v2\/docs\/560"}],"next":[{"title":"Slider Settings","link":"https:\/\/themepoints.com\/teamshowcase\/docs\/team-showcase\/manage-shortcode\/slider-settings\/","href":"https:\/\/themepoints.com\/teamshowcase\/wp-json\/wp\/v2\/docs\/953"}],"prev":[{"title":"All Settings","link":"https:\/\/themepoints.com\/teamshowcase\/docs\/team-showcase\/manage-shortcode\/all-settings\/","href":"https:\/\/themepoints.com\/teamshowcase\/wp-json\/wp\/v2\/docs\/952"}],"wp:attachment":[{"href":"https:\/\/themepoints.com\/teamshowcase\/wp-json\/wp\/v2\/media?parent=954"}],"wp:term":[{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/themepoints.com\/teamshowcase\/wp-json\/wp\/v2\/doc_tag?post=954"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}