{"id":1683,"date":"2022-07-22T20:28:24","date_gmt":"2022-07-22T20:28:24","guid":{"rendered":"https:\/\/knight.domains\/support\/?p=1683"},"modified":"2022-07-22T20:28:26","modified_gmt":"2022-07-22T20:28:26","slug":"how-to-customize-css-for-a-single-wordpress-page-or-post","status":"publish","type":"post","link":"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/","title":{"rendered":"How to Customize CSS for a Single WordPress Page or Post"},"content":{"rendered":"\n<p>Utilizing the&nbsp;<strong>Additional CSS<\/strong>&nbsp;tab in the WordPress theme customizer can be a very powerful tool, but have you ever wondered if it\u2019s possible to customize CSS for a single page or post? The answer is yes, this is possible. There may be plugins that can accomplish this, but it\u2019s actually possible by just using the Additional CSS tab in the theme customizer. Each page or post actually belongs to its own class that you can use for customization.<\/p>\n\n\n\n<p>The selector to use for a page is<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">.page-id-#<\/pre>\n\n\n\n<p>The selector to use for a post is<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">.postid-#<\/pre>\n\n\n\n<p>There is a unique number ID for each post or page. This is what you will replace the \u2018#\u2019 with. To find this number, bring up the window to edit the desired page you want to apply CSS to. Look at its URL. You\u2019ll see the ID within the URL. For example, the ID of this post is 268<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/blog.annickarabida.com\/wp-content\/uploads\/2020\/06\/Screen-Shot-2020-06-26-at-4.08.15-PM.png\" alt=\"\" class=\"wp-image-270\"\/><\/figure>\n\n\n\n<p>Once you have this, you can start with your custom CSS! You would put whatever selector you\u2019d like to change after .postid-268 on the same line.<\/p>\n\n\n\n<p>Here is an example of this in action:<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">.postid-268 h1{\n         display: none;\n}<\/pre>\n\n\n\n<p>The above code would hide all the h1\u2019s on this post but it wouldn\u2019t affect any text with the h1 tag on any other portion of the site.<\/p>\n\n\n\n<p>I find this especially helpful when trying to make the page title disappear on some pages, specifically the page I title \u201cHome\u201d. I find this redundant, so most times I choose to hide it. The page\u2019s title class for this theme is .title so below is an example of my hiding it.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">.page-id-43 .title {\n     display: none;\n}<\/pre>\n\n\n\n<p>Hope this helps you on your way to customizing your WordPress site even further!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Utilizing the&nbsp;Additional CSS&nbsp;tab in the WordPress theme customizer can be a very powerful tool, but have you ever wondered if it\u2019s possible to customize CSS for a single page or post? The answer is yes, this is possible. There may be plugins that can accomplish this, but it\u2019s actually possible by just using the Additional&hellip;&nbsp;<a href=\"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/\" class=\"\" rel=\"bookmark\">Read More &raquo;<span class=\"screen-reader-text\">How to Customize CSS for a Single WordPress Page or Post<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_mi_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"neve_meta_sidebar":"","neve_meta_container":"","neve_meta_enable_content_width":"","neve_meta_content_width":0,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"","neve_meta_disable_footer":"","neve_meta_disable_title":"","footnotes":""},"categories":[7,21,15],"tags":[],"class_list":["post-1683","post","type-post","status-publish","format-standard","hentry","category-applications","category-learn","category-wordpress"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v21.2 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>How to Customize CSS for a Single Wordpress Page or Post - Knight Domains Support<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Customize CSS for a Single Wordpress Page or Post - Knight Domains Support\" \/>\n<meta property=\"og:description\" content=\"Utilizing the&nbsp;Additional CSS&nbsp;tab in the WordPress theme customizer can be a very powerful tool, but have you ever wondered if it\u2019s possible to customize CSS for a single page or post? The answer is yes, this is possible. There may be plugins that can accomplish this, but it\u2019s actually possible by just using the Additional&hellip;&nbsp;Read More &raquo;How to Customize CSS for a Single WordPress Page or Post\" \/>\n<meta property=\"og:url\" content=\"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/\" \/>\n<meta property=\"og:site_name\" content=\"Knight Domains Support\" \/>\n<meta property=\"article:published_time\" content=\"2022-07-22T20:28:24+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-07-22T20:28:26+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/blog.annickarabida.com\/wp-content\/uploads\/2020\/06\/Screen-Shot-2020-06-26-at-4.08.15-PM.png\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/\"},\"author\":{\"name\":\"admin\",\"@id\":\"https:\/\/knight.domains\/support\/#\/schema\/person\/97fce710c22c2ab77084638feca7a7b3\"},\"headline\":\"How to Customize CSS for a Single WordPress Page or Post\",\"datePublished\":\"2022-07-22T20:28:24+00:00\",\"dateModified\":\"2022-07-22T20:28:26+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/\"},\"wordCount\":300,\"publisher\":{\"@id\":\"https:\/\/knight.domains\/support\/#organization\"},\"articleSection\":[\"Applications\",\"Learn\",\"Wordpress\"],\"inLanguage\":\"en\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/\",\"url\":\"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/\",\"name\":\"How to Customize CSS for a Single Wordpress Page or Post - Knight Domains Support\",\"isPartOf\":{\"@id\":\"https:\/\/knight.domains\/support\/#website\"},\"datePublished\":\"2022-07-22T20:28:24+00:00\",\"dateModified\":\"2022-07-22T20:28:26+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/#breadcrumb\"},\"inLanguage\":\"en\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/knight.domains\/support\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to Customize CSS for a Single WordPress Page or Post\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/knight.domains\/support\/#website\",\"url\":\"https:\/\/knight.domains\/support\/\",\"name\":\"Knight Domains Support\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/knight.domains\/support\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/knight.domains\/support\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/knight.domains\/support\/#organization\",\"name\":\"Knight Domains Support\",\"url\":\"https:\/\/knight.domains\/support\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en\",\"@id\":\"https:\/\/knight.domains\/support\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/knight.domains\/support\/wp-content\/uploads\/2020\/08\/cropped-norbyKDC_noText.png\",\"contentUrl\":\"https:\/\/knight.domains\/support\/wp-content\/uploads\/2020\/08\/cropped-norbyKDC_noText.png\",\"width\":1200,\"height\":950,\"caption\":\"Knight Domains Support\"},\"image\":{\"@id\":\"https:\/\/knight.domains\/support\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/knight.domains\/support\/#\/schema\/person\/97fce710c22c2ab77084638feca7a7b3\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en\",\"@id\":\"https:\/\/knight.domains\/support\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/14485561fe5f6aa0e0fa6f4fec288e998230a44741f270a510ea9621f2d9cfb6?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/14485561fe5f6aa0e0fa6f4fec288e998230a44741f270a510ea9621f2d9cfb6?s=96&d=mm&r=g\",\"caption\":\"admin\"},\"url\":\"https:\/\/knight.domains\/support\/author\/admin\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to Customize CSS for a Single Wordpress Page or Post - Knight Domains Support","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/","og_locale":"en_US","og_type":"article","og_title":"How to Customize CSS for a Single Wordpress Page or Post - Knight Domains Support","og_description":"Utilizing the&nbsp;Additional CSS&nbsp;tab in the WordPress theme customizer can be a very powerful tool, but have you ever wondered if it\u2019s possible to customize CSS for a single page or post? The answer is yes, this is possible. There may be plugins that can accomplish this, but it\u2019s actually possible by just using the Additional&hellip;&nbsp;Read More &raquo;How to Customize CSS for a Single WordPress Page or Post","og_url":"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/","og_site_name":"Knight Domains Support","article_published_time":"2022-07-22T20:28:24+00:00","article_modified_time":"2022-07-22T20:28:26+00:00","og_image":[{"url":"https:\/\/blog.annickarabida.com\/wp-content\/uploads\/2020\/06\/Screen-Shot-2020-06-26-at-4.08.15-PM.png"}],"author":"admin","twitter_card":"summary_large_image","twitter_misc":{"Written by":"admin","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/#article","isPartOf":{"@id":"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/"},"author":{"name":"admin","@id":"https:\/\/knight.domains\/support\/#\/schema\/person\/97fce710c22c2ab77084638feca7a7b3"},"headline":"How to Customize CSS for a Single WordPress Page or Post","datePublished":"2022-07-22T20:28:24+00:00","dateModified":"2022-07-22T20:28:26+00:00","mainEntityOfPage":{"@id":"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/"},"wordCount":300,"publisher":{"@id":"https:\/\/knight.domains\/support\/#organization"},"articleSection":["Applications","Learn","Wordpress"],"inLanguage":"en"},{"@type":"WebPage","@id":"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/","url":"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/","name":"How to Customize CSS for a Single Wordpress Page or Post - Knight Domains Support","isPartOf":{"@id":"https:\/\/knight.domains\/support\/#website"},"datePublished":"2022-07-22T20:28:24+00:00","dateModified":"2022-07-22T20:28:26+00:00","breadcrumb":{"@id":"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/#breadcrumb"},"inLanguage":"en","potentialAction":[{"@type":"ReadAction","target":["https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/knight.domains\/support\/how-to-customize-css-for-a-single-wordpress-page-or-post\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/knight.domains\/support\/"},{"@type":"ListItem","position":2,"name":"How to Customize CSS for a Single WordPress Page or Post"}]},{"@type":"WebSite","@id":"https:\/\/knight.domains\/support\/#website","url":"https:\/\/knight.domains\/support\/","name":"Knight Domains Support","description":"","publisher":{"@id":"https:\/\/knight.domains\/support\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/knight.domains\/support\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en"},{"@type":"Organization","@id":"https:\/\/knight.domains\/support\/#organization","name":"Knight Domains Support","url":"https:\/\/knight.domains\/support\/","logo":{"@type":"ImageObject","inLanguage":"en","@id":"https:\/\/knight.domains\/support\/#\/schema\/logo\/image\/","url":"https:\/\/knight.domains\/support\/wp-content\/uploads\/2020\/08\/cropped-norbyKDC_noText.png","contentUrl":"https:\/\/knight.domains\/support\/wp-content\/uploads\/2020\/08\/cropped-norbyKDC_noText.png","width":1200,"height":950,"caption":"Knight Domains Support"},"image":{"@id":"https:\/\/knight.domains\/support\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/knight.domains\/support\/#\/schema\/person\/97fce710c22c2ab77084638feca7a7b3","name":"admin","image":{"@type":"ImageObject","inLanguage":"en","@id":"https:\/\/knight.domains\/support\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/14485561fe5f6aa0e0fa6f4fec288e998230a44741f270a510ea9621f2d9cfb6?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/14485561fe5f6aa0e0fa6f4fec288e998230a44741f270a510ea9621f2d9cfb6?s=96&d=mm&r=g","caption":"admin"},"url":"https:\/\/knight.domains\/support\/author\/admin\/"}]}},"rttpg_featured_image_url":null,"rttpg_author":{"display_name":"admin","author_link":"https:\/\/knight.domains\/support\/author\/admin\/"},"rttpg_comment":0,"rttpg_category":"<a href=\"https:\/\/knight.domains\/support\/category\/applications\/\" rel=\"category tag\">Applications<\/a> <a href=\"https:\/\/knight.domains\/support\/category\/learn\/\" rel=\"category tag\">Learn<\/a> <a href=\"https:\/\/knight.domains\/support\/category\/applications\/wordpress\/\" rel=\"category tag\">Wordpress<\/a>","rttpg_excerpt":"Utilizing the&nbsp;Additional CSS&nbsp;tab in the WordPress theme customizer can be a very powerful tool, but have you ever wondered if it\u2019s possible to customize CSS for a single page or post? The answer is yes, this is possible. There may be plugins that can accomplish this, but it\u2019s actually possible by just using the Additional&hellip;&nbsp;Read&hellip;","_links":{"self":[{"href":"https:\/\/knight.domains\/support\/wp-json\/wp\/v2\/posts\/1683","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/knight.domains\/support\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/knight.domains\/support\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/knight.domains\/support\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/knight.domains\/support\/wp-json\/wp\/v2\/comments?post=1683"}],"version-history":[{"count":1,"href":"https:\/\/knight.domains\/support\/wp-json\/wp\/v2\/posts\/1683\/revisions"}],"predecessor-version":[{"id":1684,"href":"https:\/\/knight.domains\/support\/wp-json\/wp\/v2\/posts\/1683\/revisions\/1684"}],"wp:attachment":[{"href":"https:\/\/knight.domains\/support\/wp-json\/wp\/v2\/media?parent=1683"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/knight.domains\/support\/wp-json\/wp\/v2\/categories?post=1683"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/knight.domains\/support\/wp-json\/wp\/v2\/tags?post=1683"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}