{"id":2013,"date":"2020-08-29T11:43:21","date_gmt":"2020-08-29T01:43:21","guid":{"rendered":"http:\/\/vjdesign.com.au\/?p=2013"},"modified":"2022-04-10T09:37:58","modified_gmt":"2022-04-09T23:37:58","slug":"simple-css-add-custom-css-to-your-site","status":"publish","type":"post","link":"https:\/\/vjdesign.com.au\/simple-css-add-custom-css-to-your-site\/","title":{"rendered":"Simple CSS – Add custom CSS to your site"},"content":{"rendered":"\n

Do you need to add some custom CSS to your WordPress site? <\/p>\n\n\n\n

You can also add additional CSS using the Customiser<\/a> (without using this plugin).<\/p>\n\n\n\n

Simple CSS gives you an awesome CSS editor in admin area and a live preview editor in the Customizer so you can easily add your CSS.<\/strong> <\/p>\n\n\n\n

Simple CSS also adds a metabox to pages and posts – this allows you to add CSS to only apply to that specific page or post.<\/p>\n\n\n\n

You can add CSS using Simple CSS in one of three ways:<\/strong><\/h2>\n\n\n\n
  1. Go to Appearance > Simple CSS<\/strong> and add your CSS to the admin editor.
    <\/li><\/ol>\n\n\n\n
    \"Simple
    Simple CSS Admin Editor<\/figcaption><\/figure><\/div>\n\n\n\n
    1. Go to Appearance > Customize<\/strong> and then choose Simple CSS<\/strong>. You can then preview how your custom CSS affects your site as you add your styles (in Desktop, on a tablet and on mobile devices).<\/li><\/ol>\n\n\n\n
      \"Simple
      Simple CSS Cutomizer<\/figcaption><\/figure><\/div>\n\n\n\n
      1. Go to your page or post in the Dashboard and add your code in the Simple CSS metabox<\/strong>.<\/li><\/ol>\n\n\n\n
        \"Simple
        Simple CSS Metabox in page\/post<\/figcaption><\/figure><\/div>\n\n\n\n

        Along with the awesome GeneratePress theme<\/a>, Simple CSS by Tom Usborne<\/strong> is one of my go to plugins to add custom CSS and I install it on all the sites I build. <\/p>\n\n\n\n

        Click here to download this free plugin today<\/a><\/p>\n\n\n\n

        Additional CSS<\/h2>\n\n\n\n

        With improvements to WordPress backend, the customizer plays a huge part customising your site. This includes the ability to add additional CSS to style your theme (without the need for Custom CSS plugin). This is my current approach. <\/p>\n\n\n\n

        That said, Simple CSS is advanced – it allows you to add css to individual page\/post.<\/p>\n\n\n\n

        Login to WordPress and from the WordPress admin menu, select Appearance<\/strong> > Customize<\/strong>.<\/p>\n\n\n\n

        \"-\"<\/a><\/figure>\n\n\n\n

        The Customizer<\/strong> (1) allows you to customise the site title, manage menus, widgets and also add additional CSS (2) to style the site.<\/p>\n\n\n\n

        \"WordPress<\/a><\/figure>\n\n\n\n

        Enter required CSS in the CSS editor (1) and also preview how your custom CSS affects your site as you add your styles in Desktop, on a tablet and on mobile devices (2).<\/p>\n\n\n\n

        \"Add<\/a><\/figure>\n","protected":false},"excerpt":{"rendered":"

        Simple CSS is lightweight CSS editor plugin that allows you to add custom CSS to your site and watch a live preview via customizer.<\/p>\n","protected":false},"author":1,"featured_media":3035,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":"","_links_to":"","_links_to_target":""},"categories":[19,18],"tags":[],"post_series":[],"post_folder":[],"acf":[],"_links":{"self":[{"href":"https:\/\/vjdesign.com.au\/wp-json\/wp\/v2\/posts\/2013"}],"collection":[{"href":"https:\/\/vjdesign.com.au\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/vjdesign.com.au\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/vjdesign.com.au\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/vjdesign.com.au\/wp-json\/wp\/v2\/comments?post=2013"}],"version-history":[{"count":12,"href":"https:\/\/vjdesign.com.au\/wp-json\/wp\/v2\/posts\/2013\/revisions"}],"predecessor-version":[{"id":5255,"href":"https:\/\/vjdesign.com.au\/wp-json\/wp\/v2\/posts\/2013\/revisions\/5255"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/vjdesign.com.au\/wp-json\/wp\/v2\/media\/3035"}],"wp:attachment":[{"href":"https:\/\/vjdesign.com.au\/wp-json\/wp\/v2\/media?parent=2013"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/vjdesign.com.au\/wp-json\/wp\/v2\/categories?post=2013"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/vjdesign.com.au\/wp-json\/wp\/v2\/tags?post=2013"},{"taxonomy":"post_series","embeddable":true,"href":"https:\/\/vjdesign.com.au\/wp-json\/wp\/v2\/post_series?post=2013"},{"taxonomy":"post_folder","embeddable":true,"href":"https:\/\/vjdesign.com.au\/wp-json\/wp\/v2\/post_folder?post=2013"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}