MediaWiki

De wiki.sjm.ovh
Révision datée du 14 mai 2024 à 12:53 par Alexandre (discussion | contributions)
(diff) ← Version précédente | Voir la version actuelle (diff) | Version suivante → (diff)
Aller à :navigation, rechercher

Personnalisation de wiki.sjm.ovh

Feuille de style CSS

MediaWiki:Common.css

Skin

La Skin MediaWiki utilisée sur ce wiki est Chameleon et son layout stickyhead personnalisé suivant cette procédure :

  • Ajout de l'extension Bootstrap via Composer
  • Ajout de Chameleon via Composer
  • Copie du layout stickyhead.xml vers sjm.xml
  • Personnalisation
sjm.xml
<?xml version="1.0" encoding="utf-8"?>
<!--
<?xml-model href="https://ProfessionalWiki.github.io/chameleon/schema/3.6/layout.rng" schematypens="http://relaxng.org/ns/structure/1.0"?>
This file is part of the MediaWiki skin Chameleon.

@copyright 2013 - 2021, Stephan Gambke
@license   GNU General Public License, version 3 (or any later version)

The Chameleon skin is free software: you can redistribute it and/or modify it
under the terms of the GNU General Public License as published by the Free
Software Foundation, either version 3 of the License, or (at your option) any
later version.

The Chameleon skin is distributed in the hope that it will be useful, but
WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more
details.

You should have received a copy of the GNU General Public License along
with this program. If not, see <http://www.gnu.org/licenses/>.

@author Stephan Gambke
@since 1.0
@ingroup Skins
-->
<structure xmlns="https://ProfessionalWiki.github.io/chameleon/schema/3.6/layout.rng">

	<component type="Container" class="text-white bg-dark">

		<component type="NavbarHorizontal" class="bg-dark" collapsible="no">
			<component type="Html"><a class="text-warning text-decoration-none" href="/">wiki.sjm.ovh</a></component>
		</component>

		<component type="NavbarHorizontal" class="small form-control form-control-sm" showTogglerText="no" collapsible="yes">
			<modification type="Sticky" />
			<modification type="ShowOnlyFor" permission="edit" />
			<component type="PageTools" buttons="edit, move, delete, history" hideSelectedNameSpace="yes" hideDiscussionLink="yes" />
			<component type="SearchBar" class="order-first" placeholder="Rechercher" position="right" buttons="go" />
			<component type="PersonalTools" position="right" showUserName="username-only" />
		</component>

		<grid class="flex-fill">
			<row>
				<cell>
					<component type="SiteNotice" />
				</cell>
			</row>

			<row>
				<cell>
					<component type="MainContent" class="text-white" />
				</cell>
			</row>
		</grid>

		<grid class="mb-2 mt-4" mode="fluid">
			<row>
				<cell>
					<modification type="ShowOnlyFor" permission="edit" />
					<component type="NavbarHorizontal" collapsible="no" class="small mb-2" >
						<component type="PageTools" buttons="edit, move, delete, history" hideSelectedNameSpace="yes" hideDiscussionLink="yes" />
						<component type="Toolbox" flatten="no" class="dropup" />
					</component>
				</cell>
			</row>
		</grid>

		<component type="Container" class="footer mt-auto py-3">
			<component type="Container" class="container text-center">
				<component type="Container" class="d-flex flex-column p-2">
					<component type="Container">
						<component type="Html">
							Remerciements :
						</component>
						<component type="Container" class="btn-group align-baseline" role="group">
							<component type="Html">
								<button type="button" class="btn btn-link text-warning text-decoration-none dropdown-toggle pl-3" data-toggle="dropdown" aria-expanded="false">
									<i class="far fa-keyboard"></i>
								</button>
								<ul class="dropdown-menu dropdown-menu-outline-warning">
									<li>
										<a class="dropdown-item" href="https://ubuntu.com/" target="_blank">
											<i class="fab fa-ubuntu"></i> Linux Ubuntu
										</a>
									</li>
									<li>
										<a class="dropdown-item" href="https://httpd.apache.org/" target="_blank">
											<i class="fas fa-server"></i> Apache
										</a>
									</li>
									<li>
										<a class="dropdown-item" href="https://www.mysql.com/" target="_blank">
											<i class="fas fa-database"></i> MySQL
										</a>
									</li>
									<li>
										<a class="dropdown-item" href="https://www.php.net/" target="_blank">
											<i class="fab fa-php"></i> PHP
										</a>
									</li>
								</ul>
							</component>
						</component>
						<component type="Container" class="btn-group align-baseline" role="group">
							<component type="Html">
								<button type="button" class="btn btn-link text-warning text-decoration-none dropdown-toggle pl-1" data-toggle="dropdown" aria-expanded="false">
									<i class="fas fa-users"></i>
								</button>
								<ul class="dropdown-menu dropdown-menu-outline-warning">
									<li>
										<a class="dropdown-item" href="https://www.digitalocean.com" target="_blank">
											<i class="fab fa-digital-ocean"></i> Digital Ocean
										</a>
									</li>
                                    <li>
										<a class="dropdown-item" href="https://mediawiki.org" target="_blank">
											<i class="fas fa-globe"></i> MediaWiki
										</a>
									</li>
									<li>
										<a class="dropdown-item" href="https://creativecommons.org" target="_blank">
											<i class="fab fa-creative-commons"></i> CreativeCommons
										</a>
									</li>
                                        <a class="dropdown-item" href="https://github.com/ProfessionalWiki/chameleon" target="_blank">
                                            <i class="fab fa-github"></i> Chameleon skin
                                        </a>
									<li>
										<a class="dropdown-item" href="https://getbootstrap.com/" target="_blank">
											<i class="fab fa-bootstrap"></i> Bootstrap
										</a>
									</li>
									<li>
										<a class="dropdown-item" href="https://forkaweso.me" target="_blank">
											<i class="fab fa-font-awesome-flag"></i> FontAwesome
										</a>
									</li>
								</ul>
							</component>
						</component>	
					</component>
					<component type="Container">
						<component type="Html">
							2020-2024 <a class="text-warning text-decoration-none" href="https://sjm.ovh">Les Serveurs Jean-Michel</a>
							<a class="text-warning text-decoration-none" href="https://creativecommons.org/licenses/by/4.0/deed.fr" title="Attribution 4.0 International" target="_blank">
							<i class="fab fa-creative-commons"></i> <i class="fab fa-creative-commons-by"></i></a>
						</component>
					</component>
				</component>
			</component>
		</component>

	</component>
