{"title":"Adding Custom CSS and Custom JavaScript","id":36304,"link":"https:\/\/env.averta.net\/en\/step\/adding-custom-css-and-custom-javascript\/","parent":[35058],"content":"<p><a href=\"http:\/\/env.averta.net\/en\/wp-content\/uploads\/Customize_-Typography-?-Test-Drive-?-Phlox-Theme-Google-Chrome-2016-11-02-10.52.23.png\"><img decoding=\"async\" loading=\"lazy\" class=\"size-full wp-image-36305 alignright\" src=\"http:\/\/env.averta.net\/en\/wp-content\/uploads\/Customize_-Typography-?-Test-Drive-?-Phlox-Theme-Google-Chrome-2016-11-02-10.52.23.png\" alt=\"customize_-typography-test-drive-phlox-theme-google-chrome-2016-11-02-10-52-23\" width=\"315\" height=\"387\" \/><\/a><\/p>\n<p>If you want to add custom CSS or JS to your website, you can define it for each post and page on?post options?and page option or add them globally by the customizer:<\/p>\n<p>To add custom CSS or JS by customizer (To define globally):<\/p>\n<ol>\n<li>Go to your <strong>WordPress Admin Panel<\/strong><\/li>\n<li>Click?<b>Appearance<\/b> on the <b>Dashboard<\/b><\/li>\n<li>Then click?<strong>Customize<\/strong><\/li>\n<li>Navigate?<strong>General &gt; Custom CSS Code\/Custom JS Code<\/strong><\/li>\n<\/ol>\n<div style=\"clear: both;\"><\/div>\n<h3>Video Tutorial<\/h3>\n<div style=\"position: relative; height: 0; padding-bottom: 56.25%;\"><iframe loading=\"lazy\" width=\"560\" height=\"315\" style=\"position: absolute; width: 100%; height: 100%; left: 0; display: block;\" src=\"https:\/\/www.youtube.com\/embed\/Pi9121CAGgY?rel=0&amp;ecver=2\" frameborder=\"0\" encrypted-media=\"\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/div>\n<p>To add custom CSS or JS in a single post:<\/p>\n<ol>\n<li><span style=\"font-weight: 400;\">Go to your <strong>WordPress Admin Panel<\/strong><\/span><\/li>\n<li style=\"font-weight: 400;\">Navigate?<strong style=\"font-weight: 400;\">Posts &gt; Add New<\/strong><\/li>\n<li style=\"font-weight: 400;\">Find <strong>Post Options Meta Box<\/strong>, under the edit box<\/li>\n<li style=\"font-weight: 400;\">Then click the last tab,?<strong>Advanced Setting<\/strong><\/li>\n<\/ol>\n<p>To add custom CSS or JS in a single page<\/p>\n<ol>\n<li><span style=\"font-weight: 400;\">Go to your <strong>WordPress Admin Panel<\/strong><\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Navigate?<strong>Pages &gt; Add New<\/strong><\/span><\/li>\n<li style=\"font-weight: 400;\">Find <strong>Page?Options?Meta Box<\/strong>, under the edit box<\/li>\n<li style=\"font-weight: 400;\">Then click the last tab, <strong>Advanced Setting<img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-36780\" src=\"http:\/\/env.averta.net\/en\/wp-content\/uploads\/custom-css-js.png\" alt=\"custom-css-js\" width=\"1134\" height=\"678\" \/><\/strong><\/li>\n<\/ol>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n","type":"solution"}