?i»?
Your IP : 18.118.142.245
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Theming — Nextcloud 13 Administration Manual 13 documentation</title>
<link rel="stylesheet" href="../_static/" type="text/css" />
<link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
<link rel="stylesheet" href="../_static/main.min.css" type="text/css" />
<link rel="stylesheet" href="../_static/styles.css" type="text/css" />
<script type="text/javascript">
var DOCUMENTATION_OPTIONS = {
URL_ROOT: '../',
VERSION: '13',
COLLAPSE_INDEX: false,
FILE_SUFFIX: '.html',
HAS_SOURCE: true
};
</script>
<script type="text/javascript" src="../_static/jquery.js"></script>
<script type="text/javascript" src="../_static/underscore.js"></script>
<script type="text/javascript" src="../_static/doctools.js"></script>
<script type="text/javascript" src="../_static/js/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="../_static/js/jquery-fix.js"></script>
<script type="text/javascript" src="../_static/bootstrap-3.1.0/js/bootstrap.min.js"></script>
<script type="text/javascript" src="../_static/bootstrap-sphinx.js"></script>
<link rel="top" title="Nextcloud 13 Administration Manual 13 documentation" href="../contents.html" />
<link rel="up" title="Server configuration" href="index.html" />
<link rel="next" title="User management" href="../configuration_user/index.html" />
<link rel="prev" title="Server tuning" href="server_tuning.html" />
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'>
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1'>
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="theme-color" content="#1d2d44">
</head>
<body role="document">
<div class="wrap container not-front">
<div class="content row">
<main class="main">
<div class="row">
<div class="col-md-3">
<div class="sidebar">
<h1>Nextcloud 13 Administration Manual</h1>
<div class="sidebar-search">
<form class="headersearch" action="../search.html" method="get">
<input type="text" value="" name="q" id="q" class="form-control" />
<button class="btn btn-default" type="submit" id="searchsubmit">Search</button>
</form>
</div>
<div class="menu-support-container">
<ul id="menu-support" class="menu">
<ul>
<li><a href="../contents.html">Table of Contents</a></li>
</ul>
<ul class="current">
<li class="toctree-l1"><a class="reference internal" href="../index.html">Introduction</a></li>
<li class="toctree-l1"><a class="reference internal" href="../release_notes.html">Release notes</a></li>
<li class="toctree-l1"><a class="reference internal" href="../installation/index.html">Installation</a></li>
<li class="toctree-l1 current"><a class="reference internal" href="index.html">Server configuration</a><ul class="current">
<li class="toctree-l2"><a class="reference internal" href="security_setup_warnings.html">Warnings on admin page</a></li>
<li class="toctree-l2"><a class="reference internal" href="occ_command.html">Using the occ command</a></li>
<li class="toctree-l2"><a class="reference internal" href="activity_configuration.html">Configuring the activity app</a></li>
<li class="toctree-l2"><a class="reference internal" href="caching_configuration.html">Configuring memory caching</a></li>
<li class="toctree-l2"><a class="reference internal" href="background_jobs_configuration.html">Defining background jobs</a></li>
<li class="toctree-l2"><a class="reference internal" href="config_sample_php_parameters.html">Config.php Parameters</a></li>
<li class="toctree-l2"><a class="reference internal" href="email_configuration.html">Email configuration</a></li>
<li class="toctree-l2"><a class="reference internal" href="external_sites.html">Linking external sites</a></li>
<li class="toctree-l2"><a class="reference internal" href="language_configuration.html">Language configuration</a></li>
<li class="toctree-l2"><a class="reference internal" href="logging_configuration.html">Logging configuration</a></li>
<li class="toctree-l2"><a class="reference internal" href="harden_server.html">Hardening and security guidance</a></li>
<li class="toctree-l2"><a class="reference internal" href="reverse_proxy_configuration.html">Reverse proxy configuration</a></li>
<li class="toctree-l2"><a class="reference internal" href="thirdparty_php_configuration.html">Using third party PHP components</a></li>
<li class="toctree-l2"><a class="reference internal" href="automatic_configuration.html">Automatic configuration setup</a></li>
<li class="toctree-l2"><a class="reference internal" href="server_tuning.html">Server tuning</a></li>
<li class="toctree-l2 current"><a class="current reference internal" href="">Theming</a><ul>
<li class="toctree-l3"><a class="reference internal" href="#theming-app">Theming app</a></li>
<li class="toctree-l3"><a class="reference internal" href="#theming-of-icons">Theming of icons</a></li>
<li class="toctree-l3"><a class="reference internal" href="#theming-of-mobile-app-urls-and-ids">Theming of mobile app URLs and IDs</a></li>
</ul>
</li>
</ul>
</li>
<li class="toctree-l1"><a class="reference internal" href="../configuration_user/index.html">User management</a></li>
<li class="toctree-l1"><a class="reference internal" href="../configuration_files/index.html">File sharing and management</a></li>
<li class="toctree-l1"><a class="reference internal" href="../file_workflows/index.html">File workflows</a></li>
<li class="toctree-l1"><a class="reference internal" href="../configuration_database/index.html">Database configuration</a></li>
<li class="toctree-l1"><a class="reference internal" href="../configuration_mimetypes/index.html">Mimetypes management</a></li>
<li class="toctree-l1"><a class="reference internal" href="../maintenance/index.html">Maintenance</a></li>
<li class="toctree-l1"><a class="reference internal" href="../issues/index.html">Issues and troubleshooting</a></li>
</ul>
</ul>
</div>
</div>
</div>
<div class="col-md-9">
<div class="page-content">
<ul class="prevnext-title list-unstyled list-inline">
<li class="prev">
<a href="server_tuning.html" title="Previous Chapter: Server tuning"><span class="glyphicon glyphicon-chevron-left visible-sm"></span><span class="hidden-sm">« Server tuning</span>
</a>
</li>
<li class="next">
<a href="../configuration_user/index.html" title="Next Chapter: User management"><span class="glyphicon glyphicon-chevron-right visible-sm"></span><span class="hidden-sm">User management »</span>
</a>
</li>
</ul>
<div class="section" id="theming">
<h1>Theming<a class="headerlink" href="#theming" title="Permalink to this headline">¶</a></h1>
<p>Nextcloud has two ways of theming. There is a theming app that provides a web
UI to set up theming. The second option allows to overwrite most of the files
but a customized theme needs to be created and maintained. For more information on
this check out the <a class="reference external" href="../../developer_manual/core/theming.html">developers documentation</a>.</p>
<p>We recommend to use the theming app, because the Nextcloud team maintains this
and verifies that all adjustments to the server work with the theming. It
covers also most use cases like replacing the name, logos and colors.</p>
<div class="section" id="theming-app">
<h2>Theming app<a class="headerlink" href="#theming-app" title="Permalink to this headline">¶</a></h2>
<p>Check in the apps management that the theming app is enabled. Then the
administrator settings show a section where you can modify the appearance of
your Nextcloud:</p>
<ul class="simple">
<li>Name</li>
<li>Web Address</li>
<li>Slogan</li>
<li>Color: The color of header bar, checkboxes and folder icon</li>
<li>Logo: The logo will appear in the header and on the log in page. Default has 62/34 px.</li>
<li>Log in image: The background image of the log in page</li>
</ul>
<div class="figure">
<img alt="../_images/theming.png" src="../_images/theming.png" />
</div>
<p>Log in page</p>
<div class="figure">
<img alt="../_images/theming-log-in-page.png" src="../_images/theming-log-in-page.png" />
</div>
</div>
<div class="section" id="theming-of-icons">
<h2>Theming of icons<a class="headerlink" href="#theming-of-icons" title="Permalink to this headline">¶</a></h2>
<p>Nextcloud will automatically generate favicons and home screen icons
depending on the current app and theming color.</p>
<p>This requires the following additional dependencies:</p>
<blockquote>
<div><ul class="simple">
<li>PHP module imagick</li>
<li>SVG support for imagick (e.g. <cite>libmagickcore5-extra</cite>)</li>
</ul>
</div></blockquote>
</div>
<div class="section" id="theming-of-mobile-app-urls-and-ids">
<h2>Theming of mobile app URLs and IDs<a class="headerlink" href="#theming-of-mobile-app-urls-and-ids" title="Permalink to this headline">¶</a></h2>
<p>The themes supported to change the URLs to the mobile apps (Android & iOS) that
is shown when the web UI is opened on one of those devices. Then there was a
header shown, that redirects the user to the app in the app store. By default
this redirects to the Nextcloud apps. In some cases it is wanted that this
links to branded versions of those apps. In those cases the IDs and URLs can be
set via the occ command:</p>
<div class="highlight-python"><div class="highlight"><pre>occ config:app:set theming AndroidClientUrl --value "https://play.google.com/store/apps/details?id=com.nextcloud.client"
occ config:app:set theming iTunesAppId --value "1125420102"
occ config:app:set theming iOSClientUrl --value "https://itunes.apple.com/us/app/nextcloud/id1125420102?mt=8"
</pre></div>
</div>
<p>This feature was added in version 12.0.1 and 13.</p>
</div>
</div>
<ul class="prevnext-title list-unstyled list-inline">
<li class="prev">
<a href="server_tuning.html" title="Previous Chapter: Server tuning"><span class="glyphicon glyphicon-chevron-left visible-sm"></span><span class="hidden-sm">« Server tuning</span>
</a>
</li>
<li class="next">
<a href="../configuration_user/index.html" title="Next Chapter: User management"><span class="glyphicon glyphicon-chevron-right visible-sm"></span><span class="hidden-sm">User management »</span>
</a>
</li>
</ul>
</div>
</div>
</div>
</main>
</div>
</div>
</body>
</html>