{"id":5718,"date":"2012-04-19T20:57:56","date_gmt":"2012-04-19T20:57:56","guid":{"rendered":"http:\/\/help-o.ning.com\/?p=5718"},"modified":"2019-09-03T14:13:41","modified_gmt":"2019-09-03T14:13:41","slug":"introduction-to-the-design-studio-2","status":"publish","type":"post","link":"https:\/\/www.ning.com\/help\/introduction-to-the-design-studio-2\/","title":{"rendered":"Introduction to the Design Studio"},"content":{"rendered":"<p><iframe loading=\"lazy\" src=\"https:\/\/www.youtube.com\/embed\/XEJPJ_tgtQk?rel=0\" width=\"560\" height=\"315\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/p>\n<p>You can use the Design Studio to customize your network&#8217;s appearance.\u00a0Select a theme, insert your header or background image, have two columns instead of three, change the color of your tabs when you hover over them\u2026 You can do all of this and more, at the click of a button.<\/p>\n<p>Newer Ning Networks come with the Design Studio already enabled. To enable the Design Studio on a network using the Classic Appearance Editor, head over to your My Network tab, then click the &#8220;Appearance&#8221; link in the Settings section. Finally, click the &#8220;Upgrade&#8221; button and publish a new theme.<\/p>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-5721 size-large\" src=\"https:\/\/www.ning.com\/help\/wp-content\/uploads\/3876_7.21.2011_1-600x582.png\" alt=\"Introduction to the Design Studio 1\" width=\"600\" height=\"582\" \/><\/p>\n<p>To get started, click on the\u00a0Design Studio\u00a0icon at the top left of your network bar.<\/p>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-5722 size-large\" src=\"https:\/\/www.ning.com\/help\/wp-content\/uploads\/look-for-control-icon-600x280.jpg\" alt=\"Introduction to the Design Studio 2\" width=\"600\" height=\"280\" \/><\/p>\n<p>There are four panels to choose from: Themes, Layout, Customize and Advanced.<\/p>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-5724 size-large\" src=\"https:\/\/www.ning.com\/help\/wp-content\/uploads\/designstudio-tour1-600x365.jpg\" alt=\"Introduction to the Design Studio 3\" width=\"600\" height=\"365\" \/><\/p>\n<ol>\n<li>The <a href=\"\/help\/apply-a-new-theme-to-your-ning-network\/\">Themes panel<\/a> includes a growing collection of themes that can be applied to your network. Clicking on a theme will give you a live preview of what it would look like on your network. This panel also includes up to 50 of your last published themes in the My Themes section. You should also have a &#8220;Classic&#8221; theme available if you want to revert to the Classic Appearance Editor.<\/li>\n<li>The <a href=\"\/help\/apply-a-new-layout-to-your-ning-network\/\">Layout panel<\/a> provides you with eight different arrangements to apply to your network.<\/li>\n<li>The\u00a0<a href=\"\/help\/customize-your-ning-networks-appearance-with-the-design-studio-2\/\">Customize panel<\/a> is where you can tweak the details, such as header images, module backgrounds and font styles.<\/li>\n<li>The\u00a0<a href=\"\/help\/advanced-customization-with-the-design-studio\/\">Advanced panel<\/a> has two tricks up its sleeve: a place to input your custom CSS, or an option to go into Developer Mode where you can completely rework the theme you&#8217;ve selected, or even create your own theme. (<strong>This panel is available to networks on the Ning Plus or Ning Pro plans.)<\/strong><\/li>\n<\/ol>\n<p>If you switch to the Design Studio, then decide you&#8217;d rather have your last theme and customizations from the Classic Appearance Editor, just go to My Themes in the Themes panel, click on the Classic theme with the Ning logo and click &#8220;Publish&#8221;. This will reinstate the structure and customizations you had.\u00a0This will not restore or affect content on the network. Switching back to the Classic Appearance Editor will also reapply your members&#8217; My Page appearance.<\/p>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-5725 size-large\" src=\"https:\/\/www.ning.com\/help\/wp-content\/uploads\/reapply-classic-theme-600x368.jpg\" alt=\"Introduction to the Design Studio 4\" width=\"600\" height=\"368\" \/><\/p>\n<p>Please note that reverting to the Classic Appearance Editor will not carry over any changes you have made in the Design Studio. The next time you try to use the Design Studio, you will see this message:<\/p>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-5726 size-large\" src=\"https:\/\/www.ning.com\/help\/wp-content\/uploads\/revert-to-old-editor-600x440.jpg\" alt=\"Introduction to the Design Studio 5\" width=\"600\" height=\"440\" \/><\/p>\n<p>If you took the tour, that&#8217;s great! Missed the tour? Add this string to your address in the navigation bar to see it again!<\/p>\n<p>\/?showPanelTour=1<\/p>\n<p><strong>Please note that switching to the Design Studio will cause the themes and designs you select to be applied to the entire network.<\/strong> <strong>If your members have their own themes and customizations in place on their My Pages, these will<\/strong> <strong>be removed.<\/strong><\/p>\n","protected":false},"excerpt":{"rendered":"<p>You can use the Design Studio to customize your network&#8217;s appearance.\u00a0Select a theme, insert your header or background image, have two columns instead of three, change the color of your tabs when you hover over them\u2026 You can do all of this and more, at the click of a button.<br \/>\nNewer Ning Networks come with the Design Studio already enabled. To enable the Design Studio on a network using the Classic Appearance Editor, head over to your My Network tab, then click the &#8220;Appearance&#8221; link in the Settings section. Finally, click the &#8220;Upgrade&#8221; button and publish a new theme.<\/p>\n<p>To get started, click on the\u00a0Design Studio\u00a0icon at the top left of your network bar.<\/p>\n<p>There are four panels to choose from: Themes, Layout, Customize and Advanced.<\/p>\n<p>The <a href=\"\/help\/apply-a-new-theme-to-your-ning-network\/\">Themes panel<\/a> includes a growing collection of themes that can be applied to your network. Clicking on a theme will give you a live preview of what it would look like on your network. This panel also includes up to 50 of your last published themes in the My Themes section. You should also have a &#8220;Classic&#8221; theme available if you want to revert to the Classic Appearance Editor.<br \/>\nThe <a href=\"\/help\/apply-a-new-layout-to-your-ning-network\/\">Layout panel<\/a> provides you with eight &#8230;<\/p>\n","protected":false},"author":4,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[62,53,51],"tags":[90,965,89,91,524,774],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v16.6 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Introduction to the Design Studio | Ning Help Center<\/title>\n<meta name=\"description\" content=\"Introduction to the Design Studio | Ning Help Center\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.ning.com\/help\/introduction-to-the-design-studio-2\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Introduction to the Design Studio | Ning Help Center\" \/>\n<meta property=\"og:description\" content=\"Introduction to the Design Studio | Ning Help Center\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.ning.com\/help\/introduction-to-the-design-studio-2\/\" \/>\n<meta property=\"og:site_name\" content=\"Ning Help Center\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/Ning\" \/>\n<meta property=\"article:published_time\" content=\"2012-04-19T20:57:56+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2019-09-03T14:13:41+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.ning.com\/help\/wp-content\/uploads\/3876_7.21.2011_1-600x582.png\" \/>\n<meta name=\"twitter:card\" content=\"summary\" \/>\n<meta name=\"twitter:creator\" content=\"@Ning\" \/>\n<meta name=\"twitter:site\" content=\"@Ning\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.ning.com\/help\/#website\",\"url\":\"https:\/\/www.ning.com\/help\/\",\"name\":\"Ning Help Center\",\"description\":\"The place to look for help with the details of your Ning Network.\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.ning.com\/help\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.ning.com\/help\/introduction-to-the-design-studio-2\/#primaryimage\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/www.ning.com\/help\/wp-content\/uploads\/3876_7.21.2011_1.png\",\"contentUrl\":\"https:\/\/www.ning.com\/help\/wp-content\/uploads\/3876_7.21.2011_1.png\",\"width\":\"945\",\"height\":\"918\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.ning.com\/help\/introduction-to-the-design-studio-2\/#webpage\",\"url\":\"https:\/\/www.ning.com\/help\/introduction-to-the-design-studio-2\/\",\"name\":\"Introduction to the Design Studio | Ning Help Center\",\"isPartOf\":{\"@id\":\"https:\/\/www.ning.com\/help\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.ning.com\/help\/introduction-to-the-design-studio-2\/#primaryimage\"},\"datePublished\":\"2012-04-19T20:57:56+00:00\",\"dateModified\":\"2019-09-03T14:13:41+00:00\",\"author\":{\"@id\":\"https:\/\/www.ning.com\/help\/#\/schema\/person\/dec9bc9aa2d82cae488f9a48da93f231\"},\"description\":\"Introduction to the Design Studio | Ning Help Center\",\"breadcrumb\":{\"@id\":\"https:\/\/www.ning.com\/help\/introduction-to-the-design-studio-2\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.ning.com\/help\/introduction-to-the-design-studio-2\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.ning.com\/help\/introduction-to-the-design-studio-2\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.ning.com\/help\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Introduction to the Design Studio\"}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.ning.com\/help\/#\/schema\/person\/dec9bc9aa2d82cae488f9a48da93f231\",\"name\":\"aaron\",\"url\":\"https:\/\/www.ning.com\/help\/author\/aaron\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","_links":{"self":[{"href":"https:\/\/www.ning.com\/help\/wp-json\/wp\/v2\/posts\/5718"}],"collection":[{"href":"https:\/\/www.ning.com\/help\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.ning.com\/help\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.ning.com\/help\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.ning.com\/help\/wp-json\/wp\/v2\/comments?post=5718"}],"version-history":[{"count":15,"href":"https:\/\/www.ning.com\/help\/wp-json\/wp\/v2\/posts\/5718\/revisions"}],"predecessor-version":[{"id":10989,"href":"https:\/\/www.ning.com\/help\/wp-json\/wp\/v2\/posts\/5718\/revisions\/10989"}],"wp:attachment":[{"href":"https:\/\/www.ning.com\/help\/wp-json\/wp\/v2\/media?parent=5718"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.ning.com\/help\/wp-json\/wp\/v2\/categories?post=5718"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.ning.com\/help\/wp-json\/wp\/v2\/tags?post=5718"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}