</structure>
  • Activation par défaut du layout personnalisé dans LocalSettings.php
## Default skin
$wgDefaultSkin = "chameleon";
$egChameleonLayoutFile= __DIR__ . '/skins/chameleon/layouts/sjm.xml';
# Enabled skins
wfLoadSkin( 'chameleon' );

ShortURL

  • Installation sous /wiki.sjm.ovh/mediawiki
  • Création de /wiki.sjm.ovh/.htaccess
RewriteEngine On

# main rewrite rule
RewriteRule ^/?m(/.*)?$ %{DOCUMENT_ROOT}/mediawiki/index.php [L]

# Redirect / to Main Page
RewriteRule ^/*$ %{DOCUMENT_ROOT}/mediawiki/index.php [L]
  • Modification LocalSettings.php
## https://www.mediawiki.org/wiki/Manual:Short_URL
$wgScriptPath = "/mediawiki";
$wgArticlePath = "/m/$1";

Source : Manual:Short_URL/Apache

Outils

Edittools

  1. Installer l'extension CharInsert Extension:CharInsert
  2. Installer l'extension Gadgets Extension:Gadgets
  3. Créer les pages
  4. Ajouter les styles CSS dédiés à MediaWiki:Common.css
  5. Ajouter à MediaWiki:Gadgets-definition
    • * Edittools[ResourceLoader|default|actions=edit]|Edittools.js
    • * CharInsertButtons[ResourceLoader|default|actions=edit]|CharInsertButtons.css

Source : MediaWiki_talk:Edittools