{"id":5877,"date":"2015-12-25T11:17:14","date_gmt":"2015-12-25T08:17:14","guid":{"rendered":"http:\/\/blog.cs-cart.com\/?p=5877"},"modified":"2025-10-24T14:08:03","modified_gmt":"2025-10-24T10:08:03","slug":"cs-cart-boilerplate-theme-minimum-of-code-maximum-of-flexibility","status":"publish","type":"post","link":"https:\/\/www.cs-cart.com\/blog\/cs-cart-boilerplate-theme-minimum-of-code-maximum-of-flexibility\/","title":{"rendered":"CS-Cart Boilerplate Theme: Minimum of Code, Maximum of Flexibility"},"content":{"rendered":"\n<p>Hello!<\/p>\n\n\n\n<p class=\"has-text-align-left\">At CS-Cart, we\u2019re continually developing and polishing storefront design\u2014the built-in CS-Cart Responsive theme. The Responsive theme is mobile-friendly, customizable via the <a title=\"What is the Visual Editor?\" href=\"https:\/\/docs.cs-cart.com\/latest\/user_guide\/look_and_feel\/themes\/theme_editor.html\" target=\"_blank\" rel=\"noopener noreferrer\">Visual Editor<\/a>, and perfect for a startup.<\/p>\n\n\n\n<p class=\"has-text-align-left\">But owners of the big online stores often order custom designs or install third-party themes to make their stores look unique. And here comes trouble for theme developers: to develop a new theme from the Responsive theme, a developer has to completely rework the Responsive theme by deleting tons of code.<\/p>\n\n\n\n<p class=\"has-text-align-left\">We\u2019d like to ease the work for theme developers, so we\u2019re presenting to you a special <b>CS-Cart Boilerplate theme<\/b> that has a minimum of code and is easy to develop.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img data-opt-id=580625257  fetchpriority=\"high\" decoding=\"async\" src=\"https:\/\/mldi5dmmdvnt.i.optimole.com\/cb:sOwt.3b410\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/www.cs-cart.com\/blog\/wp-content\/uploads\/DevTheme.png\" alt=\"\"\/><\/figure>\n\n\n\n<h2 id='what-makes-the-boilerplate-theme-easy-to-work-with'  id=\"boomdevs_1\" class=\"wp-block-heading\">What Makes the Boilerplate Theme Easy to Work With<\/h2>\n\n\n\n<p class=\"has-text-align-left\">We\u2019ve contacted our developer partners and asked them to provide us with feedback about CS-Cart theme development: difficulties, special aspects, and requests.<\/p>\n\n\n\n<p class=\"has-text-align-left\">We\u2019ve analyzed the feedback and created the Boilerplate theme\u2014a skeleton that has much less code and files than the Responsive theme:<\/p>\n\n\n\n<ul>\n<li>The Boilerplate theme uses <b><a href=\"https:\/\/getbootstrap.com\/\" target=\"_blank\" rel=\"noopener noreferrer\" title=\"Bootstrap official website\">Bootstrap<\/a> 3.3.5<\/b>\u2014an HTML, CSS, and JavaScript framework that developers use as a basis for creating responsive websites.<br \/><p>Bootstrap is easy to work with because you can use <a href=\"https:\/\/getbootstrap.com\/components\/\" target=\"_blank\" rel=\"noopener noreferrer\" title=\"Bootstrap components\">dozens of pre-built components<\/a> such as dropdowns, navigation, buttons, and other interface elements. No deep HTML, CSS, and JavaScript knowledge required\u2014copy-paste the pre-cooked code and you\u2019re good to go.<\/p><br \/><p>Bootstrap is open source and <a href=\"https:\/\/github.com\/twbs\/bootstrap\" target=\"_blank\" rel=\"noopener noreferrer\" title=\"Bootstrap repository\">available on GitHub<\/a>.<\/p><\/li>\n<\/ul>\n\n\n\n<ul>\n<li>The Boilerplate theme supports both <a href=\"https:\/\/glyphicons.com\/\" target=\"_blank\" rel=\"noopener noreferrer\" title=\"What are these icons?\">Glyphicons<\/a>, which ship with Bootstrap, and <a href=\"https:\/\/fortawesome.github.io\/Font-Awesome\/icons\/\" target=\"_blank\" rel=\"noopener noreferrer\" title=\"What are these icons?\">Font Awesome icons<\/a>. These icons simplify and speed up theme development\u2014you add a ready-made icon to your theme by copying the pre-cooked code.<\/li>\n<\/ul>\n\n\n\n<ul>\n<li>Since the Boilerplate theme uses Bootstrap, we have re-factored all the templates\u2014now they use <a href=\"https:\/\/getbootstrap.com\/components\/\" target=\"_blank\" rel=\"noopener noreferrer\" title=\"Bootstrap components\">bootstrap components<\/a> and have simplified HTML.<\/li>\n<\/ul>\n\n\n\n<ul>\n<li>The Boilerplate theme has 1,000 lines of our CSS code left (Responsive has 11,000 lines). Less code\u2014less work to do.<\/li>\n<\/ul>\n\n\n\n<ul>\n<li>The number of template files decreased by 131 files compared with Responsive.<\/li>\n\n\n\n<li>Unlike the Responsive theme, which uses a 16-column grid, the Boilerplate theme has a more common <a href=\"https:\/\/www.w3schools.com\/bootstrap\/bootstrap_grid_system.asp\" target=\"_blank\" rel=\"noopener noreferrer\" title=\"Bootstrap 12-column grid\">12-column grid.<\/a><\/li>\n<\/ul>\n\n\n\n<div style=\"padding: 10px; border: 1px solid #f9cb9c; background: #ffe599; text-align: left;\">The Boilerplate theme is <a title=\"The CS-Cart Boilerplate theme repo\" href=\"https:\/\/github.com\/cscart\/cscart-boilerplate\" target=\"_blank\" rel=\"noopener noreferrer\">open source<\/a>, so you are welcome to send pull requests.<\/div>\n\n\n\n<h2 id='plans-for-the-future'  id=\"boomdevs_2\" class=\"wp-block-heading\">Plans for the Future<\/h2>\n\n\n\n<p class=\"has-text-align-left\">After the release of the Boilerplate theme, we\u2019ll continue to polish and simplify it. Here\u2019s how we\u2019re planning to improve it in the future:<\/p>\n\n\n\n<ul>\n<li>Through the theme, you\u2019ll be able to override store settings\u2014in the theme\u2019s <i>manifest.json<\/i> file, you can change product page templates, thumbnails size, number of layout columns, and more.<\/li>\n<\/ul>\n\n\n\n<ul>\n<li>We\u2019ll rework JavaScript by simplifying it and deleting redundant code. For example, <a href=\"https:\/\/jqueryui.com\/\" target=\"_blank\" rel=\"noopener noreferrer\" title=\"jQuery UI official website\">jQuery UI<\/a> will be totally removed.<\/li>\n\n\n\n<li>We\u2019ll reduce the amount of the CSS code that developers have to modify during theme development and simplify the templates\u2019 logic.<\/li>\n<\/ul>\n\n\n\n<div style=\"text-align: center;\">\n<div style=\"overflow: hidden; margin: 10px auto; display: inline-block; border-radius: 5px;\"><a class=\"blog-btn blog-btn-green\" title=\"Download the theme from the repo\" href=\"https:\/\/github.com\/cscart\/cscart-boilerplate\" target=\"_blank\" rel=\"noopener noreferrer\">DOWNLOAD THE BOILERPLATE THEME<\/a><\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<p class=\"has-text-align-left\">You are welcome to <a title=\"Download the theme from the repo\" href=\"https:\/\/github.com\/cscart\/cscart-boilerplate\" target=\"_blank\" rel=\"noopener noreferrer\">download the Boilerplate theme<\/a>. Please test it, and <a title=\"Issue tracker\" href=\"https:\/\/github.com\/cscart\/cscart-boilerplate\/issues\" target=\"_blank\" rel=\"noopener noreferrer\">post issues<\/a> if you find any.<\/p>\n\n\n\n<p class=\"has-text-align-left\">Tell us what you think about the new Boilerplate theme in <a href=\"https:\/\/forum.cs-cart.com\/topic\/43024-the-cs-cart-boilerplate-theme-for-developers-minimum-of-code-maximum-of-flexibility\/\" target=\"_blank\" rel=\"noopener noreferrer\" title=\"Share your opinion here\">this forum topic<\/a>. We greatly appreciate your feedback!<\/p>\n\n\n\n<p><strong>Read more about<\/strong>: <a href=\"https:\/\/www.cs-cart.com\/blog\/best-cs-cart-themes\/\" title=\"\">Best CS-Cart Themes for Your Online Store in 2025<\/a><\/p>\n\n\n\n<p class=\"has-text-align-left\">We post all the CS-Cart news and announcements on our <a title=\"CS-Cart on Facebook\" href=\"https:\/\/www.facebook.com\/cscart.official\" target=\"_blank\" rel=\"noopener noreferrer\">Facebook<\/a> and <a title=\"CS-Cart on Twitter\" href=\"https:\/\/twitter.com\/cscart\" target=\"_blank\" rel=\"noopener noreferrer\">Twitter<\/a> pages, so follow us to stay informed.<\/p>\n\n\n\n<p class=\"has-text-align-left\">Enter your email in the form below to get news and other cool stuff from us directly to your mailbox.<\/p>\n\n\n\n<div style=\"background: #f7f7f7;\">\n<div style=\"width: 600px; margin: 0 auto; padding: 20px 0 10px;\">\n<h2 id='follow-cs-cart-news-promotions'  id=\"boomdevs_3\" style=\"text-align: center; font-weight: normal; text-transform: uppercase; margin-bottom: 20px;\">Follow CS-Cart news &amp; promotions<\/h2>\n<form style=\"text-align: center;\" action=\"https:\/\/www.cs-cart.com\" method=\"post\" name=\"subscribe_form\"><input name=\"mailing_lists[4]\" type=\"hidden\" value=\"1\"\/><br \/>\n<input name=\"redirect_url\" type=\"hidden\" value=\"index.php\"\/><br \/>\n<label class=\"cm-required cm-email\" style=\"display: none;\" for=\"subscr_email\">Email<\/label><br \/>\n<input id=\"subscr_email\" class=\"subscribe-input\" style=\"font-size: 16px; padding: 10px; width: 400px; border-radius: 4px; height: 41px; color: #72757a; border: 2px solid #C7C7C9; box-sizing: border-box;\" name=\"subscribe_email\" type=\"text\" placeholder=\"Enter e-mail address\"\/><br \/>\n<button class=\"subscribe-btn\" style=\"background: #2F4156; outline: 0; border: 0; padding: 12.5px 15px; font-size: 14px; text-transform: uppercase; color: #fff; margin-left: -10px; vertical-align: top; border-top-right-radius: 3px; border-bottom-right-radius: 3px; cursor: pointer; height: 41px;\" type=\"submit\">Subscribe<\/button><br \/>\n<input name=\"dispatch\" type=\"hidden\" value=\"newsletters.add_subscriber\"\/><\/form>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"Hello! At CS-Cart, we\u2019re continually developing and polishing storefront design\u2014the built-in CS-Cart Responsive theme. The Responsive theme is&hellip;","protected":false},"author":31003,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_ayudawp_aiss_exclude":false,"csco_singular_sidebar":"","csco_page_header_type":"","csco_page_load_nextpost":"","footnotes":""},"categories":[6,1,5],"tags":[],"_links":{"self":[{"href":"https:\/\/www.cs-cart.com\/blog\/wp-json\/wp\/v2\/posts\/5877"}],"collection":[{"href":"https:\/\/www.cs-cart.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.cs-cart.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.cs-cart.com\/blog\/wp-json\/wp\/v2\/users\/31003"}],"replies":[{"embeddable":true,"href":"https:\/\/www.cs-cart.com\/blog\/wp-json\/wp\/v2\/comments?post=5877"}],"version-history":[{"count":1,"href":"https:\/\/www.cs-cart.com\/blog\/wp-json\/wp\/v2\/posts\/5877\/revisions"}],"predecessor-version":[{"id":20440,"href":"https:\/\/www.cs-cart.com\/blog\/wp-json\/wp\/v2\/posts\/5877\/revisions\/20440"}],"wp:attachment":[{"href":"https:\/\/www.cs-cart.com\/blog\/wp-json\/wp\/v2\/media?parent=5877"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.cs-cart.com\/blog\/wp-json\/wp\/v2\/categories?post=5877"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.cs-cart.com\/blog\/wp-json\/wp\/v2\/tags?post=5877"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}