Themes | Themes for Tiki Wiki CMS Groupware

<!DOCTYPE html> <html lang="en" id="page_1"> <head> <meta http-equiv="X-UA-Compatible" content="IE=Edge"> <meta name="viewport" content="width=device-width, initial-scale=1" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="generator" content="Tiki Wiki CMS Groupware - https://tiki.org"> <meta content="https://themes.tiki.org/" name="twitter:domain"> <link rel="canonical" href="https://themes.tiki.org/Themes"> <meta content="https://themes.tiki.org/Themes" property="og:url"> <meta name="keywords" content="Themes, Tiki, TikiWiki, Wiki, CMS, Groupware, Tiki CMS, "> <meta name="author" content="Tiki community"> <meta name="description" content="Themes for Tiki CMS -- downloads, discussion, tutorials."> <meta content="Themes for Tiki CMS -- downloads, discussion, tutorials." property="og:description"> <meta name="twitter:description" content="Themes for Tiki CMS -- downloads, discussion, tutorials."> <meta name="robots" content="index, follow, noodp"> <meta name="revisit-after" content="15 days"> <meta content="Themes for Tiki Wiki CMS Groupware" property="og:site_name"> <meta content="Themes for Tiki Wiki CMS Groupware" name="twitter:site"> <title>Themes | Themes for Tiki Wiki CMS Groupware</title> <meta property="og:title" content="Themes | Themes for Tiki Wiki CMS Groupware"> <meta name="twitter:title" content="Themes | Themes for Tiki Wiki CMS Groupware"> <meta content="website" property="og:type"> <meta name="twitter:card" content="summary"> <meta content="display383" property="og:image"> <meta content="display383" property="twitter:image"> <link rel="alternate" type="application/rss+xml" title='Tiki RSS feed for the wiki pages' href="tiki-wiki_rss.php?ver=2"> <link rel="alternate" type="application/rss+xml" title='Tiki RSS feed for blogs' href="tiki-blogs_rss.php?ver=2"> <link rel="alternate" type="application/rss+xml" title='themes.tikiwiki.org news' href="tiki-articles_rss.php?ver=2"> <link rel="alternate" type="application/rss+xml" title='Tiki RSS feed for file galleries' href="tiki-file_galleries_rss.php?ver=2"> <link rel="alternate" type="application/rss+xml" title='themes.tw.o forums' href="tiki-forums_rss.php?ver=2"> <link rel="alternate" type="application/rss+xml" title='Tiki RSS feed for directory sites' href="tiki-directories_rss.php?ver=2"> <script type="text/javascript" src="vendor_bundled/vendor/npm-asset/sentry--browser/build/bundle.min.js"></script> <script type="text/javascript">Sentry.init({ dsn: "https://422cad35a6ae4870ac09f60605c43a73@app.glitchtip.com/3431", sampleRate: 1});</script> <script async src="/public/generated/js/vendor_dist/es-module-shims/dist/es-module-shims.js"></script> <script type="importmap"> { "imports": { "@kurkle\/color": "\/public\/generated\/js\/vendor_dist\/@kurkle\/color\/dist\/color.esm.js", "@popperjs\/core": "\/public\/generated\/js\/vendor_dist\/@popperjs\/core\/dist\/esm\/index.js", "animejs": "\/public\/generated\/js\/vendor_dist\/anime\/dist\/anime.es.js", "@shoelace\/color-picker": "\/public\/generated\/js\/color-picker.js", "bootstrap": "\/public\/generated\/js\/vendor_dist\/bootstrap\/dist\/js\/bootstrap.esm.min.js", "chartjs": "\/public\/generated\/js\/vendor_dist\/chart.js\/dist\/chart.js", "clipboard": "\/public\/generated\/js\/vendor_dist\/clipboard\/dist\/clipboard.min.js", "dompurify": "\/public\/generated\/js\/vendor_dist\/dompurify\/dist\/purify.es.js", "driver.js": "\/public\/generated\/js\/vendor_dist\/driver.js\/dist\/driver.js.mjs", "jquery": "\/public\/generated\/js\/vendor_dist\/jquery\/dist\/jquery.js", "mermaid": "\/public\/generated\/js\/vendor_dist\/mermaid\/dist\/mermaid.esm.min.mjs", "moment": "\/public\/generated\/js\/vendor_dist\/moment\/dist\/moment.js", "select2": "\/public\/generated\/js\/vendor_dist\/select2\/dist\/select2.min.js", "sortablejs": "\/public\/generated\/js\/vendor_dist\/sortablejs\/modular\/sortable.esm.js", "vue": "\/public\/generated\/js\/vendor_dist\/vue\/dist\/vue.esm-browser.prod.js", "@jquery-tiki\/plugin-edit": "\/public\/generated\/js\/jquery-tiki\/plugin-edit\/index.js", "@jquery-tiki\/plugin-edit\/buttons": "\/public\/generated\/js\/jquery-tiki\/plugin-edit\/buttons.js", "@jquery-tiki\/plugins\/dialog": "\/public\/generated\/js\/jquery-tiki\/plugins\/dialog.js", "@jquery-tiki\/plugins\/pagetabs": "\/public\/generated\/js\/jquery-tiki\/plugins\/pagetabs.js", "@jquery-tiki\/tiki-calendar": "\/public\/generated\/js\/jquery-tiki\/tiki-calendar.js", "@jquery-tiki\/tiki-svgedit_draw": "\/public\/generated\/js\/jquery-tiki\/tiki-svgedit_draw.js", "@jquery-tiki\/tiki-handle_svgedit": "\/public\/generated\/js\/jquery-tiki\/tiki-handle_svgedit.js", "@jquery-tiki\/tiki-admin_menu_options": "\/public\/generated\/js\/jquery-tiki\/tiki-admin_menu_options.js", "@jquery-tiki\/tiki-edit_structure": "\/public\/generated\/js\/jquery-tiki\/tiki-edit_structure.js", "@jquery-tiki\/ui-utils": "\/public\/generated\/js\/jquery-tiki\/ui-utils\/index.js", "@jquery-tiki\/wikiplugin-trackercalendar": "\/public\/generated\/js\/jquery-tiki\/wikiplugin-trackercalendar.js", "@jquery-tiki\/fullcalendar_to_pdf": "\/public\/generated\/js\/jquery-tiki\/fullcalendar_to_pdf.js", "@vue-mf\/duration-picker": "\/public\/generated\/js\/duration-picker.js", "@vue-mf\/emoji-picker": "\/public\/generated\/js\/emoji-picker.js", "@vue-mf\/kanban": "\/public\/generated\/js\/kanban.js", "@vue-mf\/root-config": "\/public\/generated\/js\/root-config.js", "@vue-mf\/styleguide": "\/public\/generated\/js\/styleguide.js", "@vue-mf\/tiki-offline": "\/public\/generated\/js\/tiki-offline.js", "@vue-mf\/toolbar-dialogs": "\/public\/generated\/js\/toolbar-dialogs.js", "@vue-widgets\/datetime-picker": "\/public\/generated\/js\/datetime-picker.js", "@vue-widgets\/element-plus-ui": "\/public\/generated\/js\/element-plus-ui.js", "@tiki-iot\/tiki-iot-dashboard-all": "\/public\/generated\/js\/tiki-iot\/tiki-iot-dashboard-all.js", "@tiki-iot\/tiki-iot-dashboard": "\/public\/generated\/js\/tiki-iot\/tiki-iot-dashboard.js" } } </script> <script type="module"> import "@vue-mf/root-config"; </script> <meta name="msapplication-config" content="themes/base_files/favicons/browserconfig.xml"> <link rel="icon" href="themes/base_files/favicons/favicon-16x16.png" sizes="16x16" type="image/png"> <link rel="apple-touch-icon" href="themes/base_files/favicons/apple-touch-icon.png" sizes="180x180"> <link rel="icon" href="themes/base_files/favicons/favicon-32x32.png" sizes="32x32" type="image/png"> <link rel="shortcut icon" href="themes/base_files/favicons/favicon.ico"> <link rel="mask-icon" href="themes/base_files/favicons/safari-pinned-tab.svg" color="#5bbad5"> <link rel="stylesheet" href="temp/public/minified_f8a384f2321ad581495abb8d489a7b90.css" type="text/css"> <link rel="stylesheet" href="temp/public/minified_e3c25e805885179f2c89835917fd189f.css" type="text/css"> <link rel="stylesheet" href="temp/public/minified_32cbc7490bac7bd4c7bd32eebe935547.css" type="text/css"> <link rel="stylesheet" href="temp/public/minified_c5d432a1f89557fdec4a3d9fed7ae48a.css" type="text/css"> <link rel="stylesheet" href="temp/public/minified_de722c78f502db0e097d39f9a46b17ad.css" type="text/css"> <link rel="stylesheet" href="temp/public/minified_d28c3563048e00a3d212e3d149079019.css" type="text/css"> <link rel="stylesheet" href="temp/public/minified_0ae8ca14436527cba9b23ba86f946a0a.css" type="text/css"> <link rel="stylesheet" href="temp/public/minified_5e9f46372118ec88bb41277866492619.css" type="text/css"> <link rel="stylesheet" href="temp/public/minified_431ab7d4ef48afd9c39a647c5c990b0a.css" type="text/css"> <link rel="stylesheet" href="temp/public/minified_e71c39430469a3eea74514a2b48f6536.css" type="text/css"> <link rel="stylesheet" href="temp/public/minified_3caedafd8e52dca668b4620ba7320045.css" type="text/css"> <link rel="stylesheet" href="temp/public/minified_de204cf1e00d3b64a8ea247fc7c06514.css" type="text/css"> <link rel="stylesheet" href="temp/public/minified_58a32a155e8352e5d0210566c25a8c4c.css" type="text/css"> <link rel="stylesheet" href="temp/public/minified_7b1c39bc344c31838599a690e01ef763.css" type="text/css"> <link rel="stylesheet" href="temp/public/minified_9f29f69d8a640b433a9a1a88a6952630.css" type="text/css"> <link rel="stylesheet" href="temp/public/minified_51046d54ce34c38bcaed593696d96aab.css" type="text/css"> <link rel="stylesheet" href="temp/public/minified_48ef24c8183bd3919bb89396174fcbdd.css" type="text/css"> <link rel="stylesheet" href="temp/public/minified_449790d2e0ac49f31fd9dbf6f5646231.css" type="text/css"> <style type="text/css"> </style> <script> const getStoredTheme = () => localStorage.getItem("theme"); const setStoredTheme = (theme) => localStorage.setItem("theme", theme); const getPreferredTheme = () => { const storedTheme = getStoredTheme(); if (storedTheme) return storedTheme; return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light"; }; const setTheme = (theme) => { if (theme === "auto" && window.matchMedia("(prefers-color-scheme: dark)").matches) document.documentElement.setAttribute("data-bs-theme", "dark"); else document.documentElement.setAttribute("data-bs-theme", theme); }; setTheme(getPreferredTheme()); </script> <style> </style> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> /* Prevent target anchors from being covered by fixed top navbar */ h1:target:before, h2:target:before, h3:target:before, h4:target:before, h5:target:before, h6:target:before { content: ""; display: block; height: 73px; /* fixed header height*/ margin: -73px 0 0; /* negative fixed header height */ } </style></head> <body class="tiki navbar-padding tiki-index tiki_wiki_page uab fixed_width layout_social homepage lang_en" style="padding-top: 73px"> <div id="fullscreenbutton"> <a title="Fullscreen" href="/Themes?fullscreen=y"><span class="icon icon-expand fas fa-expand " ></span></a> </div> <div id="ajaxLoading">Loading...</div> <div id="ajaxLoadingBG"> </div> <div id="ajaxDebug"></div> <a class="btn btn-info btn-lg skipnav" href="#col1">Skip to main content</a> <div class="middle_outer" id="middle_outer"> <div class="topbar-wrapper navbar-dark-parent bg-dark-parent tiki-topbar-nav-dark"> <div class="topbar container container-std navbar-dark bg-dark tiki-topbar-nav-dark" id="topbar"> <div class="modules topbar_modules w-100" id="topbar_modules" aria-labelledby="topbar_modules_heading" role=""> <h2 class="visually-hidden-focusable" id="topbar_modules_heading">Navigation and related functionality and content</h2> <div class="col-sm-8 tikipedia_menu"> <div id="module_67" style="" class="module box-menu display_on_print"> <div id="mod-menutopbar1"> <nav class="navbar navbar-expand-lg navbar-dark bg-dark tiki-nav-dark" role="navigation"> <button type="button" class="navbar-toggler" data-bs-toggle="collapse" data-bs-target="#mod-menutopbar1 .navbar-collapse" aria-controls="mod-menutopbar1" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse "> <ul class=" navbar-nav me-auto nav sm-horizontal"> <li class="nav-item dropdown active "> <a href="Themes" class="nav-link dropdown-toggle" data-bs-toggle="dropdown"> Home Page </a> <ul class="dropdown-menu"> <li class="nav-item "> <a class="dropdown-item" href="About"> About </a> </li> <li class="nav-item "> <a class="dropdown-item" href="Marketplace-Themes"> Marketplace </a> </li> <li class="nav-item "> <a class="dropdown-item" href="Sample-Page"> Sample page </a> </li> <li class="nav-item "> <a class="dropdown-item" href="http://dev.tiki.org/Theme"> Wishlist at dev site </a> </li> <li class="nav-item "> <a class="dropdown-item" href="categories"> Sitemap (Categories) </a> </li> </ul> </li> <li class="nav-item dropdown "> <a href="Tiki-Customization" class="nav-link dropdown-toggle" data-bs-toggle="dropdown"> Tiki Customization </a> <ul class="dropdown-menu"> <li class="nav-item "> <a class="dropdown-item" href="Creating-a-Tiki-theme"> Creating a theme </a> </li> <li class="nav-item "> <a class="dropdown-item" href="Converting a Bootstrap theme made for HTML or another CMS"> Converting a Bootstrap theme </a> </li> <li class="nav-item "> <a class="dropdown-item" href="Contributing, sharing or selling a theme"> Contributing, sharing or selling </a> </li> <li class="nav-item "> <a class="dropdown-item" href="Icons"> Customizing icons </a> </li> <li class="nav-item dropdown "> <a href="Tips" class="dropdown-item dropdown-toggle" data-bs-toggle="dropdown"> Tips </a> <ul class="dropdown-menu"> <li class="nav-item "> <a class="dropdown-item" href="Template-Tricks"> Template Tricks </a> </li> <li class="nav-item "> <a class="dropdown-item" href="CSS-Tricks"> CSS Tricks </a> </li> </ul> </li> </ul> </li> <li class="nav-item dropdown "> <a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown"> Feature Examples </a> <ul class="dropdown-menu"> <li class="nav-item "> <a class="dropdown-item" href="articles"> Articles </a> </li> <li class="nav-item "> <a class="dropdown-item" href="blogs"> Blogs </a> </li> <li class="nav-item "> <a class="dropdown-item" href="calendar"> Calendar </a> </li> <li class="nav-item "> <a class="dropdown-item" href="forums"> Forums </a> </li> <li class="nav-item "> <a class="dropdown-item" href="faqs"> FAQs </a> </li> <li class="nav-item "> <a class="dropdown-item" href="trackers"> Trackers </a> </li> <li class="nav-item "> <a class="dropdown-item" href="tiki-list_file_gallery.php"> Files </a> </li> <li class="nav-item "> <a class="dropdown-item" href="directories"> Links Directory </a> </li> <li class="nav-item "> <a class="dropdown-item" href="tiki-listpages.php"> Wiki Pages </a> </li> </ul> </li> </ul> </div> </nav> </div> </div> </div> <div class="w-100"> <div id="module_86" style="" class="module box-pagetop-hero display_on_print"> <div id="mod-pagetop-herotopbar2"> <div id="pagetop-hero" style="display:block;"> <div id="pagetop-hero" class="pagetop-hero w-100"> <div class="bg-image-wrapper" id="bg-image-wrapper"></div> <div class="container"> <div class="row"> <div class="col-sm-8 offset-sm-2 text-center" id="page-header-title-wrapper"> </div> </div> </div> </div></div> </div> </div> </div> <div class="col-sm-3"><div id="module_69" style="" class="module box-search display_on_print"><div id="mod-searchtopbar3"><form id="search-module-form1" method="get" action="tiki-searchindex.php" onsubmit="return submitSearch1()" style="position: relative;"><div class="input-group"><input style="min-width: 4rem;" placeholder="Find" class="form-control my-1" id="search_mod_input_1" name="filter~content" type="text" accesskey="s" value=""><label class="sr-only" for="search_mod_input_1">Find</label><button type="submit" class="btn btn-info my-1 search_mod_magnifier" aria-label="Search"><span class="icon icon-search fas fa-search " ></span></button></div><div class="btn-group search_mod_buttons box"><input type = "submit" class="btn btn-info btn-sm tips btn-primary button_default bottom" name = "search" value = "Search" title="Search|Search for text throughout the site." data-bs-placement="bottom" onclick = "$('#search-module-form1').attr('action', 'tiki-searchindex.php').attr('page_selected','');" /><input type="hidden" name="exact_match" value="" /><input type = "submit" class="btn btn-info btn-sm tips bottom" name = "go" value = "Go" title="Go|Go directly to a page, or search in page titles if exact match is not found." data-bs-placement="bottom" onclick = "$('#search-module-form1').attr('action', 'tiki-listpages.php').attr('page_selected',''); $('#search-module-form1 input[name=\'filter~content\']').attr('name', 'find'); " ></div></form></div></div></div> </div> </div> </div> <div class="middle-wrapper"> <div class="page-content-top-margin" style="height: var(--tiki-page-content-top-margin)"></div> <div class="container container-std middle" id="middle"> <div class="row row-middle" id="row-middle"> <div class="col col1 col-md-12 pb-4" id="col1"> <div id="feedback" role="alert"> <div id="tikifeedback"> </div> </div> <div class="wikitopline clearfix" style="clear: both;"> <div class="content"> <div class="wikiinfo float-start" id="pdfinfo" style="display:none"> <div class="alert alert-info" style="width:500px"><h4><span class="icon icon-information fas fa-info-circle fa-fw "></span> <span class="rboxtitle">Please wait</span></h4><div class="rboxcontent" style="display: inline"><span class="fas fa-circle-notch fa-spin" style="font-size:24px"></span> The PDF is being prepared, please wait...</div></div> </div> </div> </div> <div class="wikiactions_wrapper clearfix"> <div class="wikiactions d-flex justify-content-end mb-2"><div class="btn-group ms-2"><div class="btn-group page_actions" role="group"><a class="btn btn-info btn-sm dropdown-toggle" data-bs-toggle="dropdown" href="#" title="Page actions"><span class="icon icon-menu-extra fas fa-ellipsis-v " ></span></a><div class="dropdown-menu dropdown-menu-end"><h6 class="dropdown-header">Page actions</h6><div class="dropdown-divider"></div><a class="dropdown-item generate-pdf" href="tiki-print.php?page=Themes&display=pdf"><span class="icon icon-pdf far fa-file-pdf " ></span> PDF</a></div></div></div></div> </div> <main> <article id="top" class="wikitext highlightable clearfix"> <div id="page-data" class="clearfix"> <style> .side-col-toggle-container, #col2 { display: none; } body, html { max-width: 100%; overflow-x: hidden; padding: 0; margin: 0 } body { overflow-x: hidden; } .section { position: relative; overflow: hidden; padding: 4em 0 } .section.btm { padding: 2em 0; background: rgba(153, 153, 153, .8) } .parallax-bg { background: center center/cover no-repeat; position: absolute; top: 0; left: 0; bottom: 0; right: 0 } .bg1 { background: url(dl463); } .bg2 { background: url(dl464); } .bg3 { background: url(dl181); } .bg4 { background: url(dl465); } .box { padding: .6em; /* background: #222; */ position: relative } .box2 { display: inline-block; /* background: rgba(34, 34, 34, .9); */ position: absolute; top: 50%; left: 0; right: 0; -webkit-transform: translateY(-50%); transform: translateY(-50%) } .box3 { display: inline-block; position: absolute; top: -webkit-calc(50% - 5em); top: calc(50% - 5em); width: 12em; height: 12em; right: 0; z-index: 100 } .box-heading-bg { background: var(--bs-body-bg); display: inline-block; padding: 1rem 2rem; color: var(--bs-body-color); opacity: .7; } .py-5rem { padding-top: 5rem; padding-bottom: 5rem; } </style> <p><section class="no-parallax pb-5"> </p> <div class="container "> <div class="row site_intro"> <div class="col-sm-5"> <div class="display-3 fw-medium my-5" style="word-break: break-word;">Themes.tiki.org</div> <div class="display-6 fw-medium mb-5">Making and updating Tiki themes and configuring the website appearance</div> </div> <div class="col-sm-7"> <style>.key-info .box-last_blog_posts ol {list-style-type: disc;} .key-info .box-last_blog_posts .date {display: none;} </style><div class='card module mb-3 key-info'><div class='row g-0'><div class='col-md-6 text-center'> <img src="display461?display" loading="lazy" width="600" height="799" alt="Yeti" class="regImage pluginImg461 img-fluid" data-src="display461?display" /> <br /><div style="position:relative"><button type="button" class="btn btn-primary"><a href="Included themes" class="text-white">Included theme - See all</a></button></div></div><div class='col-md-6'><div class='card-body'> <h3 class="showhide_heading d-flex justify-content-start" id="Key_info"> Key info<a href="#Key_info" class="heading-link" aria-label="heading link"><span class="icon icon-link fas fa-link " ></span></a></h3> <ul><li> <a href="Making-or-Updating-a-Theme-for-Tiki-27" title="Making or Updating a Theme for Tiki 27" class="wiki wiki_page">Making or Updating a Theme for Tiki 27</a> </li><li> <a href="About-post-Tiki-25.2-GitLab-branch-25x-theme-files" title="About post-Tiki 25.2 GitLab branch 25x theme files" class="wiki wiki_page">About post-Tiki 25.2 GitLab branch 25x theme files</a> </li><li> <a href="Updating-a-Theme-for-Tiki-26" title="Updating a Theme for Tiki 26" class="wiki wiki_page">Updating a Theme for Tiki 26</a> </li><li> <a href="Implementing-Color-Modes-in-Tiki" title="Implementing Color Modes in Tiki" class="wiki wiki_page">Implementing Color Modes in Tiki</a> </li><li> <a href="CSS-Variables-in-Tiki" title="CSS Variables in Tiki" class="wiki wiki_page">CSS Variables in Tiki</a> </li><li> <a href="Make-an-SCSS-Compiled-Tiki-Theme" title="Make an SCSS-Compiled Tiki Theme" class="wiki wiki_page">Make an SCSS-Compiled Tiki Theme</a> </li></ul> <h3 class="showhide_heading d-flex justify-content-start" id="Latest_blog_posts"> Latest blog posts<a href="#Latest_blog_posts" class="heading-link" aria-label="heading link"><span class="icon icon-link fas fa-link " ></span></a></h3> <div> <div id="module_wikiplugin_3" style="" class="module box-last_blog_posts"> <div id="mod-last_blog_posts_wp_3"> <ol> <li> <a class="linkmodule" href="blogpost75-Site-upgraded-to-branch-27x" title=" Wed 24 of Apr, 2024 11:12 GMT-0000, by Rodriguez Nyiringabo"> Site upgraded to branch 27x </a> <div class="date"> Wed 24 of Apr, 2024 11:12 GMT-0000</div> </li> <li> <a class="linkmodule" href="blogpost72-Site-upgraded-to-branch-26x" title=" Wed 21 of Jun, 2023 09:45 GMT-0000, by Marc Laporte"> Site upgraded to branch 26x </a> <div class="date"> Wed 21 of Jun, 2023 09:45 GMT-0000</div> </li> <li> <a class="linkmodule" href="blogpost71-Site-upgraded-to-branch-25x" title=" Sat 12 of Nov, 2022 17:00 GMT-0000, by Gary Cunningham-Lee"> Site upgraded to branch 25x </a> <div class="date"> Sat 12 of Nov, 2022 17:00 GMT-0000</div> </li> </ol> </div> </div> </div> <hr />- <div class="community-links-bottom w-100 d-grid gap-3 d-md-flex"> <button type="button" class="btn btn-success flex-fill"><a href="https://app.gitter.im/#/room/#tiki-org_community:gitter.im" target="_blank">Chat <small><span class="icon icon-link-external fas fa-external-link-alt"></span></small></a></button> <button type="button" class="btn btn-primary flex-fill"><a href="https://tiki.org/Community" target="_blank" class="text-white">Community Site <small> <span class="icon icon-link-external fas fa-external-link-alt " ></span> </small></a></button> </div></div></div></div></div> </div> </div> </div> </section> <section class="parallax included-themes_info section section2 border-top border-bottom" style="height: 30rem"> <div class="parallax-bg bg1" data-depth=".6" style="background-position: 50% 46px; background-size: cover;"> <div class="info info-b text-center box box2"> <div class="box-heading-bg"> <h2 class="display-6 fw-medium">Tiki's Themes Feature New Designs and Page Elements!</h2> </div> </div> </div> </section> <section class="no-parallax py-5rem"> <div class="container"> <div class="row included-themes_info"> <div class="col-sm-4 text-center"> <h3>New Theme Features in Tiki 25 and 26</h3> <p>Tiki 25 and 26 themes have evolved with the ongoing progress of the recently released Bootstrap versions <a href="https://blog.getbootstrap.com/2022/07/19/bootstrap-5-2-0/" target="_blank">5.2</a> and <a href="https://blog.getbootstrap.com/2022/07/19/bootstrap-5-3-0/" target="_blank">5.3</a>. New features include increasing use of CSS variables, support for color modes, new helpers and utilities, and accordions.</p> </div> <div class="col-sm-4 text-center"> <h3><a href="Updating-a-Theme-for-Tiki-26" title="Updating a Theme for Tiki 26" class="wiki wiki_page">Updating a theme for Tiki 26</a></h3> <p>There's been a focus on easier configuration and customization by site admins in the latest Tiki releases. This is made possible by CSS variables (custom properties). Many design details can be adjusted at a Tiki website by defining the relevant CSS variables in Look and Feel admin. The code for pagetop navbars in particular has been updated to facilitate this. </p> </div> <div class="col-sm-4 text-center"> <h3>Easy and more powerful configuring</h3> <p>There's been a focus on easier configuration and customization by site admins in the latest Tiki releases. This is made possible by CSS variables (custom properties). Many design details can be adjusted at a Tiki website by defining the relevant CSS variables in Look and Feel admin. The code for pagetop navbars in particular has been updated to facilitate this. </p> </div> </div> <div class="row latest_themes mb-5 d-none"> <h2>Latest Themes</h2> <br> </div> <div class="row d-none"> {trackerlist trackerId="6" fields="31:36:38:40" sort_mode="lastModif_desc" max="4" wiki="Theme_thumbnail_TPL"} </div> <div class="text-right d-none">((Marketplace Themes|All Themes))</div> </div> </section> <section class="parallax marketplace_intro section section2 border-top border-bottom" style="height: 20rem"> <div class="parallax-bg bg2" data-depth=".6" style="background-position: 50% 46px; background-size: cover;"> <div class="info info-b text-center box box2"> <div class="box-heading-bg"> <h2 class="display-6 fw-medium">Revitalized themes marketplace will return!</h2> </div> </div> </div> </section> <section class="no-parallax py-5rem"> <div class="container"> <div class="row marketplace_intro py-5"> <div class="col-sm-6 text-center"> <h3><a href="Marketplace-Themes" title="Marketplace Themes" class="wiki wiki_page">New aftermarket themes on the horizon</a></h3> <p>Customizing via CSS variables, along with support for light, dark, auto, and (coming soon) site-specific color modes, can now do some of what was formerly done by child themes and aftermarket themes.</p> <p>But for even more visual and layout options for Tiki websites, new aftermarket themes for the latest versions of Tiki are in the pipeline. Updates of previously released themes as well as new themes will be listed when they are ready, and then can be demoed at the designer's website and downloaded.</p> </div> <div class="col-sm-6 text-center"> <h3><a href="Information-for-authors" title="Information for authors" class="wiki wiki_page">Share your Tiki themes!</a></h3> <p>Designers and authors, share your Tiki themes by listing them here! Nurture your karma. Increase the exposure for your business. Free-of-charge and premium themes, simple single-CSS file themes and elaborate packages with SCSS files and images, and anything in between - all are welcome.</p> <p>Tiki's integration of the Bootstrap CSS framework has opened the door for designers to easily produce themes for the powerful, feature-filled Tiki Wiki CMS Groupware. Please see <a href="Information for authors" title="Information for authors" class="wiki wiki_page">Information for authors</a> for more details.</p> </div> </div> <div class="row latest_themes mb-5 d-none"> <h2>Latest Themes</h2> <br> </div> <div class="row d-none"> {trackerlist trackerId="6" fields="31:36:38:40" sort_mode="lastModif_desc" max="4" wiki="Theme_thumbnail_TPL"} </div> <div class="text-right d-none">((Marketplace Themes|All Themes))</div> </div> </section> <section class="parallax theme-info_intro section section2 border-top border-bottom" style="height: 40rem"> <div class="parallax-bg bg3" data-depth=".6" style="background-position: 50% 46px; background-size: cover;"> <div class="info info-b text-center box box2"> <div class="box-heading-bg"> <h2 class="display-6 fw-medium">About Tiki's themes - overview and documentation</h2> </div> </div> </div> </section> <section class="no-parallax py-5rem"> <div class="container"> <div class="row theme-info_intro"> <div class="col-sm-6"></div> <div class="col-sm-6"></div> </div> <div class="row content_3_points my-5"> <div class="col-md-4 text-center center-block"> <h3>Many sources</h3> <img src="display143?display" loading="lazy" width="270" height="220" alt="Any Bs Theme2" class="center-block regImage pluginImg143 img-fluid" data-src="display143?display" /> <p>Any Bootstrap 5 style sheet (as of Tiki 25) can be a Tiki theme - adapted from HTML or another CMS, or written from scratch.</p> </div> <div class="col-md-4 text-center"> <h3>"Up to 11*"</h3> <img src="display144?display" loading="lazy" width="270" height="220" alt="Tiki Extends Bs" class="center-block regImage pluginImg144 img-fluid" data-src="display144?display" /> <p>Tiki extends Bootstrap to cover all Tiki features and multiply styling and layout options.<br> *What's special about "11"? <a href="https://youtu.be/vknVQs-lang" target="_blank">This Is Spinal Tap - Up to 11</a></p> </div> <div class="col-md-4 text-center center-block"> <h3>Just styling</h3> <img src="display145?display" loading="lazy" width="270" height="220" alt="Themes Only Surface" class="center-block regImage pluginImg145 img-fluid" data-src="display145?display" /> <p>Tiki themes are for laying out and styling the site only. - No need to worry about affecting site security or functionality.</p> </div> </div> </div> </section> <section class="parallax mature-but-evolving section section2 border-top border-bottom" style="height: 60rem"> <div class="parallax-bg bg4" data-depth=".6" style="background-position: 50% 46px; background-size: cover;"> <div class="content_tiki_is box box2"> <div class="row"> <div class="col-md-6 offset-md-3 display-6 fw-medium"> <div class="box-heading-bg"> <h2 class="display-6 fw-medium">Tiki is mature software that's still steadily evolving.</h2> <p> Recent transitions include the integration of Vue.js and upgrade of the Bootstrap CSS Framework to version 5.3. Design flexibility has always been a strong point of Tiki, and this is melded with the familiar languages of Bootstrap and Vue.</p> </div> </div> </div> </div> </div> </section> <section class="no-parallax pt-5"> <div class="container"> <div class="row content_next_steps mt-4"> <div class="col-md-7"> <div class="center-block"> <h3>For theme authors</h3> <ul class="list-unstyled"> <li><a href="Creating a Tiki theme">Creating a Tiki theme</a></li> <li><a href="Three ways to make a new theme">Three ways to make a new theme</a></li> <li><a href="Updating a pre-Bootstrap theme">Updating a pre-Bootstrap theme</a></li> <li><a href="Converting a Bootstrap theme made for HTML or another CMS">Converting a Bootstrap theme made for HTML or another CMS</a></li> <li><a href="Contributing, sharing or selling a theme">Contributing, sharing or selling a theme</a></li> <li><a href="Theme-making Questions and Answers">Theme-making Questions and Answers</a></li> </ul> </div> </div> <div class="col-md-5"> <div class="center-block"> <h3>For theme users</h3> <ul class="list-unstyled"> <li><a href="Finding a theme">Finding a theme</a></li> <li><a href="Configuring a theme">Configuring a theme</a></li> <li><a href="Modifying a theme">Modifying a theme</a></li> <li><a href="Troubleshooting a theme">Troubleshooting a theme</a></li> </ul> </div> </div> </div> <div class="row content_digging_deeper"> <div class="col-md-7"> <h3>Digging deeper:</h3> <ul class="list-unstyled"> <li><a href="Tiki's CSS and Smarty template organization">Tiki's CSS and Smarty template organization</a></li> <li><a href="Theme-related Software Concept and Design">Theme-related Software Concept and Design</a></li> </ul>  </div> <div class="col-md-5"> <h3>Latest changes</h3> <div> <div id="module_wikiplugin_4" style="" class="module box-last_modif_pages"> <div id="mod-last_modif_pages_wp_4"> <ol> <li> <a class="linkmodule" href="Making-or-Updating-a-Theme-for-Tiki-27" title=" Sun 24 of Nov, 2024 11:39 GMT-0000" > Making or Updating a Theme for Tiki 27 </a> </li> <li> <a class="linkmodule" href="MenuPageBanner" title=" Mon 28 of Oct, 2024 11:34 GMT-0000" > MenuPageBanner </a> </li> <li> <a class="linkmodule" href="rss_gabarit" title=" Wed 14 of Aug, 2024 11:35 GMT-0000" > rss_gabarit </a> </li> <li> <a class="linkmodule" href="RSS_banner_test" title=" Wed 17 of Jul, 2024 04:49 GMT-0000" > RSS_banner_test </a> </li> <li> <a class="linkmodule" href="Common-Color-Contrast-Issues-and-Fixes" title=" Fri 05 of Jul, 2024 08:48 GMT-0000" > Common Color Contrast Issues and Fixes </a> </li> <li> <a class="linkmodule" href="Bootstrap-Sample-Elements" title=" Thu 04 of Jul, 2024 13:56 GMT-0000" > Bootstrap Sample Elements </a> </li> <li> <a class="linkmodule" href="Bootstrap-5-Cheatsheet" title=" Thu 04 of Jul, 2024 02:24 GMT-0000" > Bootstrap 5 Cheatsheet </a> </li> <li> <a class="linkmodule" href="Key_Info" title=" Wed 29 of May, 2024 07:29 GMT-0000" > Key_Info </a> </li> <li> <a class="linkmodule" href="Tiki_org_family_customizations_CSS" title=" Fri 03 of May, 2024 05:03 GMT-0000" > Tiki_org_family_customizations_CSS </a> </li> <li> <a class="linkmodule" href="Included-themes" title=" Wed 24 of Apr, 2024 11:21 GMT-0000" > Included themes </a> </li> </ol> <a class="linkmodule ms-3" href="tiki-lastchanges.php">...more</a> </div> </div> </div> </div> </div> </div> </section> <script src="dl387"></script> <script> document.addEventListener('DOMContentLoaded', function () { pureParallax({ selector: '[data-depth]', axisSelector: 'parallax-x', bgSelector: 'parallax-bg', topSelector: 'parallax-top', btmSelector: 'parallax-btm', container: 'section', offsetHeader: true, headerId: 'hd', minWidth: 64, oldBrowserSupport: 'false' }); }); /* const pureParallax = new pureParallax({ selector: '[data-depth]', axisSelector: 'parallax-x', bgSelector: 'parallax-bg', topSelector: 'parallax-top', btmSelector: 'parallax-btm', container: 'section', offsetHeader: true, headerId: 'hd', minWidth: 64, oldBrowserSupport: 'false' }); */ </script> </div> </article> <footer class="form-text"> <div class="wiki-authors"> <hr> Page last modified on Tuesday 13 of February, 2024 19:55:48 GMT-0000 </div> </footer> <div class="row mx-0 my-3" id="page-bar"> <div class="btn-bar"> <div class="btn-group dropup mb-2"> <button type="button" class="btn btn-secondary dropdown-toggle" data-bs-toggle="dropdown">More</button> <div class="dropdown-menu"> <a class="btn btn-link dropdown-item" target="" data-role="button" data-inline="true" href="/tiki-likepages.php?page=Themes">Similar</a> </div> </div> </div> </div> </main> <div class="modules mt-3" id="pagebottom_modules" aria-labelledby="pagebottom_modules_heading" role="complementary"> <h2 class="visually-hidden-focusable" id="pagebottom_modules_heading">Pagebottom heading</h2> <div class="col-sm-12 text-center my-4"> <div id="module_81" style="height: 3rem" class="module box-menupage display_on_print"> <div id="mod-menupagepagebottom1"> <div class="col-sm-12 text-center margin-bottom-lg" style="height: 3rem;"><h2>Site tools and information</h2></div> </div> </div> </div> <div class="col-sm-3"> <div id="module_77" class="card box-pagebottom_zone_notice module"> <div class="card-header" > <h3 class="card-title"> <span class="moduletitle">About changing the theme and layout</span> <div class="moduleflip" id="moduleflip-pagebottom_zone_noticepagebottom2"> <a title="Toggle module contents" class="flipmodtitle close" href="javascript:icntoggle('mod-pagebottom_zone_noticepagebottom2','module.png');"> <span class="icon icon-bars fas fa-bars " id="icnmod-pagebottom_zone_noticepagebottom2"></span> </a> </div> </h3> </div> <div id="mod-pagebottom_zone_noticepagebottom2" style="display: block;" class="card-body"> <div id="pagebottom_zone_notice" style="display:block;"> To change the theme and/or layout of this site, please proceed to an inside page. The modules for switching the theme and layout will be at the top of the left column. This front page has custom coding that doesn't work well, as is, in all themes and layouts.</div> </div> <div class="card-footer"></div> </div> </div> <div class="col-sm-2"> <div id="module_72" class="card box-Newsletter_subscribe module"> <div class="card-header" > <h3 class="card-title"> <span class="moduletitle">Subscribe to Tiki Newsletters!</span> </h3> </div> <div id="mod-Newsletter_subscribepagebottom4" style="display: block;" class="card-body"> <div id="Newsletter_subscribe" style="display:block;"> <div style="font-weight:bold; font-style:italic; text-align:center;width: auto;">Delivered fresh to your email inbox!<br /> <a href="https://tiki.org/Newsletters"><img src="//themes.tiki.org/display113" alt="Newsletter subscribe icon" title="Subscribe!" /></a><br /> Don't miss major announcements and other big news!</div> <div style="text-align:center;margin:2.5em 0"> <a href="https://tiki.org/Donation"><img src="//tiki.org/display264" width="170" alt="Contribute to Tiki" border="0" /></a> </div></div> </div> <div class="card-footer"></div> </div> </div> <div class="col-sm-3"> <div id="module_73" class="card box-last_blog_posts module"> <div class="card-header" > <h3 class="card-title"> <span class="moduletitle">Site config blog</span> <div class="moduleflip" id="moduleflip-last_blog_postspagebottom5"> <a title="Toggle module contents" class="flipmodtitle close" href="javascript:icntoggle('mod-last_blog_postspagebottom5','module.png');"> <span class="icon icon-bars fas fa-bars " id="icnmod-last_blog_postspagebottom5"></span> </a> </div> </h3> </div> <div id="mod-last_blog_postspagebottom5" style="display: block;" class="card-body"> <ul> <li> <a class="linkmodule" href="blogpost75-Site-upgraded-to-branch-27x" title=" Wed 24 of Apr, 2024 11:12 GMT-0000, by Rodriguez Nyiringabo"> Site upgraded to branch 27x </a> <div class="date"> Wed 24 of Apr, 2024 11:12 GMT-0000</div> </li> <li> <a class="linkmodule" href="blogpost72-Site-upgraded-to-branch-26x" title=" Wed 21 of Jun, 2023 09:45 GMT-0000, by Marc Laporte"> Site upgraded to branch 26x </a> <div class="date"> Wed 21 of Jun, 2023 09:45 GMT-0000</div> </li> <li> <a class="linkmodule" href="blogpost71-Site-upgraded-to-branch-25x" title=" Sat 12 of Nov, 2022 17:00 GMT-0000, by Gary Cunningham-Lee"> Site upgraded to branch 25x </a> <div class="date"> Sat 12 of Nov, 2022 17:00 GMT-0000</div> </li> <li> <a class="linkmodule" href="blogpost70-Site-upgraded-to-Tiki-23-x" title=" Sat 24 of Jul, 2021 00:30 GMT-0000, by Marc Laporte"> Site upgraded to Tiki 23.x </a> <div class="date"> Sat 24 of Jul, 2021 00:30 GMT-0000</div> </li> <li> <a class="linkmodule" href="blogpost69-Site-upgraded-to-Tiki-20" title=" Wed 29 of May, 2019 07:57 GMT-0000, by Gary Cunningham-Lee"> Site upgraded to Tiki 20 </a> <div class="date"> Wed 29 of May, 2019 07:57 GMT-0000</div> </li> <li> <a class="linkmodule" href="blogpost68-We-are-now-on-Tiki-19-x" title=" Fri 05 of Oct, 2018 10:02 GMT-0000, by Marc Laporte"> We are now on Tiki 19.x </a> <div class="date"> Fri 05 of Oct, 2018 10:02 GMT-0000</div> </li> <li> <a class="linkmodule" href="blogpost67-Shoutbox-module-removed" title=" Thu 28 of Jun, 2018 07:01 GMT-0000, by Gary Cunningham-Lee"> Shoutbox module removed </a> <div class="date"> Thu 28 of Jun, 2018 07:01 GMT-0000</div> </li> <li> <a class="linkmodule" href="blogpost66-We-are-now-on-Tiki-18-x" title=" Wed 02 of May, 2018 08:46 GMT-0000, by luciash d' being ?‍♂️"> We are now on Tiki 18.x </a> <div class="date"> Wed 02 of May, 2018 08:46 GMT-0000</div> </li> <li> <a class="linkmodule" href="blogpost65-Upgraded-to-Tiki-17-0" title=" Wed 02 of Aug, 2017 08:19 GMT-0000, by Gary Cunningham-Lee"> Upgraded to Tiki 17.0 </a> <div class="date"> Wed 02 of Aug, 2017 08:19 GMT-0000</div> </li> <li> <a class="linkmodule" href="blogpost64-Upgraded-to-Tiki-15-0alpha" title=" Tue 08 of Mar, 2016 13:34 GMT-0000, by Gary Cunningham-Lee"> Upgraded to Tiki 15.0alpha </a> <div class="date"> Tue 08 of Mar, 2016 13:34 GMT-0000</div> </li> </ul> </div> <div class="card-footer"></div> </div> </div> </div> </div> </div> </div> </div> <footer class="footer main-footer" id="footer"> <div class="footer_liner"> <div class="container container-std"> <div class="modules bottom_modules p-3 mx-n2point5" id="bottom_modules" aria-labelledby="bottom_modules_heading" role="contentinfo"> <h2 class="visually-hidden-focusable" id="bottom_modules_heading">Site information, links, etc.</h2> <div class="col-sm-2"> <div id="module_91" class="card box-switch_theme module"> <div class="card-header" > <h3 class="card-title"> <span class="moduletitle">Switch Theme </span> <div class="moduleflip" id="moduleflip-switch_themebottom1"> <a title="Toggle module contents" class="flipmodtitle close" href="javascript:icntoggle('mod-switch_themebottom1','module.png');"> <span class="icon icon-bars fas fa-bars " id="icnmod-switch_themebottom1"></span> </a> </div> </h3> </div> <div id="mod-switch_themebottom1" style="display: block;" class="card-body"> <form method="get" action="tiki-switch_theme.php"> <fieldset> <legend class="visually-hidden">Switch Theme</legend> <div class="mb-3"> <select name="theme" onchange="this.form.submit();" class="form-select" > <option value="" class="text-muted bg-info">Site theme (fivealive-lite/grape)</option> <option value="default" >Default</option> <option value="amelia" >Amelia</option> <option value="bookStacked" >BookStacked</option> <option value="boosted" >Boosted</option> <option value="business" >Business</option> <option value="cerulean" >Cerulean</option> <option value="cosmo" >Cosmo</option> <option value="cyborg" >Cyborg</option> <option value="darkly" >Darkly</option> <option value="darkroom" >Darkroom</option> <option value="darkshine" >Darkshine</option> <option value="feb12" >Feb12</option> <option value="fivealive-lite" selected="selected">Fivealive-lite</option> <option value="fivealive" >Fivealive</option> <option value="flatly" >Flatly</option> <option value="greenvalley" >Greenvalley</option> <option value="journal" >Journal</option> <option value="jqui" >Jqui</option> <option value="lighty" >Lighty</option> <option value="litera" >Litera</option> <option value="lumen" >Lumen</option> <option value="lux" >Lux</option> <option value="materia" >Materia</option> <option value="minty" >Minty</option> <option value="morph" >Morph</option> <option value="neubrutiki" >Neubrutiki</option> <option value="ohia" >Ohia</option> <option value="pulse" >Pulse</option> <option value="quartz" >Quartz</option> <option value="sandstone" >Sandstone</option> <option value="simplex" >Simplex</option> <option value="sketchy" >Sketchy</option> <option value="slate" >Slate</option> <option value="solar" >Solar</option> <option value="spacelab" >Spacelab</option> <option value="strasa" >Strasa</option> <option value="superhero" >Superhero</option> <option value="thenews" >Thenews</option> <option value="tikicorp" >Tikicorp</option> <option value="tikinewt" >Tikinewt</option> <option value="tuften" >Tuften</option> <option value="united" >United</option> <option value="utopias" >Utopias</option> <option value="vapor" >Vapor</option> <option value="yeti" >Yeti</option> <option value="zephyr" >Zephyr</option> </select> </div> <div class="mb-3"> <select name="theme_option" onchange="this.form.submit();" class="form-select" > <option value="" class="text-muted bg-info">None</option> <option value="akebi" >Akebi</option> <option value="grape" selected="selected">Grape</option> <option value="kiwi" >Kiwi</option> <option value="lemon" >Lemon</option> <option value="orange" >Orange</option> <option value="plum" >Plum</option> <option value="raspberry" >Raspberry</option> <option value="watermelon" >Watermelon</option> </select> </div> <noscript> <button type="submit" class="btn btn-primary btn-sm">Switch</button> </noscript> </fieldset> </form> </div> <div class="card-footer"></div> </div> </div> <div class="col-sm-10"> <div id="module_63" style="" class="module box-menupage display_on_print"> <div id="mod-menupagebottom2"> <style>.twfooter .card {border: none; background: transparent; } .twfooter h4 { font-size: 1.2rem; margin-bottom: 0; } .twfooter ul { list-style:none; padding-left: 0; } .twfooter .icon-link-external, .twfooter .icon-link {display: none; }</style><div class="twfooter"><div class="row"><div class="col-sm-2"><div class="card"> <h4 class="showhide_heading d-flex justify-content-start" id="About_Tiki"> About Tiki<a href="#About_Tiki" class="heading-link" aria-label="heading link"><span class="icon icon-link fas fa-link " ></span></a></h4> <ul><li> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/tiki-view_articles.php" rel="external">News</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/Download" rel="external">Download</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/Demo" rel="external">Demo</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/Features" rel="external">Features</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/Tiki-Software-Community-Association" rel="external">Tiki Association</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/Contact-Us" rel="external">Contact Tiki</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/Contribute to Tiki" rel="external">Donation</a></div><div class="card"> </li></ul><h4 class="showhide_heading d-flex justify-content-start" id="Support"> Support<a href="#Support" class="heading-link" aria-label="heading link"><span class="icon icon-link fas fa-link " ></span></a></h4> <ul><li> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/tiki-forums.php" rel="external">Forums</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://doc.tiki.org" rel="external">Documentation</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/Mailing-lists" rel="external">Mailing lists</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://doc.tiki.org/faqs" rel="external">FAQs</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/Consultants" rel="external">Consultants</a></div></div><div class="col-sm-2"><div class="card"> </li></ul><h4 class="showhide_heading d-flex justify-content-start" id="Community"> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/Community" rel="external">Community</a><a href="#Community" class="heading-link" aria-label="heading link"><span class="icon icon-link fas fa-link " ></span></a></h4> <ul><li> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/Model" rel="external">Model</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/tiki-register.php" rel="external">Join Tiki</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://dev.tiki.org/Make-a-wish" rel="external">Feature request / Bug report</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://info.tiki.org/Featured-Tikis" rel="external">Featured Tikis</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://info.tiki.org/tiki-calendar.php" rel="external">Events</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/TikiMovies" rel="external">Videos</a></div></div><div class="col-sm-2"><div class="card"> </li></ul><h4 class="showhide_heading d-flex justify-content-start" id="Documentation"> <a class="wiki external" target="_blank" title="External link" href="https://doc.tiki.org" rel="external">Documentation</a><a href="#Documentation" class="heading-link" aria-label="heading link"><span class="icon icon-link fas fa-link " ></span></a></h4> <ul><li> <a class="wiki external" target="_blank" title="External link" href="https://doc.tiki.org/Basic-Docs-Project" rel="external">Basics</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://doc.tiki.org/Installation" rel="external">Installation guide</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://doc.tiki.org/Initial-Configuration" rel="external">Configuration</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://doc.tiki.org/Features" rel="external">Features</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://doc.tiki.org/Tutorials" rel="external">Tutorials</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://doc.tiki.org/Welcome-Authors" rel="external">Become an author</a></div></div><div class="col-sm-2"><div class="card"> </li></ul><h4 class="showhide_heading d-flex justify-content-start" id="Development"> <a class="wiki external" target="_blank" title="External link" href="https://dev.tiki.org" rel="external">Development</a><a href="#Development" class="heading-link" aria-label="heading link"><span class="icon icon-link fas fa-link " ></span></a></h4> <ul><li> <a class="wiki external" target="_blank" title="External link" href="https://dev.tiki.org/3Rules" rel="external">The 3 rules</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://dev.tiki.org/How-to-get-commit-access" rel="external">Commit access</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://dev.tiki.org/Get-code" rel="external">Get the code</a> </li></ul><h4 class="showhide_heading d-flex justify-content-start" id="Legal"> Legal<a href="#Legal" class="heading-link" aria-label="heading link"><span class="icon icon-link fas fa-link " ></span></a></h4> <ul><li> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/terms-of-service" rel="external">Terms of Service</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/privacy-policy" rel="external">Privacy Policy</a> </li></ul></div></div><div class="col-sm-2"><div class="card"> <h4 class="showhide_heading d-flex justify-content-start" id="Tiki_Project_Sites"> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org" rel="external">Tiki Project Sites</a><a href="#Tiki_Project_Sites" class="heading-link" aria-label="heading link"><span class="icon icon-link fas fa-link " ></span></a></h4> <ul><li> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/Community" rel="external">Community</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://dev.tiki.org" rel="external">Development</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://doc.tiki.org" rel="external">Documentation</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://themes.tiki.org" rel="external">Themes</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://profiles.tiki.org" rel="external">Profiles</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://security.tiki.org" rel="external">Security</a></div></div><div class="col-sm-2"><div class="card"> </li></ul><h4 class="showhide_heading d-flex justify-content-start" id="Networks"> <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/networks" rel="external">Networks</a><a href="#Networks" class="heading-link" aria-label="heading link"><span class="icon icon-link fas fa-link " ></span></a></h4> <ul><li> <a class="wiki external" target="_blank" title="External link" href="https://twitter.com/tikiwiki" rel="external">Twitter</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://www.facebook.com/groups/6607687318/" rel="external">Facebook</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://www.linkedin.com/groups/118987/" rel="external">LinkedIn</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://www.openhub.net/p/tikiwiki" rel="external">Open Hub</a> </li><li> <a class="wiki external" target="_blank" title="External link" href="https://www.youtube.com/results?search_query=tikiwiki+cms" rel="external">YouTube</a></div></div> </div> </li></ul><div class="row d-flex"><div class="col-sm-8"> Tiki® and TikiWiki® are registered trademarks of the <a class="wiki external" target="_blank" title="External link" href="https://tiki.org/Tiki-Software-Community-Association" rel="external">Tiki Software Community Association</a>.</div><div class="col-sm-4 text-right"><a href="https://sourceforge.net/projects/tikiwiki"><img src="https://sflogo.sourceforge.net/sflogo.php?group_id=64258&type=14" width="150" height="40" alt="Get Tiki Wiki CMS Groupware at SourceForge.net. Fast, secure and Free Open Source software downloads" /></a></div></div> <p></p> </div> </div> </div> <div id="module_83" style="" class="module box-Git+detail display_on_print"> <div id="mod-Git_detailbottom3"> <div class="mod-git_detail cvsup"> <span class="label">Git information:</span>  <span class="branch">28.x:<a href="https://gitlab.com/tikiwiki/tiki/-/commit/31d9b169ddaf4041f745a865ca7ed76ccbe78651">31d9b169</a></span>  <span class="date">from Sun 24 of Nov, 2024 05:18 GMT-0000</span> </div> </div> </div> <div id="module_79" style="" class="module box-Back+To+Top+0.4.3 display_on_print"> <div id="mod-Back_To_Top_0.4.3bottom4"> <div id="Back_To_Top_0.4.3" style="display:block;"> <style type="text/css"> .backtotop { bottom: 3rem; position: fixed; right: 3rem; z-index: 1; } .backtotop a:after { border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(255, 255, 255, 0.5); border-style: none solid solid; border-width: 0 1rem 1.5rem; content: ""; display: block; left: 0.5rem; position: absolute; top: 0.6rem; } .backtotop a { background: none repeat scroll 0 0 rgba(0, 0, 0, 0.25); border-radius: 12.8rem !important; color: rgba(255, 255, 255, 0.5); display: block; font-size: 400%; height: 3rem; line-height: 58%; margin-right: 0; overflow: hidden; position: relative; text-align: center; text-decoration: none; text-indent: -999rem; width: 3rem; } .backtotop a:active, .backtotop a:focus { outline: none; } </style><div class="backtotop"><a href="#top" title="Back To Top">⌅</a></div> </div> </div> </div> <div id="module_68" style="" class="module box-Hide+Fixed+Top+Nav+Bar+on+Scroll+%280.2%29 display_on_print"> <div id="mod-Hide_Fixed_Top_Nav_Bar_on_Scroll_%280.2%29bottom5"> <div id="Hide_Fixed_Top_Nav_Bar_on_Scroll_(0.2)" style="display:block;"> </div> </div> </div> <div id="module_59" style="" class="module box-loadstats display_on_print"> <div id="mod-loadstatsbottom6"> <small>[ Execution time: 0.36 secs ]   [ Memory usage: 7.64MB ]   [ Queries: 379 in 0.16 secs ]</small> </div> </div> </div> </div> </div> </footer> <header class="navbar navbar-expand-md tiki-top-nav-dark navbar-dark bg-dark fixed-top"> <div class="container-fluid"> <nav class="modules top_modules w-100 tiki-top-nav-dark navbar-dark-parent bg-dark-parent" id="top_modules" aria-labelledby="top_modules_heading" role="banner"> <h2 class="visually-hidden-focusable" id="top_modules_heading">Site identity, navigation, etc.</h2> <div id="module_93" style="" class="module box-menupage display_on_print"> <div id="mod-menupagetop1"> <style>.icon.icon-link-external { font-size: .6rem; }</style> <nav class=" navbar navbar-expand-lg navbar-dark bg-dark tiki-nav-dark" role="navigation"> <button type="button" class="navbar-toggler" data-bs-toggle="collapse" data-bs-target="#mod-menupagetop1 .navbar-collapse" aria-controls="mod-menutop1" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse "> <ul class="navbar-nav me-auto nav" data-smartmenus-id="16888224171900354"> <li class="nav-item "> <a class="nav-link" href="https://tiki.org/HomePage" title="Tiki.org homepage"> At Tiki.org <span class="icon icon-link-external fas fa-external-link-alt"></span>: </a> </li> <li class="nav-item "> <a class="nav-link" href="https://tiki.org/Project-Introduction" title="Project introduction"> Project <span class="icon icon-link-external fas fa-external-link-alt"></span></a> </li> <li class="nav-item "> <a class="nav-link" href="https://tiki.org/Software-Overview-and-Model" title="Software overview and model"> Software <span class="icon icon-link-external fas fa-external-link-alt"></span></a> </li> <li class="nav-item "> <a class="nav-link" href="https://tiki.org/Try-Tiki" title="Try Tiki"> Try Tiki <span class="icon icon-link-external fas fa-external-link-alt"></span></a> </li> <li class="nav-item "> <a class="nav-link" href="https://tiki.org/Get-Tiki" title="Get Tiki"> Get Tiki <span class="icon icon-link-external fas fa-external-link-alt"></span></a> </li> <li class="nav-item "> <a class="nav-link" href="https://tiki.org/Get-Help" title="Get help"> Help <span class="icon icon-link-external fas fa-external-link-alt"></span></a> </li> <li class="nav-item "> <a class="nav-link" href="https://tiki.org/Get-Involved" title="Get involved"> Get Involved <span class="icon icon-link-external fas fa-external-link-alt"></span></a> </li> <li class="nav-item "> <a class="nav-link" href="https://tiki.org/News" title="Tiki News"> News <span class="icon icon-link-external fas fa-external-link-alt"></span></a> </li> <li class="nav-item "> <a class="nav-link" href="https://tiki.org/Featured-Tikis" title="Featured Tikis"> Featured Tikis <span class="icon icon-link-external fas fa-external-link-alt"></span></a> </li> <li class="nav-item "> <a class="nav-link" href="https://tiki.org/tiki-register.php" title="Register at Tiki.org"> Register! <span class="icon icon-link-external fas fa-external-link-alt"></span></a> </li> </ul> </div> </nav> </div> </div> <div class="d-block d-md-none flex-grow-1"> <div id="module_89" style="" class="module box-logo display_on_print"> <div id="mod-logotop2"> <div class="sitelogo" class="d-flex align-items-center"><a class="navbar-brand d-flex flex-row w-100 align-self-center align-items-center p-0 sitelogo" href="./" title="Tiki Themes "><img class="sitelogo sitelogo-img img-fluid align-self-center me-3" src="img/tiki/tiki-icon-flat.svg" alt="site logo" style="height: calc(73px - ( 2 * var(--bs-navbar-padding-y)) - var(--tiki-fixed-top-border-top-width) - var(--tiki-fixed-top-border-bottom-width) ); width: auto; vertical-align: inherit;"><div class="sitetitle me-5" style="color: var(--tiki-site-title-color)">Themes</div></a></div> </div> </div> </div> <div class="d-none d-md-flex flex-grow-1"> <div id="module_88" style="" class="module box-logo display_on_print"> <div id="mod-logotop3"> <div class="sitelogo" class="d-flex align-items-center"><a class="navbar-brand d-flex flex-row w-100 align-self-center align-items-center p-0 sitelogo" href="./" title="Tiki logo"><img class="sitelogo sitelogo-img img-fluid align-self-center me-3" src="img/tiki/tiki-icon-flat.svg" alt="Tiki logo" style="height: calc(73px - ( 2 * var(--bs-navbar-padding-y)) - var(--tiki-fixed-top-border-top-width) - var(--tiki-fixed-top-border-bottom-width) ); width: auto; vertical-align: inherit;"><div class="sitetitle me-5" style="color: var(--tiki-site-title-color)">Themes</div><div class="sitesubtitle" style="color: var(--tiki-site-subtitle-color)">Tiki Wiki CMS Groupware</div></a></div> </div> </div> </div> <div id="module_92" style="" class="module box-switch_color_mode display_on_print"> <div id="mod-switch_color_modetop4"> <style> .color-mode-navbar .btn#color-mode-theme { border-radius: 100%; display: grid; place-items: center; height: 40px; width: 40px; transition: all 0.1s; } #color-mode-theme.loading { opacity: 0; } .dropdown-item .theme-selected-check { display: none; } .dropdown-item.active .theme-selected-check { display: inline; } </style> <div class="color-mode-navbar"> <div class="dropdown"> <button class="btn btn-link dropdown-toggle py-2 px-0 px-lg-2 d-flex align-items-center loading" id="color-mode-theme" data-bs-toggle="dropdown" type="button" aria-expanded="false" data-bs-display="static" aria-label="Toggle theme (auto)"> <span class="icon icon-sun fas fa-sun " ></span> </button> <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="color-mode-theme" data-bs-popper="static"> <li> <button type="button" class="dropdown-item d-flex align-items-center gap-1" data-bs-theme-value="light" aria-pressed="false"> <span class='theme_icon'><span class="icon icon-sun fas fa-sun " ></span></span> light <span class='theme-selected-check'><span class="icon icon-check fas fa-check " ></span></span> </button> </li> <li> <button type="button" class="dropdown-item d-flex align-items-center gap-1" data-bs-theme-value="dark" aria-pressed="false"> <span class='theme_icon'><span class="icon icon-moon fas fa-moon " ></span></span> dark <span class='theme-selected-check'><span class="icon icon-check fas fa-check " ></span></span> </button> </li> <li> <button type="button" class="dropdown-item d-flex align-items-center gap-1" data-bs-theme-value="auto" aria-pressed="false"> <span class='theme_icon'><span class="icon icon-circle-half fas fa-circle-half-stroke " ></span></span> auto <span class='theme-selected-check'><span class="icon icon-check fas fa-check " ></span></span> </button> </li> </ul> </div> </div> </div> </div> <div class="d-none d-sm-block"> <div id="module_65" style="" class="module box-login_box display_on_print"> <div id="mod-login_boxtop5"> <div class="siteloginbar_popup dropdown btn-group float-sm-end drop-left"> <button type="button" class="btn btn-link dropdown-toggle" data-bs-toggle="dropdown"> Log in </button> <div class="siteloginbar_poppedup dropdown-menu dropdown-menu-end float-sm-end modal-sm p-3"> <form name="loginbox" class="form" id="loginbox-1" action="https://themes.tiki.org/tiki-login.php" method="post" > <input type="hidden" class="ticket" name="ticket" value="RXwMjLXJMEcN7VHCoDBlpSnV3TxvgxWivWCcol2SnNE" /> <div class="user my-2 "> <label class="form-label" for="login-user_1"> Username </label> <input class="form-control" type="text" name="user" id="login-user_1" autocomplete="username"/> </div> <div class="pass my-2 "> <label class="form-label" for="login-pass_1">Password</label> <input onkeypress="capLock(event, this)" type="password" name="pass" class="form-control" id="login-pass_1" autocomplete="current-password"> <div class="divCapson" style="display:none;"> <span class="icon icon-error fas fa-exclamation-circle " style="vertical-align:middle;" ></span> CapsLock is on. </div> </div> <div class="form-check"> <input type="checkbox" class="form-check-input" name="rme" id="login-remember-module_1" value="on" /> <label for="login-remember-module_1"> Remember me (for 1 week) </label> </div> <div class="my-2 text-center" > <button class="btn btn-primary button submit" type="submit" name="login">Log in </button> </div>   <div class="form-check"> <input type="checkbox" class="form-check-input" name="stay_in_ssl_mode" id="login-stayssl_1" checked="checked" /> <label class="form-check-label" for="login-stayssl_1">Stay in SSL mode</label> </div> <input type="hidden" name="stay_in_ssl_mode_present" value="y" /> <div class="social-buttons"> </div> </form></div></div> </div> </div> </div> <div class="d-sm-none"> <div id="module_90" style="" class="module box-login_box display_on_print"> <div id="mod-login_boxtop6"> <div class="siteloginbar_popup dropdown btn-group float-sm-end drop-left"> <button type="button" class="btn btn-link dropdown-toggle" data-bs-toggle="dropdown"> Log in </button> <div class="siteloginbar_poppedup dropdown-menu dropdown-menu-end float-sm-end modal-sm p-3"> <form name="loginbox" class="form" id="loginbox-2" action="https://themes.tiki.org/tiki-login.php" method="post" > <input type="hidden" class="ticket" name="ticket" value="RXwMjLXJMEcN7VHCoDBlpSnV3TxvgxWivWCcol2SnNE" /> <div class="user my-2 "> <label class="form-label" for="login-user_2"> Username </label> <input class="form-control" type="text" name="user" id="login-user_2" autocomplete="username"/> </div> <div class="pass my-2 "> <label class="form-label" for="login-pass_2">Password</label> <input onkeypress="capLock(event, this)" type="password" name="pass" class="form-control" id="login-pass_2" autocomplete="current-password"> <div class="divCapson" style="display:none;"> <span class="icon icon-error fas fa-exclamation-circle " style="vertical-align:middle;" ></span> CapsLock is on. </div> </div> <div class="form-check"> <input type="checkbox" class="form-check-input" name="rme" id="login-remember-module_2" value="on" /> <label for="login-remember-module_2"> Remember me (for 1 week) </label> </div> <div class="my-2 text-center" > <button class="btn btn-primary button submit" type="submit" name="login">Log in </button> </div>   <div class="form-check"> <input type="checkbox" class="form-check-input" name="stay_in_ssl_mode" id="login-stayssl_2" checked="checked" /> <label class="form-check-label" for="login-stayssl_2">Stay in SSL mode</label> </div> <input type="hidden" name="stay_in_ssl_mode_present" value="y" /> <div class="social-buttons"> </div> </form></div></div> </div> </div> </div> </nav> </div> </header> <div id=bootstrap-modal class="modal fade footer-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="myModalLabel1"></h5> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <div class="modal-body"> </div> <div class="modal-footer"> <button type="button" class="btn btn-link" data-bs-dismiss="modal">Close</button> </div> </div> </div> </div> <div id=bootstrap-modal-2 class="modal fade footer-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="myModalLabel2"></h5> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <div class="modal-body"> </div> <div class="modal-footer"> <button type="button" class="btn btn-link" data-bs-dismiss="modal">Close</button> </div> </div> </div> </div> <div id=bootstrap-modal-3 class="modal fade footer-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="myModalLabel3"></h5> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <div class="modal-body"> </div> <div class="modal-footer"> <button type="button" class="btn btn-link" data-bs-dismiss="modal">Close</button> </div> </div> </div> </div> <script type="module" name="App"> // js_modules 0 import "@jquery-tiki/tiki-svgedit_draw"; import * as bootstrap from "bootstrap"; window.bootstrap = bootstrap; import "@jquery-tiki/tiki-calendar"; import "@jquery-tiki/fullcalendar_to_pdf"; import Sortable from "sortablejs"; window.Sortable = Sortable; import '@shoelace/color-picker'; import * as elementPlus from '@vue-widgets/element-plus-ui'; </script> <script type="text/javascript" src="temp/public/min_main_afd84d89ce754ce5587b3fd6425ae3b4.js"></script> <script type="text/javascript" src="temp/public/min_main_c5cd29d8e2746627f384fffecb22cdce.js"></script> <script type="text/javascript"> <![CDATA[//><!]]> </script> <script type="text/javascript"> <![CDATA[//><!]]> </script> <script type="text/javascript"> BOOMR.init({ beacon_url: "tiki-performance-beacon" }); </script> </body> </html>

CINXE.COM

Themes | Themes for Tiki Wiki CMS Groupware