{"id":4232,"date":"2019-09-04T14:38:26","date_gmt":"2019-09-04T09:08:26","guid":{"rendered":"http:\/\/holithemes.com\/blog\/?p=4232"},"modified":"2019-09-04T14:38:26","modified_gmt":"2019-09-04T09:08:26","slug":"how-to-add-custom-css-to-wordpress","status":"publish","type":"post","link":"https:\/\/holithemes.com\/blog\/how-to-add-custom-css-to-wordpress\/","title":{"rendered":"How to add custom CSS to WordPress?"},"content":{"rendered":"\n

It is the general tendency of WordPress users to pick a basic format in making a site in the initial days of their site-building. However, as they get familiar with WordPress and start enjoying its user-friendliness, they would want to customize their sites as per their needs. As WordPress launches many tutorials for its users, it is easy to add custom CSS in WordPress<\/strong>.  But it may be complicated sometimes to make modifications in your parent theme\u2019s stylesheet and write your own codes there as you may fear losing all the changes when there is an update. Hence, it is always better to add custom CSS in the style sheet of a child theme. However, it is a different concept of How to Create a Child Theme in WordPress<\/a>!!<\/strong>
<\/p>\n\n\n\n

\"\"
ADD CUSTOM CSS<\/figcaption><\/figure>\n\n\n\n

There are multiple methods one can add custom CSS to WordPress<\/strong> in the right place. But after the WordPress Customizer<\/strong> has come into existence, it made the rest of methods meager. <\/p>\n\n\n\n

Pros of WordPress Customizer: <\/h5>\n\n\n\n
  • WordPress allows you to preview the custom CSS modifications on a real-time basis<\/li>
  • WordPress plugins and CSS<\/strong> are inversely proportional and plugins are not necessary as Customizer is a part of WordPress. <\/li>
  • Basic validation secures your data
    <\/li><\/ul>\n\n\n\n

    Cons of WordPress Customizer<\/strong>: <\/p>\n\n\n\n

    • Custom CSS codes for WordPress<\/strong> are theme-specific. With a change in the theme, it is essential to copy over the custom CSS. <\/li><\/ul>\n\n\n\n

      Add Custom CSS with WordPress Customizer: <\/strong><\/p>\n\n\n\n

      Since WordPress Customizer is an inbuilt feature, just enable it appear on the screen by clicking on Appearance\ud83e\udc6aCustomize \ud83e\udc6a Additional CSS on the dashboard.<\/strong>
      <\/p>\n\n\n\n

      \"\"<\/figure><\/div>\n\n\n\n

      Add custom CSS to the box. The inbuilt editor will raise an alarm if you are chaotic with syntax errors. <\/p>\n\n\n\n

      \"\"<\/figure><\/div>\n\n\n\n

      \n\nDon\u2019t forget to save the changes and making them live by clicking on PUBLISH! And you are done!!\n\n<\/p>\n\n\n\n

      If it\u2019s just a couple of random changes, you better not to mess up your theme\u2019s stylesheet. Remember that putting your custom CSS in the parent theme\u2019s sheet will get it overwritten with every update of the theme. You better be using a child theme in order to keep the custom CSS intact whenever there is a parent theme update. However, child themes are good for adding huge custom CSS. Hope this article explains “How to add custom CSS to WordPress” in an illustrated manner. Do let us know if you have any challenges in this process and your feedback too\u2026

      <\/p>\n","protected":false},"excerpt":{"rendered":"

      It is the general tendency of WordPress users to pick a basic format in making a site in the initial days of their site-building. However, as they get familiar with WordPress and start enjoying its user-friendliness, they would want to customize their sites as per their needs. As WordPress launches many tutorials for its users, […]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"","site-content-style":"default","site-sidebar-style":"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":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[7],"tags":[46,47],"class_list":["post-4232","post","type-post","status-publish","format-standard","hentry","category-wordpress","tag-add-custom-css","tag-custom-css"],"_links":{"self":[{"href":"https:\/\/holithemes.com\/blog\/wp-json\/wp\/v2\/posts\/4232","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/holithemes.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/holithemes.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/holithemes.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/holithemes.com\/blog\/wp-json\/wp\/v2\/comments?post=4232"}],"version-history":[{"count":0,"href":"https:\/\/holithemes.com\/blog\/wp-json\/wp\/v2\/posts\/4232\/revisions"}],"wp:attachment":[{"href":"https:\/\/holithemes.com\/blog\/wp-json\/wp\/v2\/media?parent=4232"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/holithemes.com\/blog\/wp-json\/wp\/v2\/categories?post=4232"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/holithemes.com\/blog\/wp-json\/wp\/v2\/tags?post=4232"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}