themes.html 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6. <title>Custom Themes &#8212; phpMyAdmin 4.9.10 documentation</title>
  7. <link rel="stylesheet" href="_static/pygments.css" type="text/css" />
  8. <link rel="stylesheet" href="_static/classic.css" type="text/css" />
  9. <script id="documentation_options" data-url_root="./" src="_static/documentation_options.js"></script>
  10. <script src="_static/jquery.js"></script>
  11. <script src="_static/underscore.js"></script>
  12. <script src="_static/doctools.js"></script>
  13. <link rel="index" title="Index" href="genindex.html" />
  14. <link rel="search" title="Search" href="search.html" />
  15. <link rel="copyright" title="Copyright" href="copyright.html" />
  16. <link rel="next" title="Other sources of information" href="other.html" />
  17. <link rel="prev" title="Import and export" href="import_export.html" />
  18. </head><body>
  19. <div class="related" role="navigation" aria-label="related navigation">
  20. <h3>Navigation</h3>
  21. <ul>
  22. <li class="right" style="margin-right: 10px">
  23. <a href="genindex.html" title="General Index"
  24. accesskey="I">index</a></li>
  25. <li class="right" >
  26. <a href="other.html" title="Other sources of information"
  27. accesskey="N">next</a> |</li>
  28. <li class="right" >
  29. <a href="import_export.html" title="Import and export"
  30. accesskey="P">previous</a> |</li>
  31. <li class="nav-item nav-item-0"><a href="index.html">phpMyAdmin 4.9.10 documentation</a> &#187;</li>
  32. <li class="nav-item nav-item-1"><a href="user.html" accesskey="U">User Guide</a> &#187;</li>
  33. <li class="nav-item nav-item-this"><a href="">Custom Themes</a></li>
  34. </ul>
  35. </div>
  36. <div class="document">
  37. <div class="documentwrapper">
  38. <div class="bodywrapper">
  39. <div class="body" role="main">
  40. <div class="section" id="custom-themes">
  41. <span id="themes"></span><h1>Custom Themes<a class="headerlink" href="#custom-themes" title="Permalink to this headline">¶</a></h1>
  42. <p>phpMyAdmin comes with support for third party themes. You can download
  43. additonal themes from our website at &lt;<a class="reference external" href="https://www.phpmyadmin.net/themes/">https://www.phpmyadmin.net/themes/</a>&gt;.</p>
  44. <div class="section" id="configuration">
  45. <h2>Configuration<a class="headerlink" href="#configuration" title="Permalink to this headline">¶</a></h2>
  46. <p>Themes are configured with <span class="target" id="index-0"></span><a class="reference internal" href="config.html#cfg_ThemeManager"><code class="xref config config-option docutils literal notranslate"><span class="pre">$cfg['ThemeManager']</span></code></a> and
  47. <span class="target" id="index-1"></span><a class="reference internal" href="config.html#cfg_ThemeDefault"><code class="xref config config-option docutils literal notranslate"><span class="pre">$cfg['ThemeDefault']</span></code></a>. Under <code class="file docutils literal notranslate"><span class="pre">./themes/</span></code>, you should not
  48. delete the directory <code class="docutils literal notranslate"><span class="pre">pmahomme</span></code> or its underlying structure, because this is
  49. the system theme used by phpMyAdmin. <code class="docutils literal notranslate"><span class="pre">pmahomme</span></code> contains all images and
  50. styles, for backwards compatibility and for all themes that would not include
  51. images or css-files. If <span class="target" id="index-2"></span><a class="reference internal" href="config.html#cfg_ThemeManager"><code class="xref config config-option docutils literal notranslate"><span class="pre">$cfg['ThemeManager']</span></code></a> is enabled, you
  52. can select your favorite theme on the main page. Your selected theme will be
  53. stored in a cookie.</p>
  54. </div>
  55. <div class="section" id="creating-custom-theme">
  56. <h2>Creating custom theme<a class="headerlink" href="#creating-custom-theme" title="Permalink to this headline">¶</a></h2>
  57. <p>To create a theme:</p>
  58. <ul class="simple">
  59. <li><p>make a new subdirectory (for example “your_theme_name”) under <code class="file docutils literal notranslate"><span class="pre">./themes/</span></code>.</p></li>
  60. <li><p>copy the files and directories from <code class="docutils literal notranslate"><span class="pre">pmahomme</span></code> to “your_theme_name”</p></li>
  61. <li><p>edit the css-files in “your_theme_name/css”</p></li>
  62. <li><p>put your new images in “your_theme_name/img”</p></li>
  63. <li><p>edit <code class="file docutils literal notranslate"><span class="pre">layout.inc.php</span></code> in “your_theme_name”</p></li>
  64. <li><p>edit <code class="file docutils literal notranslate"><span class="pre">theme.json</span></code> in “your_theme_name” to contain theme metadata (see below)</p></li>
  65. <li><p>make a new screenshot of your theme and save it under
  66. “your_theme_name/screen.png”</p></li>
  67. </ul>
  68. <div class="section" id="theme-metadata">
  69. <h3>Theme metadata<a class="headerlink" href="#theme-metadata" title="Permalink to this headline">¶</a></h3>
  70. <div class="versionchanged">
  71. <p><span class="versionmodified changed">Changed in version 4.8.0: </span>Before 4.8.0 the theme metadata was passed in the <code class="file docutils literal notranslate"><span class="pre">info.inc.php</span></code> file.
  72. It has been replaced by <code class="file docutils literal notranslate"><span class="pre">theme.json</span></code> to allow easier parsing (without
  73. need to handle PHP code) and to support additional features.</p>
  74. </div>
  75. <p>In theme directory there is file <code class="file docutils literal notranslate"><span class="pre">theme.json</span></code> which contains theme
  76. metadata. Currently it consists of:</p>
  77. <dl class="describe">
  78. <dt>
  79. <code class="sig-name descname">name</code></dt>
  80. <dd><p>Display name of the theme.</p>
  81. <p><strong>This field is required.</strong></p>
  82. </dd></dl>
  83. <dl class="describe">
  84. <dt>
  85. <code class="sig-name descname">version</code></dt>
  86. <dd><p>Theme version, can be quite arbirary and does not have to match phpMyAdmin version.</p>
  87. <p><strong>This field is required.</strong></p>
  88. </dd></dl>
  89. <dl class="describe">
  90. <dt>
  91. <code class="sig-name descname">desciption</code></dt>
  92. <dd><p>Theme description. this will be shown on the website.</p>
  93. <p><strong>This field is required.</strong></p>
  94. </dd></dl>
  95. <dl class="describe">
  96. <dt>
  97. <code class="sig-name descname">author</code></dt>
  98. <dd><p>Theme author name.</p>
  99. <p><strong>This field is required.</strong></p>
  100. </dd></dl>
  101. <dl class="describe">
  102. <dt>
  103. <code class="sig-name descname">url</code></dt>
  104. <dd><p>Link to theme author website. It’s good idea to have way for getting
  105. support there.</p>
  106. </dd></dl>
  107. <dl class="describe">
  108. <dt>
  109. <code class="sig-name descname">supports</code></dt>
  110. <dd><p>Array of supported phpMyAdmin major versions.</p>
  111. <p><strong>This field is required.</strong></p>
  112. </dd></dl>
  113. <p>For example, the definition for Original theme shipped with phpMyAdnin 4.8:</p>
  114. <div class="highlight-json notranslate"><div class="highlight"><pre><span></span><span class="p">{</span>
  115. <span class="nt">&quot;name&quot;</span><span class="p">:</span> <span class="s2">&quot;Original&quot;</span><span class="p">,</span>
  116. <span class="nt">&quot;version&quot;</span><span class="p">:</span> <span class="s2">&quot;4.8&quot;</span><span class="p">,</span>
  117. <span class="nt">&quot;description&quot;</span><span class="p">:</span> <span class="s2">&quot;Original phpMyAdmin theme&quot;</span><span class="p">,</span>
  118. <span class="nt">&quot;author&quot;</span><span class="p">:</span> <span class="s2">&quot;phpMyAdmin developers&quot;</span><span class="p">,</span>
  119. <span class="nt">&quot;url&quot;</span><span class="p">:</span> <span class="s2">&quot;https://www.phpmyadmin.net/&quot;</span><span class="p">,</span>
  120. <span class="nt">&quot;supports&quot;</span><span class="p">:</span> <span class="p">[</span><span class="s2">&quot;4.8&quot;</span><span class="p">]</span>
  121. <span class="p">}</span>
  122. </pre></div>
  123. </div>
  124. </div>
  125. <div class="section" id="sharing-images">
  126. <h3>Sharing images<a class="headerlink" href="#sharing-images" title="Permalink to this headline">¶</a></h3>
  127. <p>If you do not want to use your own symbols and buttons, remove the
  128. directory “img” in “your_theme_name”. phpMyAdmin will use the
  129. default icons and buttons (from the system-theme <code class="docutils literal notranslate"><span class="pre">pmahomme</span></code>).</p>
  130. </div>
  131. </div>
  132. </div>
  133. <div class="clearer"></div>
  134. </div>
  135. </div>
  136. </div>
  137. <div class="sphinxsidebar" role="navigation" aria-label="main navigation">
  138. <div class="sphinxsidebarwrapper">
  139. <h3><a href="index.html">Table of Contents</a></h3>
  140. <ul>
  141. <li><a class="reference internal" href="#">Custom Themes</a><ul>
  142. <li><a class="reference internal" href="#configuration">Configuration</a></li>
  143. <li><a class="reference internal" href="#creating-custom-theme">Creating custom theme</a><ul>
  144. <li><a class="reference internal" href="#theme-metadata">Theme metadata</a></li>
  145. <li><a class="reference internal" href="#sharing-images">Sharing images</a></li>
  146. </ul>
  147. </li>
  148. </ul>
  149. </li>
  150. </ul>
  151. <h4>Previous topic</h4>
  152. <p class="topless"><a href="import_export.html"
  153. title="previous chapter">Import and export</a></p>
  154. <h4>Next topic</h4>
  155. <p class="topless"><a href="other.html"
  156. title="next chapter">Other sources of information</a></p>
  157. <div role="note" aria-label="source link">
  158. <h3>This Page</h3>
  159. <ul class="this-page-menu">
  160. <li><a href="_sources/themes.rst.txt"
  161. rel="nofollow">Show Source</a></li>
  162. </ul>
  163. </div>
  164. <div id="searchbox" style="display: none" role="search">
  165. <h3 id="searchlabel">Quick search</h3>
  166. <div class="searchformwrapper">
  167. <form class="search" action="search.html" method="get">
  168. <input type="text" name="q" aria-labelledby="searchlabel" />
  169. <input type="submit" value="Go" />
  170. </form>
  171. </div>
  172. </div>
  173. <script>$('#searchbox').show(0);</script>
  174. </div>
  175. </div>
  176. <div class="clearer"></div>
  177. </div>
  178. <div class="related" role="navigation" aria-label="related navigation">
  179. <h3>Navigation</h3>
  180. <ul>
  181. <li class="right" style="margin-right: 10px">
  182. <a href="genindex.html" title="General Index"
  183. >index</a></li>
  184. <li class="right" >
  185. <a href="other.html" title="Other sources of information"
  186. >next</a> |</li>
  187. <li class="right" >
  188. <a href="import_export.html" title="Import and export"
  189. >previous</a> |</li>
  190. <li class="nav-item nav-item-0"><a href="index.html">phpMyAdmin 4.9.10 documentation</a> &#187;</li>
  191. <li class="nav-item nav-item-1"><a href="user.html" >User Guide</a> &#187;</li>
  192. <li class="nav-item nav-item-this"><a href="">Custom Themes</a></li>
  193. </ul>
  194. </div>
  195. <div class="footer" role="contentinfo">
  196. &#169; <a href="copyright.html">Copyright</a> 2012 - 2018, The phpMyAdmin devel team.
  197. Created using <a href="https://www.sphinx-doc.org/">Sphinx</a> 3.4.3.
  198. </div>
  199. </body>
  200. </html>