{"id":3645,"date":"2019-07-10T04:17:53","date_gmt":"2019-07-10T04:17:53","guid":{"rendered":"https:\/\/docs.contentviewspro.com\/?p=3645"},"modified":"2023-12-29T08:28:06","modified_gmt":"2023-12-29T08:28:06","password":"","slug":"live-filter-custom-style-for-the-checkbox-type","status":"publish","type":"docs","link":"https:\/\/contentviewspro.com\/documentation\/article\/live-filter-custom-style-for-the-checkbox-type\/","title":{"rendered":"Live Filter &#8211; custom style for the Checkbox"},"content":{"rendered":"<p>This document helps you to style the checkbox type of Live Filter to look like this:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/contentviewspro.com\/documentation\/wp-content\/uploads\/2019\/07\/cvp-live-filter-checkbox.png\" alt=\"cvp-live-filter-checkbox\" width=\"557\" height=\"275\" class=\"alignnone size-full wp-image-3646\" srcset=\"https:\/\/contentviewspro.com\/documentation\/wp-content\/uploads\/2019\/07\/cvp-live-filter-checkbox.png 557w, https:\/\/contentviewspro.com\/documentation\/wp-content\/uploads\/2019\/07\/cvp-live-filter-checkbox-300x148.png 300w\" sizes=\"auto, (max-width: 557px) 100vw, 557px\" \/><\/p>\n<p>To do that, Please add this code to <strong>Custom CSS<\/strong> field (the left textarea) in <a href=\"https:\/\/contentviewspro.com\/documentation\/wp-content\/uploads\/2018\/03\/Content-Views-_-Settings.png\">Content Views >> Settings<\/a> page:<\/p>\n<pre style=\"font-size:13px\">\n\/* Live Filter \u2013 custom style for the checkbox type *\/\n.cvp-live-filter.cvp-checkbox {\n    min-width: 250px;\n}\n\n.cvp-live-filter.cvp-checkbox .cvp-label {\n    font-size: 20px !important;\n    line-height: 1.3 !important;\n    color: #ffffff !important;\n    background-color: #00aeef !important;\n    display: block;\n    margin-right: 0;\n    padding: 10px;\n}\n\n.cvp-live-filter.cvp-checkbox .checkbox {\n    border-bottom: 1px solid #f3f3f3 !important;\n    padding: 5px 0px;\n    color: red;\n}\n<\/pre>\n<p>Best regards,<\/p>\n","protected":false},"excerpt":{"rendered":"<p>This document helps you to style the checkbox type of Live Filter to look like this: To do that, Please add this code to Custom CSS field (the left textarea) in Content Views >> Settings page: \/* Live Filter \u2013 custom style for the checkbox type *\/ .cvp-live-filter.cvp-checkbox { min-width: 250px; } .cvp-live-filter.cvp-checkbox .cvp-label { &hellip;<\/p>\n<p class=\"read-more\"> <a class=\"\" href=\"https:\/\/contentviewspro.com\/documentation\/article\/live-filter-custom-style-for-the-checkbox-type\/\"> <span class=\"screen-reader-text\">Live Filter &#8211; custom style for the Checkbox<\/span> Read More &raquo;<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","footnotes":""},"doc_category":[47,46],"doc_tag":[29,35],"class_list":["post-3645","docs","type-docs","status-publish","hentry","doc_category-customize-css-style","doc_category-live-filter","doc_tag-custom-css","doc_tag-live-filter"],"year_month":"2026-10","word_count":83,"total_views":"6","reactions":{"happy":"0","normal":"0","sad":"0"},"author_info":{"name":"admin1","author_nicename":"admin1","author_url":"https:\/\/contentviewspro.com\/documentation\/author\/admin1\/"},"doc_category_info":[{"term_name":"Customize CSS\/Style","term_url":"https:\/\/contentviewspro.com\/documentation\/cats\/customize-css-style\/"},{"term_name":"Live Filter (Frontend Search &amp; Filter)","term_url":"https:\/\/contentviewspro.com\/documentation\/cats\/live-filter\/"}],"doc_tag_info":[{"term_name":"custom CSS","term_url":"https:\/\/contentviewspro.com\/documentation\/tags\/custom-css\/"},{"term_name":"live filter","term_url":"https:\/\/contentviewspro.com\/documentation\/tags\/live-filter\/"}],"_links":{"self":[{"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/docs\/3645","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/comments?post=3645"}],"version-history":[{"count":2,"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/docs\/3645\/revisions"}],"predecessor-version":[{"id":5648,"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/docs\/3645\/revisions\/5648"}],"wp:attachment":[{"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/media?parent=3645"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/doc_category?post=3645"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/doc_tag?post=3645"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}