https://wiki.javasatu.com/index.php?action=history&feed=atom&title=Javasatu%3ATemplateStyles 2026-04-07T20:37:41Z Riwayat revisi halaman ini di wiki MediaWiki 1.40.0 https://wiki.javasatu.com/index.php?title=Javasatu:TemplateStyles&diff=8751&oldid=prev 2023-10-09T15:39:57Z

<p>←Membuat halaman berisi &#039;{{short description|Wikimedia project guideline for TemplateStyles}} {{Subcat guideline|editing guideline||WP:TSTYLE|WP:TSTYLES}} &#039;&#039;&#039;TemplateStyles&#039;&#039;&#039; memungkinkan halaman CSS kustom digunakan untuk menata konten tanpa <a href="/index.php?title=WP:IADMIN&amp;action=edit&amp;redlink=1" class="new" title="WP:IADMIN (halaman belum tersedia)">administrator antarmuka</a> untuk mengedit CSS di seluruh situs. TemplateStyles memudahkan editor untuk menata gaya template; misalnya, templat yang menggunakan CSS di seluruh situs untuk tampilan seluler atau tampilan lainnya (mis. Time...&#039;</p> <p><b>Halaman baru</b></p><div>{{short description|Wikimedia project guideline for TemplateStyles}}<br /> {{Subcat guideline|editing guideline||WP:TSTYLE|WP:TSTYLES}}<br /> <br /> '''TemplateStyles''' memungkinkan halaman CSS kustom digunakan untuk menata konten tanpa [[WP:IADMIN|administrator antarmuka]] untuk mengedit CSS di seluruh situs. TemplateStyles memudahkan editor untuk menata gaya template; misalnya, templat yang menggunakan CSS di seluruh situs untuk tampilan seluler atau tampilan lainnya (mis. Timeless) saat ini berdampak negatif terhadap tampilan templat.<br /> <br /> <br /> <br /> == Guidelines ==<br /> *Style harus hanya diimplementasikan hanya pada templat terkait. Ini mungkin juga berlaku untuk teks wiki terdekat yang sangat relevan di mana templat tersebut digunakan. (Misalnya, ada banyak templat tabel yang seharusnya memiliki TemplatStyles yang disediakan seluruhnya dalam templat, atau yang mungkin memberikan legenda pada tabel teks wiki.) Jika tidak, akan membingungkan jika menambahkan templat ke satu bagian halaman akan sepenuhnya atau mengubah sebagian tampilan atau gaya bagian halaman yang tidak terkait.<br /> <br /> * Halaman style harus dikaitkan dengan templat atau grup templat tertentu, dan diberi nama yang sesuai. Hal ini memungkinkan halaman gaya mudah diidentifikasi dan diedit. Secara umum, ini berarti halaman gaya harus merupakan subhalaman dari templat terkait, misalnya: {{mxt|Templat:{{var|templatSaya}}/styles.css}} atau {{mxt|Templat:{{var|templatSaya}}/styles-{{var|foo}}.css}}, bukan {{!mxt|Templat:styles-{{var|foo}}.css}} maupun {{!mxt|Templat:{{var|foo}}.css}}.<br /> <br /> * Umumnya menurut [[mediawikiwiki:Manual:Coding conventions/CSS|MediaWiki coding conventions for CSS]]. Beberapa hal spesifik:<br /> ** Use selectors that are highly likely to be unique to the template being used. This reduces the chance of conflicting CSS rules arising accidentally. Examples: Use {{mxt|.{{var|myTemplate}}-row}} rather than {{!mxt|.row}} or {{mxt|.{{var|myTemplate}} tr}} rather than {{!mxt|tr}}.<br /> ** Avoid using {{!mxt|#id}} per the conventions. HTML IDs are supposed to be unique on a page. Templates are rarely used uniquely, and those that are initially single-use-per-page are often later used in unanticipated ways. Use classes instead of IDs for styling.<br /> ** Avoid using {{!mxt|!important}} per the conventions, except in mobile views to override style input from the associated template. Use of &lt;code&gt;!important&lt;/code&gt; in TemplateStyles is exceptionally difficult to override because of loading order of styles (personal CSS then TemplateStyles).<br /> * In templates intended to be substituted, or those likely to be substituted, use {{tl|ifsubst}} to remove the TemplateStyles tag. Example: {{tl|allcaps}}.<br /> ** Inline styles may be used as the &quot;if substed&quot; case in a substituted template. Example: {{tl|smallcaps}}.<br /> * Images that do not require attribution (i.e. those in the public domain) are the only images that may be used as background images. For normal file usage, attribution is provided on the file description page, accessed by clicking the image. This is not possible if the image is being used as the background.<br /> * The protection level of style pages should match that of their associated template. If a template is [[Wikipedia:High-risk templates|high-risk]], then its styles are also high-risk, and should have the same protection. If a template is not high-risk, then vandalism to cause chaos could be achieved just by editing the template itself. A higher protection level for the style page would encourage editors to add inline styles to the template, since the template would be editable but the style page would not. Any templates using CSS pages with the wrong protection level will be categorized in {{Cl|Templates using TemplateStyles with a different protection level}}.<br /> * Remember to add &lt;code&gt;&lt;nowiki&gt;/* {{pp-template}} */&lt;/nowiki&gt;&lt;/code&gt; to any protected CSS pages to ensure that they display the appropriate lock icon. Protected templates using CSS pages that lack the lock icon will be categorized in {{Cl|Templates using TemplateStyles without padlocks}}.<br /> Note that the [[Wikipedia:Manual of Style|Manual of Style]], including the [[Wikipedia:Manual of Style/Accessibility|Accessibility guidelines]], still applies.<br /> <br /> == Workflow for conversion ==<br /> # In {{mxt|Template:{{var|myTemplate}}}}, identify all of the inline styles that can be moved to a separate stylesheet.<br /> # Create {{mxt|Template:{{var|myTemplate}}/styles.css}} containing all the classes that will replace the inline styles. Use template-specific class names where possible.<br /> # In {{mxt|Template:{{var|myTemplate}}}} (or its {{mxt|Template:{{var|myTemplate}}/sandbox}} if you want to test first), add {{tag|templatestyles|params=src=&quot;{{var|myTemplate}}/styles.css&quot;|single}} (you don't need to specify the Template: namespace). It's probably best at the top so that it is obvious and to avoid a [[flash of unstyled content]], but it will need to be on its own line if the template begins with wiki markup that has to start on a new line (e.g. wiki-table).<br /> # Amend the template (or sandbox) to replace the inline styles with the classes you defined in {{mxt|Template:{{var|myTemplate}}/styles.css}}<br /> # Do as much checking as you can. If you tested in the sandbox you can check the testcases page where it exists, but specifically check that the styles you affected render properly.<br /> ## Specifically, for templates meant to be used inline, check to see if there are uses inside of links. TemplateStyles templates will not work inside links ([[:phab:T200704|right now]]).<br /> # If you used the sandbox, either make an edit request for the main template or do the update if you are confident of your changes.<br /> # Request or amend the protection level of {{mxt|Template:{{var|myTemplate}}/styles.css}} to match that of {{mxt|Template:{{var|myTemplate}}}} as necessary.<br /> # Add {{tlx|Uses TemplateStyles}} to the template's documentation to show which TemplateStyles stylesheets it uses.<br /> <br /> == Tips ==<br /> * Uses of TemplateStyles stylesheets are recorded just like template transclusion and Scribunto module invocation. [[Special:WhatLinksHere]] and the &quot;Templates used in this preview&quot; section beneath the edit form will work for them in the usual manner.<br /> * To search for TemplateStyles stylesheets, you can [[Special:Search/all: contentmodel:sanitized-css|search for {{tt|contentmodel:sanitized-css}}]]. See also [[mw:Help:CirrusSearch#Contentmodel]].<br /> * When {{tlx|Uses TemplateStyles}} is placed on a template's documentation, it adds the template to [[:Category:Templates using TemplateStyles]]. If the TemplateStyles stylesheet has a different protection level, the template will be tracked in [[:Category:Templates using TemplateStyles with a different protection level]] ({{PAGESINCAT:Templates using TemplateStyles with a different protection level}} page{{#ifeq:{{PAGESINCAT:Templates using TemplateStyles with a different protection level}}|1||s}}).<br /> * TemplateStyles experiments can be created at [[Template:TemplateStyles sandbox]], e.g. for use in [[Module:Sandbox]] module experiments.<br /> <br /> == Overriding TemplateStyles ==<br /> {{anchor|Override}}<br /> Because of the way TemplateStyles is implemented, overriding TemplateStyles in your personal CSS requires a little more effort than normal. The rules on a specific TemplateStyles sheet are not the full CSS rules, nor can you match the selectors to override them.<br /> <br /> # Each selector is 'hoisted' to &lt;code&gt;.mw-parser-output&lt;/code&gt;, so to override a rule in a TemplateStyles sheet that looks like &lt;code&gt;.documentation {}&lt;/code&gt;, a naive override in your personal CSS file would need to look like &lt;code&gt;.mw-parser-output .documentation {}&lt;/code&gt;.<br /> # However, in the HTML each TemplateStyles style is {{em|always}} placed after your personal CSS file loads. Accordingly, the new rule would need to be more specific. That can come in a couple ways. The easiest is to select the HTML element also as in: &lt;code&gt;.mw-parser-output div.documentation {}&lt;/code&gt;. Another way would be to double one of the class selectors, as in &lt;code&gt;.mw-parser-output.mw-parser-output .documentation {}&lt;/code&gt; or &lt;code&gt;.mw-parser-output .documentation.documentation {}&lt;/code&gt;. This latter way is a little more future-proof but looks a little weirder.<br /> # Lastly, &lt;code&gt;!important&lt;/code&gt; can always override styles in your personal CSS. The usual caveats regarding &lt;code&gt;!important&lt;/code&gt; apply. Prefer one of the two options in bullet two if possible. (You must do this to override inline styles, regardless of any of the above; some templates cannot move everything to TemplateStyles per the flexibility given to template users. Implementers of templates should consider whether parameters like &lt;code&gt;style&lt;/code&gt; and &lt;code&gt;width&lt;/code&gt; are actually necessary. See also [[:phab:T200632]].)<br /> <br /> == Examples ==<br /> * [[:mw:Help:TemplateStyles/examples]]<br /> ** [[:mw:Template:Stylish]] ([[:mw:Template:Stylish/styles.css|CSS]])<br /> ** [[:mw:Template:ResponsiveAmboxExample]] ([[:mw:Template:ResponsiveAmbox/styles.css|CSS]])<br /> * [[Template:Thermometer]] and [[Template:Thermometer/styles.css]] give a simple demonstration of how TemplateStyles may be mixed with inline styles (where a parameter is passed to change one or more styles)<br /> <br /> == See also ==<br /> * [[Wikipedia:Lua]]<br /> * [[MediaWiki talk:Common.css/to do]], where conversion from Common.css, Mobile.css, and skin.css to TemplateStyles is being tracked<br /> <br /> == External links ==<br /> * [[mw:Extension:TemplateStyles]]<br /> * [[mw:Help:TemplateStyles]]<br /> <br /> [[Category:Wikipedia template guidelines]]<br /> [[Category:Wikipedia template help]]</div>

Adminjavasatu