{"id":424,"date":"2017-12-13T10:44:09","date_gmt":"2017-12-13T10:44:09","guid":{"rendered":"http:\/\/rifetheme.com\/docs\/docs\/installation-updating\/installing-the-child-theme\/custom-css\/"},"modified":"2018-01-30T15:52:03","modified_gmt":"2018-01-30T15:52:03","slug":"custom-css","status":"publish","type":"docs","link":"https:\/\/rifetheme.com\/apollo13-framework\/docs\/modifications-of-theme\/custom-css\/","title":{"rendered":"Adding Custom CSS"},"content":{"rendered":"<p>To add your CSS changes safely you have 3 ways of doing this:<\/p>\n<ol>\n<li><a href=\"http:\/\/rifetheme.com\/apollo13-framework\/docs\/customizing-the-theme\/custom-css\/\"><strong>Appearance\u00a0\u2192\u00a0Customize\u00a0\u2192\u00a0Custom CSS<\/strong><\/a> &#8211; this custom CSS field from theme, and will work only if you have our main or <a href=\"http:\/\/rifetheme.com\/apollo13-framework\/docs\/installation-updating\/installing-child-theme\/\">child theme<\/a> activated. All CSS added here will be added at end of theme <code>user\/user.css<\/code> file.<\/li>\n<li><strong>Appearance\u00a0\u2192\u00a0Customize\u00a0\u2192 Additional CSS<\/strong> &#8211; this is WordPress field that was added in version 4.7. Changes added here will be visible independent of theme that you use. Css from here will be inlined on each page displayed on front-end.<\/li>\n<li><strong>Using child theme style.css file<\/strong> &#8211; this will only work if you have activated <a href=\"http:\/\/rifetheme.com\/apollo13-framework\/docs\/installation-updating\/installing-child-theme\/\">child theme<\/a>.<\/li>\n<\/ol>\n<p>&nbsp;<\/p>\n<p>Choose whatever you option you want, and you can insert there your custom CSS.<\/p>\n<h2>Order of CSS that is included in theme<\/h2>\n<p>In this theme default stylesheet is loaded from main theme, and then you can overwrite CSS rules in <code>style.css<\/code> of <a href=\"http:\/\/rifetheme.com\/apollo13-framework\/docs\/installation-updating\/installing-child-theme\/\">child theme<\/a>. After this comes <code>user.css<\/code> with changes set in admin panel. So finally it loads in this order:<\/p>\n<ol>\n<li>main theme <code>style.css<\/code><\/li>\n<li>child theme <code>style.css<\/code><\/li>\n<li>located in main theme <code>user\/user.css<\/code>(settings form admin panel)<\/li>\n<li>Custom CSS from panel(it is added at end of <code>user.css<\/code>)<\/li>\n<\/ol>\n","protected":false},"author":1,"featured_media":0,"parent":8354,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"doc_tag":[],"class_list":["post-424","docs","type-docs","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/rifetheme.com\/apollo13-framework\/wp-json\/wp\/v2\/docs\/424","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rifetheme.com\/apollo13-framework\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/rifetheme.com\/apollo13-framework\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/rifetheme.com\/apollo13-framework\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rifetheme.com\/apollo13-framework\/wp-json\/wp\/v2\/comments?post=424"}],"version-history":[{"count":2,"href":"https:\/\/rifetheme.com\/apollo13-framework\/wp-json\/wp\/v2\/docs\/424\/revisions"}],"predecessor-version":[{"id":8916,"href":"https:\/\/rifetheme.com\/apollo13-framework\/wp-json\/wp\/v2\/docs\/424\/revisions\/8916"}],"up":[{"embeddable":true,"href":"https:\/\/rifetheme.com\/apollo13-framework\/wp-json\/wp\/v2\/docs\/8354"}],"next":[{"title":"Changing Theme Functions","link":"https:\/\/rifetheme.com\/apollo13-framework\/docs\/modifications-of-theme\/changing-theme-functions\/","href":"https:\/\/rifetheme.com\/apollo13-framework\/wp-json\/wp\/v2\/docs\/425"}],"wp:attachment":[{"href":"https:\/\/rifetheme.com\/apollo13-framework\/wp-json\/wp\/v2\/media?parent=424"}],"wp:term":[{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/rifetheme.com\/apollo13-framework\/wp-json\/wp\/v2\/doc_tag?post=424"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}