{"id":15668,"date":"2018-09-19T09:30:49","date_gmt":"2018-09-19T13:30:49","guid":{"rendered":"https:\/\/www.boldgrid.com\/support\/?p=15668"},"modified":"2023-12-13T14:06:16","modified_gmt":"2023-12-13T19:06:16","slug":"using-the-custom-css-and-js-editor-in-boldgrid-crio","status":"publish","type":"post","link":"https:\/\/www.boldgrid.com\/support\/boldgrid-crio-supertheme-product-guide\/using-the-custom-css-and-js-editor-in-boldgrid-crio\/","title":{"rendered":"Using the Custom CSS and JS Editor in BoldGrid Crio"},"content":{"rendered":"<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.0 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/REC-html40\/loose.dtd\">\n<?xml encoding=\"utf-8\" ?><html><body><div class=\"video-responsive\">\n<p><iframe loading=\"lazy\" title=\"Crio - Using the custom CSS editor\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/x2wNizpc-II?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe><\/p>\n<\/div>\n<p>BoldGrid Crio allows you to change the style and function of elements used on your website using CSS or JS. This guide will show you how to use those Advanced tools within the Customizer for adding them without having to use a child theme.<\/p>\n<ul>\n<li>In the Dashboard navigate to <b>Appearance<\/b> &rarr; <b>Customize<\/b><\/li>\n<li>In the Customizer menu navigate to <b>CSS\/JS Editor<\/b><\/li>\n<li>Enter your custom code<\/li>\n<li>Click the <b>Publish<\/b> button to save your changes<\/li>\n<\/ul>\n<p>Congratulations! You now know how to add custom CSS and JS to enhance your website even further.<\/p>\n<h2 id=\"using-the-browser-inspector-with-custom-css\">Using the Browser Inspector With Custom CSS<\/h2>\n<p>Custom CSS is a powerful tool, you can zero in on specific elements of your site to make unique additions and changes to your design. If you aren&rsquo;t sure where to begin, check out the video below to help you get started.<br>\n<iframe loading=\"lazy\" title=\"Using the Browser Inspector to add Custom CSS in BoldGrid\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/z7odYi68wZA?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe><\/p>\n<\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>BoldGrid Crio allows you to change the style and function of elements used on your website using CSS or JS. This guide will show you how to use those Advanced tools within the Customizer for adding them without having to use a child theme. In the Dashboard navigate to Appearance &rarr; Customize In the Customizer [&hellip;]<\/p>\n","protected":false},"author":529,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"bgseo_title":"Using the Custom CSS and JS Editor in Crio | BoldGrid Crio","bgseo_description":"BoldGrid Crio allows you to change the style and function of elements used on your website using custom CSS and JS. This guide will show you how to use those Advanced tools within the Customizer for adding them without having to use a child theme.","bgseo_robots_index":"index","bgseo_robots_follow":"follow","footnotes":""},"categories":[573],"tags":[690],"class_list":["post-15668","post","type-post","status-publish","format-standard","hentry","category-boldgrid-crio-supertheme-product-guide","tag-faq"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts\/15668","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/users\/529"}],"replies":[{"embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/comments?post=15668"}],"version-history":[{"count":6,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts\/15668\/revisions"}],"predecessor-version":[{"id":121260,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts\/15668\/revisions\/121260"}],"wp:attachment":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/media?parent=15668"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/categories?post=15668"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/tags?post=15668"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}